:root{color-scheme:dark;--bg: #090908;--panel: #10100e;--ink: #f4efe6;--muted: #9c9488;--line: rgba(244, 239, 230, .12);--paper: #f3ecdf;--paper-ink: #16130f;--danger: #ffb4a2}*{box-sizing:border-box}html,body,#root{height:100%}@media(min-width:981px){html,body,#root{overflow:hidden}}body{margin:0;background:var(--bg);color:var(--ink);font-family:Outfit,sans-serif;font-weight:400}button,input{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--paper);outline-offset:2px}.studio{height:100%;display:grid;grid-template-columns:332px minmax(0,1fr)}.studio[hidden]{display:none}.panel{overflow:auto;background:var(--panel);border-right:1px solid var(--line);padding:22px 18px 32px}.brand{display:flex;gap:12px;align-items:center;margin-bottom:26px}.brand h1{margin:0;font-family:Syne,sans-serif;font-weight:750;font-size:22px;letter-spacing:.16em}.brand p{margin:2px 0 0;color:var(--muted);font-size:13px}.mark{width:36px;height:36px;display:block}section+section{margin-top:22px}.section-label{margin-bottom:10px;color:var(--muted);font-size:11px;letter-spacing:.18em}.samples,.toggles{display:flex;flex-wrap:wrap;gap:6px}.chip,.upload,.seg button,.swatch,.play,.btn{border:0}.chip{border:1px solid var(--line);background:transparent;border-radius:999px;padding:7px 11px;font-size:13px}.chip[aria-pressed=true]{background:var(--paper);color:var(--paper-ink);border-color:transparent}.upload{width:100%;margin-top:8px;padding:12px;border:1px dashed rgba(244,239,230,.32);border-radius:12px;background:transparent}.upload:hover{border-color:var(--paper)}.strava-setup,.strava-bar{margin-bottom:12px}.strava-bar{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px}.strava-setup .hint em{font-style:normal;font-family:DM Mono,ui-monospace,monospace;color:var(--ink)}.strava-setup a{color:var(--paper)}.strava-setup .linkish{display:inline-block;margin-top:8px}.acts{display:flex;flex-direction:column;gap:6px;max-height:240px;margin-bottom:12px;overflow:auto}.act{padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:transparent;text-align:left}.act strong{display:block;font-weight:500;font-size:13px}.act small{color:var(--muted);font-size:11px}.act[aria-pressed=true]{background:var(--paper);color:var(--paper-ink)}.act[aria-pressed=true] small{color:#5c5348}.act:disabled{opacity:.6}.summary{margin:12px 0 0;color:var(--ink);font-family:DM Mono,ui-monospace,monospace;font-size:12px;line-height:1.55}.summary.quiet{margin-top:4px;color:var(--muted)}.badge{display:inline-block;margin-top:8px;color:#ff8a62;font-size:10px;letter-spacing:.16em}.error{margin-top:10px;padding:10px 12px;border-radius:10px;background:#2a1410;color:var(--danger);font-size:13px;line-height:1.4}.swatches{display:flex;gap:10px}.swatch{width:28px;height:28px;padding:0;border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff2e}.swatch[aria-pressed=true]{outline:2px solid var(--paper);outline-offset:3px}.theme-name{margin:8px 0 10px;font-size:13px}.seg{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:4px;border-radius:12px;background:#1a1a17}.seg.three{grid-template-columns:repeat(3,1fr)}.seg.two{grid-template-columns:repeat(2,1fr)}.seg.duration{grid-template-columns:repeat(4,1fr);min-width:176px}.speed{display:flex;align-items:center;gap:8px;min-width:180px;color:var(--muted);font-size:12px}.speed em{font-style:normal;font-family:DM Mono,ui-monospace,monospace;color:var(--ink)}.speed input{flex:1;min-width:90px;accent-color:#f3ecdf}.seg button{background:transparent;color:var(--muted);border-radius:9px;padding:8px 4px;font-size:12px}.seg button small{display:block;margin-top:2px;font-size:10px;opacity:.75}.seg button[aria-pressed=true]{background:var(--paper);color:var(--paper-ink)}.field{display:block;margin-top:10px}.field span{display:block;margin-bottom:6px;color:var(--muted);font-size:12px}.field input[type=text],.field input[type=password]{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#0c0c0b}.field input::placeholder{color:#6a6258}.field input[type=range],.slider{width:100%;accent-color:#f3ecdf}.toggles{margin-top:12px}.looks{display:flex;flex-wrap:wrap;gap:6px}.sub-label{margin:14px 0 6px;color:var(--muted);font-size:12px}.field-row{display:flex;justify-content:space-between}.field-row em{font-style:normal;font-family:DM Mono,ui-monospace,monospace;color:var(--ink)}.map-status{margin-top:8px;min-height:16px;font-size:12px;color:var(--muted)}.map-status.error{color:var(--danger)}.linkish{padding:0;border:0;background:none;color:var(--paper);text-decoration:underline}.strava-connect{display:inline-block;margin-top:10px;padding:0;border:0;background:transparent;line-height:0}.strava-connect img{display:block;height:48px;width:auto}.strava-connect:disabled{opacity:.45}.strava-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.consent{display:flex;gap:8px;align-items:flex-start;margin-top:10px;color:var(--ink);font-size:13px;line-height:1.4}.consent input{margin-top:3px}.view-strava{display:inline-block;margin-top:8px;color:#fc5200;font-size:13px;font-weight:700;text-decoration:underline}.notice{margin-top:10px;padding:10px 12px;border-radius:10px;background:#142018;color:var(--ink);font-size:13px;line-height:1.45}.strava-notice{margin-bottom:12px}.strava-notice p,.strava-notice ul{margin:0}.strava-notice ul{margin:8px 0;padding-left:18px}.strava-notice p+p{margin-top:8px}.strava-notice a,.legal a,.legal-links a{color:var(--paper)}.legal-links{display:flex;flex-wrap:wrap;gap:8px 14px;margin:18px 0 0;color:var(--muted);font-size:12px}.legal{max-width:720px;margin:0 auto;padding:32px 22px 80px;color:var(--ink);font-size:15px;line-height:1.55}.legal h1{margin:18px 0 12px;font-family:Syne,sans-serif;font-size:40px;letter-spacing:-.04em}.legal h2{margin:22px 0 8px;font-size:16px}.legal p{margin:0 0 10px}.legal em{font-style:normal;font-family:DM Mono,ui-monospace,monospace}.legal-back{color:var(--paper);font-size:13px}.hint.tight{margin:10px 0 0}.hint{margin:26px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.stage{min-width:0;min-height:0;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:radial-gradient(900px 480px at 50% 28%,rgba(255,255,255,.035),transparent 62%),#080807}.stagebar,.transport{display:flex;align-items:center;gap:12px;padding:14px 18px}.stagebar{justify-content:space-between;color:var(--muted);font-size:12px;letter-spacing:.12em}.canvaswrap{min-height:0;min-width:0;height:100%;display:grid;place-items:center;padding:6px 22px 14px;overflow:hidden}.canvaswrap canvas{display:block;border-radius:2px;box-shadow:0 30px 90px #0000007a;cursor:ew-resize;touch-action:none}.transport{border-top:1px solid var(--line);flex-wrap:wrap}.play{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--paper);color:var(--paper-ink);flex:0 0 auto}.play:disabled{opacity:.45}.slider{flex:1 1 160px;min-width:120px}.times{font-family:DM Mono,ui-monospace,monospace;font-size:12px;color:var(--muted);min-width:88px}.exports{display:flex;gap:8px;margin-left:auto}.btn{border-radius:999px;padding:10px 14px;font-size:13px;font-weight:600}.btn.primary{background:var(--paper);color:var(--paper-ink)}.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}.btn:disabled{opacity:.45;cursor:progress}.drop{position:fixed;top:16px;right:16px;bottom:16px;left:16px;z-index:5;display:grid;place-items:center;border:1.5px dashed rgba(243,236,223,.55);border-radius:22px;background:#080807c7;font-family:Syne,sans-serif;font-size:40px;letter-spacing:-.03em;pointer-events:none}@media(max-width:980px){.studio{height:auto;min-height:100%;display:flex;flex-direction:column}.panel{border-right:0;border-bottom:0;overflow:visible}.stage{order:-1;position:sticky;top:0;z-index:4;height:48dvh;min-height:220px;flex:none;box-shadow:0 16px 32px #00000073}.stagebar,.transport{padding:8px 12px;gap:8px}.canvaswrap{min-height:0;padding:2px 12px 8px}.transport{flex-wrap:nowrap;overflow-x:auto}.exports{flex:none}}@media(max-width:980px)and (orientation:landscape){html,body,#root{height:100%;overflow:hidden}.studio{height:100%;min-height:0;display:grid;grid-template-columns:minmax(220px,42%) minmax(0,1fr)}.panel{height:100%;min-height:0;overflow:auto;border-right:1px solid var(--line);padding:14px 12px 20px}.stage{order:0;position:relative;height:100%;min-height:0;box-shadow:none}}
