#practiceFaq:where(:not(#stemRoom,#stemRoom *)){scroll-margin-top:85px}

/* The approved page shell is present before a song is loaded, too. */
body.practice-shell .app:where(:not(#stemRoom,#stemRoom *)){max-width:1240px;padding:0 32px 36px;text-align:left}
.practice-shell .header:where(:not(#stemRoom,#stemRoom *)){display:none}.practice-shell h1:where(:not(#stemRoom,#stemRoom *)){font:700 36px/1.2 'Montserrat',sans-serif;color:#fff;margin:18px 0 12px;letter-spacing:-.03em}.practice-shell .signin-prompt:where(:not(#stemRoom,#stemRoom *)){max-width:640px;margin:20px auto}.practice-shell .seo-content:where(:not(#stemRoom,#stemRoom *)){display:none}.practice-shell section[hidden]:where(:not(#stemRoom,#stemRoom *)){display:none!important}.practice-shell :focus-visible:where(:not(#stemRoom,#stemRoom *)){outline:2px solid #2dd4bf;outline-offset:3px}
@media(max-width:760px){body.practice-shell .app:where(:not(#stemRoom,#stemRoom *)){padding:0 16px 28px}.practice-shell h1:where(:not(#stemRoom,#stemRoom *)){font-size:28px}}

/* Authentication is an interruption the user can dismiss, not a page section. */
.shell-auth-dialog:where(:not(#stemRoom,#stemRoom *)){position:fixed;inset:0;width:min(440px,calc(100vw - 32px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;margin:auto;padding:0;border:1px solid #3c4943;border-radius:16px;background:#141917;color:#f0f4f1;box-shadow:0 24px 90px #0009}
.shell-auth-dialog:where(:not(#stemRoom,#stemRoom *))::backdrop{background:#050907b8;backdrop-filter:blur(5px)}
.shell-auth-close:where(:not(#stemRoom,#stemRoom *)){position:absolute;right:10px;top:10px;width:44px;height:44px;border:0;border-radius:8px;background:transparent;color:#bbc9c1;font:28px 'Archivo',sans-serif;cursor:pointer;z-index:1}.shell-auth-close:hover:where(:not(#stemRoom,#stemRoom *)){background:#ffffff0c;color:#fff}
.practice-shell .shell-auth-dialog .signin-prompt:where(:not(#stemRoom,#stemRoom *)){margin:0;max-width:none}
.shell-auth-dialog .signin-card:where(:not(#stemRoom,#stemRoom *)){margin:0;padding:36px 30px 28px;background:transparent;border:0;border-radius:0;text-align:left;box-shadow:none}
.shell-auth-dialog .signin-logo:where(:not(#stemRoom,#stemRoom *)){margin:0 0 18px;text-align:left}.shell-auth-dialog .signin-logo svg:where(:not(#stemRoom,#stemRoom *)){width:30px;height:30px}
.shell-auth-dialog .signin-title:where(:not(#stemRoom,#stemRoom *)){font:600 23px/1.3 'Montserrat',sans-serif;margin:0 20px 10px 0;letter-spacing:-.025em;color:#fff}
.shell-auth-dialog .signin-subtitle:where(:not(#stemRoom,#stemRoom *)){font:14px/1.6 'Archivo',sans-serif;margin:0 0 24px;color:#b7c5bd}
.shell-auth-dialog .signin-form-inner:where(:not(#stemRoom,#stemRoom *)){max-width:none;margin:0;width:100%}.shell-auth-dialog .google-signin-btn:where(:not(#stemRoom,#stemRoom *)){width:100%;min-height:48px;border-radius:8px}
.shell-auth-dialog .signin-divider:where(:not(#stemRoom,#stemRoom *)){margin:18px 0;color:#95a69c}.shell-auth-dialog .shell-auth-label:where(:not(#stemRoom,#stemRoom *)){display:block;font:500 12px 'Archivo',sans-serif;color:#c8d6ce;margin-bottom:8px}
.shell-auth-dialog .magic-link-input:where(:not(#stemRoom,#stemRoom *)){background:#0d120f;border:1px solid #52665b;border-radius:8px;color:#fff;min-height:48px;font-size:16px;width:100%}.shell-auth-dialog .magic-link-input:where(:not(#stemRoom,#stemRoom *))::placeholder{color:#8faaa0}
.shell-auth-dialog .magic-link-btn:where(:not(#stemRoom,#stemRoom *)){min-height:48px;border-radius:8px;margin-top:10px}.shell-auth-dialog .signin-footer:where(:not(#stemRoom,#stemRoom *)){font:12px/1.6 'Archivo',sans-serif;color:#a7b9ae;text-align:center;margin:18px 0 0}.shell-auth-dialog .magic-link-status:where(:not(#stemRoom,#stemRoom *)){margin-top:10px;font-size:13px;line-height:1.6}

@media(max-width:480px){.shell-auth-dialog .signin-card:where(:not(#stemRoom,#stemRoom *)){padding:30px 22px 24px}.shell-auth-dialog .signin-title:where(:not(#stemRoom,#stemRoom *)){font-size:21px}}

/* The practice room is part of this page: #stemRoom holds its markup, and scripts/scope_room_css.cjs keeps its styles
   and this page's apart. What stays hidden under the room, and the room's stacking layer, are in index.html's head, so
   they hold even if this stylesheet does not load. */

/* LOCKED: everything except the landing screen (room-host.js). Its layout is in index.html's head, after this
   stylesheet, so an open song keeps it even if this file does not load. */
/* The page's H1 lives in the old page's header, which stays rendered behind the room while locked (index.html): only its H1,
   never its badge, logo row or tagline. Not printed. */
.gold-room-visible>.app>.header>*:not(h1):where(:not(#stemRoom,#stemRoom *)){display:none!important}
@media print{.gold-room-visible>.app>.header:where(:not(#stemRoom,#stemRoom *)){display:none!important}}

/* LANDING: the room shows its upload screen with nothing open, loading or running (room-host.js sets
   html.room-landing). The page scrolls past the room to the H1, the copy, the FAQ and the footer. The copy is
   restyled in the room's own language: Montserrat headings, Space Mono labels, #111 panels on #0a0a0a, teal links,
   one 1176px column that lines up with the room's. */
html.room-landing #stemRoom{z-index:1}
html.room-landing .gold-room-visible>.app:where(:not(#stemRoom,#stemRoom *)){max-width:1240px;margin:0 auto;padding:0 32px 8px;box-sizing:border-box;text-align:left;color:#fff;font-family:'Archivo',-apple-system,BlinkMacSystemFont,sans-serif}
html.room-landing .gold-room-visible>.app>.header:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .seo-content:where(:not(#stemRoom,#stemRoom *)){display:block!important;position:static;width:auto;max-width:none;height:auto;overflow:visible;pointer-events:auto;box-sizing:border-box}
html.room-landing .gold-room-visible>.app>.header:where(:not(#stemRoom,#stemRoom *)){margin:8px 0 0;padding:44px 0 0;border-top:1px solid #292929;text-align:left}
html.room-landing .gold-room-visible>.app>.header>h1:where(:not(#stemRoom,#stemRoom *)){font:600 30px/1.25 'Montserrat',sans-serif!important;color:#fff;letter-spacing:-.5px;max-width:860px;margin:0;text-align:left}
html.room-landing .gold-room-visible>.app>.header>.subtitle-small:where(:not(#stemRoom,#stemRoom *)){display:block!important;margin:14px 0 0;font:11px/1.6 'Space Mono',monospace;letter-spacing:.02em;color:#8f9995}
html.room-landing .gold-room-visible>.app>.header .byline-link:where(:not(#stemRoom,#stemRoom *)){color:#cfd8d8;border-bottom-color:#2dd4bf73}
html.room-landing .gold-room-visible .seo-content:where(:not(#stemRoom,#stemRoom *)){margin:0;padding:0;border:0}
html.room-landing .gold-room-visible .seo-section:where(:not(#stemRoom,#stemRoom *)){margin:40px 0 0;padding:32px 0 0;border-top:1px solid #292929}
html.room-landing .gold-room-visible .seo-section:first-child:where(:not(#stemRoom,#stemRoom *)){border-top:0;padding-top:0}
html.room-landing .gold-room-visible .seo-section h2:where(:not(#stemRoom,#stemRoom *)){font:600 22px/1.3 'Montserrat',sans-serif;color:#fff;letter-spacing:-.4px;margin:0 0 16px;max-width:860px}
html.room-landing .gold-room-visible .seo-section h3:where(:not(#stemRoom,#stemRoom *)){font:600 15px/1.4 'Montserrat',sans-serif;color:#fff;margin:24px 0 8px}
html.room-landing .gold-room-visible .seo-section p:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .seo-section li:where(:not(#stemRoom,#stemRoom *)){font:14px/1.75 'Archivo',sans-serif;color:#b2bcb8;margin:0 0 12px}
html.room-landing .gold-room-visible .seo-section>p:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .seo-section>ul:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .seo-section>h3:where(:not(#stemRoom,#stemRoom *)){max-width:780px}
html.room-landing .gold-room-visible .seo-section strong:where(:not(#stemRoom,#stemRoom *)){color:#fff;font-weight:600}
html.room-landing .gold-room-visible .seo-section a:where(:not(#stemRoom,#stemRoom *)){color:#5eead4;text-decoration:none;border-bottom:1px solid #2dd4bf59}
html.room-landing .gold-room-visible .seo-section a:hover:where(:not(#stemRoom,#stemRoom *)){color:#8cf0df;border-bottom-color:#2dd4bf}
html.room-landing .gold-room-visible .seo-section a:focus-visible:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible>footer a:focus-visible:where(:not(#stemRoom,#stemRoom *)){outline:2px solid #2dd4bf;outline-offset:2px;border-radius:2px}
html.room-landing .gold-room-visible .seo-section ul li:where(:not(#stemRoom,#stemRoom *))::before{content:'·';color:#2dd4bf;font-weight:600}
html.room-landing .gold-room-visible .seo-section table:where(:not(#stemRoom,#stemRoom *)){width:100%;min-width:640px;border-collapse:collapse;margin:14px 0 8px;font:12.5px/1.45 'Archivo',sans-serif}
html.room-landing .gold-room-visible .seo-section th:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .seo-section td:where(:not(#stemRoom,#stemRoom *)){text-align:left;vertical-align:top;padding:9px 10px;border-bottom:1px solid #292929;color:#c9cfcc}
html.room-landing .gold-room-visible .seo-section th:where(:not(#stemRoom,#stemRoom *)){font:10px 'Space Mono',monospace;letter-spacing:1px;text-transform:uppercase;color:#8f9995;font-weight:400}
html.room-landing .gold-room-visible .seo-section th:nth-child(2):where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .seo-section td:nth-child(2):where(:not(#stemRoom,#stemRoom *)){color:#52d7c6}
html.room-landing .gold-room-visible .seo-section .seo-updated:where(:not(#stemRoom,#stemRoom *)){font-size:12px;color:#8f9995}
html.room-landing .gold-room-visible .steps:where(:not(#stemRoom,#stemRoom *)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}
html.room-landing .gold-room-visible .use-case-grid:where(:not(#stemRoom,#stemRoom *)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}
html.room-landing .gold-room-visible .step:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .use-case-card:where(:not(#stemRoom,#stemRoom *)){min-width:0;margin:0;padding:18px;text-align:left;background:#111;border:1px solid #292929;border-radius:13px}
html.room-landing .gold-room-visible .step-number:where(:not(#stemRoom,#stemRoom *)){display:block;width:auto;height:auto;margin:0 0 10px;background:none;border-radius:0;font:10px 'Space Mono',monospace;letter-spacing:1px;color:#2dd4bf}
html.room-landing .gold-room-visible .step-number:where(:not(#stemRoom,#stemRoom *))::before{content:'0'}
html.room-landing .gold-room-visible .step h3:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .use-case-card h3:where(:not(#stemRoom,#stemRoom *)){font:600 15px/1.35 'Montserrat',sans-serif;color:#fff;margin:0 0 6px}
html.room-landing .gold-room-visible .step p:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .use-case-card p:where(:not(#stemRoom,#stemRoom *)){font-size:12.5px;line-height:1.55;color:#aaa;margin:0}
html.room-landing .gold-room-visible .use-case-icon:where(:not(#stemRoom,#stemRoom *)){display:none}
html.room-landing .gold-room-visible .trust-bar:where(:not(#stemRoom,#stemRoom *)){display:flex;flex-wrap:wrap;justify-content:flex-start;gap:10px 28px;margin:0;padding:18px 20px;background:#111;border:1px solid #292929;border-radius:13px}
html.room-landing .gold-room-visible .trust-item:where(:not(#stemRoom,#stemRoom *)){display:flex;align-items:center;gap:10px;font:13px/1.5 'Archivo',sans-serif;color:#c9cfcc;text-transform:none;letter-spacing:0}
html.room-landing .gold-room-visible .trust-item svg:where(:not(#stemRoom,#stemRoom *)){width:18px;height:18px;flex:none;color:#2dd4bf}
html.room-landing .gold-room-visible .faq-item:where(:not(#stemRoom,#stemRoom *)){margin:0;border:0;border-top:1px solid #2b302c;border-radius:0;background:none;overflow:visible}
html.room-landing .gold-room-visible .faq-item:last-child:where(:not(#stemRoom,#stemRoom *)){border-bottom:1px solid #2b302c}
html.room-landing .gold-room-visible .faq-question:where(:not(#stemRoom,#stemRoom *)){display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;min-height:52px;margin:0;padding:15px 0;background:none;border:0;text-align:left;font:500 15px/1.5 'Archivo',sans-serif;color:#e2e9e4;cursor:pointer}
html.room-landing .gold-room-visible .faq-question:hover:where(:not(#stemRoom,#stemRoom *)){background:none;color:#fff}
html.room-landing .gold-room-visible .faq-question:focus-visible:where(:not(#stemRoom,#stemRoom *)){outline:2px solid #2dd4bf;outline-offset:2px;border-radius:4px}
html.room-landing .gold-room-visible .faq-question:where(:not(#stemRoom,#stemRoom *))::after{color:#2dd4bf;font:400 18px 'Space Mono',monospace;margin:0}
html.room-landing .gold-room-visible .faq-item.open .faq-question:where(:not(#stemRoom,#stemRoom *)){color:#5eead4}
html.room-landing .gold-room-visible .faq-answer:where(:not(#stemRoom,#stemRoom *)){padding:0;transition:none}
html.room-landing .gold-room-visible .faq-item.open .faq-answer:where(:not(#stemRoom,#stemRoom *)){max-height:none;padding:0 0 18px}
html.room-landing .gold-room-visible .faq-answer p:where(:not(#stemRoom,#stemRoom *)){max-width:780px;font:14px/1.8 'Archivo',sans-serif;color:#afbdb5;margin:0}
html.room-landing>body.gold-room-visible>footer:where(:not(#stemRoom,#stemRoom *)){display:block!important;margin-top:56px!important;border-top-color:#292929!important}
html.room-landing>body.gold-room-visible>footer a[href^="/"]:where(:not(#stemRoom,#stemRoom *)){font-family:'Space Mono',monospace!important;font-size:11px!important;letter-spacing:.02em;color:#aaa!important;min-height:36px;display:inline-flex;align-items:center}
html.room-landing>body.gold-room-visible>footer a[href^="/"]:hover:where(:not(#stemRoom,#stemRoom *)){color:#5eead4!important}
@media(max-width:900px){html.room-landing .gold-room-visible .use-case-grid:where(:not(#stemRoom,#stemRoom *)){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){html.room-landing .gold-room-visible>.app:where(:not(#stemRoom,#stemRoom *)){padding:0 16px 8px}html.room-landing .gold-room-visible>.app>.header:where(:not(#stemRoom,#stemRoom *)){padding-top:32px}html.room-landing .gold-room-visible>.app>.header>h1:where(:not(#stemRoom,#stemRoom *)){font-size:24px!important;letter-spacing:-.3px}html.room-landing .gold-room-visible .seo-section:where(:not(#stemRoom,#stemRoom *)){margin-top:32px;padding-top:26px}html.room-landing .gold-room-visible .seo-section h2:where(:not(#stemRoom,#stemRoom *)){font-size:19px}html.room-landing .gold-room-visible .steps:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .use-case-grid:where(:not(#stemRoom,#stemRoom *)){grid-template-columns:1fr}html.room-landing .gold-room-visible .step:where(:not(#stemRoom,#stemRoom *)),html.room-landing .gold-room-visible .use-case-card:where(:not(#stemRoom,#stemRoom *)){padding:16px}html.room-landing>body.gold-room-visible>footer:where(:not(#stemRoom,#stemRoom *)){margin-top:40px!important}}
@media print{html.room-landing #stemRoom{display:none}}


/* Shared verification widget for account, checkout and guest-save email forms. */
.email-signin-verification:where(:not(#stemRoom,#stemRoom *)){display:flex;justify-content:center;width:100%;margin:8px 0}