.practice{max-width:720px;min-height:100dvh;padding:14px var(--gutter) calc(150px + env(safe-area-inset-bottom));align-content:start;gap:16px;margin:0 auto;display:grid;position:relative}.pr-top{align-items:center;gap:10px;display:flex}.pr-top .pr-bar{flex:1}.pr-close{width:44px;height:44px;color:var(--ink-3);border-radius:14px;place-items:center;display:grid}.pr-close:hover{background:var(--mint);color:var(--ink)}.pr-bar{background:var(--tile-edge);border-radius:999px;height:16px;overflow:hidden}.pr-bar span{background:var(--leaf);min-width:16px;height:100%;transition:width .42s var(--bounce);border-radius:999px;display:block;box-shadow:inset 0 4px #ffffff59}.pr-ask{grid-template-columns:auto 1fr;align-items:end;gap:8px;display:grid}.pr-mascot{transition:transform .3s var(--bounce)}.pr-ask[data-mood=happy] .pr-mascot,.pr-ask[data-mood=cheer] .pr-mascot{animation:pr-hop .6s var(--bounce)}.pr-ask[data-mood=think] .pr-mascot{transform:rotate(-4deg)}@keyframes pr-hop{40%{transform:translateY(-14px)rotate(4deg)}}.pr-bubble{border:3px solid var(--line);background:var(--paper);border-radius:20px;gap:8px;margin-bottom:10px;padding:14px 16px;display:grid;position:relative}.pr-bubble:before{content:"";border-left:3px solid var(--line);border-bottom:3px solid var(--line);background:var(--paper);width:16px;height:16px;position:absolute;bottom:18px;left:-11px;transform:rotate(45deg)}.pr-intro{color:var(--ink-2);font-size:16px}.pr-task{font-family:var(--font-display);font-size:clamp(20px,3.6vw,24px);font-weight:600;line-height:1.25}.pr-note{background:var(--sun-wash);color:var(--sun-ink);border-radius:16px;align-items:flex-start;gap:10px;padding:12px 14px;font-weight:700;display:flex}.pr-note svg{color:var(--sun);flex:none;margin-top:2px}.pr-actions{padding:14px var(--gutter) calc(16px + env(safe-area-inset-bottom));border-top:3px solid var(--line);background:var(--paper);transition:background-color .2s var(--ease), border-color .2s var(--ease);gap:12px;display:grid;position:fixed;bottom:0;left:0;right:0}.pr-actions>*{width:100%;max-width:684px;margin:0 auto}.pr-actions[data-verdict=correct]{border-color:var(--mint-edge);background:var(--mint)}.pr-actions[data-verdict=wrong]{background:var(--rose-wash);border-color:#f6c6cf}.pr-actions[data-nudge]{background:var(--sun-wash);border-color:#f3dfa3}.pr-feedback{gap:4px;display:grid}.pr-feedback:empty{display:none}.pr-message{font-family:var(--font-display);font-size:19px;font-weight:700}.pr-actions[data-verdict=correct] .pr-message{color:var(--leaf-deep)}.pr-actions[data-verdict=wrong] .pr-message{color:var(--rose-edge);font-family:var(--font-ui);font-size:17px}.pr-actions[data-nudge] .pr-message{color:var(--sun-ink)}.pr-xp{color:var(--leaf-deep);font-family:var(--font-display);font-weight:600}.pr-solution{color:var(--ink-2)}.pr-solution code{background:var(--paper);color:var(--leaf-deep);font-family:var(--font-mono);border-radius:8px;padding:2px 8px;font-size:14px}.pr-buttons{gap:10px;display:flex}.pr-buttons .btn-quiet{width:58px;padding:0}.pr-main{flex:1}.practice .celebrate{position:fixed;top:42%}.pr-lesson{font-family:var(--font-display);color:var(--ink);flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:-2px;font-size:17px;font-weight:700;display:flex}.pr-lesson span{color:var(--leaf-edge);font-size:14px;font-weight:600}.pr-ex{gap:16px;display:grid}.pr-menu{cursor:pointer;background:0 0;border:0}.pr-mascot{view-transition-name:pr-mascot}.pr-actions{view-transition-name:pr-actions}.pr-top{view-transition-name:pr-top}.pr-top .pr-close{flex:none}