/* GrooveSteps: Backstage. Shared product surfaces, October 2026. */
:root{--gs-stage:#141f19;--gs-brass:#edbd61;--gs-copper:#aa4a2d;--gs-paper:#f5f1e7}
[hidden]{display:none!important}
.gs-eyebrow{font:600 .67rem/1.6 var(--gs-font-mono);letter-spacing:.17em;text-transform:uppercase}
a,button,input,select,summary{touch-action:manipulation}
:focus-visible{outline:3px solid #a9621f;outline-offset:4px}
html[data-gs-view="home"] .gs-header{background:#141f19;color:#f5f1e7;border-bottom-color:#3a4437}
html[data-gs-view="home"] .gs-header a,html[data-gs-view="home"] .gs-logo{color:#f5f1e7}
html[data-gs-view="home"] .gs-header .gs-cta{background:#edbd61;color:#18241a}
html[data-gs-view="home"] .gs-burger span{background:#f5f1e7}
.gs-stage{position:relative;isolation:isolate;background:#111b16;color:#f5f1e7;overflow:hidden;min-height:650px}
.gs-stage-art{position:absolute;inset:0;z-index:-2;display:block}.gs-stage-art img{width:100%;height:100%;object-fit:cover;object-position:70% 60%}
.gs-stage::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#111b16 0%,#111b16eb 24%,#111b1660 52%,#111b1600 82%),linear-gradient(0deg,#111b16 0%,transparent 22%)}
.gs-stage-main{max-width:1320px;margin:auto;padding:82px 48px 105px;min-height:590px}
.gs-stage .gs-eyebrow{color:#ebc68c;margin-bottom:22px}.gs-stage h1{font:750 clamp(3.6rem,6.8vw,6.6rem)/.97 var(--gs-font-disp);letter-spacing:-.065em;color:#f5f1e7;max-width:10ch;margin:0 0 26px;text-wrap:balance}
.gs-stage h1 em{display:block;font-style:normal;color:#edbd61}.gs-stage-lede{font-size:1.06rem;line-height:1.65;color:#d8dccf;max-width:36ch}
.gs-stage .cta-row{margin-top:28px;gap:12px;display:flex;flex-wrap:wrap}.gs-stage .gs-btn{font-size:.92rem;padding:15px 23px;border-radius:5px}
.gs-stage .gs-btn--primary{background:#edbd61;color:#172319;border:1px solid #edbd61;box-shadow:none}.gs-stage .gs-btn--ghost{background:#172319aa;color:#f5f1e7;border:1px solid #7d8975}
.gs-stage-note{font-size:.75rem;color:#c3cbbb;max-width:40ch;margin-top:18px}
.gs-stage-footer{position:absolute;bottom:0;left:0;right:0;display:flex;gap:24px;justify-content:space-between;padding:22px max(48px,calc((100vw - 1224px)/2));border-top:1px solid #a2ac7b30;font:500 .65rem/1.5 var(--gs-font-mono);letter-spacing:.08em;background:#142019ab}
.gs-stage-footer a{color:#edbd61}
.gs-soundcheck{display:grid;grid-template-columns:.85fr 1.15fr;gap:54px;align-items:center;max-width:1240px;padding:64px 32px;margin:auto}
.gs-soundcheck h2{font-size:2.4rem;letter-spacing:-.05em;margin:10px 0 18px}.gs-soundcheck-copy>p:last-child{max-width:35ch;color:#56604d}.gs-soundcheck .groove{border-radius:10px;border:1px solid #5d6b50;box-shadow:0 8px 0 #dbd8c7;padding:28px;min-width:0}.gs-soundcheck .step{height:28px}
.gs-home-path{max-width:1240px;margin:0 auto 58px;padding:0 32px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.gs-home-path>a{display:flex;flex-direction:column;gap:12px;border-top:2px solid #9c7e42;padding:22px 0;color:#273727;text-decoration:none}.gs-home-path>a:hover strong{color:#8d481e}
.gs-home-path strong{font:700 1.35rem/1.2 var(--gs-font-disp);letter-spacing:-.025em}.gs-home-path span{font-size:.8rem;color:#59634d}.gs-home-path span:first-child{font:500 .64rem/1.5 var(--gs-font-mono);letter-spacing:.13em;color:#816021}
.gs-progress-hud{font:500 .72rem/1.6 var(--gs-font-mono);color:inherit;padding:8px 0}
.gs-rank-page{max-width:1200px;margin:auto;padding:36px 32px 80px;color:#283527}
.gs-rank-hero{display:grid;grid-template-columns:1.4fr .6fr;gap:30px;align-items:center;padding:44px 48px 48px;background:#1c2c21;color:#f6f0df;border-radius:12px;overflow:hidden;position:relative;isolation:isolate}
.gs-rank-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(0deg,transparent 0 7px,#d2bc7f04 7px 8px)}
.gs-rank-hero h1{font:750 clamp(2.6rem,5vw,4.5rem)/1 var(--gs-font-disp);letter-spacing:-.05em;margin:20px 0;color:#f6f0df}.gs-rank-hero h1 span{display:block;font-size:.6em;margin-top:14px;color:#edbd61}
.gs-rank-hero p{max-width:46ch;color:#d2d8c8;line-height:1.7}.gs-rank-hero .gs-eyebrow{color:#dbc592}.gs-rank-hero .gs-btn{margin-top:22px;background:#edbd61;color:#18251b;box-shadow:none}
.gs-rank-disc{width:270px;aspect-ratio:1;border:1px solid #d4b570;border-radius:50%;box-shadow:0 0 0 14px #1c2c21,0 0 0 15px #bda37355,0 0 0 30px #1c2c21,0 0 0 31px #bda37333;display:flex;flex-direction:column;justify-content:center;text-align:center;transform:rotate(-12deg);background:repeating-radial-gradient(#d8b860 0 1px,#dfbe72 2px 5px);color:#243221;margin:25px 0}
.gs-rank-disc span{font:800 2.4rem/.95 var(--gs-font-disp);letter-spacing:-.05em}.gs-rank-disc small{font:600 .45rem/1.5 var(--gs-font-mono);margin-top:20px;letter-spacing:.06em}
.gs-board-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:32px;margin-top:40px}.gs-board-toolbar{display:flex;border-bottom:1px solid #b4bca4;gap:25px;margin-bottom:20px;flex-wrap:wrap}.gs-board-toolbar button{border:0;border-bottom:3px solid transparent;padding:12px 0;background:transparent;color:#57604e;font:700 .95rem var(--gs-font-body);cursor:pointer}.gs-board-toolbar button[aria-pressed="true"]{color:#233e26;border-bottom-color:#9b6b25}
.gs-board-selects{display:flex;align-items:end;gap:15px;flex-wrap:wrap;justify-content:space-between;min-height:80px;margin-bottom:20px}.gs-board-selects label{display:block;font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;font-weight:600;margin-bottom:5px}.gs-board-selects select{border:1px solid #a5ae99;background:#fcf9ef;color:#29372a;border-radius:5px;padding:10px;font:500 .88rem var(--gs-font-body);max-width:100%}#boardPeriod{font:400 .64rem/1.5 var(--gs-font-mono);color:#616b56;margin-bottom:12px}
.gs-board{min-height:280px;background:#fdfaf1;border:1px solid #bfc7b0;border-radius:8px;overflow:hidden}.gs-board-message{padding:40px;text-align:center}.gs-board-empty{padding:40px 32px 48px;background:linear-gradient(135deg,#e7eada,#f7f4e8)}.gs-board-empty>span{font:500 .65rem/1.5 var(--gs-font-mono);letter-spacing:.13em;color:#776027}.gs-board-empty h2{font:700 2.15rem/1.05 var(--gs-font-disp);letter-spacing:-.04em;max-width:16ch;margin:18px 0}.gs-board-empty p{font-size:.94rem;max-width:46ch;color:#536149;line-height:1.7;margin-bottom:20px}.gs-board-empty a{font-weight:700;color:#38512f}
.gs-board table{width:100%;border-collapse:collapse;min-width:0}.gs-board caption{text-align:left;padding:18px 24px;font:700 1.1rem var(--gs-font-disp)}.gs-board th,.gs-board td{padding:16px 20px;border-top:1px solid #d6dcc9;text-align:left;font-size:.9rem}.gs-board thead{background:#e8ecde;color:#5e6955}.gs-board thead th{font:500 .65rem var(--gs-font-mono);text-transform:uppercase}.gs-board tbody td:first-child{font:600 1.3rem var(--gs-font-disp);color:#977031}.gs-board td:last-child{font:500 .85rem var(--gs-font-mono);text-align:right;color:#33532d}.gs-board tbody a{color:#253c2b;overflow-wrap:anywhere}.gs-board-footnote{font-size:.74rem;line-height:1.6;color:#606b55;margin-top:16px}
.gs-standing{align-self:start;background:#e6e9d9;border:1px solid #bec8af;border-radius:8px;padding:24px}.gs-standing h2{font:700 1.6rem/1.1 var(--gs-font-disp);letter-spacing:-.035em;margin:12px 0 20px}.gs-standing p{font-size:.88rem;line-height:1.65;color:#536047}.gs-standing a{font-size:.82rem;line-height:1.6;font-weight:600;color:#40582e}.gs-standing-total{display:block;font:600 1.2rem var(--gs-font-disp);margin-bottom:12px}.gs-standing progress{width:100%;height:9px;accent-color:#58743c;margin-bottom:14px}.gs-standing-rule{display:flex;align-items:center;gap:12px;border-top:1px solid #b7c2a4;margin-top:25px;padding:20px 0}.gs-standing-rule b{font:700 2.5rem var(--gs-font-disp);color:#546c38}.gs-standing-rule span{font-size:.75rem;max-width:10ch;color:#57654b}
.gs-ranking-rules{display:grid;grid-template-columns:1fr 1.5fr;gap:70px;margin-top:70px;border-top:1px solid #bdc5ae;padding-top:44px}.gs-ranking-rules h2{font:700 2.8rem/1.06 var(--gs-font-disp);letter-spacing:-.05em;margin:18px 0}.gs-ranking-rules p{line-height:1.75;font-size:.94rem;color:#536149}.gs-ranking-rules a{display:block;margin-top:20px;color:#40562d}.gs-ranking-rules ol{list-style:none;counter-reset:rule;padding:0;margin:0}.gs-ranking-rules li{counter-increment:rule;border-top:1px solid #c7cebb;padding:20px 0 20px 44px;position:relative}.gs-ranking-rules li::before{content:'0' counter(rule);position:absolute;left:0;top:21px;font:600 .75rem var(--gs-font-mono);color:#846326}.gs-ranking-rules li strong{font:700 1.15rem var(--gs-font-disp)}.gs-ranking-rules li p{margin:8px 0 0}
.gs-midi-panel{background:#edf0e3;border:1px solid #aebc9f;border-radius:8px;margin:20px 0;color:#263c2b;font-family:var(--gs-font-body);text-align:left;max-width:100%;overflow:hidden}.gs-midi-panel>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px;cursor:pointer;font-size:.93rem;font-weight:700;list-style:none}.gs-midi-panel>summary::after{content:'+';font-size:1.2rem}.gs-midi-panel[open]>summary::after{content:'−'}.gs-midi-badge{font:500 .55rem/1.5 var(--gs-font-mono);letter-spacing:.05em;border:1px solid #a6b695;padding:3px 6px;border-radius:3px;white-space:nowrap}.gs-midi-body{padding:0 18px 20px}.gs-midi-panel p{font-size:.82rem;line-height:1.65;margin:8px 0 16px;color:#4e6046;padding:0}.gs-midi-panel label{font:600 .74rem/1.6 var(--gs-font-body);display:block;margin:14px 0 5px;color:#364c30}.gs-midi-panel select{display:block;width:100%;background:#fdfbf1;color:#293d2b;border:1px solid #9eaf8e;min-height:42px;padding:9px;font-family:inherit;border-radius:4px}.gs-midi-actions{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.gs-midi-panel .gs-midi-btn{min-height:42px;padding:9px 12px;font:600 .78rem var(--gs-font-body);border-radius:5px;border:1px solid #324d32;background:#324d32;color:#fff6de;cursor:pointer}.gs-midi-panel .gs-midi-ghost{background:transparent;color:#324d32}.gs-midi-readout{margin:18px 0;padding:16px;background:#1b2b21;color:#edbd61;border-radius:6px}.gs-midi-readout>span{display:block;font:500 .56rem/1.6 var(--gs-font-mono);letter-spacing:.12em;color:#b8c6aa;margin-bottom:6px}.gs-midi-readout output{font:500 .72rem/1.6 var(--gs-font-mono);display:block}.midi-velocity{width:100%;height:6px;margin-top:12px;accent-color:#edbd61}.midi-mapping{border-top:1px solid #b6c2a5;border-bottom:1px solid #b6c2a5;padding-bottom:12px}.midi-mapping>summary{padding:14px 0;font-size:.84rem;cursor:pointer}.gs-midi-panel .midi-check{display:flex;align-items:center;gap:9px;margin-top:18px}.midi-check input{width:18px;height:18px;accent-color:#3e5d39;flex:none}.gs-midi-panel .gs-midi-fine{font-size:.72rem;color:#596a4e}.gs-midi-help{font-size:.77rem;color:#38522c;display:block;margin-top:16px;text-decoration:underline;text-underline-offset:3px}
.gs-play{border:1px solid #b5c2a7!important;background:#eef1e5!important;box-shadow:0 6px 0 #d6ddc7;border-radius:10px!important;color:#233a29!important}.gs-play-bar{flex-wrap:wrap!important}.gs-play .gs-hud-stat{color:#3f5835}.gs-play .gs-card{background:#1e3024;color:#fff6e0;border-color:#78905f}.gs-save-result{margin:18px 0;padding:16px;background:#e7ecd9;border-radius:6px;color:#324a2d}.gs-save-result p{font-size:.82rem;color:#405938}.gs-save-result a{display:block;color:#38522b;font-size:.8rem;margin-top:12px}.gs-play .gs-play-hint{color:#53684a!important}.gs-play .gs-pad{min-height:62px;background:#2b4230!important;color:#fff6de!important;border-color:#5a744b!important;border-radius:6px;box-shadow:0 4px 0 #152a1c}.gs-play .gs-pad-on{background:#c88f36!important}.gs-play .gs-pad-key{color:#e0bd75!important}
.gs-guide{max-width:1100px;margin:auto;padding:40px 32px 80px;color:#293c2a}.gs-guide-header{padding:40px 0 46px;border-bottom:1px solid #b6c2a5}.gs-guide h1{font:750 clamp(2.8rem,5vw,4.6rem)/1.03 var(--gs-font-disp);letter-spacing:-.05em;max-width:16ch;margin:18px 0 24px;color:#293c2a}.gs-guide-lead{max-width:65ch;font-size:1.1rem;line-height:1.7;color:#51624a}.gs-guide .gs-guide-section{display:grid;grid-template-columns:1fr 1.7fr;gap:45px;padding:34px 0;border-bottom:1px solid #c5ceb8}.gs-guide h2{font:700 1.55rem/1.15 var(--gs-font-disp);letter-spacing:-.03em;max-width:20ch}.gs-guide-section p{color:#506348;line-height:1.8}.gs-guide-cta{margin-top:30px;display:flex;flex-wrap:wrap;gap:16px}.gs-guide a{color:#4b602f;text-underline-offset:4px}
.gs-header{box-shadow:0 2px 0 #263d2110}.gs-auth-card{border-radius:10px!important;border-color:#a7b795!important;box-shadow:0 8px 0 #cbd5bb55!important}.gs-page>h1,.gs-page article>h1{letter-spacing:-.05em}.gs-rank-page .gs-btn,.gs-guide .gs-btn{border-radius:5px}
@media(max-width:1000px){.gs-stage-main{padding-left:32px}.gs-stage-footer{padding-left:32px;padding-right:32px}.gs-rank-disc{width:200px}.gs-rank-disc span{font-size:1.8rem}.gs-rank-hero{padding:34px}.gs-board-layout{grid-template-columns:minmax(0,1fr) 240px;gap:22px}.gs-soundcheck{gap:30px}.gs-soundcheck h2{font-size:2rem}.gs-soundcheck .groove{padding:22px 18px}.gs-rank-page{padding-left:24px;padding-right:24px}}
@media(max-width:760px){.gs-stage{min-height:0}.gs-stage-art{height:430px;bottom:auto}.gs-stage-art img{object-position:74% 50%;opacity:.95}.gs-stage::after{background:linear-gradient(0deg,#111b16 15%,#111b16e8 38%,#111b1600 75%)}.gs-stage-main{padding:285px 24px 28px;min-height:0;position:relative}.gs-stage .gs-eyebrow{margin-bottom:14px;font-size:.57rem;letter-spacing:.12em}.gs-stage h1{font-size:clamp(3.8rem,13vw,5.8rem);max-width:10ch;margin-bottom:20px}.gs-stage-lede{max-width:35ch;font-size:1rem}.gs-stage .cta-row{margin-top:22px}.gs-stage-note{font-size:.7rem}.gs-stage-footer{position:relative;padding:18px 24px;gap:14px;flex-wrap:wrap;font-size:.55rem}.gs-stage-footer span:nth-child(2){display:none}.gs-soundcheck{grid-template-columns:1fr;gap:25px;padding:38px 22px}.gs-soundcheck h2{font-size:2.15rem}.gs-soundcheck-copy>p:last-child{max-width:none;font-size:.9rem}.gs-soundcheck .step{height:24px}.gs-home-path{grid-template-columns:1fr;padding:0 22px;gap:0;margin-bottom:20px}.gs-home-path>a{padding:20px 0;gap:7px}.gs-home-path strong{font-size:1.25rem}.gs-rank-page{padding:20px 18px 50px}.gs-rank-hero{grid-template-columns:1fr;padding:28px 24px}.gs-rank-disc{display:none}.gs-rank-hero h1{font-size:3rem}.gs-rank-hero p{font-size:.9rem}.gs-rank-hero .gs-eyebrow{font-size:.55rem}.gs-rank-hero .gs-btn{font-size:.8rem;padding:13px}.gs-board-layout{grid-template-columns:1fr;gap:25px;margin-top:25px}.gs-standing{order:-1}.gs-standing-rule{display:none}.gs-standing{padding:22px}.gs-standing h2{font-size:1.4rem;margin:10px 0 14px}.gs-standing> a{display:block;margin-top:15px}.gs-board-toolbar{gap:28px}.gs-board-selects{min-height:0}.gs-board-empty{padding:30px 24px}.gs-board-empty h2{font-size:2rem}.gs-board th,.gs-board td{padding:14px 12px}.gs-ranking-rules{grid-template-columns:1fr;gap:26px;margin-top:40px;padding-top:30px}.gs-ranking-rules h2{font-size:2.3rem}.gs-guide{padding:20px 22px 50px}.gs-guide-header{padding:26px 0 30px}.gs-guide .gs-guide-section{grid-template-columns:1fr;gap:15px;padding:28px 0}.gs-guide h2{max-width:none}.gs-midi-badge{display:none}.gs-play-pads{flex-wrap:wrap!important}.gs-midi-panel>summary{font-size:.85rem;padding:15px}.gs-midi-body{padding:0 14px 18px}}
@media(prefers-reduced-motion:reduce){.gs-stage *,.gs-rank-page *,.gs-midi-panel *{animation:none!important;transition:none!important}}
.gs-account-history{margin:24px 0;border-top:1px solid #b4c2a3;padding-top:24px}.gs-account-history h2{font:700 1.3rem var(--gs-font-disp);letter-spacing:-.025em}.gs-attempt-list{list-style:none;margin:15px 0;padding:0}.gs-attempt-list li{padding:14px 0;border-bottom:1px solid #c6cfb9;display:flex;flex-direction:column;gap:6px}.gs-attempt-list a{text-transform:capitalize;font-weight:600;color:#3b542d}.gs-attempt-list strong{font:500 .75rem var(--gs-font-mono);color:#576842}.gs-attempt-list small{font-size:.68rem;color:#637057}#gsAttemptHistory>p{font-size:.85rem;line-height:1.6;color:#596a4e}

html[data-gs-view="practice"] body{font-family:var(--gs-font-body);margin:0;background:#f4f1e7;color:#263c2b;line-height:1.65}
.gs-play{--gs-ink:#263c2b;--gs-ink-soft:#4d6344;--gs-ink-mute:#52654b;--gs-green:#315a32;--gs-purple-lt:#655020;--gs-bg:#e8eddd;color-scheme:light}
.gs-play .gs-card{--gs-ink:#fff6e0;--gs-ink-soft:#d1dbc6;--gs-green:#c2dc9e;color:#fff6e0}.gs-play .gs-card-grade{color:#edbd61}
html[data-gs-view="home"] .gs-header .gs-mainnav a.gs-nav-user{color:#d6dda6}
html[data-gs-view="home"] .gs-header .gs-wordmark b{color:#edbd61}

.gs-trainer-save{padding:12px;border:1px solid #8c9c70;border-radius:6px;margin:10px 0;color:var(--gs-ink);font:400 .78rem/1.6 var(--gs-font-body)}.gs-trainer-save p{margin:0 0 8px}.gs-trainer-save button{background:#edbd61;color:#1e3022;border:0;padding:10px 15px;border-radius:4px;cursor:pointer;font:600 .8rem var(--gs-font-body)}

.gs-pay--square{background:#edbd61;color:#1b2c20}.gs-pay--square .gs-pay-icon{background:#1b2c20;color:#edbd61}