:root{--ink:#40345c;--muted:#877397;--purple:#7957bd;--gold:#ffd16b;--line:#e8daef}*{box-sizing:border-box}body{color:var(--ink);-webkit-font-smoothing:antialiased;background:#181b43;margin:0;font:15px/1.6 Microsoft JhengHei,system-ui,sans-serif}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline-offset:5px;outline:3px solid #e8aa36}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}main:focus{outline:none}.app-shell{background:radial-gradient(at 90% 20%,#6e438444,#0000 40%),radial-gradient(at 8% 70%,#3b539166,#0000 45%),#181b43;min-height:100svh;position:relative;overflow:clip}.app-shell:before{content:"";pointer-events:none;opacity:.45;background-image:radial-gradient(circle,#d9c8ee 1px,#0000 1.8px),radial-gradient(circle,#ffe8a5 1px,#0000 1.7px);background-position:12px 20px,55px 75px;background-size:91px 97px,173px 157px;position:absolute;inset:0}main{position:relative}.topbar{color:#d9c8ec;border-bottom:1px solid #ffffff12;align-items:center;gap:28px;max-width:1280px;min-height:88px;margin:auto;padding:17px 42px;display:flex}.brand{color:#fff4dc;letter-spacing:1px;align-items:center;gap:12px;font-size:29px;font-weight:800;display:inline-flex}.brand small{letter-spacing:3px;color:#d2bee9;margin-top:-3px;font-size:10px;font-weight:500;display:block}.brand-icon{color:#ffe4a0;background:#a582da26;border:1px solid #c6ade855;border-radius:14px;place-items:center;width:42px;height:42px;font-size:28px;display:grid}.breadcrumb{border-left:1px solid #ffffff24;padding-left:28px;font-size:12px}.prototype-badge{white-space:nowrap;background:#ffffff08;border:1px solid #bda3d844;border-radius:30px;margin-left:auto;padding:7px 13px;font-size:11px}.page-content{max-width:1196px;margin:auto;padding:32px 36px 20px}.eyebrow{letter-spacing:1.5px;color:#b9a1dc;font-size:11px;font-weight:600}.featured{background:radial-gradient(at 80%,#8164aa77,#0000 70%),linear-gradient(130deg,#33315f,#3d3063 70%,#594477);border:1px solid #b99be455;border-radius:30px;grid-template-columns:1.1fr 1fr;min-height:450px;display:grid;overflow:hidden;box-shadow:0 15px 70px #090b2540}.featured-copy{z-index:1;padding:38px 40px 32px;position:relative}.pill{color:#ffe3a0;background:#ffdd7712;border:1px solid #ffe7a433;border-radius:30px;padding:6px 13px;font-size:11px;display:inline-block}.featured h1{letter-spacing:2px;color:#fff4dc;margin:19px 0;font:700 clamp(45px,4.5vw,64px)/1.15 Georgia,serif}.featured h1 span{color:#ffdda0;letter-spacing:3px;font:700 .57em/1.4 Microsoft JhengHei,system-ui,sans-serif}.featured p{color:#e1d3f2;font-size:14px;line-height:1.9}.lesson-facts{color:#cdb9e3;gap:15px;margin:19px 0 22px;font-size:11px;display:flex}.lesson-facts span+span{border-left:1px solid #bda1da44;padding-left:15px}.primary{color:#60421d;background:linear-gradient(#ffe8a5,#ffca60);border:1px solid #ffecb8;border-bottom:4px solid #cf8d33;border-radius:16px;justify-content:center;align-items:center;gap:25px;min-height:52px;padding:13px 26px;font-weight:800;transition:transform .18s;display:inline-flex;box-shadow:0 4px #21143255,0 4px 20px #ffd56b14}.primary:hover:not(:disabled){transform:translateY(-2px)}.primary:active:not(:disabled){transform:translateY(2px)}.primary:disabled{opacity:.65}.featured-copy>small{color:#c7b6dc;margin-top:13px;font-size:10px;display:block}.harpi{aspect-ratio:1;filter:drop-shadow(0 12px 18px #180f3b33);background-image:url(/images/harpi/states.png);background-repeat:no-repeat;background-size:300% 200%;width:280px;max-width:100%;position:relative}.hero-harpi{place-items:center;min-width:0;padding:18px 0 30px;display:grid;position:relative}.hero-harpi .harpi{z-index:1;width:min(390px,100%);animation:5s ease-in-out infinite float-harpi}.hero-orbit{border:1px solid #cfb7f133;border-radius:50%;width:340px;height:340px;position:absolute;transform:rotate(-25deg)}.orbit-two{opacity:.5;border-style:dashed;width:410px;height:230px;transform:rotate(-35deg)}.hero-nameplate{z-index:2;color:#e5d3fa;background:#2d224cbb;border:1px solid #b9a1de44;border-radius:25px;padding:7px 16px;font-size:11px;position:absolute;bottom:23px}.floating-note{color:#ffe29b;z-index:2;text-shadow:0 0 30px #ffd46666;font-size:41px;position:absolute;transform:rotate(-15deg)}.note-one{top:48px;left:10px}.note-two{color:#cfb1ff;font-size:32px;bottom:95px;right:13px;transform:rotate(15deg)}.practice-summary{color:#cbb9de;align-items:center;gap:13px;padding:21px 8px;font-size:12px;display:flex}.practice-summary>span:first-child{color:#f9d57f;font-size:26px}.practice-summary .tag{margin-left:auto}.tag{color:#d5c7ec;white-space:nowrap;background:#8b6ac01a;border:1px solid #b7a4d94d;border-radius:8px;padding:5px 10px;font-size:10px;display:inline-block}.section-heading{justify-content:space-between;align-items:flex-end;margin:12px 0 23px;display:flex}.section-heading h2{color:#fff4df;letter-spacing:1px;margin-top:7px;font-size:23px}.muted{color:#b7a8cf;font-size:11px}.range-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.range-card{text-align:left;color:#f2e5ff;background:linear-gradient(150deg,#38365c,#27284d);border:1px solid #b39bdc30;border-radius:20px;min-width:0;padding:20px 24px 0;transition:transform .2s,border-color .2s;display:block}.range-card.ready{background:linear-gradient(145deg,#66539c,#443765);border-color:#bda1f788;box-shadow:0 8px 35px #080f2522}.range-card.ready:hover{border-color:#ffe2a0;transform:translateY(-4px)}.range-top{justify-content:space-between;align-items:center;min-height:53px;margin-bottom:14px;display:flex}.range-symbol{color:#422d6b;letter-spacing:-3px;background:radial-gradient(circle at 32% 30%,#e6c9ff,#9b79cf 65%,#6b509c);border-radius:50%;place-items:center;width:58px;height:58px;font:38px/1 Georgia,Segoe UI Symbol,serif;display:grid;box-shadow:inset -5px -5px 12px #211a5533,0 0 20px #bd94f429}.range-card:nth-child(2n) .range-symbol{color:#283c75;background:radial-gradient(circle at 30% 30%,#aedbeb,#6b9fc7 65%,#536496)}.range-card:nth-child(3n) .range-symbol{color:#69366a;background:radial-gradient(circle at 30% 30%,#f4c6d3,#b979a6 65%,#81527e)}.range-top .tag{color:#ffe8a8;background:#ffd57815;border-color:#ffd57866}.coming .range-symbol{opacity:.7}.coming .tag{color:#b9a7d0;background:#ffffff05;border-color:#a28abd33}.range-number{color:#a89bc4;letter-spacing:.6px;margin-top:6px;font-size:9px;display:block}.range-title{color:#f0e7fa;margin:7px 0;font-size:20px;font-weight:700;display:block}.range-card p{color:#b5a5cc;min-height:36px;font-size:11px;line-height:1.8}.range-bottom{color:#c4afd9;border-top:1px solid #c5abe522;justify-content:space-between;margin-top:15px;padding:12px 0;font-size:11px;display:flex}.how-to{color:#c3b4da;border:1px dashed #b29bd53b;border-radius:16px;justify-content:center;gap:45px;margin-top:35px;padding:20px;font-size:12px;display:flex}.page-footer{color:#a796c3;justify-content:space-between;padding:24px 0 14px;font-size:10px;display:flex}.practice-notice{color:#aa9bbe;text-align:center;margin:13px 0;font-size:10px;line-height:1.9}.storage-warning{color:#67451d;background:#fff0ce;border-radius:8px;max-width:1100px;margin:15px auto 0;padding:12px;font-size:12px}.play-heading{justify-content:space-between;align-items:center;display:flex}.text-button{color:#d3bde9;background:0 0;border:none;min-height:44px;padding:8px 0;font-size:13px}.game-title{text-align:center;margin:15px 0 24px}.game-title h1{color:#fff0d0;letter-spacing:1px;margin:7px 0;font-size:27px}.game-title p{color:#c1afd8;font-size:12px}.adventure-board{grid-template-columns:minmax(0,1fr) 230px;align-items:center;gap:25px;display:grid}.game-card{background:#fffaf1;border:3px solid #d9c5f6;border-radius:26px;min-width:0;padding:23px 26px 18px;box-shadow:0 8px #6d539055,0 20px 60px #0d0c3233}.game-stats{color:#81708e;justify-content:space-between;gap:8px;font-size:11px;display:flex}.game-stats strong{color:#5b4781;margin:0 2px;font-size:19px}.star-trail{justify-content:space-between;gap:3px;margin:17px 0;padding:0 0 11px;list-style:none;display:flex;position:relative}.star-trail:before{content:"";border-top:2px dashed #e5d9ed;position:absolute;top:17px;left:5%;right:5%}.trail-stop{text-align:center;flex:1;min-width:0;position:relative}.trail-star{place-items:center;width:clamp(24px,3vw,38px);height:clamp(24px,3vw,38px);margin:auto;display:grid;position:relative}.star-shape{fill:#f1ebf5;stroke:#d8cbe3;stroke-width:1.4px;width:100%;height:100%}.star-symbol{color:#8e7fa5;font-size:10px;font-weight:800;position:absolute}.trail-number{color:#897596;margin-top:4px;font-size:9px;display:block}.trail-stop.lit .star-shape,.result-constellation .lit{fill:#ffd15e;stroke:#e7a63a;filter:drop-shadow(0 0 5px #ffd76b66)}.trail-stop.lit .star-symbol{color:#815315}.trail-stop.practised .star-shape{fill:#f5ddd0;stroke:#d9ad9b}.trail-stop.practised .star-symbol{color:#a25e46}.trail-stop.here:after{content:"✦";color:#8960c5;font-size:11px;position:absolute;bottom:-15px;left:50%;transform:translate(-50%)}.trail-stop.here .trail-star{transform:scale(1.15)}.notation{text-align:center;background:#fff;border:1px solid #eee5f2;border-radius:16px;padding:13px 8px 0}.notation-label{color:#816c93;letter-spacing:2px;font-size:12px}.question-transition{justify-content:center;align-items:center;gap:8px;min-height:180px;padding:10px;animation:.3s ease-out question-pop;display:flex}.question-transition .harpi{flex-shrink:0;width:145px}.question-transition h2{color:#704799;font-size:23px;line-height:1.5}.question-transition p{color:#9476a7;margin-top:4px;font-size:12px}.transition-sparkles{color:#dcad40;letter-spacing:9px;margin-bottom:7px;font-size:20px;display:block}.notation.is-transitioning{background:radial-gradient(#fff0d9,#f5e9ff)}.question-arrival{animation:.3s ease-out question-pop}@keyframes question-pop{0%{opacity:.25;transform:translateY(7px)scale(.97)}to{opacity:1;transform:none}}.staff{width:100%;max-width:600px;margin:auto}.staff svg{width:100%;height:auto;display:block}.feedback{text-align:center;color:#8d7c99;justify-content:center;align-items:center;min-height:60px;padding:8px 0;font-size:12px;font-weight:600;display:flex}.feedback.correct{color:#3d7b55}.feedback.incorrect{color:#a0663f}.answer-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;display:grid}.answer{color:#654894;background:#f6efff;border:2px solid #d9c9ed;border-bottom:5px solid #c1a8e0;border-radius:13px;flex-direction:column;justify-content:center;align-items:center;min-height:66px;transition:transform .15s,background .15s;display:flex}.answer span{font:700 29px/1.2 Georgia,serif}.answer small{color:#9b87b1;font-size:9px}.answer:hover:not(:disabled){background:#eaddfb;transform:translateY(-2px)}.answer.is-correct{color:#446c2f;background:#e0f2d2;border-color:#8bbb67}.answer.is-wrong{color:#925c37;background:#fce4d4;border-color:#dba07d}.keyboard-hint{text-align:center;color:#8c7b9a;margin-top:14px;font-size:10px}.companion{text-align:center;min-width:0;position:relative}.companion .harpi{width:240px;max-width:110%;margin-left:-5%}.speech-bubble{color:#5d417b;background:#f3e6ff;border:2px solid #c3a6eb;border-radius:20px;padding:14px 16px;font-size:13px;font-weight:700;display:inline-block;position:relative;box-shadow:0 5px #7d55b322}.speech-bubble:after{content:"";background:inherit;border-bottom:2px solid #c3a6eb;border-right:2px solid #c3a6eb;width:15px;height:15px;position:absolute;bottom:-9px;left:48%;transform:rotate(45deg)}.companion-correct .harpi,.companion-streak .harpi{animation:.55s ease-out celebrate}.companion-streak .speech-bubble{color:#825522;background:#ffe8a6;border-color:#e9b94d}.companion-name{color:#ffe2a3;letter-spacing:1px;font-size:18px;font-weight:800}.companion-name span{color:#b5a4cd;letter-spacing:2px;font-size:10px;font-weight:400;display:block}.play-tip{text-align:center;color:#c4b0da;margin:22px 0;font-size:11px}.play-tip>span{color:#f8cf74;margin-right:7px;font-size:21px}.results{text-align:center;max-width:760px;margin:auto;padding:10px 0 24px;position:relative}.results>.eyebrow{z-index:2;position:relative}.result-constellation{pointer-events:none;justify-content:space-around;align-items:center;gap:10px;height:220px;display:flex;position:absolute;inset:55px 0 auto}.result-constellation .star-shape{flex-shrink:0;width:26px;height:26px}.result-constellation .star-shape:nth-child(3n){align-self:flex-start;margin-top:10px}.result-constellation .star-shape:nth-child(3n+1){align-self:flex-end;margin-bottom:10px}.result-constellation .unlit{fill:#ffffff08;stroke:#a18bc655}.result-harpi{width:240px;margin:5px auto -5px}.results>.tag{color:#ffe1a1;background:#ffd16615;border-color:#ffd16666}.results h1{color:#fff0d4;margin:13px 0 8px;font-size:29px}.results>p:not(.practice-notice){color:#d7c6ee;font-size:13px}.result-card{background:#fff9ee;border:2px solid #cab1e8;border-radius:23px;max-width:590px;margin:24px auto;overflow:hidden}.result-score{color:#8e708e;background:radial-gradient(#fff3d5,#f6e9ee);flex-direction:column;align-items:center;padding:18px 0;font-size:11px;display:flex}.result-score>strong{color:#7650a1;font:700 60px/1.25 Georgia,serif}.result-score>small{font-size:10px}.result-metrics{grid-template-columns:repeat(3,1fr);padding:22px 10px;display:grid}.result-metrics>div{flex-direction:column;gap:5px;display:flex}.result-metrics>div+div{border-left:1px solid #e3d5e7}.result-metrics strong{color:#60467d;font-size:25px}.result-metrics strong small{margin-left:3px;font-size:11px}.result-metrics span{color:#8f7b9c;font-size:10px}.result-actions{justify-content:center;gap:12px;margin-bottom:20px;display:flex}.secondary{color:#e7d6fa;background:#7d5cad22;border:1px solid #b69bd866;border-radius:16px;justify-content:center;align-items:center;min-height:52px;padding:12px 23px;font-weight:600;display:inline-flex}.secondary:hover{background:#a178c933}.modal-shade{z-index:20;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#15112d99;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.exit-modal{background:#fff8ee;border:3px solid #d4b8ed;border-radius:25px;max-width:430px;padding:30px;box-shadow:0 20px 100px #0005}.exit-modal h2{color:#614381;margin-bottom:12px}.exit-modal p{color:#85718f;margin-bottom:23px;font-size:13px}.exit-modal .secondary{color:#79608d;border-color:#cfb8e2}.exit-modal button+button{margin-left:10px}.skip-link{z-index:50;color:#573b79;background:#fff4db;border-radius:10px;padding:12px;position:fixed;top:-80px;left:20px}.skip-link:focus{top:15px}@keyframes float-harpi{50%{transform:translateY(-7px)rotate(1deg)}}@keyframes celebrate{40%{transform:translateY(-10px)rotate(-3deg)}70%{transform:translateY(-3px)rotate(2deg)}}@media (max-width:1000px){.page-content{padding:25px 28px 20px}.featured-copy{padding:30px}.hero-orbit{width:260px;height:260px}.orbit-two{width:320px;height:210px}.adventure-board{grid-template-columns:minmax(0,1fr) 175px;gap:12px}.companion .harpi{width:190px}.speech-bubble{padding:12px;font-size:11px}.game-card{padding:22px 18px 17px}.range-card{padding:18px 18px 0}}@media (max-width:760px){.topbar{min-height:80px;padding:16px 23px}.breadcrumb{display:none}.page-content{padding:20px}.featured{min-height:380px}.featured-copy{padding:27px}.featured h1{font-size:48px}.featured p{font-size:12px}.pill{font-size:9px}.hero-harpi{padding-bottom:38px}.hero-nameplate{padding:6px 10px;font-size:9px;bottom:40px}.lesson-facts{gap:8px;font-size:9px}.lesson-facts span+span{padding-left:8px}.range-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.summary-detail,.practice-summary .tag{display:none}.adventure-board{flex-direction:column-reverse;gap:12px;display:flex}.companion{justify-content:center;align-items:center;gap:6px;width:100%;display:flex}.companion .harpi{flex-shrink:0;order:-1;width:112px;max-width:112px;margin:-10px 0}.speech-bubble{text-align:left;max-width:220px;font-size:13px}.speech-bubble:after{border-top:0;border-bottom:2px solid #c3a6eb;border-left:2px solid #c3a6eb;border-right:0;bottom:17px;left:-9px}.companion-name{display:none}.game-card{width:100%;max-width:650px}.game-title{margin:6px 0 12px}.game-title h1{font-size:24px}.trail-star{width:34px;height:34px}.how-to{gap:18px;padding:16px 8px;font-size:10px}}@media (max-width:500px){.topbar{gap:8px;min-height:76px;padding:13px 18px}.brand{gap:9px;font-size:25px}.brand small{letter-spacing:2px;font-size:9px}.brand-icon{border-radius:12px;width:35px;height:38px;font-size:25px}.prototype-badge{padding:5px 9px;font-size:9px}.page-content{padding:17px 15px}.featured{border-radius:25px;flex-direction:column-reverse;display:flex}.hero-harpi{height:218px;margin:0;padding:0}.hero-harpi .harpi{width:215px}.hero-orbit{width:190px;height:190px}.orbit-two{width:265px;height:145px}.hero-nameplate{font-size:9px;bottom:0}.note-one{font-size:28px;top:30px;left:20%}.note-two{font-size:23px;bottom:30px;right:16%}.featured-copy{text-align:center;padding:17px 25px 26px}.featured h1{margin:12px 0;font-size:42px}.featured h1 br{display:none}.featured h1 span{margin-top:5px;display:block}.featured p{font-size:12px}.lesson-facts{justify-content:center;margin:16px 0;font-size:10px}.start-adventure{width:100%;font-size:16px}.featured-copy>small{font-size:9px}.practice-summary{gap:8px;padding:17px 3px;font-size:10px;line-height:1.8}.section-heading{margin:7px 0 18px}.section-heading h2{font-size:21px}.section-heading>.muted{display:none}.eyebrow{letter-spacing:1px;font-size:10px}.range-card{border-radius:17px;padding:15px 14px 0}.range-top{margin-bottom:10px}.range-symbol{width:47px;height:47px;font-size:32px}.range-top .tag{padding:4px 6px;font-size:8px}.range-number{letter-spacing:0;font-size:8px}.range-title{font-size:17px}.range-card p{min-height:38px;font-size:10px}.range-bottom{font-size:9px}.how-to{text-align:center;flex-direction:column;gap:8px;margin-top:23px;font-size:12px}.page-footer{gap:10px;font-size:9px}.page-footer span:last-child{white-space:nowrap}.practice-notice,.play-heading .tag{font-size:9px}.text-button{font-size:12px}.game-title h1{font-size:21px}.game-title p{font-size:11px}.companion .harpi{width:92px;max-width:92px;margin:-7px 0}.speech-bubble{padding:10px 13px;font-size:12px}.game-card{border-width:2px;border-radius:21px;padding:18px 13px 15px}.game-stats{font-size:9px}.game-stats strong{font-size:16px}.star-trail{gap:1px;margin:15px 0}.trail-star{width:25px;height:25px}.star-trail:before{top:12px}.star-symbol,.trail-number{font-size:8px}.notation{padding:11px 0 0}.notation-label{font-size:11px}.feedback{min-height:56px;font-size:11px}.answer-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.answer{border-radius:11px;min-height:53px}.answer span{font-size:26px}.answer small{display:none}.keyboard-hint{margin-top:12px;font-size:9px}.play-tip{margin:17px 0;font-size:10px}.result-harpi{width:205px}.result-constellation{gap:2px;height:180px;inset:50px 0 auto}.result-constellation .star-shape{width:19px;height:19px}.results h1{font-size:25px}.results>p:not(.practice-notice){font-size:11px}.result-card{margin:21px 0}.result-score>strong{font-size:55px}.result-metrics strong{font-size:22px}.result-metrics span{font-size:9px}.result-actions{gap:9px}.result-actions button{padding:12px 20px;font-size:14px}.exit-modal{padding:23px}.exit-modal button{padding:10px 16px;font-size:13px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media (max-width:500px){.question-transition{gap:0;min-height:150px;padding:8px 3px}.question-transition .harpi{width:105px}.question-transition h2{font-size:18px}.question-transition p{font-size:10px}.transition-sparkles{letter-spacing:5px;font-size:15px}}.second-level-entry{background:linear-gradient(120deg,#454077,#2e3a66);border:1px solid #c6b0ef55;border-radius:22px;justify-content:space-between;align-items:center;gap:24px;margin:5px 0 30px;padding:24px 28px;display:flex}.second-level-entry h2{color:#ffe6a9;margin:6px 0;font-size:23px}.second-level-entry p{color:#cfbfdf;font-size:12px}.level-two-menu{color:#e5d8f5}.level-two-intro{justify-content:center;align-items:center;gap:24px;margin:0 0 28px;display:flex}.level-two-intro .harpi{flex-shrink:0;width:230px}.level-two-intro h1{color:#ffe7ad;margin:7px 0 12px;font-size:32px}.level-two-intro p{margin-bottom:17px;font-size:14px;line-height:1.9}.mode-grid{grid-template-columns:minmax(0,1fr);gap:24px;max-width:580px;margin:auto;display:grid}.mode-card{text-align:center;background:linear-gradient(145deg,#50416d,#2e3157);border:1px solid #b99ad266;border-radius:25px;flex-direction:column;align-items:center;padding:27px;display:flex}.mode-symbol{color:#ffdf8f;font-size:40px}.mode-card h2{color:#ffe6ad;margin:8px 0 12px}.mode-card p{color:#e0d0ed;font-size:13px;line-height:1.9}.mode-card small{color:#bdaace;margin:14px 0 22px;font-size:11px}.mode-card button{width:100%}.mode-best{color:#cab7e3;margin-top:18px;font-size:11px}.moving-note-track{color:#71558d;max-width:620px;margin:2px auto 0;padding:7px 13px 8px}.track-heading,.track-legend{justify-content:space-between;align-items:center;display:flex}.track-heading{letter-spacing:.5px;min-height:24px;font-size:12px;font-weight:800}.track-heading strong{color:#664982;background:#f3eafd;border-radius:999px;min-width:58px;padding:4px 8px;font-size:12px}.moving-staff{width:100%;height:auto;max-height:190px;display:block;overflow:visible}.staff-lines line{stroke:#433354;stroke-width:1.5px}.staff-lines text{fill:#433354;font-family:Noto Music,Segoe UI Symbol,serif;font-size:68px}.moving-note{fill:#56406b;stroke:#56406b;stroke-width:2.5px}.moving-note .ledger-line{stroke-width:1.5px}.moving-note .note-stem{stroke-width:2.5px}.hit-light line{stroke:#ffc942;stroke-width:4px;filter:url(#harpi-glow)}.hit-light circle{fill:#fff0a9;filter:url(#harpi-glow)}.timing-hit-window .hit-light{animation:.55s ease-in-out infinite alternate hit-pulse}.timing-hit-window .moving-note{fill:#7c4f87;stroke:#7c4f87;filter:url(#harpi-glow)}.moving-note-track.paused .moving-note,.moving-note-track.paused .hit-light{opacity:.48}.track-legend{color:#9b86ab;letter-spacing:1px;margin-top:-13px;padding:0 8px;font-size:9px}.track-legend span:last-child{color:#b39abd;opacity:.35;transition:opacity .25s,color .25s}.track-legend span:last-child.visible{color:#a97920;opacity:1}@keyframes hit-pulse{0%{opacity:.68}to{opacity:1}}.timeout-summary{margin-bottom:20px}.result-actions{flex-wrap:wrap}.result-next{background:#ffd46f10;border:1px solid #f4cf8066;border-radius:20px;max-width:590px;margin:0 auto 22px;padding:18px 22px}.result-next p{color:#ffe0a0;margin-bottom:12px;font-size:13px}.result-next .primary{width:100%;min-height:56px;font-size:18px}.result-next small{color:#d2bce7;margin-top:9px;font-size:11px;display:block}@media (max-width:760px){.second-level-entry{flex-direction:column;align-items:stretch;gap:16px;padding:20px}.level-two-intro{gap:12px}.level-two-intro .harpi{width:150px}.level-two-intro h1{font-size:25px}.level-two-intro p{font-size:12px}.mode-grid{gap:15px}.mode-card{padding:22px 17px}}@media (max-width:500px){.level-two-intro{text-align:center;flex-direction:column;margin-bottom:20px}.level-two-intro .harpi{width:155px;margin:-10px 0}.mode-grid{grid-template-columns:1fr}.mode-card{padding:22px}.mode-card p{font-size:13px}.second-level-entry h2{font-size:21px}.moving-note-track{padding:6px 2px 5px}.track-heading{padding:0 8px;font-size:10px}.track-heading strong{min-width:52px;font-size:10px}.track-legend{margin-top:-8px}}@media (prefers-reduced-motion:reduce){.hit-light{animation:none!important}}