:root{--ink-0:#06050e;--ink-1:#0b0916;--ink-2:#14111f;--ink-3:#1c1830;--rose:#ff7482;--rose-hi:#ffb6c1;--rose-deep:#d24a63;--violet:#9d5cff;--gold:#e3c17e;--gold-hi:#f7e2b6;--paper:#fffdf6;--paper-edge:#e3c17e8c;--paper-ink:#8d8161;--text:#cdc7e6;--text-h:#f7f3ff;--text-mid:#a9a2c8;--text-low:#8e88ad;--accent:var(--rose);--accent-2:var(--rose-hi);--accent-bg:#ff748221;--accent-border:#ff96a561;--danger:#ff9dc2;--danger-bg:#ff8cb81f;--ok:#7fe3b0;--panel-bg:#ffffff09;--panel-border:#b996ff29;--e1:0 1px 2px #04020c80, 0 8px 24px -12px #0a041eb3;--e2:0 1px 2px #04020c8c, 0 20px 50px -22px #0c0428d9;--e3:0 2px 4px #04020c99, 0 40px 90px -30px #0e042ee6;--glow:0 0 40px -8px #ff748273;--r-sm:10px;--r-md:14px;--r-lg:20px;--r-xl:26px;--r-pill:999px;--ease:cubic-bezier(.2, .7, .3, 1);--ease-out:cubic-bezier(.16, 1, .3, 1);--shell:1080px;font-feature-settings:"cv05" 1, "ss01" 1;color:var(--text);background:var(--ink-1);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-family:Inter,system-ui,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.55}*,:before,:after{box-sizing:border-box}::selection{color:#fff;background:#ff748252}body{min-height:100svh;color:var(--text);background:0 0;margin:0;overflow-x:hidden}body:before{content:"";z-index:0;pointer-events:none;animation:sky-drift 44s var(--ease) infinite alternate;background:radial-gradient(58% 46% at 12% 102%,#ff748266,#0000 66%),radial-gradient(44% 36% at 94% -4%,#ffb6c138,#0000 64%),radial-gradient(72% 50% at 50% -14%,#9d5cff47,#0000 68%),radial-gradient(48% 40% at 86% 58%,#9d5cff29,#0000 66%),radial-gradient(60% 45% at 6% 44%,#d24a6324,#0000 68%);position:fixed;inset:0}body:after{content:"";z-index:0;pointer-events:none;-webkit-mask-composite:source-in;background-image:repeating-linear-gradient(#d6d0f00d 0 1px,#0000 1px 11px,#d6d0f00d 11px 12px,#0000 12px 22px,#d6d0f00d 22px 23px,#0000 23px 33px,#d6d0f00d 33px 34px,#0000 34px 44px,#d6d0f00d 44px 45px,#0000 45px 116px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.12'/%3E%3C/svg%3E");position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000 0 12vh,#0000 46vh),linear-gradient(90deg,#0000,#000 18% 82%,#0000);mask-image:linear-gradient(#000 0 12vh,#0000 46vh),linear-gradient(90deg,#0000,#000 18% 82%,#0000);-webkit-mask-composite:source-in;mask-composite:intersect}@keyframes sky-drift{0%{transform:scale(1)translate(0,0)}to{transform:scale(1.12)translate(1.5%,-1.5%)}}#app{z-index:1;max-width:var(--shell);margin:0 auto;padding:clamp(36px,7vw,72px) clamp(16px,4vw,28px) 96px;position:relative}h1,h2,h3,h4{color:var(--text-h);text-wrap:balance;font-family:Playfair Display,Georgia,serif}p{text-wrap:pretty}a{color:var(--accent-2)}:where(a,button,input,select,textarea,label.dropzone,[tabindex]):focus-visible{outline:2px solid var(--rose-hi);outline-offset:3px;border-radius:var(--r-sm)}header{text-align:center;margin-bottom:clamp(32px,4.5vw,52px);position:relative}.eyebrow{border-radius:var(--r-pill);letter-spacing:.16em;text-transform:uppercase;width:fit-content;color:var(--rose-hi);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ff748214;border:1px solid #ff96a547;align-items:center;gap:8px;margin:0 auto 18px;padding:6px 16px 6px 13px;font-size:11.5px;font-weight:600;display:flex;box-shadow:inset 0 1px #ffffff0f}.brand-mark{place-items:center;width:fit-content;margin:0 auto;display:grid;position:relative}.brand-mark:before{content:"";aspect-ratio:1;filter:blur(22px);background:radial-gradient(circle,#ff74824d,#9d5cff29 42%,#0000 68%);border-radius:50%;width:150%;animation:7s ease-in-out infinite halo-breathe;position:absolute}@keyframes halo-breathe{0%,to{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}.brand-logo{aspect-ratio:1;filter:drop-shadow(0 0 26px #ff748280)drop-shadow(0 0 70px #9d5cff47);width:clamp(140px,16vw,186px);height:auto;margin:0;position:relative}.tagline{background:linear-gradient(100deg, var(--rose-hi) 8%, #fff 42%, var(--rose-hi) 78%);color:#0000;filter:drop-shadow(0 0 22px #ffb6c157);-webkit-background-clip:text;background-clip:text;margin:6px 0 14px;font-family:Playfair Display,Georgia,serif;font-size:clamp(23px,3.6vw,33px);font-style:italic;font-weight:500;line-height:1.15}.subtitle{max-width:54ch;color:var(--text-mid);margin:0 auto;font-size:16.5px;line-height:1.65}.game-link{border-radius:var(--r-pill);color:var(--text-h);box-shadow:var(--e2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .25s var(--ease-out), box-shadow .25s var(--ease-out);background:linear-gradient(#261a3ee6,#140e24e6);align-items:center;gap:12px;margin-top:20px;padding:12px 22px 12px 13px;font-size:14.5px;font-weight:500;text-decoration:none;display:inline-flex;position:relative}.game-link:before{content:"";border-radius:inherit;background:linear-gradient(120deg, var(--rose), var(--violet) 52%, var(--gold));-webkit-mask-composite:xor;pointer-events:none;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.game-link b{color:#fff;font-weight:700}.game-link .game-badge{border-radius:var(--r-pill);background:linear-gradient(135deg, var(--rose), #ff9cab);color:#2a0e14;letter-spacing:.13em;text-transform:uppercase;flex:none;padding:4px 11px;font-size:10.5px;font-weight:800}.game-link .game-arrow{color:var(--rose-hi);transition:transform .25s var(--ease-out);display:inline-block}.game-link:hover{box-shadow:var(--e3), var(--glow);transform:translateY(-2px)}.game-link:hover .game-arrow{transform:translate(5px)}.panel{border-radius:var(--r-xl);-webkit-backdrop-filter:blur(26px)saturate(1.45);backdrop-filter:blur(26px)saturate(1.45);box-shadow:var(--e2);opacity:0;animation:panel-rise .75s var(--ease-out) both;background:linear-gradient(#ffffff12,#ffffff06),#130e246b;border:0;margin-bottom:20px;padding:clamp(22px,3.4vw,32px);position:relative}.panel:first-of-type{animation-delay:50ms}.panel:nth-of-type(2){animation-delay:.12s}.panel:nth-of-type(3){animation-delay:.19s}.panel:nth-of-type(4){animation-delay:.26s}.panel:nth-of-type(n+5){animation-delay:.32s}.panel:before{content:"";border-radius:inherit;-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(150deg,#ffb6c166,#9d5cff2e 34%,#b996ff12 62%,#ffffff08);padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.panel:after{content:"";border-radius:var(--r-xl) var(--r-xl) 0 0;pointer-events:none;background:linear-gradient(#ffffff0b,#0000);height:58%;position:absolute;inset:1px 1px auto}.panel>*{z-index:1;position:relative}@keyframes panel-rise{0%{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}.panel h2{color:var(--text-h);align-items:center;gap:13px;margin:0 0 20px;font-size:clamp(20px,2.4vw,23px);font-weight:600;line-height:1.25;display:flex}.ways{border-radius:calc(var(--r-xl) + 8px);animation:panel-rise .75s var(--ease-out) both;opacity:0;background:radial-gradient(80% 60% at 50% 0,#9d5cff24,#0000 72%),#ffffff06;border:1px solid #b996ff33;margin-bottom:20px;padding:26px clamp(14px,2vw,22px) 22px;animation-delay:.12s;position:relative;box-shadow:inset 0 1px #ffffff0d}.ways-head{text-align:center;margin-bottom:22px}.ways-head h2{color:var(--text-h);margin:0 0 6px;font-family:Playfair Display,Georgia,serif;font-size:clamp(21px,2.6vw,26px);font-weight:600}.ways-note{max-width:52ch;color:var(--text-low);margin:0 auto;font-size:14px}.ways .panel{opacity:1;margin-bottom:0;animation:none}.ways-pair{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start;gap:16px;margin-top:16px;display:grid}.ways-pair .panel{background:linear-gradient(#ffffff0d,#ffffff04),#130e2457}.way h2{align-items:center;gap:12px;margin-bottom:18px}.way-badge{width:34px;height:34px;color:var(--rose-hi);background:linear-gradient(160deg,#ff74823d,#9d5cff24);border:1px solid #ff96a557;border-radius:11px;flex:none;place-items:center;font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1;display:grid;box-shadow:inset 0 1px #ffffff29,0 6px 16px -8px #ff7482b3}.way-heading{flex-direction:column;gap:1px;min-width:0;display:flex}.way-kind{letter-spacing:.15em;text-transform:uppercase;color:var(--rose-hi);opacity:.9;font-family:Inter,system-ui,sans-serif;font-size:10.5px;font-weight:700}.panel>p,.panel-note{max-width:72ch;color:var(--text-mid);margin:0 0 18px;font-size:14.5px;line-height:1.65}.dropzone{border:1.5px dashed var(--accent-border);border-radius:var(--r-lg);text-align:center;cursor:pointer;transition:background .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease-out);background:radial-gradient(70% 100% at 50% 0,#ff748229,#0000 70%),#ff74820d;flex-direction:column;align-items:center;padding:clamp(30px,5vw,46px) 22px;display:flex;position:relative;overflow:hidden}.dropzone:hover,.dropzone.dragover{border-color:var(--rose-hi);box-shadow:inset 0 0 60px -20px #ff748299, var(--glow);background:radial-gradient(70% 100% at 50% 0,#ff748242,#0000 70%),#ff74821a}.dropzone.dragover{border-style:solid;transform:scale(1.012)}.dropzone input{display:none}.dropzone .hint{max-width:56ch;color:var(--text-mid);margin-top:16px;font-size:13.5px;line-height:1.6;display:block}.dropzone:before{content:"♫";color:var(--rose-hi);opacity:.55;text-shadow:0 0 24px #ff7482b3;transition:transform .35s var(--ease-out), opacity .25s var(--ease);margin-bottom:12px;font-size:30px;line-height:1;display:block}.dropzone:hover:before,.dropzone.dragover:before{opacity:1;transform:translateY(-3px)}.controls-row{flex-wrap:wrap;align-items:flex-end;gap:14px 18px;margin-top:20px;display:flex}.controls-row label{letter-spacing:.07em;text-transform:uppercase;color:var(--text-low);flex-direction:column;gap:6px;font-size:12px;font-weight:600;display:flex}.controls-row select,.controls-row input[type=number],.controls-row input[type=text],.level-picker select{border-radius:var(--r-pill);color:var(--text-h);transition:border-color .18s var(--ease), background .18s var(--ease), box-shadow .18s var(--ease);background:#ffffff0b;border:1px solid #b996ff38;padding:10px 15px;font-family:inherit;font-size:14px}.controls-row input::placeholder{color:var(--text-low);opacity:.75}.controls-row select:hover,.controls-row input[type=number]:hover,.controls-row input[type=text]:hover,.level-picker select:hover{background:#ffffff12;border-color:#ff96a566}.controls-row select:focus,.controls-row input:focus,.level-picker select:focus{border-color:var(--rose-hi);box-shadow:0 0 0 3px #ff748233}.controls-row select:focus:not(:focus-visible),.controls-row input:focus:not(:focus-visible),.level-picker select:focus:not(:focus-visible){outline:none}.controls-row input[type=text]{min-width:210px}select{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23ffb6c1' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 15px center;background-repeat:no-repeat;padding-right:38px!important}select option{color:#f4f1fb;background-color:#16121f}.controls-row select,.level-picker select{background-color:#191527}button{font-family:inherit}button.primary{border-radius:var(--r-pill);background:linear-gradient(135deg, #ff8a97, var(--rose) 45%, var(--rose-deep));color:#2a0e14;letter-spacing:.01em;cursor:pointer;transition:transform .18s var(--ease-out), box-shadow .18s var(--ease-out), filter .18s var(--ease);border:0;padding:12px 28px;font-size:14px;font-weight:700;position:relative;overflow:hidden;box-shadow:0 10px 26px -10px #ff7482e6,inset 0 1px #ffffff73}button.primary:after{content:"";transition:transform .55s var(--ease-out);background:linear-gradient(100deg,#0000 30%,#ffffff73 50%,#0000 70%);position:absolute;inset:0;transform:translate(-120%)}button.primary:hover:not(:disabled){filter:saturate(1.08);transform:translateY(-2px);box-shadow:0 16px 34px -10px #ff7482,inset 0 1px #ffffff80}button.primary:hover:not(:disabled):after{transform:translate(120%)}button.primary:active:not(:disabled){transform:translateY(0)}button.primary:disabled{color:var(--text-low);cursor:not-allowed;background:#ffffff0f;box-shadow:inset 0 0 0 1px #b996ff24}button.primary:disabled:after{display:none}button.secondary,.dropzone-cta{border-radius:var(--r-pill);color:var(--text-h);cursor:pointer;transition:background .18s var(--ease), border-color .18s var(--ease), transform .18s var(--ease-out);background:#ffffff0e;border:1px solid #b996ff38;padding:11px 24px;font-size:14px;font-weight:600;display:inline-block}button.secondary:hover,.dropzone:hover .dropzone-cta,.dropzone.dragover .dropzone-cta{background:#ffffff1f;border-color:#ff96a56b;transform:translateY(-1px)}button.secondary:active{transform:translateY(0)}button.secondary:disabled{opacity:.45;cursor:not-allowed;transform:none}.dropzone-cta{box-shadow:var(--e1)}.status{margin-top:16px;font-size:14px}.status:empty{margin-top:0}.status.error{color:var(--danger);background:var(--danger-bg);border:1px solid #ff8cb847;border-left:3px solid var(--danger);border-radius:var(--r-sm);align-items:baseline;gap:10px;padding:12px 18px;display:flex}.status.error:before{content:"⚠";flex:none;font-size:15px;line-height:1}.status.info{color:var(--text-mid)}.progress-bar{border-radius:var(--r-pill);background:#ffffff12;height:8px;margin-top:14px;overflow:hidden;box-shadow:inset 0 1px 2px #0006}.progress-bar>div{border-radius:var(--r-pill);background:linear-gradient(90deg, var(--rose-deep), var(--rose), var(--gold));height:100%;transition:width .3s var(--ease);position:relative;box-shadow:0 0 14px #ff7482bf}.progress-bar>div:after{content:"";background:linear-gradient(90deg,#0000,#fff6,#0000);animation:1.5s linear infinite progress-sheen;position:absolute;inset:0}@keyframes progress-sheen{0%{transform:translate(-100%)}to{transform:translate(100%)}}.score-header{border-bottom:1px solid #b996ff24;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:10px;margin-bottom:22px;padding-bottom:20px;display:flex}.score-header h2{margin:0 auto 0 0}.score-header button.secondary{padding:9px 17px;font-size:13px}.score-meta{grid-template-columns:repeat(auto-fit,minmax(122px,1fr));gap:10px;margin-bottom:20px;display:grid}.score-meta>div{border-radius:var(--r-md);color:var(--text-h);font-variant-numeric:tabular-nums;background:#ffffff08;border:1px solid #b996ff26;padding:12px 16px;font-size:15px}.score-meta b{color:var(--gold);letter-spacing:.13em;text-transform:uppercase;opacity:.9;margin-bottom:3px;font-family:Inter,system-ui,sans-serif;font-size:10.5px;font-weight:700;display:block}.score-heading{color:var(--text-h);grid-column:1/-1;font-family:Playfair Display,Georgia,serif;font-size:clamp(19px,2.6vw,24px);font-style:italic;background:0 0!important;border:0!important;padding:0 0 4px!important}.scroll-hint{color:var(--text-low);margin:0 0 12px;font-size:13px;display:none}@media (width<=960px){.scroll-hint{display:block}}#scoreContainer{scrollbar-color:#ff96a566 transparent;padding:4px 0 28px;overflow-x:auto}#scoreContainer svg{display:block}#scoreInner{counter-reset:sheet-page;min-width:900px;position:relative}#scoreInner div[id^=osmdCanvasPage]{counter-increment:sheet-page;border-radius:var(--r-md);border:1px solid var(--paper-edge);background:radial-gradient(120% 80% at 50% 0,#fffefa,#0000 70%),linear-gradient(178deg,#fffdf7,#fbf6e9);margin-bottom:34px;padding:22px 22px 30px;position:relative;box-shadow:inset 0 1px #ffffffe6,0 0 0 1px #00000008,0 30px 70px -28px #0c0428f2}#scoreInner div[id^=osmdCanvasPage]:before{content:"";border-radius:var(--r-md) 0 0 var(--r-md);background:linear-gradient(180deg, var(--gold), #e3c17e40);opacity:.7;width:3px;position:absolute;inset:0 auto 0 0}#scoreInner div[id^=osmdCanvasPage]:after{content:"Page " counter(sheet-page);letter-spacing:.04em;color:var(--paper-ink);font-family:Playfair Display,Georgia,serif;font-size:12.5px;font-style:italic;position:absolute;bottom:9px;right:22px}.chord-box{cursor:pointer;transition:background .15s var(--ease), border-color .15s var(--ease), box-shadow .15s var(--ease);background:0 0;border:1px dashed #ff748280;border-radius:6px;padding:0;position:absolute}.chord-box:hover{background:#ff748229;border-style:solid;box-shadow:0 0 0 3px #ff74821f}.chord-box.picked{border-style:solid;border-color:var(--accent);background:#fffdf8;box-shadow:0 2px 10px -3px #ff7482b3}.chord-box-label{color:var(--accent);justify-content:center;align-items:center;font-size:13px;font-style:italic;font-weight:700;display:flex;position:absolute;inset:0}.chord-popover{z-index:5;border-radius:var(--r-md);min-width:148px;box-shadow:var(--e3);animation:pop-in .16s var(--ease-out) both;background:linear-gradient(#241d3d,#17122a);border:1px solid #b996ff3d;flex-direction:column;gap:2px;padding:7px;display:flex;position:absolute}@keyframes pop-in{0%{opacity:0;transform:translateY(-5px)scale(.97)}}.chord-alt{color:var(--text-h);text-align:left;cursor:pointer;white-space:nowrap;transition:background .13s var(--ease);background:#ffffff0d;border:0;border-radius:8px;padding:8px 11px;font-size:13px;font-weight:500}.chord-alt:hover{background:#ff748247}.chord-alt-reset{color:var(--text-mid);border-top:1px solid #b996ff2e;margin-top:5px;padding-top:9px}.limitations{color:var(--text-low);border-top:1px solid #b996ff1f;max-width:88ch;margin-top:20px;padding-top:18px;font-size:13px;line-height:1.7}.midi-status{color:var(--text-mid);margin-top:12px;font-size:14px}.live-listen-display,.generated-chord-output,.song-section{border-radius:var(--r-lg);box-shadow:var(--e1);background:radial-gradient(90% 140% at 0 0,#ff74821f,#0000 60%),#ffffff07;border:1px solid #ff96a53d;margin-top:18px;padding:18px 20px}#liveListenDisplay{text-align:center;padding:26px 20px 22px}.live-chord{color:var(--rose-hi);letter-spacing:.02em;text-shadow:0 0 44px #ffb6c18c;font-family:ui-monospace,SF Mono,Monaco,Courier New,monospace;font-size:clamp(38px,7vw,58px);font-weight:700;line-height:1.05}.live-meta{font-variant-numeric:tabular-nums;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);opacity:.9;margin-top:10px;font-size:13px}.generated-structured-output{margin-top:18px;padding:0}#songSections{grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:12px;display:grid}.progression-line{color:var(--rose-hi);letter-spacing:.05em;text-shadow:0 0 24px #ffb6c152;margin-bottom:8px;font-family:ui-monospace,SF Mono,Monaco,Courier New,monospace;font-size:clamp(15px,2vw,18px);font-weight:600;line-height:1.7}.progression-meta{color:var(--gold);opacity:.85;margin-bottom:14px;font-size:13px}.song-section{margin-top:0;margin-bottom:0;padding:15px 17px}.song-section .progression-line{margin-bottom:0}.section-label{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:10px;font-size:11px;font-weight:700}.fallback-notes{padding:4px 2px}.fallback-warning{color:var(--rose-hi);background:var(--danger-bg);border-radius:var(--r-md);border:1px solid #ff8cb847;align-items:flex-start;gap:10px;margin-bottom:18px;padding:12px 16px;font-size:14px;display:flex}.fb-staff{margin-bottom:22px}.fb-staff h4{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0 0 10px;font-family:Inter,system-ui,sans-serif;font-size:11px;font-weight:700}.fb-measure{border-bottom:1px solid #ffffff0f;align-items:baseline;gap:12px;padding:5px 0;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:13px;display:flex}.fb-measure-num{color:var(--text-low);text-align:right;font-variant-numeric:tabular-nums;flex:0 0 2.5em}.fb-diag{border-radius:var(--r-lg);background:#00000040;border:1px solid #b996ff2e;margin:18px 0 24px;padding:16px 18px}.fb-diag-label{color:var(--text-mid);margin:0 0 12px;font-size:13px}.fb-diag-actions{flex-wrap:wrap;gap:10px;margin-bottom:14px;display:flex}.fb-diag-actions button{padding:8px 16px;font-size:13px}.fb-diag-pre{border-radius:var(--r-sm);max-height:260px;color:var(--text-mid);white-space:pre-wrap;word-break:break-word;background:#00000073;border:1px solid #ffffff12;margin:0;padding:14px 16px;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:12px;line-height:1.6;overflow:auto}.capture-list{scrollbar-width:thin;scrollbar-color:#ff96a559 transparent;flex-direction:column;gap:9px;max-height:340px;margin-top:18px;display:flex;overflow-y:auto}.capture-list:empty{display:none}.capture-idea{border-radius:var(--r-md);transition:background .16s var(--ease), border-color .16s var(--ease);background:#ffffff08;border:1px solid #b996ff26;grid-template-columns:1fr auto auto;align-items:center;gap:14px;padding:12px 16px;display:grid}.capture-idea:hover{background:#ffffff0f;border-color:#ff96a552}.capture-idea-label{color:var(--text-h);font-size:14px}.capture-idea-meta{color:var(--text-low);font-variant-numeric:tabular-nums;font-size:13px}.capture-idea button{padding:7px 16px;font-size:13px}.level-picker{letter-spacing:.09em;text-transform:uppercase;color:var(--text-low);align-items:center;gap:9px;font-size:11px;font-weight:600;display:flex}.level-picker select{text-transform:none;letter-spacing:0;padding:8px 14px;font-size:13px}.immersive-status{color:var(--text-mid);margin-top:12px;font-size:14px}.immersive-status.error{color:var(--danger)}.immersive-download{color:var(--accent-2);border-bottom:1px solid var(--accent-border);padding-bottom:1px;text-decoration:none}.immersive-download:hover{border-bottom-color:var(--accent-2)}.topbar{z-index:30;justify-content:flex-end;margin-bottom:.75rem;display:flex;position:relative}.account-menu{position:relative}.account-trigger{border-radius:var(--r-pill);color:var(--text-mid);cursor:pointer;max-width:min(18rem,60vw);transition:background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease);background:#ffffff0d;border:1px solid #b996ff33;align-items:center;gap:.55rem;padding:6px 14px 6px 6px;font-family:inherit;font-size:13px;font-weight:600;display:flex}.account-trigger:hover,.account-trigger[aria-expanded=true]{color:var(--text-h);background:#ffffff1a;border-color:#ff96a566}.account-avatar{background:linear-gradient(135deg, var(--rose-hi), var(--rose-deep));color:#2a0e14;border-radius:50%;flex:none;place-items:center;width:26px;height:26px;font-size:12px;font-weight:700;line-height:1;display:grid}.account-menu[data-state=out] .account-avatar{color:var(--text-low);background:#ffffff14;font-size:13px}.account-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.account-caret{opacity:.6;width:7px;height:7px;transition:transform .2s var(--ease-out);border-bottom:1.5px solid;border-right:1.5px solid;flex:none;transform:rotate(45deg)translate(-2px,-2px)}.account-trigger[aria-expanded=true] .account-caret{transform:rotate(-135deg)translate(-3px,-3px)}.account-dropdown{-webkit-backdrop-filter:blur(26px)saturate(1.45);backdrop-filter:blur(26px)saturate(1.45);width:min(23rem,100vw - 2rem);box-shadow:var(--e2);animation:account-drop .16s var(--ease-out) both;background:linear-gradient(#ffffff0f,#ffffff05),#100c1ef0;border:1px solid #b996ff2e;border-radius:18px;flex-direction:column;gap:.85rem;padding:1.1rem 1.2rem;display:flex;position:absolute;top:calc(100% + .5rem);right:0}.account-dropdown[hidden]{display:none}@keyframes account-drop{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.account-dropdown{animation:none}}.account-who{color:var(--text-mid);font-size:.9rem;line-height:1.45}.account-who b{color:var(--text-h);text-overflow:ellipsis;display:block;overflow:hidden}.account-actions{flex-direction:column;gap:.5rem;display:flex}.account-actions button.secondary,.account-actions button.upgrade{text-align:center;width:100%;padding:9px 18px;font-size:13px}.account-email,.account-code{width:100%;min-width:0}button.upgrade{border-radius:var(--r-pill);background:linear-gradient(135deg, var(--gold-hi), var(--gold));color:#2c2210;cursor:pointer;transition:transform .18s var(--ease-out), box-shadow .18s var(--ease-out), filter .18s var(--ease);border:1px solid #e3c17e80;padding:9px 18px;font-size:13px;font-weight:700;box-shadow:0 8px 20px -10px #e3c17ed9,inset 0 1px #ffffff80}button.upgrade:hover:not(:disabled){filter:saturate(1.06)brightness(1.03);transform:translateY(-1px);box-shadow:0 12px 26px -10px #e3c17e,inset 0 1px #ffffff8c}button.upgrade:active:not(:disabled){transform:translateY(0)}button.upgrade:disabled{opacity:.45;cursor:not-allowed;transform:none}button.secondary.google-signin{border-color:#b996ff52}.library-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.6rem;display:flex}.library-head h2{margin:0}.library-count{color:var(--text-low);font-variant-numeric:tabular-nums;font-size:.86rem}.library-status{color:var(--gold);flex-wrap:wrap;align-items:center;gap:.6rem;margin-top:.65rem;font-size:.88rem;display:flex}.library-status.error{color:var(--danger)}.library-list{gap:.5rem;margin:.9rem 0 0;padding:0;list-style:none;display:grid}.library-empty{color:var(--text-low);font-size:.9rem}.library-item{transition:border-color .18s var(--ease), background .18s var(--ease);background:#ffffff09;border:1px solid #b996ff29;border-radius:14px;grid-template-columns:1fr auto;grid-template-areas:"name actions""meta actions";align-items:center;gap:.15rem .9rem;padding:.7rem .9rem;display:grid}.library-item:hover{background:#ffffff0f;border-color:#ff96a557}.library-name{color:var(--text-h);grid-area:name;font-size:.95rem;font-weight:600}.library-meta{color:var(--text-low);grid-area:meta;font-size:.8rem}.library-actions{grid-area:actions;gap:.4rem;display:flex}.library-actions button.secondary{padding:7px 14px;font-size:12px}.library-delete[data-armed="1"]{color:#ffb4b4;border-color:#ff78788c}.save-gate{background:#ffffff08;border:1px solid #b996ff33;border-radius:16px;margin-top:.9rem;padding:.9rem 1rem}.save-gate-q{color:var(--text-h);margin:0 0 .6rem;font-size:.92rem;font-weight:600}.save-gate-choices{gap:.35rem;display:grid}.save-gate-choices label{color:var(--text-mid);cursor:pointer;align-items:flex-start;gap:.5rem;font-size:.88rem;display:flex}.save-gate-choices input{accent-color:var(--rose);margin-top:.2rem}.save-gate-actions{flex-wrap:wrap;gap:.5rem;margin-top:.9rem;display:flex}.save-gate-actions button.primary{padding:10px 22px;font-size:13px}.save-gate-actions button.secondary{padding:9px 18px;font-size:13px}button.upgrade.wall-upgrade{padding:7px 16px;font-size:12px}.account-billing{color:var(--text-low);margin-top:.3rem;font-size:.84rem;display:block}.account-status{color:var(--text-mid);margin-top:.65rem;font-size:.88rem}.account-status.error{color:var(--danger)}.account-status.info{color:var(--gold)}.terms-panel{padding-top:clamp(20px,3vw,28px)}.terms-gate{border:1px solid var(--accent-border);border-radius:var(--r-lg);background:radial-gradient(80% 120% at 0 0,#ff748221,#0000 62%),#ffffff06;padding:1.15rem 1.25rem}.terms-gate h3{color:var(--text-h);margin:0 0 .55rem;font-size:1.06rem}.terms-gate p,.terms-gate li{max-width:74ch;color:var(--text-mid);font-size:.9rem;line-height:1.6}.terms-gate ul{margin:.7rem 0;padding-left:1.15rem}.terms-gate li{margin-bottom:.4rem}.terms-gate li::marker{color:var(--accent)}.terms-gate li b{color:var(--text-h)}.terms-tick{border-radius:var(--r-md);max-width:74ch;color:var(--text);cursor:pointer;transition:background .16s var(--ease);background:#ffffff0a;align-items:flex-start;gap:.65rem;margin:1rem 0;padding:.7rem .85rem;font-size:.9rem;display:flex}.terms-tick:hover{background:#ffffff12}.terms-tick input{width:1.1rem;height:1.1rem;accent-color:var(--accent);flex:none;margin-top:.2rem}.account-code{font-variant-numeric:tabular-nums;letter-spacing:.18em;text-align:center;width:9.5rem}.practice-cta{color:var(--text-h);box-shadow:0 0 22px -8px #ff7482bf;border-color:var(--accent-border)!important;background:var(--accent-bg)!important}.practice-cta:hover{border-color:var(--rose-hi)!important;background:#ff748242!important}.practice-overlay{z-index:50;animation:fade-in .28s var(--ease-out) both;background:#05030f;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}}.practice-overlay[hidden]{display:none}.practice-overlay canvas{width:100%;height:100%;display:block}body.practising{overflow:hidden}.practice-bar{background:linear-gradient(#05030fe0,#05030f00);align-items:center;gap:10px;padding:14px 18px;display:flex;position:absolute;top:0;left:0;right:0}.practice-title{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--text-h);text-shadow:0 1px 12px #000c;flex:1;font-size:15px;font-weight:600;overflow:hidden}.practice-button{border-radius:var(--r-pill);color:var(--text-h);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .15s var(--ease), border-color .15s var(--ease);background:#0c081ab3;border:1px solid #ffffff29;padding:8px 17px;font-family:inherit;font-size:13px;font-weight:600}.practice-button:hover{background:#22163ce6;border-color:#ff96a573}.practice-settings{border-radius:var(--r-lg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);width:258px;max-height:calc(100% - 90px);box-shadow:var(--e3);scrollbar-width:thin;scrollbar-color:#ff96a559 transparent;animation:pop-in .2s var(--ease-out) both;background:#0a0716e0;border:1px solid #ffffff21;padding:18px 20px 20px;position:absolute;top:62px;right:18px;overflow-y:auto}.practice-settings[hidden]{display:none}.practice-settings h3{letter-spacing:.16em;text-transform:uppercase;color:var(--text-low);margin:0 0 14px;font-family:Inter,system-ui,sans-serif;font-size:11px;font-weight:700}.practice-palettes{flex-wrap:wrap;gap:6px;margin-bottom:16px;display:flex}.practice-palette{border-radius:var(--r-pill);color:var(--text-h);cursor:pointer;transition:background .14s var(--ease), border-color .14s var(--ease);background:#ffffff0d;border:1px solid #ffffff29;padding:5px 11px 5px 24px;font-family:inherit;font-size:12px;font-weight:600;position:relative}.practice-palette:hover{background:#ffffff1a}.practice-palette:before{content:"";background:linear-gradient(135deg, var(--right) 50%, var(--left) 50%);width:10px;height:10px;box-shadow:0 0 8px var(--right);border-radius:50%;margin-top:-5px;position:absolute;top:50%;left:8px}.practice-palette.active{background:#ffffff26;border-color:#fff9}.practice-slider{margin-bottom:14px;font-size:12px;display:block}.practice-slider>span{color:var(--text-mid);justify-content:space-between;margin-bottom:6px;display:flex}.practice-slider output{font-variant-numeric:tabular-nums;color:var(--text-low)}.practice-slider input[type=range]{width:100%;accent-color:var(--accent)}.practice-slider input.hue-range{appearance:none;border-radius:var(--r-pill);background:linear-gradient(90deg,#f43434,#f4f434,#34f434,#34f4f4,#3434f4,#f434f4,#f43434);height:8px}.practice-slider input.hue-range::-webkit-slider-thumb{appearance:none;cursor:pointer;background:0 0;border:2px solid #fff;border-radius:50%;width:16px;height:16px;box-shadow:0 0 6px #000000bf}.practice-slider input.hue-range::-moz-range-thumb{cursor:pointer;background:0 0;border:2px solid #fff;border-radius:50%;width:14px;height:14px}.practice-tick{color:var(--text-mid);cursor:pointer;align-items:center;gap:9px;font-size:12px;display:flex}.practice-tick input{width:1rem;height:1rem;accent-color:var(--accent)}.practice-field-label{letter-spacing:.1em;text-transform:uppercase;color:var(--text-low);margin:2px 0 8px;font-size:10.5px;font-weight:600}.practice-palette.practice-motif{padding:5px 11px}.practice-palette.practice-motif:before{content:none}*{scrollbar-width:thin;scrollbar-color:#ff96a54d transparent}::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{border-radius:var(--r-pill);background-color:#ff96a54d;background-clip:content-box;border:3px solid #0000}::-webkit-scrollbar-thumb:hover{background-color:#ff96a58c}@media (width<=720px){.score-header{gap:9px}.score-header h2{flex-basis:100%;margin-right:0}.level-picker{flex-direction:column;flex:46%;align-items:stretch;gap:5px}.capture-idea{grid-template-columns:1fr auto}.capture-idea button{grid-column:1/-1;justify-self:start}}@media (width<=620px){.practice-settings{width:auto;left:14px;right:14px}.practice-title{display:none}}@media (width<=640px){.panel h2{gap:11px;font-size:19px}.step-n{width:28px;height:28px;font-size:13px}.game-link{padding:11px 18px 11px 11px;font-size:13.5px}.controls-row input[type=text]{width:100%;min-width:0}.controls-row label{flex:100%}.score-meta{grid-template-columns:repeat(auto-fit,minmax(104px,1fr))}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.panel,.ways{opacity:1;transform:none;animation:none!important}body:before{animation:none}}@media (prefers-contrast:more){:root{--text:#e8e4f7;--text-mid:#d3cde9;--text-low:#bcb5d6;--panel-border:#c8afff66}.panel:before{background:#c8afff80}body:after{opacity:.2}}.style-blurb{color:var(--text-low);min-height:1.2em;margin:10px 0 0;font-size:13.5px}.section-bars{float:right;letter-spacing:.06em;color:var(--text-low);font-weight:600}.plans-panel .plans-lede{color:var(--text-mid);max-width:46ch;margin:0 0 1.6rem}.plans{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;display:grid}.plan{background:var(--ink-1);border:1px solid var(--ink-3);border-radius:14px;padding:1.3rem 1.4rem}.plan h3{color:var(--text-h);margin:0 0 .2rem;font-family:Playfair Display,Georgia,serif;font-size:1.3rem;font-weight:600}.plan-price{color:var(--text-h);margin:0 0 1rem;font-size:1.9rem;font-weight:600;line-height:1}.plan-price span{color:var(--text-low);font-size:.95rem;font-weight:400}.plan ul{margin:0;padding:0;font-size:.93rem;list-style:none}.plan li{color:var(--text);padding:.3rem 0 .3rem 1.2rem;position:relative}.plan li:before{content:"·";color:var(--rose);font-weight:700;position:absolute;left:.25rem}.plan-pro{border-color:var(--accent-border);background:linear-gradient(180deg, var(--accent-bg), transparent 60%), var(--ink-1)}.plan-trial{color:var(--text-mid);margin:1rem 0 0;font-size:.86rem}.plan-cta{flex-direction:column;gap:.5rem;margin-top:1.1rem;display:flex}.plan-cta button{width:100%}.plan-cta-note{color:var(--text-dim,var(--text-mid));text-align:center;margin:0;font-size:.8rem}.plan-cta-have{color:var(--text-mid);font-weight:600}.site-foot{border-top:1px solid var(--ink-3);text-align:center;max-width:60rem;margin:3rem auto 2rem;padding:1.6rem 1.2rem 0;font-size:.88rem}.site-foot p{margin:0 0 .6rem}.site-foot a{color:var(--text-mid);white-space:nowrap;margin:0 .55rem;text-decoration:none}.site-foot a:hover,.site-foot a:focus-visible{color:var(--rose-hi);text-decoration:underline}.foot-who{color:var(--text-low);font-size:.82rem}