:root{color:#171a1b;font-synthesis:none;text-rendering:optimizelegibility;--paper:#f7f1e4;--ink:#171a1b;--coral:#ff5148;--coral-dark:#db352f;--blue:#145ed9;--yellow:#ffc928;--line:#1d262a;--muted:#6f706b;background:#f7f1e4;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans HK,Noto Sans TC,PingFang HK,Microsoft JhengHei,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}html,body,#root{background-color:#f7f1e4}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:3px solid var(--blue);outline-offset:4px}.app-shell{background-color:var(--paper);background-image:radial-gradient(circle at 20% 18%,#4532140e 0 1px,#0000 1.3px),radial-gradient(circle at 79% 68%,#4532140a 0 1px,#0000 1.2px);background-size:27px 29px,31px 33px;grid-template-rows:auto 1fr auto;min-height:100vh;display:grid;position:relative;overflow:hidden}.app-shell:before,.app-shell:after{content:"";z-index:0;background-color:var(--yellow);pointer-events:none;border-radius:50%;width:130px;height:130px;position:absolute;bottom:-48px}.app-shell:before{background-image:repeating-linear-gradient(132deg,#0000 0 9px,#171a1ba6 9px 11px,#0000 11px 17px);left:-52px}.app-shell:after{background-image:radial-gradient(circle, var(--ink) 0 1.3px, transparent 1.6px);background-size:10px 10px;right:-42px}.app-shell>*{z-index:1;position:relative}.site-header{z-index:5;border-bottom:1px dashed #171a1b2e;justify-content:space-between;align-items:center;min-height:92px;padding:18px clamp(24px,4vw,64px);display:flex}.brand{align-items:center;gap:13px;display:flex}.brand-home-button{color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:9px;padding:0}.brand-home-button .brand-mark{transition:transform .16s,box-shadow .16s}.brand-home-button:hover .brand-mark{box-shadow:4px 4px 0 var(--yellow);transform:translate(-2px,-2px)rotate(-2deg)}.brand-home-button:hover .brand-copy strong{color:var(--blue)}.brand-mark{color:#fff;background:var(--coral);border-radius:50%;place-items:center;width:55px;height:55px;display:grid;transform:rotate(-2deg)}.brand-mark svg{fill:none;stroke:currentColor;stroke-width:2.3px;stroke-linecap:round;stroke-linejoin:round;width:37px}.brand-copy{line-height:1;display:grid}.brand-copy strong{letter-spacing:.08em;font-size:24px;font-weight:900}.brand-copy small{letter-spacing:.32em;margin-top:8px;font-size:11px;font-weight:700}.header-actions{align-items:center;gap:16px;display:flex}.icon-button,.settings-button{border:1.5px solid var(--line);cursor:pointer;background:#ffffff2e;border-radius:8px;min-height:48px;transition:transform .16s,box-shadow .16s,background .16s}.icon-button:hover,.settings-button:hover{box-shadow:3px 3px 0 var(--yellow);background:#fffaf0;transform:translate(-2px,-2px)}.icon-button{place-items:center;width:62px;display:grid}.settings-button{align-items:center;gap:9px;padding:0 20px;font-size:15px;font-weight:750;display:flex}.icon-button svg,.settings-button svg,.dialog-close svg,.replay-button svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}main{flex-direction:column;align-items:center;width:min(1120px,100% - 40px);margin:0 auto;padding:35px 0 15px;display:flex}.sound-stage{text-align:center;width:100%}.sound-stage h1,.results h1{letter-spacing:.04em;margin:0;font-size:clamp(45px,5.2vw,70px);font-weight:950;line-height:.98}.intro{letter-spacing:.14em;margin:14px 0 16px;font-family:Georgia,Noto Serif HK,serif;font-size:18px}.instrument-control{grid-template-columns:auto minmax(165px,235px);justify-content:center;align-items:center;gap:5px 10px;min-height:50px;margin:-3px 0 2px;display:grid}.instrument-control label{letter-spacing:.12em;font-size:13px;font-weight:900}.instrument-control select{border:1.5px solid var(--line);width:100%;min-height:38px;color:var(--ink);cursor:pointer;background:#ffffff47;border-radius:7px;padding:0 34px 0 12px;font-size:14px;font-weight:800}.instrument-control select:hover:not(:disabled){color:var(--blue);border-color:var(--blue);background:#eef4ff}.instrument-control select:disabled{cursor:wait;opacity:.55}.instrument-control small{min-height:13px;color:var(--coral-dark);letter-spacing:.03em;grid-column:1/-1;font-size:10px;font-weight:750}.sound-visual{grid-template-columns:1fr 225px 1fr;align-items:center;min-height:300px;display:grid;position:relative}.play-button{z-index:2;border:3px solid var(--line);background:var(--coral);color:#fff;width:205px;height:205px;box-shadow:7px 7px 0 var(--coral-dark), 9px 9px 0 var(--line);cursor:pointer;border-radius:50%;flex-direction:column;grid-column:2;justify-content:center;justify-self:center;align-items:center;gap:4px;transition:transform .12s,box-shadow .12s;display:flex}.play-button:hover:not(:disabled){box-shadow:9px 9px 0 var(--coral-dark), 11px 11px 0 var(--line);transform:translate(-2px,-2px)}.play-button:active{box-shadow:2px 2px 0 var(--coral-dark), 3px 3px 0 var(--line);transform:translate(5px,5px)}.play-button:disabled{cursor:wait;opacity:.58}.play-button svg{fill:#fff;stroke:none;width:56px;height:56px}.play-button span{letter-spacing:.09em;font-size:19px;font-weight:850}.sound-rings{pointer-events:none;width:275px;height:275px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.sound-rings i{border:1.5px dashed #ff514894;border-radius:50%;position:absolute;inset:0}.sound-rings i:nth-child(2){inset:13px;transform:rotate(12deg)}.sound-rings i:nth-child(3){inset:27px;transform:rotate(-8deg)}.is-playing .sound-rings i{animation:1s ease-out infinite ring-pulse}.is-playing .sound-rings i:nth-child(2){animation-delay:.12s}.is-playing .sound-rings i:nth-child(3){animation-delay:.24s}.waveform{height:90px;color:var(--coral);align-items:center;gap:clamp(3px,.38vw,6px);display:flex;overflow:hidden}.waveform--left{justify-content:flex-start;transform:scaleX(-1)}.waveform--right{justify-content:flex-start}.waveform i{width:2px;height:var(--bar-height);transform-origin:50%;background:currentColor;border-radius:2px;min-height:4px;display:block}.is-playing .waveform i{animation:.56s ease-in-out infinite alternate bar-dance;animation-delay:calc(var(--bar-height) * -9ms)}.training-status{justify-content:center;align-items:center;gap:18px;min-height:58px;display:flex}.question-status{letter-spacing:.1em;white-space:nowrap;margin:0;font-weight:750}.reference-scale-button{border:1.5px solid var(--blue);min-width:156px;min-height:48px;color:var(--blue);cursor:pointer;background:#ffffff3d;border-radius:7px;padding:5px 12px;transition:transform .12s,box-shadow .12s,background .12s}.reference-scale-button span{letter-spacing:.06em;font-size:14px;font-weight:900;display:block}.reference-scale-button small{color:var(--muted);letter-spacing:.02em;margin-top:3px;font-size:9px;font-weight:750;display:block}.reference-scale-button:hover{box-shadow:4px 4px 0 var(--yellow);background:#fffaf0;transform:translate(-2px,-2px)}.reference-scale-button.is-playing{color:var(--ink);border-color:var(--ink);background:var(--yellow);box-shadow:3px 3px 0 var(--ink)}.reference-scale-button.is-playing small{color:var(--ink)}.level-switch{border:1.5px solid var(--line);background:#171a1b0f;border-radius:8px;grid-template-columns:repeat(4,1fr);padding:3px;display:grid}.level-switch button{cursor:pointer;background:0 0;border:0;border-radius:5px;min-width:94px;min-height:45px;padding:4px 10px;line-height:1.05}.level-switch button span{letter-spacing:.08em;font-size:14px;font-weight:900;display:block}.level-switch button small{color:var(--muted);letter-spacing:.03em;margin-top:4px;font-size:10px;font-weight:750;display:block}.level-switch button.is-active{color:#fff;background:var(--blue);box-shadow:2px 2px 0 var(--ink)}.level-switch button.is-active small{color:#fffc}.level-switch button:hover:not(.is-active){color:var(--blue);background:#eef4ff}.level-switch button:disabled{cursor:wait;opacity:.48}.feedback-slot{color:#0000;min-height:30px;margin:8px auto 2px;font-weight:800;transition:color .2s}.feedback-slot.has-feedback{color:var(--ink)}.answer-frame{border:2px solid var(--line);width:100%;box-shadow:7px 7px 0 var(--blue);background:#ffffff1f;border-radius:8px;padding:14px}.answer-grid{grid-template-columns:repeat(6,1fr);gap:11px;display:grid}.answer-grid--natural{grid-template-columns:repeat(7,1fr)}.note-key{border:1.7px solid var(--line);cursor:pointer;background:#ffffff4d;border-radius:7px;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-height:84px;font-size:34px;font-weight:900;line-height:1;transition:transform .12s,background .12s,box-shadow .12s,color .12s;display:flex}.note-key-label{line-height:.9;display:block}.note-key-solfege{color:var(--coral-dark);letter-spacing:.04em;font-size:13px;font-weight:850;line-height:1;display:block}.note-key.is-correct .note-key-solfege,.note-key.is-wrong .note-key-solfege{color:inherit}.note-key:hover:not(:disabled),.note-key.is-selected{color:var(--blue);box-shadow:4px 4px 0 var(--blue);background:#eef4ff;transform:translate(-2px,-2px)}.note-key:disabled{cursor:default;opacity:.5}.note-key.is-correct{opacity:1;color:#155f2e;background:#d8f6cb;border-color:#155f2e;transform:translate(-2px,-2px);box-shadow:4px 4px #155f2e}.note-key.is-wrong{opacity:1;color:#a9201e;background:#ffe0dc;border-color:#a9201e;text-decoration:line-through}.secondary-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:13px;min-height:72px;display:flex}.replay-button,.restart-round-button,.next-button,.dialog-done,.results button{border:1.7px solid var(--blue);min-width:210px;height:51px;color:var(--blue);letter-spacing:.08em;cursor:pointer;background:0 0;border-radius:7px;font-size:17px;font-weight:850;transition:transform .12s,box-shadow .12s,background .12s}.replay-button,.restart-round-button{justify-content:center;align-items:center;gap:11px;display:flex}.replay-button:hover:not(:disabled),.restart-round-button:hover{box-shadow:4px 4px 0 var(--blue);background:#eef4ff;transform:translate(-2px,-2px)}.replay-button:disabled{opacity:.35;cursor:not-allowed}.restart-round-button{color:var(--coral-dark);border-color:var(--coral-dark)}.restart-round-button:hover{box-shadow:4px 4px 0 var(--coral-dark);background:#fff1ec}.restart-round-button svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.next-button,.dialog-done,.results button{color:#fff;background:var(--blue)}.next-button:hover,.dialog-done:hover,.results button:hover{box-shadow:4px 4px 0 var(--ink);transform:translate(-2px,-2px)}.progress-footer{border-top:1px dashed #171a1b2e;grid-template-columns:auto 1fr auto;align-items:center;gap:32px;min-height:78px;padding:16px clamp(24px,6vw,100px);display:grid}.progress-footer>strong{letter-spacing:.12em;font-size:25px}.progress-track{background:#171a1b14;border:1px solid #171a1b38;border-radius:20px;height:14px;overflow:hidden}.progress-track i{border-radius:inherit;background:var(--coral);height:100%;transition:width .35s;display:block}.footer-meta{justify-items:end;gap:2px;display:grid}.footer-streak{letter-spacing:.06em;font-size:17px;font-weight:800}.studio-credit{color:var(--muted);letter-spacing:.045em;white-space:nowrap;font-size:10px;font-weight:700}.studio-credit a,.studio-credit button{color:inherit;text-underline-offset:2px;text-decoration:underline;text-decoration-thickness:1px}.studio-credit button{font:inherit;letter-spacing:inherit;cursor:pointer;background:0 0;border:0;padding:0}.studio-credit a:hover,.studio-credit button:hover{color:var(--blue)}.progress-footer b{color:var(--coral);margin-left:8px;font-size:27px}.dialog-backdrop{z-index:20;background:#171a1b7a;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.settings-dialog,.confirm-dialog,.privacy-dialog{border:2px solid var(--ink);background:var(--paper);width:min(430px,100%);box-shadow:8px 8px 0 var(--blue);border-radius:10px;padding:28px}.privacy-dialog{width:min(520px,100%);max-height:calc(100vh - 40px);overflow-y:auto}.dialog-heading{justify-content:space-between;align-items:center;display:flex}.dialog-heading h2{margin:0;font-size:28px}.dialog-close{cursor:pointer;background:0 0;border:0;width:40px;height:40px}.language-fieldset{border:0;margin:26px 0 0;padding:0}.language-fieldset legend{margin-bottom:11px;font-weight:800}.language-switch{width:100%;position:relative}.language-menu-trigger{border:1.5px solid var(--line);cursor:pointer;background:#ffffff3d;border-radius:8px;justify-content:space-between;align-items:center;gap:8px;width:100%;min-height:44px;padding:0 12px;font-weight:850;transition:transform .16s,box-shadow .16s,background .16s;display:flex}.language-menu-trigger:hover,.language-menu-trigger[aria-expanded=true]{box-shadow:3px 3px 0 var(--yellow);background:#fffaf0;transform:translate(-2px,-2px)}.language-menu-trigger svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:18px;height:18px}.language-menu-trigger svg:last-child{width:14px;height:14px;transition:transform .16s}.language-menu-trigger[aria-expanded=true] svg:last-child{transform:rotate(180deg)}.language-current-short{display:none}.language-switch--header{width:78px}.language-switch--header .language-menu-trigger{gap:5px;min-height:48px;padding:0 9px}.language-switch--header .language-current-long{display:none}.language-switch--header .language-current-short{text-align:center;min-width:20px;font-size:13px;display:inline}.language-menu{z-index:30;border:1.5px solid var(--line);background:var(--paper);width:100%;min-width:190px;box-shadow:5px 5px 0 var(--blue);border-radius:8px;padding:6px;position:absolute;top:calc(100% + 9px);left:0}.language-switch--header .language-menu{left:auto;right:0}.language-menu button{text-align:left;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:5px;justify-content:space-between;align-items:center;gap:18px;width:100%;min-height:42px;padding:0 10px 0 12px;font-size:14px;font-weight:800;display:flex}.language-menu button:hover,.language-menu button:focus-visible{color:var(--blue);background:#eef4ff}.language-menu button.is-active{color:#fff;background:var(--blue)}.language-menu button svg{opacity:0;fill:none;stroke:currentColor;stroke-width:2.3px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.language-menu button.is-active svg{opacity:1}.language-fieldset small{color:var(--muted);margin-top:9px;font-size:12px;line-height:1.55;display:block}.settings-dialog label{justify-content:space-between;margin:24px 0 12px;font-weight:800;display:flex}.settings-dialog input{width:100%;accent-color:var(--coral)}.settings-dialog p{color:var(--muted);font-size:14px;line-height:1.7}.dialog-done{width:100%;margin-top:12px}.confirm-dialog p{color:var(--muted);margin:22px 0 25px;font-size:16px;line-height:1.7}.privacy-intro{margin:22px 0 16px;font-size:16px;font-weight:750;line-height:1.75}.privacy-list{color:var(--muted);margin:0;padding-left:1.4em;font-size:14px;line-height:1.75}.privacy-list li+li{margin-top:8px}.privacy-list li::marker{color:var(--coral)}.confirm-actions{grid-template-columns:1fr 1fr;gap:12px;display:grid}.confirm-actions button{border:1.7px solid var(--blue);cursor:pointer;border-radius:7px;min-height:51px;padding:8px 12px;font-weight:850;transition:transform .12s,box-shadow .12s,background .12s}.confirm-cancel{color:#fff;background:var(--blue)}.confirm-actions .confirm-submit{color:var(--coral-dark);border-color:var(--coral-dark);background:0 0}.confirm-actions button:hover{box-shadow:4px 4px 0 var(--ink);transform:translate(-2px,-2px)}.results{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:540px;display:flex;position:relative}.results p{max-width:500px;font-size:19px;line-height:1.7}.results .reference-scale-used{color:var(--muted);letter-spacing:.06em;margin:-5px 0 8px;font-size:12px;font-weight:750}.results>strong{color:var(--coral);margin:12px 0 30px;font-size:96px;line-height:1}.results>strong small{color:var(--ink);font-size:25px}.result-actions{flex-wrap:wrap;justify-content:center;gap:13px;display:flex}.results .result-secondary{color:var(--blue);background:var(--paper)}.results .share-result-button{min-width:250px;color:var(--coral-dark);border-color:var(--coral-dark);background:var(--paper);justify-content:center;align-items:center;gap:9px;display:flex}.results .share-result-button:hover{box-shadow:4px 4px 0 var(--coral-dark);background:#fff1ec}.share-result-button svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:21px;height:21px}.share-status{min-height:24px;color:var(--blue);letter-spacing:.03em;margin-top:13px;font-size:14px;font-weight:800}.result-orbit{pointer-events:none;width:440px;height:440px;position:absolute}.result-orbit i{border:1.5px dashed #ff514859;border-radius:50%;position:absolute;inset:0;transform:rotate(-8deg)}.result-orbit i:last-child{border-color:#145ed94d;inset:34px;transform:rotate(13deg)}.results>:not(.result-orbit){z-index:1;position:relative}html[lang=en] .brand-copy small{letter-spacing:.13em;font-size:8px}html[lang=en] .level-switch button span{letter-spacing:.02em;font-size:12px}@keyframes ring-pulse{0%{opacity:.9;transform:scale(.82)}to{opacity:0;transform:scale(1.16)}}@keyframes bar-dance{0%{transform:scaleY(.45)}to{transform:scaleY(1.2)}}@media (width<=760px){.app-shell:before,.app-shell:after{display:none}.site-header{min-height:76px;padding:12px 16px}.brand-mark{width:46px;height:46px}.brand-mark svg{width:31px}.brand-copy strong{font-size:19px}.brand-copy small{margin-top:6px;font-size:8px}.settings-button{justify-content:center;width:48px;padding:0}.settings-button span{display:none}.header-actions{gap:8px}.icon-button{width:48px}.language-switch--header{width:70px}.language-switch--header .language-menu-trigger{min-height:48px;padding:0 7px}.language-switch--header .language-current-short{font-size:13px}main{width:min(100% - 28px,560px);padding:25px 0 16px}.sound-stage h1{font-size:clamp(40px,13vw,57px)}.intro{margin:11px 0 8px;font-size:15px}.instrument-control{min-height:47px;margin-bottom:0}.instrument-control select{min-height:36px}.sound-visual{grid-template-columns:1fr 165px 1fr;min-height:190px}.play-button{width:150px;height:150px;box-shadow:5px 5px 0 var(--coral-dark), 7px 7px 0 var(--line)}.play-button svg{width:45px;height:45px}.play-button span{font-size:16px}.sound-rings{width:195px;height:195px}.waveform{gap:3px}.waveform i:nth-child(2n){display:none}.training-status{flex-direction:column;gap:7px;min-height:92px}.level-switch{width:min(100%,390px)}.level-switch button{min-width:0;padding-inline:5px}.feedback-slot{margin-top:6px}.answer-frame{box-shadow:5px 5px 0 var(--blue);padding:9px}.answer-grid{grid-template-columns:repeat(4,1fr);gap:8px}.answer-grid--natural{grid-template-columns:repeat(8,1fr)}.answer-grid--natural .note-key{grid-column:span 2}.answer-grid--natural .note-key:nth-child(5){grid-column:2/span 2}.note-key{min-height:57px;font-size:27px}.progress-footer{grid-template-columns:auto 1fr;gap:12px 18px;min-height:70px;padding:13px 18px}.progress-track{height:11px}.progress-footer>strong{font-size:20px}.footer-meta{grid-column:1/-1;margin-top:-4px}.footer-streak{font-size:14px}.studio-credit{font-size:9px}.progress-footer b{font-size:20px}.results{min-height:480px}.results h1{font-size:45px}.results>strong{font-size:76px}}@media (width<=420px){.site-header{padding:10px 12px}.brand{gap:8px}.brand-mark{width:42px;height:42px}.brand-mark svg{width:28px}.brand-copy strong{font-size:18px}.brand-copy small{display:none}.header-actions{gap:6px}.icon-button,.settings-button{width:44px;min-height:44px}.language-switch--header{width:66px}.language-switch--header .language-menu-trigger{min-height:44px;padding:0 6px}html[lang=en] .level-switch button span{letter-spacing:0;font-size:10px}.confirm-actions{grid-template-columns:1fr}}@media (width<=350px){.site-header{padding-inline:8px}.brand{gap:6px}.brand-mark{width:38px;height:38px}.brand-mark svg{width:26px}.brand-copy strong{font-size:17px}.header-actions{gap:4px}.icon-button,.settings-button{width:40px;min-height:40px}.language-switch--header{width:62px}.language-switch--header .language-menu-trigger{min-height:40px;padding:0 5px}}@media (height<=850px) and (width>=761px){.site-header{min-height:76px;padding-top:10px;padding-bottom:10px}.brand-mark{width:48px;height:48px}main{padding:12px 0 8px}.sound-stage h1{font-size:49px}.intro{margin:10px 0 7px}.instrument-control{min-height:42px}.sound-visual{min-height:166px}.play-button{width:156px;height:156px}.sound-rings{width:205px;height:205px}.training-status{min-height:51px}.level-switch button{min-height:39px}.level-switch button small{margin-top:2px}.note-key{min-height:58px}.feedback-slot{margin-top:3px}.secondary-actions{min-height:54px}.replay-button,.restart-round-button,.next-button{height:46px}.progress-footer{min-height:60px;padding-top:10px;padding-bottom:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.access-shell{background-color:var(--paper);background-image:radial-gradient(circle at 20% 18%,#4532140e 0 1px,#0000 1.3px),radial-gradient(circle at 79% 68%,#4532140a 0 1px,#0000 1.2px);background-size:27px 29px,31px 33px;min-height:100vh;padding:22px clamp(20px,4vw,64px);overflow:hidden}.access-brand{align-items:center;gap:13px;display:flex}.access-main{place-items:center;min-height:calc(100vh - 100px);padding:40px 0 80px;display:grid;position:relative}.access-panel{z-index:1;border:2px solid var(--ink);background:var(--paper);width:min(460px,100%);box-shadow:8px 8px 0 var(--blue);border-radius:10px;padding:40px;position:relative}.access-panel h1{letter-spacing:.04em;margin:0;font-size:clamp(38px,5vw,54px);font-weight:950;line-height:1}.access-panel>p{color:var(--muted);margin:16px 0 26px;line-height:1.7}.access-panel form{gap:11px;display:grid}.access-panel label{letter-spacing:.08em;font-size:14px;font-weight:850}.access-panel input{border:1.7px solid var(--line);letter-spacing:.12em;background:#fffaf0;border-radius:7px;width:100%;height:54px;padding:0 16px;font-size:22px}.access-panel form button{border:1.7px solid var(--line);color:#fff;background:var(--coral);height:54px;box-shadow:4px 4px 0 var(--coral-dark);letter-spacing:.08em;cursor:pointer;border-radius:7px;margin-top:5px;font-weight:900}.access-panel form button:hover{box-shadow:6px 6px 0 var(--coral-dark);transform:translate(-2px,-2px)}.access-panel>small{color:var(--muted);text-align:center;margin-top:22px;display:block}.access-error{color:#a9201e;margin:0;font-size:14px;font-weight:800}.access-rings{pointer-events:none;width:650px;height:650px;position:absolute}.access-rings i{border:1.5px dashed #ff51484d;border-radius:50%;position:absolute;inset:0}.access-rings i:nth-child(2){border-color:#145ed945;inset:55px;transform:rotate(8deg)}.access-rings i:nth-child(3){inset:110px;transform:rotate(-11deg)}@media (width<=560px){.access-shell{padding:16px}.access-main{min-height:calc(100vh - 78px);padding:25px 0 50px}.access-panel{box-shadow:6px 6px 0 var(--blue);padding:30px 24px}.access-panel h1{font-size:40px}.access-rings{width:470px;height:470px}}.not-found-shell{background-color:var(--paper);background-image:radial-gradient(circle at 20% 18%,#4532140e 0 1px,#0000 1.3px),radial-gradient(circle at 79% 68%,#4532140a 0 1px,#0000 1.2px);background-size:27px 29px,31px 33px;grid-template-rows:auto 1fr auto;min-height:100vh;display:grid;overflow:hidden}.brand-home-link{color:inherit;border-radius:9px;text-decoration:none}.brand-home-link .brand-mark{transition:transform .16s,box-shadow .16s}.brand-home-link:hover .brand-mark{box-shadow:4px 4px 0 var(--yellow);transform:translate(-2px,-2px)rotate(-2deg)}.brand-home-link:hover .brand-copy strong{color:var(--blue)}.not-found-main{text-align:center;place-items:center;width:100%;padding:50px 22px 80px;display:grid;position:relative}.not-found-rings{aspect-ratio:1;pointer-events:none;width:min(650px,88vw);position:absolute}.not-found-rings i{border:1.5px dashed #ff514857;border-radius:50%;position:absolute;inset:0;transform:rotate(-8deg)}.not-found-rings i:nth-child(2){border-color:#145ed947;inset:52px;transform:rotate(12deg)}.not-found-rings i:nth-child(3){inset:104px;transform:rotate(-15deg)}.not-found-panel{z-index:1;width:min(620px,100%);position:relative}.not-found-code{color:var(--coral);letter-spacing:-.04em;text-shadow:6px 6px #145ed929;margin-bottom:8px;font-size:clamp(82px,17vw,160px);font-weight:950;line-height:.8;display:block}.not-found-panel h1{letter-spacing:.04em;margin:30px 0 0;font-size:clamp(42px,7vw,72px);font-weight:950;line-height:1}.not-found-panel p{max-width:540px;color:var(--muted);margin:20px auto 30px;font-size:18px;line-height:1.75}.not-found-home{border:2px solid var(--blue);color:#fff;background:var(--blue);min-width:250px;min-height:56px;box-shadow:5px 5px 0 var(--ink);letter-spacing:.06em;border-radius:8px;justify-content:center;align-items:center;padding:0 24px;font-size:17px;font-weight:850;text-decoration:none;transition:transform .12s,box-shadow .12s;display:inline-flex}.not-found-home:hover{box-shadow:7px 7px 0 var(--ink);transform:translate(-2px,-2px)}.not-found-footer{min-height:58px;color:var(--muted);text-align:right;border-top:1px dashed #171a1b2e;justify-content:flex-end;align-items:center;padding:18px 24px;display:flex}@media (width<=560px){.not-found-main{padding-top:35px}.not-found-rings i:nth-child(2){inset:34px}.not-found-rings i:nth-child(3){inset:68px}.not-found-panel p{font-size:16px}.not-found-footer{text-align:center;justify-content:center}}
