
:root{color-scheme:dark;--bg:#101315;--surface:#181d20;--border:#2b3436;--text:#f3f4ef;--muted:#acb8b8;--coral:#ff795f;--teal:#86dbc9;--edge:clamp(20px,4.7vw,72px);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text)}button,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:2px solid var(--teal);outline-offset:4px}p,h1,h2,h3{margin:0}svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}section{scroll-margin-top:84px}.wrap{width:min(100% - var(--edge)*2,1240px);margin-inline:auto}.eyebrow{font:700 11px/1.3 ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);display:flex;align-items:center;gap:8px}.eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 12px #86dbc957}.muted{color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:45px;padding:0 17px;border:1px solid var(--border);border-radius:8px;color:var(--text);background:#1c2326;font-size:13px;font-weight:750;white-space:nowrap}.btn:hover{background:#293438}.btn.primary{background:var(--coral);border-color:var(--coral);color:#23140f}.btn.primary:hover{background:#ffa18e}.btn svg{width:16px;height:16px}.iconbtn{display:grid;place-items:center;width:39px;height:39px;border:1px solid #ffffff3b;border-radius:50%;background:#111619bb;color:white}.iconbtn:hover{background:#3b4a4b}
header{border-bottom:1px solid #ffffff14;background:#101315ed;position:sticky;top:0;z-index:5;backdrop-filter:blur(12px)}.nav{height:66px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:9px;font-weight:850;font-size:22px;letter-spacing:-.06em}.brand svg{color:var(--coral);width:34px;height:26px;stroke-width:1.8}.brand small{font-size:.65em;color:var(--teal);letter-spacing:-.03em}.navlinks{display:flex;gap:28px;align-items:center;color:var(--muted);font-size:13px;font-weight:650}.navlinks a:hover{color:white}
.hero{position:relative;overflow:hidden;border-bottom:1px solid #ffffff13;background:radial-gradient(ellipse at 85% 38%,#173437 0%,#12191b 39%,#101315 74%)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 28%,#80b8b00a 29%,transparent 29.2%),linear-gradient(#80b8b00a 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,transparent,#000)}.hero-grid{position:relative;min-height:510px;padding:54px 0 58px;display:grid;grid-template-columns:1.03fr 1fr;align-items:center;gap:clamp(28px,6vw,100px)}h1{font-size:clamp(49px,6.2vw,94px);line-height:.94;letter-spacing:-.087em;font-weight:850;margin:18px 0 19px}h1 em{color:var(--coral);font-style:normal}.hero .lead{font-size:clamp(15px,1.6vw,18px);line-height:1.55;max-width:440px;color:var(--muted)}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.hero-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px;color:#b7c7c7;font:700 10px ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}.hero-meta span+span:before{content:"/";margin-right:10px;color:#647877}
.stage{position:relative;min-width:0;border:1px solid #57757577;border-radius:16px;background:#18282c;overflow:hidden;box-shadow:0 30px 65px #0007;aspect-ratio:1.27}.stage:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#101719 3%,#1420223b 57%),url('media/Breakwater-Run.webp') center 51%/cover;opacity:.56}.stage:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,#10191dbb,transparent 61%)}.stage-inner{position:absolute;z-index:1;inset:0;display:grid;grid-template-columns:1fr 45%;align-items:center;gap:8px;padding:16px 18px}.stage-copy{align-self:end;padding:0 0 10px 2px}.stage-copy h2{font-size:clamp(24px,4vw,47px);line-height:.96;letter-spacing:-.07em;margin:10px 0}.stage-copy p{font-size:12px;line-height:1.4;color:#d2dddd}.stage-badge{position:absolute;top:17px;left:20px;color:#e0f1ed;font:700 9px ui-monospace,monospace;letter-spacing:.15em;border:1px solid #aacbc868;background:#101c20c9;border-radius:4px;padding:6px 8px}.hero-player{width:100%;max-height:100%;aspect-ratio:9/16;justify-self:center;border-radius:9px;border:1px solid #8ddacb8c;background:black;position:relative;overflow:hidden;box-shadow:0 14px 44px #0009}.hero-player video{width:100%;height:100%;object-fit:cover;display:block}.hero-player .play-hero{position:absolute;inset:0;border:0;background:linear-gradient(0deg,#07131591,transparent 40%);color:white;display:grid;place-items:center}.hero-player .play-hero[hidden]{display:none}.play-chip{display:grid;place-items:center;width:51px;height:51px;background:#111b20cf;border:1px solid #ffffff7a;border-radius:50%}.hero-play-label{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:10px;font-weight:750;background:#111619d9;border:1px solid #ffffff38;border-radius:5px;padding:4px 6px}.play-chip svg{width:20px;height:20px}.hero-player .iconbtn{position:absolute;bottom:8px;right:8px;width:34px;height:34px}.hero-player .iconbtn[hidden]{display:none}
.section{padding:54px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:22px}.section-head h2,.sound-copy h2,.cta h2{font-size:clamp(33px,4.2vw,60px);line-height:1;letter-spacing:-.066em;margin:8px 0}.section-head p{color:var(--muted);font-size:14px;line-height:1.5}.filters{display:flex;gap:6px;flex-wrap:wrap}.filter,.option{border:1px solid var(--border);border-radius:6px;background:#161b1d;color:var(--muted);font-size:12px;padding:8px 11px;font-weight:650}.filter[aria-pressed=true],.option[aria-pressed=true]{border-color:#73c4b2;color:var(--teal);background:#18312d}.clip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.clip{min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:11px;overflow:hidden}.clip[hidden]{display:none}.thumb{display:block;position:relative;width:100%;border:0;padding:0;aspect-ratio:1.85;background:#16262b;color:white}.thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 53%}.clip:nth-child(2) .thumb img{object-position:center 41%}.thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0b0d10ab,transparent 51%)}.thumb .play-chip{position:absolute;left:12px;bottom:12px;z-index:1;width:38px;height:38px}.thumb:hover .play-chip{background:var(--coral);color:#23140f}.duration{position:absolute;right:12px;bottom:12px;z-index:1;background:#0e1519db;padding:4px 7px;border-radius:4px;font:700 11px ui-monospace,monospace}.clip-body{padding:15px}.type{font:700 9px ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}.clip h3{font-size:21px;letter-spacing:-.045em;margin:5px 0}.clip p{font-size:12px;color:var(--muted);min-height:37px;line-height:1.45}.clip .remix{margin-top:9px;background:none;color:var(--coral);border:0;padding:5px 0;font-weight:750;font-size:12px;display:inline-flex;align-items:center;gap:5px}.remix svg{width:15px;height:15px}
.tools{border-block:1px solid #ffffff12;background:#14191b}.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}.tool-card{text-align:left;padding:15px 14px 13px;background:#1a2225;border:1px solid #354447;color:var(--text);border-radius:9px;min-height:131px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.tool-card:hover{border-color:var(--teal)}.tool-card>svg{color:var(--teal);width:21px;height:21px}.tool-card strong{font-size:15px;letter-spacing:-.025em}.tool-card span{color:var(--muted);font-size:12px;line-height:1.4}.tool-card .go{margin-top:auto;color:var(--coral);font-weight:800;font-size:11px}
.sound-layout{display:grid;grid-template-columns:1fr 1.12fr;gap:35px;align-items:center}.sound-copy p,.cta p{color:var(--muted);line-height:1.55;font-size:14px;max-width:430px}.mixer{padding:13px;background:#191f21;border:1px solid var(--border);border-radius:11px}.track{display:grid;grid-template-columns:36px minmax(89px,.8fr) 1.3fr 72px;align-items:center;gap:10px;padding:9px;border-bottom:1px solid #ffffff12}.track:last-child{border-bottom:0}.track .iconbtn{width:34px;height:34px;border-color:#5b7776}.track strong{font-size:12px;display:block}.track small{color:var(--muted);font-size:10px}.wave{height:29px;display:flex;align-items:center;justify-content:center;gap:2px;overflow:hidden}.wave i{height:var(--h);width:2px;flex:none;background:var(--teal);opacity:.55}.track[data-playing=true] .wave i{animation:wave .65s ease-in-out infinite alternate;animation-delay:var(--d);opacity:1}@keyframes wave{to{transform:scaleY(.45)}}input[type=range]{accent-color:var(--teal);width:100%}
.cta{text-align:center;padding:44px 20px;border:1px solid #57757588;border-radius:15px;background:radial-gradient(ellipse at 18% 0%,#274340 0%,transparent 50%),radial-gradient(ellipse at 100% 100%,#623d34 0%,transparent 55%),#182023}.cta p{margin:0 auto 18px}.cta .eyebrow{justify-content:center}footer{padding:23px 0 29px;color:var(--muted);font-size:12px}.foot{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.foot a:hover{color:white}
dialog{border:1px solid #577575;border-radius:15px;background:#181f22;color:var(--text);width:min(calc(100% - 28px),565px);max-height:calc(100dvh - 28px);padding:22px;overflow:auto;box-shadow:0 24px 80px #000b}dialog::backdrop{background:#071011cf;backdrop-filter:blur(4px)}.modal-head{display:flex;justify-content:space-between;align-items:start;gap:8px;margin-bottom:12px}.modal-head h2{font-size:29px;letter-spacing:-.05em}.modal-head .iconbtn{flex:none}.preview-video{display:block;width:min(100%,275px);max-height:65vh;margin:auto;border-radius:8px;background:black}.modal-caption{color:var(--muted);font-size:12px;line-height:1.55;margin-top:10px}.studio label,.field-label{display:block;font-size:12px;color:var(--muted);font-weight:700;margin:14px 0 6px}.studio textarea{width:100%;min-height:84px;resize:vertical;background:#101719;border:1px solid #46605f;border-radius:7px;color:var(--text);padding:10px}.choices{display:flex;flex-wrap:wrap;gap:6px}.studio-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}.draft{margin-top:12px;padding:10px;background:#112120;border-radius:7px;color:#c6e7dd;font-size:13px;line-height:1.5}.draft[hidden]{display:none}.draft p+p{margin-top:5px}
@media(max-width:860px){.navlinks{gap:15px}.hero-grid{gap:22px;min-height:0}.stage{aspect-ratio:1.07}.stage-inner{grid-template-columns:1fr 53%;padding:12px;gap:5px}.stage-copy{padding:0}.stage-badge{left:12px;top:12px}.tools-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.nav{height:59px}.navlinks{display:none}.hero-grid{grid-template-columns:1fr;padding:35px 0;gap:22px}.stage{aspect-ratio:1.28}.stage-inner{grid-template-columns:1fr 43%;padding:12px 18px}.stage-copy h2{font-size:34px}.section{padding:36px 0}.section-head{display:block}.filters{margin-top:12px}.clip-grid,.sound-layout{grid-template-columns:1fr}.clip-grid{gap:11px}.clip p{min-height:0}.clip .thumb{aspect-ratio:2.05}.sound-layout{gap:16px}.track{grid-template-columns:33px minmax(83px,1fr) .9fr 55px;gap:6px;padding:7px 3px}.cta{padding:32px 12px}.hero-meta{gap:7px}.hero-meta span+span:before{margin-right:7px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important}}

:root{--edge:clamp(18px,4.2vw,72px)}
.navlinks{gap:16px}.nav-group,.mobile-nav{position:relative}.nav-group summary,.mobile-nav summary{cursor:pointer;list-style:none;padding:9px 6px;white-space:nowrap;color:var(--text);font-weight:700;font-size:13px}.nav-group summary::-webkit-details-marker,.mobile-nav summary::-webkit-details-marker{display:none}.nav-group summary:after,.mobile-nav summary:after{content:"⌄";color:var(--teal);margin-left:7px}.nav-pop{min-width:195px;padding:6px;position:absolute;top:100%;left:0;z-index:7;background:#1b2528;border:1px solid #4b6968;border-radius:8px;box-shadow:0 14px 30px #0008}.nav-pop a,.mobile-nav nav>a{display:block;padding:9px 10px;border-radius:4px;color:var(--text);white-space:nowrap}.nav-pop a:hover,.mobile-nav nav>a:hover{background:#314044}.mobile-nav{display:none}.foot nav{display:flex;gap:13px;flex-wrap:wrap}.hero h1{font-size:clamp(44px,5.4vw,77px);line-height:.99;letter-spacing:-.075em}.hero-grid{gap:clamp(24px,5vw,70px)}.hero .lead{max-width:530px}.hero-composer{margin-top:22px;background:#142024;border:1px solid #527574;border-radius:11px;padding:12px;max-width:530px;box-shadow:0 12px 35px #0004}.hero-composer label{font-size:12px;color:var(--muted);font-weight:700;display:block;margin:10px 0 5px}.hero-composer textarea{display:block;width:100%;min-height:66px;border:1px solid #40595b;border-radius:7px;padding:9px 10px;background:#0e171a;color:var(--text);resize:vertical}.composer-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px}.composer-footer .btn{min-height:39px}.style-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px}.style-link{font-weight:720;font-size:12px;color:var(--teal);text-underline-offset:4px}.style-link:hover{text-decoration:underline}.clip .remix{margin:0}.route-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:12px}.route-links .style-link{padding:5px 0}.pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}.pair figure{margin:0;background:#1b2528;border:1px solid var(--border);border-radius:10px;padding:12px;display:flex;align-items:center;gap:18px}.pair img,.pair video{height:210px;max-width:44%;width:auto;object-fit:contain;background:#090d0f;border-radius:6px}.pair figcaption strong{display:block;margin:5px 0 7px;font-size:19px}.pair figcaption p{font-size:13px;color:var(--muted);line-height:1.5}.callouts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.callout{padding:18px;border:1px solid var(--border);border-radius:9px;background:#171e21}.callout h3{font-size:17px;margin:5px 0 7px}.callout p{font-size:14px;color:var(--muted);line-height:1.55}.faq details{padding:12px 14px;background:#192023;border:1px solid var(--border);border-radius:7px;margin:6px 0}.faq summary{cursor:pointer;font-weight:700;font-size:14px}.faq details p{margin-top:9px;color:var(--muted);line-height:1.55;font-size:14px}.subhero{padding:36px 0 42px;background:radial-gradient(ellipse at 84% 0,#204043,transparent 60%);border-bottom:1px solid var(--border)}.crumbs{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:13px;margin-bottom:24px}.crumbs a{color:var(--teal)}.subgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,6vw,90px);align-items:center}.subhero h1{font-size:clamp(42px,6vw,73px);line-height:1;letter-spacing:-.072em}.subhero .lead{font-size:17px;line-height:1.56;color:var(--muted);max-width:610px}.submedia{margin:0;background:#152023;border:1px solid #436061;border-radius:11px;padding:12px;display:grid;grid-template-columns:minmax(105px,160px) 1fr;align-items:center;gap:15px}.submedia video,.submedia img{width:100%;max-height:270px;object-fit:contain;border-radius:6px;background:#080d0f}.submedia figcaption strong{display:block;font-size:17px;margin:6px 0}.submedia figcaption p{font-size:13px;line-height:1.5;color:var(--muted)}.article-copy{max-width:790px}.article-copy h2{font-size:clamp(27px,4vw,42px);letter-spacing:-.05em;margin:0 0 9px}.article-copy p,.article-copy li{font-size:16px;line-height:1.65;color:#c0cbca}.article-copy ol,.article-copy ul{padding-left:23px}.article-copy li+li{margin-top:8px}.article-copy strong{color:var(--text)}.article-copy blockquote{margin:10px 0 0;padding:14px 18px;background:#162926;border-left:3px solid var(--teal);color:#e8f2ef;line-height:1.65;border-radius:0 7px 7px 0}.article-copy .content-block{margin-bottom:30px}.article-copy .content-block:last-child{margin-bottom:0}.audio-samples{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.audio-samples audio{display:block;width:100%;max-width:100%;margin-top:10px}.audio-samples .callout{min-width:0}
@media(max-width:810px){.navlinks{display:none}.mobile-nav{display:block;margin-left:auto}.mobile-nav nav{position:absolute;right:0;width:min(240px,74vw);max-height:75dvh;overflow:auto;background:#1b2528;border:1px solid #4b6968;border-radius:8px;padding:5px;box-shadow:0 14px 30px #0008}.mobile-nav .nav-pop{position:static;box-shadow:none;border:0;background:#111a1d;min-width:0}.mobile-nav .nav-pop a{white-space:normal}.mobile-nav summary{padding:9px}.subgrid{gap:22px}}
@media(max-width:650px){.hero h1{font-size:clamp(43px,11vw,63px)}.pair,.subgrid,.callouts,.audio-samples{grid-template-columns:1fr}.pair img,.pair video{height:185px}.submedia{grid-template-columns:minmax(100px,130px) 1fr}.nav-cta{padding:0 10px;min-height:39px;font-size:11px}.nav{gap:6px}.nav .brand{font-size:19px}.nav .brand svg{width:25px}.nav-cta svg{display:none}.composer-footer{flex-wrap:wrap}}
.audio-samples [id],.article-copy [id],#create{scroll-margin-top:84px}
.article-copy .style-links a{color:var(--teal);font-size:14px;font-weight:720}
.article-copy .style-links a:hover{text-decoration:underline;text-underline-offset:4px}

/* Matte surfaces and film-led layout. */
:root{--bg:#171817;--surface:#1d1e1c;--border:#3b3d36;--text:#f1efe8;--muted:#b8b9ae;--coral:#ff866b;--teal:#a8c2a9}
header{background:#171817;backdrop-filter:none;border-bottom:1px solid var(--border)}
.navlinks{font-weight:550;gap:21px}.nav-group summary{font-weight:600}
.nav-pop,.mobile-nav nav,.mobile-nav .nav-pop{background:#22231f;border-color:var(--border);box-shadow:none}
.nav-pop a:hover,.mobile-nav nav>a:hover{background:#33352d}
.btn{border-radius:5px;background:#242521}.btn:hover{background:#30312b}
.section-label{font:600 11px/1.4 ui-monospace,monospace;letter-spacing:.14em;color:var(--teal)}
.hero{background:#191a18;border-color:var(--border)}.hero:before{display:none}
.hero-grid{padding:66px 0;min-height:0;grid-template-columns:1.04fr 1fr;gap:clamp(28px,6vw,95px)}
.hero h1{font-size:clamp(50px,6vw,92px);line-height:.94;letter-spacing:-.073em;margin:13px 0 20px}
.hero .lead{max-width:410px}.hero-composer{box-shadow:none;border-color:var(--border);border-radius:7px;background:#20211e;padding:12px 13px}
.hero-composer textarea{background:#171815;border-color:var(--border);border-radius:4px;min-height:72px}
.filter,.option{background:transparent;border-radius:4px}
.filter[aria-pressed=true],.option[aria-pressed=true]{background:#2b332b;border-color:#596d58}
.stage{margin:0;min-width:0;aspect-ratio:auto;overflow:hidden;border:1px solid var(--border);border-radius:5px;background:#22231f;box-shadow:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(112px,.51fr)}
.stage:before,.stage:after{display:none}
.stage-copy{min-width:0;align-self:stretch;padding:20px 15px;display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.stage-copy h2{font-size:clamp(24px,3vw,47px);line-height:1;letter-spacing:-.065em;margin:0 0 5px}
.stage-copy p{font-size:12px;color:var(--muted)}
.stage-meta{display:flex;flex-wrap:wrap;gap:6px 9px;font:650 10px/1.4 ui-monospace,monospace;color:var(--muted)}
.stage-meta span:last-child{color:var(--teal)}
.hero-player{width:100%;max-height:none;border:0;border-radius:0;box-shadow:none}
.hero-player .play-hero{background:transparent}.play-chip,.iconbtn{background:#10120ee6}
.hero-play-label{bottom:13px;background:#171817;border-radius:4px}
.home-page .section{padding:53px 0;border-bottom:1px solid var(--border)}
.section-head h2,.sound-copy h2,.cta h2{font-size:clamp(32px,4.1vw,53px);letter-spacing:-.06em}
.home-page .section-head{margin-bottom:23px}
.clip-grid{gap:19px}.clip{border:0;border-radius:0;background:transparent}
.clip .thumb{border-radius:5px;overflow:hidden;aspect-ratio:1.48}
.clip .thumb img{object-position:center 48%}
.clip-body{padding:12px 0 0}.clip h3{font-size:23px}.clip p{min-height:0}.clip .route-links{border-top:1px solid var(--border);padding-top:5px}
.tools{background:#1c1d1a;border-top:0}
.tools-grid{gap:0;border-top:1px solid var(--border);border-left:1px solid var(--border)}
.tool-card{border:0;border-right:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:0;background:transparent;padding:16px;min-height:130px}
.tool-card:hover{background:#262823}.tool-card .go{color:var(--teal)}
.pair figure,.submedia,.mixer,.faq details,.callout{box-shadow:none;border-color:var(--border);border-radius:5px;background:#20211e}
.track .wave i{opacity:.45}.track{border-color:var(--border)}
.home-page .faq details{border:0;border-bottom:1px solid var(--border);background:transparent;border-radius:0;padding:14px 0;margin:0}
.cta{display:flex;text-align:left;align-items:center;justify-content:space-between;gap:18px;background:transparent;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:38px 0}
.cta h2{margin-top:0}.cta p{margin:0}.subhero{background:#1d1e1b}
@media(max-width:900px){.navlinks{gap:8px}.hero-grid{gap:26px}.stage-copy{padding:14px 10px}.stage{grid-template-columns:1fr minmax(100px,.61fr)}}
@media(max-width:650px){.hero-grid{grid-template-columns:1fr;padding:33px 0}.hero h1{font-size:clamp(43px,11vw,65px)}.stage{max-width:460px;grid-template-columns:1.16fr 1fr}.stage-copy h2{font-size:29px}.stage-copy{padding:13px}.home-page .section{padding:34px 0}.clip .thumb{aspect-ratio:1.75}.clip-grid{gap:25px}.cta{align-items:start;flex-direction:column}.tool-card{padding:13px}}
@media(min-width:651px){.stage{width:100%;max-width:510px;justify-self:end}}
@media(min-width:901px){.stage{grid-template-columns:minmax(0,1fr) minmax(124px,.7fr)}}

/* Game covers set the colour and contrast for the homepage. */
:root{--bg:#0c1017;--surface:#131a24;--border:#2b3544;--text:#f5f4ef;--muted:#a8b3c4;--coral:#ff8d75;--teal:#84dfd1}
header{background:#0d1119}.nav-pop,.mobile-nav nav,.mobile-nav .nav-pop{background:#151d28}.nav-pop a:hover,.mobile-nav nav>a:hover{background:#222e3b}
.brand svg{filter:drop-shadow(0 0 8px #ff8d7555)}
.btn{background:#151d27;border-radius:6px}.btn:hover{background:#202e3b}
.home-page .hero{background:#0d131d;position:relative}
.home-page .hero-grid{position:relative;z-index:1;padding:52px 0 48px;grid-template-columns:1.2fr .9fr;gap:clamp(28px,5vw,76px)}
.home-page .hero h1{font-size:clamp(48px,5.8vw,85px);line-height:.99;margin:13px 0 18px}
.home-page .hero h1 em{color:var(--coral)}
.home-page .hero .lead{max-width:465px}
.home-page .hero-composer{background:#131d2a;border-color:#3c5064;margin-top:22px}
.home-page .hero-composer textarea{background:#0c141f;border-color:#2d4052}
.home-page .stage{background:#101924;border-color:#3c4d60;border-radius:8px;grid-template-columns:minmax(0,1fr) minmax(112px,.68fr);max-width:465px}
.home-page .stage-copy{background:#131e2b;padding:18px 14px}
.home-page .stage-copy h2{font-size:clamp(25px,3.2vw,45px)}
.home-page .section-label{font-size:10px}
.home-page .worlds{scroll-margin-top:84px;background:#0c1119;padding:34px 0 36px}
.worlds .section-head{align-items:end}.worlds .section-head h2{margin:6px 0 8px}
.world-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.world-card{min-width:0;background:#151d28;border:1px solid #39485c;border-top:2px solid var(--world);border-radius:7px;overflow:hidden}
.world-harbour-nine{--world:#e58e5f}.world-ash-circuit{--world:#edb45f}.world-snowline-run{--world:#a7cdfa}.world-canal-zero{--world:#a0c986}.world-ember-isle{--world:#f3a68f}.world-night-garage{--world:#de9bf2}.world-yacht{--world:#f5be91}.world-block-horror{--world:#92d4b9}
.world-cover{position:relative;display:block;aspect-ratio:5/4;background:#19212c;overflow:hidden}
.world-cover img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 47%;transition:transform .22s ease}
.world-card:hover img,.world-card:focus-visible img{transform:scale(1.05)}
.world-open{position:absolute;background:#0b121de8;color:#f7f6f2;border:1px solid #a4b8d45c}
.world-open{bottom:8px;right:8px;border-radius:4px;padding:4px 7px;font-size:11px;font-weight:750}
.world-card:hover .world-open,.world-card:focus-visible .world-open{background:var(--world);color:#141617;border-color:var(--world)}
.world-info{padding:9px 9px 11px}.world-genre{color:var(--world);font-size:10px;font-weight:750;line-height:1.3}
.world-info h3{font-size:clamp(14px,1.47vw,21px);letter-spacing:-.04em;margin:3px 0 4px}
.world-style{font-size:10px;line-height:1.35;color:var(--muted)}
.world-extra{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin-top:15px;font-size:12px;color:var(--muted)}
.world-extra a{border:1px solid var(--border);border-radius:4px;padding:5px 7px;color:var(--teal)}
.world-extra a:hover{background:#172531}
.tools,.subhero{background:#111925}.tool-card:hover{background:#192533}
.pair figure,.submedia,.mixer,.faq details,.callout{background:#141d29}
.filter[aria-pressed=true],.option[aria-pressed=true]{background:#193432;border-color:#476e69}
@media(max-width:800px){.world-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.home-page .hero-grid{grid-template-columns:1fr;padding:33px 0;gap:21px}.home-page .hero h1{font-size:clamp(39px,10vw,61px)}.home-page .stage{grid-template-columns:1.05fr 1fr;justify-self:start}.home-page .stage-copy{padding:13px}.worlds .section-head>a{display:inline-block;margin-top:9px}.world-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.world-cover{aspect-ratio:3/4}.world-info h3{font-size:17px}}

.community { border-top: 1px solid var(--line, #303544); scroll-margin-top: 74px; }
.community-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.community-filters .filter { border-radius: 99px; }
.community-filters .filter[aria-pressed="true"] { color: #10151d; background: var(--coral); border-color: var(--coral); }
.community-filters[hidden], .community-card[hidden] { display: none; }
@media (max-width: 650px) {
  .community-filters { flex-wrap: nowrap; overflow-x: auto; padding: 3px 3px 9px; }
  .community-filters .filter { flex: 0 0 auto; }
}
.community-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: start; }
.community-card { overflow: hidden; border: 1px solid var(--line, #303544); border-radius: 12px; background: #151926; }
.community-thumb { position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 3; padding: 0; border: 0; overflow: hidden; background: linear-gradient(145deg, #202d40, #101420); color: #fff; }
.community-thumb img, .community-thumb .community-video-thumbnail { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.community-thumb:focus-visible { outline: 3px solid var(--coral); outline-offset: -3px; }
.community-play-icon { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #ffffff65; border-radius: 50%; background: #0b101ac9; }
.community-play-icon::after { content: ""; margin-left: 3px; border-block: 7px solid transparent; border-left: 11px solid currentColor; }
.community-thumb:hover .community-play-icon { background: #141c2b; }
.hover-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #080b12; pointer-events: none; opacity: 0; }
.is-previewing .hover-preview { opacity: 1; }
.is-previewing .community-play-icon, .is-previewing .play-chip { visibility: hidden; }
.community-copy { padding: 10px 12px 12px; }
.community-copy h3 { margin: 0 0 4px; font-size: .95rem; line-height: 1.3; overflow-wrap: anywhere; }
.community-copy p { margin: 0; color: #b6bacb; font-size: .78rem; }
.community-player { width: min(94vw, 480px); padding: 12px; }
.community-player[data-aspect="1:1"] { width: min(94vw, 650px); }
.community-player[data-aspect="16:9"] { width: min(94vw, 880px); }
.community-player::backdrop { background: #080a10dd; }
.community-player-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.community-player-heading h2 { margin: 0; font-size: clamp(15px, 3vw, 21px); overflow-wrap: anywhere; }
.community-player-heading .btn { min-height: 36px; }
.community-player video { display: block; max-width: 100%; max-height: min(72dvh, 760px); margin-inline: auto; background: #080b12; object-fit: contain; border-radius: 8px; }
#community-player-message:empty { display: none; }
.community-more { margin-top: 16px; }
.community-more[hidden] { display: none; }
@media (max-width: 1024px) { .community-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 650px) {
  .community-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .community-copy { padding: 9px; }
  .community-copy h3 { font-size: .85rem; }
}
.community-archive main > :not(#community) { display: none; }
.community-archive #community { min-height: 70vh; }

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.community-report{padding:10px 14px}.community-report form{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.community-report input{min-width:0;flex:1 1 130px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:8px}

.brand { white-space: nowrap; }
.brand-mark { display: block; width: 30px; height: 27px; flex: none; }
.nav .brand-mark { width: 27px; height: 24px; }
