#map-wrap{position:relative;width:100%;height:480px;background:#c8dff5;border-radius:8px;overflow:hidden;cursor:crosshair;user-select:none;touch-action:none}#map-svg-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;transform-origin:center center;will-change:transform}#map-svg-container svg{width:100%;height:100%}.state-path{fill:#d6c9a0;stroke:#4a3820;stroke-width:.6;cursor:pointer;transition:fill .15s}.state-path:hover{fill:#c8b880}.state-path.flash-wrong{fill:#e57373!important;transition:fill 0s}.state-path.flash-correct{fill:#66bb6a!important;transition:fill 0s}.state-path.reveal-state{fill:#ffa726!important;transition:fill 0s}#map-sheep{position:absolute;font-size:28px;line-height:1;pointer-events:none;user-select:none;z-index:10;transform:translate(-50%,-50%);transition:left .6s cubic-bezier(.25,.46,.45,.94),top .6s cubic-bezier(.25,.46,.45,.94);filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));will-change:left,top}#map-sheep.celebrating{animation:sheep-celebrate .6s ease-out}#map-sheep.retreating{transition:left .4s ease-in,top .4s ease-in}@keyframes sheep-celebrate{0%{transform:translate(-50%,-50%) scale(1)}25%{transform:translate(-50%,-70%) scale(1.3)}55%{transform:translate(-50%,-40%) scale(1.1)}75%{transform:translate(-50%,-65%) scale(1.2)}to{transform:translate(-50%,-50%) scale(1)}}#sign-wrap{text-align:center;margin-bottom:10px;min-height:72px;display:flex;align-items:center;justify-content:center}#state-sign{display:inline-block;background:#8b6f47;color:#fff;border:4px solid #5c3d1a;border-radius:6px;padding:10px 24px;font-size:22px;font-weight:700;letter-spacing:.03em;box-shadow:0 4px 12px #00000040,inset 0 1px #ffffff26;position:relative;text-shadow:0 1px 2px rgba(0,0,0,.4)}#state-sign:before,#state-sign:after{content:"";position:absolute;top:-12px;width:6px;height:12px;background:#5c3d1a;border-radius:2px 2px 0 0}#state-sign:before{left:20%}#state-sign:after{right:20%}#state-sign.sign-arrive{animation:sign-arrive .55s cubic-bezier(.34,1.56,.64,1) forwards}#state-sign.sign-leave{animation:sign-leave .35s ease-in forwards}@keyframes sign-arrive{0%{transform:translate(110vw) rotate(4deg);opacity:0}70%{transform:translate(-8px) rotate(-1deg);opacity:1}to{transform:translate(0) rotate(0);opacity:1}}@keyframes sign-leave{0%{transform:translate(0);opacity:1}to{transform:translate(-110vw);opacity:0}}#timer-bar-wrap{background:#e0d8c8;border-radius:6px;height:10px;margin-bottom:10px;overflow:hidden;position:relative}#timer-bar{height:100%;width:100%;border-radius:6px;background:linear-gradient(to right,#43a047,#fdd835,#e53935);transform-origin:left center;transition:transform .1s linear}#timer-bar.urgent{animation:timer-pulse .5s ease-in-out infinite alternate}@keyframes timer-pulse{0%{filter:brightness(1)}to{filter:brightness(1.3)}}#timer-label{font-size:12px;color:var(--text-secondary);text-align:right;margin-bottom:4px}#round-display{display:flex;gap:4px;justify-content:center;margin-bottom:10px}.round-pip{width:10px;height:10px;border-radius:50%;background:#d0c8b4;transition:background .2s}.round-pip.done{background:#66bb6a}.round-pip.current{background:#ffa726}.round-pip.missed{background:#ef5350}.map-score-pop{position:absolute;z-index:20;font-weight:700;font-size:20px;color:#2e7d32;text-shadow:0 1px 3px rgba(0,0,0,.2);pointer-events:none;transform:translate(-50%,-50%);animation:map-score-float 1.1s ease-out forwards}.map-score-pop.zero{color:#c62828;font-size:15px}@keyframes map-score-float{0%{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,calc(-50% - 60px))}}#reset-zoom{position:absolute;bottom:8px;right:8px;background:#ffffffd9;border:1px solid rgba(0,0,0,.15);border-radius:6px;padding:5px 10px;font-size:13px;cursor:pointer;z-index:15;color:#4a4a48;backdrop-filter:blur(2px);transition:background .15s}#reset-zoom:hover{background:#fff}#feedback-toast{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000b3;color:#fff;padding:8px 18px;border-radius:8px;font-size:15px;font-weight:600;pointer-events:none;z-index:25;opacity:0;transition:opacity .2s;white-space:nowrap}#feedback-toast.visible{opacity:1}#result-overlay{position:absolute;inset:0;background:#f5f1e8f5;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:30;gap:12px;opacity:0;pointer-events:none;transition:opacity .4s}#result-overlay.visible{opacity:1;pointer-events:all}#result-score-big{font-size:56px;font-weight:700;color:#2c2c2a;line-height:1}#result-label{font-size:18px;color:#6b6961}#result-correct{font-size:14px;color:#4a9e6b;font-weight:600}#compass{position:absolute;top:8px;left:10px;font-size:22px;pointer-events:none;opacity:.35;user-select:none;z-index:5}.state-correct-label{font-size:13px;color:#6b6961;text-align:center;min-height:20px}.mode-popup-inner{display:flex;flex-direction:column;align-items:center;width:100%}#mode-popup-title{font-size:20px;font-weight:700;margin-bottom:4px;flex:none}#mode-popup-sub{font-size:13px;color:var(--text-secondary);margin-bottom:20px}.mode-popup-score{display:flex;flex-direction:column;align-items:center;gap:2px;margin-bottom:16px;padding-bottom:16px;border-bottom:.5px solid var(--border);width:100%}#mode-popup-score-val{font-size:42px;font-weight:700;line-height:1}#mode-popup-score-sub{font-size:13px;color:var(--text-secondary)}.mode-btn-row{display:flex;gap:10px;width:100%;margin-bottom:14px}.name-entry{display:flex;gap:8px;width:100%;align-items:center}.name-input{flex:1;padding:9px 12px;border:1.5px solid var(--border);border-radius:8px;font-family:inherit;font-size:15px;font-weight:700;letter-spacing:2px;text-transform:uppercase;background:var(--bg-soft)}.name-input:focus{outline:none;border-color:var(--info)}.card-btn{padding:10px 18px;background:#2563eb;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap;transition:background .15s}.card-btn:hover{background:#1d4ed8}@media(max-width:480px){#map-wrap{height:360px}#state-sign{font-size:18px;padding:8px 18px}#map-sheep{font-size:22px}}