.nt{--nt-ink:#2b2118;--nt-muted:#6d5a48;--nt-mark:#1d7566;--nt-alert:#a8452f;--play-ink:var(--nt-ink);--play-icon-bg:#fffaf2d6;border-radius:var(--radius-xl);isolation:isolate;-webkit-tap-highlight-color:transparent;background:#efe5d3;border:1px solid #e2d6c4;position:relative;overflow:hidden}.nt-stage{aspect-ratio:8/5;outline:none;width:100%;position:relative}.nt-poster,.nt-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.nt-canvas{opacity:0}.nt[data-ready=true] .nt-canvas{opacity:1}.nt[data-ready=true] .nt-poster{visibility:hidden}.nt:not([data-play-mode]) .nt-stage{cursor:pointer}.nt:not([data-play-mode]) :is(.nt-status,.nt-feedback,.nt-hint,.nt-result){display:none}.nt-entry{padding:var(--space-3) var(--space-4) var(--space-5);justify-items:center;display:grid}.nt[data-play-mode=on] .nt-entry{display:none}.nt-level{margin:0 0 var(--space-3);border:0;flex-wrap:wrap;justify-content:center;gap:6px;min-inline-size:0;padding:0;display:flex}.nt-level legend{text-align:center;width:100%;color:var(--nt-muted);margin-bottom:4px;padding:0;font-size:.85rem;font-weight:700}.nt-level label{position:relative}.nt-level input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.nt-level span{text-align:center;min-width:5.2em;min-height:44px;color:var(--nt-ink);background:#fff;border:2px solid #d8ccba;border-radius:999px;padding:10px 14px;font-weight:800;line-height:1.2;display:block}.nt-level input:checked+span{border-color:var(--nt-mark);background:var(--nt-mark);color:#fff}.nt-level input:focus-visible+span{outline:3px solid var(--nt-ink);outline-offset:2px}.nt-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.nt-cta{min-width:160px;min-height:60px;padding-inline:var(--space-6);border-radius:var(--radius-full);background:var(--color-primary);color:var(--on-primary);font:inherit;letter-spacing:.02em;cursor:pointer;touch-action:manipulation;box-shadow:0 5px 0 var(--color-primary-strong);border:0;font-size:1.25rem;font-weight:800;transition:translate 60ms,box-shadow 60ms}.nt-cta:active{box-shadow:0 2px 0 var(--color-primary-strong);translate:0 3px}.nt-slots{gap:6px;margin:0;padding:0;list-style:none;display:flex}.nt-slots li{color:#fff;border:2px solid #c4b39b;border-radius:50%;place-items:center;width:22px;height:22px;font-size:.8rem;font-weight:800;line-height:1;display:grid}.nt-slots li[data-slot=current]{border-color:var(--nt-ink)}.nt-slots li[data-slot=success]{background:var(--nt-mark);border-color:var(--nt-mark)}.nt-slots li[data-slot=success]:before{content:"✓"}.nt-slots li[data-slot=miss]{background:#8d7e6c;border-color:#8d7e6c}.nt-slots li[data-slot=miss]:before{content:"✕"}.nt-slots li[data-slot=caught]{background:var(--nt-alert);border-color:var(--nt-alert)}.nt-slots li[data-slot=caught]:before{content:"!"}.nt[data-play-mode=on]{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border:0;border-radius:0;animation:.3s ease-out nt-fade}@keyframes nt-fade{0%{opacity:0}to{opacity:1}}.nt[data-play-mode=on] .nt-stage{aspect-ratio:auto;touch-action:none;position:absolute;inset:0}.nt[data-play-mode=on] .nt-stage:focus-visible{box-shadow:inset 0 0 0 4px var(--color-focus)}.nt[data-play-mode=on] .nt-poster{display:none}.nt[data-play-mode=on] .play-bar{padding:calc(env(safe-area-inset-top) + var(--space-2)) calc(env(safe-area-inset-right) + var(--space-3)) var(--space-2) calc(env(safe-area-inset-left) + var(--space-3));z-index:2;pointer-events:none;position:absolute;inset:0 0 auto}.nt[data-play-mode=on] .play-bar button{pointer-events:auto}.nt[data-play-mode=on] .nt-status{z-index:2;top:calc(env(safe-area-inset-top) + var(--space-2));align-items:center;gap:var(--space-3);min-height:var(--tap-min);padding:0 var(--space-4);border-radius:var(--radius-full);color:var(--nt-ink);white-space:nowrap;pointer-events:none;background:#fffaf2e6;font-weight:800;display:flex;position:absolute;left:50%;translate:-50%;box-shadow:0 2px 10px #3c28141f}@media (width<=400px){.nt[data-play-mode=on] .nt-status{gap:var(--space-2);padding:0 var(--space-3)}.nt[data-play-mode=on] .nt-status [data-count]{display:none}.nt[data-play-mode=on] .nt-status .nt-slots{gap:4px}.nt[data-play-mode=on] .nt-status .nt-slots li{width:18px;height:18px;font-size:.7rem}}.nt-feedback{display:none}.nt[data-play-mode=on] .nt-feedback:not(:empty){z-index:2;padding:var(--space-2) var(--space-5);border-radius:var(--radius-full);color:var(--nt-ink);white-space:nowrap;pointer-events:none;background:#fffbf5f2;margin:0;font-size:1.5rem;font-weight:800;animation:.25s cubic-bezier(.2,.9,.3,1.2) nt-pop;display:block;position:absolute;top:42%;left:50%;translate:-50% -50%;box-shadow:0 6px 20px #3c28142e}.nt[data-last=success] .nt-feedback{color:var(--nt-mark)}.nt[data-last=caught] .nt-feedback{color:var(--nt-alert)}@keyframes nt-pop{0%{opacity:0;scale:.85}to{opacity:1;scale:1}}.nt[data-play-mode=on] .nt-hint:not([hidden]){z-index:2;bottom:calc(env(safe-area-inset-bottom) + var(--space-3));padding:6px var(--space-4);border-radius:var(--radius-full);color:var(--nt-ink);text-align:center;white-space:nowrap;pointer-events:none;background:#fffaf2e0;justify-items:center;gap:2px;margin:0;font-size:.95rem;font-weight:800;display:grid;position:absolute;left:50%;translate:-50%;box-shadow:0 2px 10px #3c281424}.nt-hint__keys{color:var(--nt-muted);font-size:.8rem;font-weight:700}.nt-redo{display:none}.nt[data-play-mode=on] .nt-redo:not([hidden]){z-index:2;left:calc(env(safe-area-inset-left) + var(--space-3));bottom:calc(env(safe-area-inset-bottom) + var(--space-3) + 72px);min-height:44px;padding:0 var(--space-4);border:2px solid var(--nt-ink);border-radius:var(--radius-full);color:var(--nt-ink);font:inherit;cursor:pointer;background:#fffaf2f0;align-items:center;font-size:.9rem;font-weight:800;display:inline-flex;position:absolute}.nt-redo:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}@media (hover:none),(pointer:coarse){.nt-hint__keys{display:none}}.nt[data-play-mode=on] .nt-result:not([hidden]){z-index:3;justify-items:center;gap:var(--space-2);width:min(calc(100% - 2 * var(--space-4)), 340px);padding:var(--space-4) var(--space-5) var(--space-5);border-radius:var(--radius-lg);text-align:center;background:#fffbf5f5;animation:.32s cubic-bezier(.2,.8,.3,1) nt-rise;display:grid;position:absolute;top:50%;left:50%;translate:-50% -50%;box-shadow:0 12px 34px #3c281438}@keyframes nt-rise{0%{opacity:0;translate:-50% calc(14px - 50%)}to{opacity:1;translate:-50% -50%}}.nt-result p{margin:0}.nt-result__badge{padding:2px var(--space-4);border-radius:var(--radius-full);color:var(--nt-mark);letter-spacing:.04em;background:#e2f2ee;font-weight:800}.nt-result__title{color:var(--nt-ink);font-size:1.6rem;font-weight:800}.nt-slots--result li{width:30px;height:30px;font-size:1rem}.nt-result__time{color:var(--nt-muted);font-weight:700;margin-bottom:var(--space-2)!important}.nt-result__time strong{color:var(--nt-ink);font-variant-numeric:tabular-nums;font-size:1.3rem}@media (orientation:landscape) and (height<=520px){.nt[data-play-mode=on] .nt-status{left:calc(env(safe-area-inset-left) + 72px);translate:0}.nt[data-play-mode=on] .nt-hint:not([hidden]){left:auto;right:calc(env(safe-area-inset-right) + var(--space-3));font-size:.85rem;translate:0}.nt-cta{min-height:52px;font-size:1.1rem}}@media (width<=520px){.nt:not([data-play-mode]) .nt-stage{aspect-ratio:4/3}}