:root{font-family:Tahoma,Arial,sans-serif;color:#193c47;background:#f3f0e8;font-synthesis:none;--teal: #247f79;--ink: #193c47;--paper: #fffdf7}*{box-sizing:border-box}body{margin:0}button{font-family:inherit;cursor:pointer}button:focus-visible,#stage:focus-visible{outline:3px solid #e6ac4f;outline-offset:2px}#app{height:100svh;min-height:360px;max-width:1600px;margin:auto;padding:clamp(12px,2vw,26px) clamp(14px,3vw,46px);display:flex;flex-direction:column;gap:12px}header{display:flex;justify-content:space-between;align-items:center;flex:none;direction:ltr}.identity{display:flex;align-items:center;gap:20px;direction:ltr}.identity b{font:900 23px Arial;letter-spacing:1px}.identity b span{font:9px Arial;letter-spacing:1px;border-left:1px solid #a6b8b0;margin-left:12px;padding-left:12px;vertical-align:middle}.campus{font-size:10px;color:#70817f;direction:rtl}#pause{border:1px solid #cbd4cb;background:transparent;border-radius:100px;padding:8px 17px;color:#34565e;font-size:12px;display:flex;align-items:center;gap:7px;direction:rtl}#pause:hover{background:#e7ece4}.game-title{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none}.eyebrow{font-size:10px;color:#678d86}h1{font-size:clamp(28px,3.2vw,45px);line-height:1.25;margin:3px 0 0;font-weight:900;letter-spacing:-1.5px}h1 em{font-style:normal;color:var(--teal)}.game-title p{font-size:12px;line-height:1.8;margin:0;text-align:left}.game-title p span{color:#81908b;font-size:10px}.game{flex:1;min-height:0;display:flex;flex-direction:column;border:1px solid #c6d1c7;border-radius:22px;overflow:hidden;background:#d8dfdc;box-shadow:0 16px 40px #284d4210}.hud{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;background:var(--paper);padding:11px 22px;gap:16px;flex:none}.score-card{display:flex;align-items:center;gap:12px;min-width:126px}.score-card>div{direction:ltr}.score-card strong{font:800 29px Arial;line-height:1}#goal{font:500 15px Arial;color:#92a29a;margin-right:4px;direction:ltr}.score-card small{display:block;font-size:9px;color:#78918b;margin-top:3px;direction:rtl}.coat-icon{border-radius:11px;background:#e2eedb;color:#548076;display:grid;place-items:center;width:37px;height:37px;font:23px Arial}.pop{animation:pop .3s ease}@keyframes pop{50%{transform:scale(1.09)}}.progress{width:clamp(80px,20vw,230px);text-align:center;font-size:10px;color:#6f8580}.progress-track{height:4px;border-radius:10px;background:#e3e7df;overflow:hidden;margin-bottom:7px}.progress-track i{display:block;height:100%;width:0;background:var(--teal);border-radius:inherit}.mistake-card{min-width:90px;text-align:left}#lives{display:flex;gap:5px;margin-bottom:5px;direction:ltr}#lives i{width:17px;height:7px;border-radius:10px;background:#e8b462;transition:background .2s,opacity .2s}#lives i.used{background:#d7dcd5;opacity:.65}.mistake-card small{font-size:9px;color:#81908b}#stage{position:relative;flex:1;min-height:0;overflow:hidden;background:#d8dfdc;touch-action:manipulation;-webkit-user-select:none;user-select:none}canvas{display:block;width:100%;height:100%;cursor:pointer}.location{position:absolute;top:18px;left:20px;direction:ltr;font:700 9px Arial;letter-spacing:1.5px;color:#355c60;pointer-events:none}.location i{display:inline-block;width:5px;height:5px;margin:0 5px 1px 0;border-radius:50%;background:#d9a44f}.location span{display:block;font-size:7px;font-weight:400;letter-spacing:1.8px;margin:5px 0 0 15px;color:#718985}#streak{position:absolute;top:16px;right:18px;background:#fff8e8;color:#9a671c;border:1px solid #e9c98f;border-radius:100px;padding:7px 12px;font-size:10px;opacity:0;transform:translateY(-5px);transition:opacity .2s,transform .2s;pointer-events:none}#streak.active{opacity:1;transform:translateY(0)}#streak b{font:800 14px Arial;margin-right:4px}#feedback{position:absolute;bottom:18px;left:50%;transform:translate(-50%);max-width:58%;padding:9px 15px;border-radius:100px;background:#fffffff0;color:#35565b;box-shadow:0 5px 18px #254b4714;font-size:10px;white-space:nowrap;pointer-events:none;transition:background .15s,color .15s}#feedback[data-tone=success]{background:#e3f2e8f2;color:#236c59}#feedback[data-tone=miss]{background:#f8e7def2;color:#9a4e3b}.input-hint{position:absolute;bottom:18px;left:20px;display:flex;align-items:center;gap:7px;font-size:8px;color:#58746f;direction:rtl;pointer-events:none}.key{border:1px solid #91a8a0;border-radius:4px;padding:4px 6px;font:7px Arial;direction:ltr}.throw-status{position:absolute;right:20px;bottom:18px;width:82px;font-size:8px;color:#4f716c;text-align:right;pointer-events:none}.throw-status>i{display:block;width:100%;height:2px;margin-top:6px;background:#aac0b9;overflow:hidden}#flightbar{display:block;height:100%;width:100%;background:var(--teal);transform-origin:right}#overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:grid;place-items:center;padding:14px;background:#163d4659;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:opacity .2s}#overlay.hidden{opacity:0;pointer-events:none}.modal{width:min(380px,calc(100% - 12px));padding:24px 27px 20px;border-radius:22px;background:#fffdf7;text-align:center;box-shadow:0 24px 70px #173c4733;animation:modal-in .28s ease}@keyframes modal-in{0%{opacity:0;transform:translateY(8px) scale(.98)}}.modal-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:#e2eedb;color:#548076;font:25px Arial;margin:0 auto 13px}.modal h2{margin:8px 0 10px;font-size:23px;line-height:1.5;letter-spacing:-.5px;overflow-wrap:break-word}.modal p{margin:0 0 17px;color:#71817e;font-size:11px;line-height:1.9}.modal button{width:100%;border:0;border-radius:11px;padding:12px 18px;background:var(--teal);color:#fff;font-weight:700;font-size:13px;display:flex;justify-content:center;gap:14px}.modal button:hover{background:#1d6d68}.modal button span{font-family:Arial}#modal-note{display:block;margin-top:13px;color:#98a29c;font-size:8px}footer{flex:none;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 20px;background:#f8f8f1;color:#748781;font-size:8px}footer>span:first-child{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.clothes-dot,.white-dot{display:inline-block;width:8px;height:11px;border-radius:2px;background:#418c98;border:1px solid #487d87}.white-dot{background:#fafbf4;border-color:#8b9b93;margin-right:5px}.ring-dot{display:inline-block;width:11px;height:7px;border:2px solid var(--teal);border-radius:50%;margin-right:5px}.disclaimer{font-size:7px;color:#8a9892}.mobile-coach{display:none}@media(min-width:361px)and (max-width:600px)and (min-height:700px){.game{max-height:570px}.mobile-coach{flex:1;min-height:88px;max-height:132px;display:grid;grid-template-columns:repeat(3,1fr);align-items:center;gap:7px;direction:rtl}.mobile-coach span{height:100%;min-height:76px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:9px 5px;border:1px solid #d7ded4;border-radius:14px;background:#faf8f1;color:#657d77;font-size:8px;text-align:center}.mobile-coach b{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#e2eedb;color:#34766d;font:700 12px Tahoma}}@media(max-width:600px){#app{padding:10px;gap:8px}.identity{gap:8px}.identity b{font-size:19px}.identity b span{font-size:7px;margin-left:7px;padding-left:7px}.campus{display:none}#pause{padding:7px 12px;font-size:10px}.game-title{gap:8px}h1{font-size:29px;letter-spacing:-1px;white-space:nowrap}.eyebrow{font-size:8px}.game-title p{max-width:140px;font-size:9px;line-height:1.65}.game-title p span{font-size:8px}.game{border-radius:18px}.hud{padding:9px 11px;gap:9px}.score-card{min-width:91px;gap:8px}.coat-icon{width:31px;height:31px;font-size:19px;border-radius:9px}.score-card strong{font-size:25px}#goal{font-size:12px}.score-card small,.mistake-card small{font-size:7px}.progress{flex:1;width:auto;font-size:8px}.mistake-card{min-width:65px}#lives i{width:13px;height:6px}.location{top:13px;left:13px;font-size:7px}.location span{font-size:6px}#streak{top:11px;right:11px;font-size:8px;padding:6px 9px}#feedback{bottom:17px;max-width:78%;padding:8px 11px;font-size:8px;white-space:normal;text-align:center}.input-hint{left:12px;bottom:12px;font-size:7px}.throw-status{right:12px;bottom:13px;width:66px;font-size:7px}footer{padding:7px 10px;gap:5px;font-size:7px}.disclaimer{max-width:85px;font-size:6px;text-align:left}.modal{padding:20px 20px 17px}.modal h2{font-size:21px}.modal p{font-size:10px}}@media(max-width:360px){#app{padding:8px;gap:6px}h1{font-size:26px}.game-title p{max-width:104px;font-size:8px}.game-title p span{font-size:7px}.modal{padding:16px}.modal-icon{margin-bottom:9px}.modal h2{font-size:19px;margin:6px 0 8px}.modal p{margin-bottom:12px;line-height:1.75}.input-hint span:not(.key){display:none}}@media(max-height:560px)and (min-width:600px){#app{padding:7px 12px;gap:0;min-height:300px}header{position:absolute;z-index:8;top:10px;left:18px;pointer-events:none}.identity,.game-title{display:none}#pause{pointer-events:auto;padding:5px 11px;background:#fffaf0}.hud{padding:6px 16px 6px 90px}.score-card strong{font-size:22px}.coat-icon{height:28px;width:28px}.game{border-radius:15px}.location{top:11px;left:14px}#streak{top:10px}.modal{padding:14px 22px;width:340px;border-radius:17px}.modal-icon{display:none}.modal h2{font-size:18px;margin:5px 0}.modal p{margin-bottom:9px;font-size:9px;line-height:1.6}.modal button{padding:8px}#modal-note{margin-top:8px;font-size:7px}footer{padding:5px 15px}#feedback,.input-hint,.throw-status{bottom:10px}}@media(hover:none){.key{display:none}}@media(prefers-reduced-motion:reduce){.pop,.modal,#streak{animation:none;transition:none}}.round-note{display:block;color:#458078;font-size:10px;margin-bottom:5px}.mistake-card small{display:block}#missed{direction:rtl}#app{height:100vh;height:100svh;padding-top:max(10px,env(safe-area-inset-top));padding-bottom:max(10px,env(safe-area-inset-bottom));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}canvas{touch-action:none;-webkit-tap-highlight-color:transparent}button{min-height:44px;min-width:44px}.header-actions{display:flex;align-items:center;gap:8px}#device-check{border:1px solid #cbd4cb;background:transparent;color:#34565e;border-radius:100px;padding:7px 12px;font-size:10px}#device-dialog{width:min(380px,calc(100% - 32px));border:1px solid #ced8ce;border-radius:18px;background:#fffdf7;color:#193c47;padding:24px;font-family:inherit;box-shadow:0 20px 80px #173c4733}#device-dialog::backdrop{background:#173c4780}#device-dialog h2{font-size:20px;margin:0 0 14px}#device-dialog p,#device-dialog li{font-size:12px;line-height:1.9}#device-details{padding-right:18px}.device-note{color:#748781;font-size:10px!important}#device-close{border:0;border-radius:10px;background:#247f79;color:#fff;width:100%}.unsupported{max-width:420px;margin:30px auto;padding:22px;text-align:center;font-size:13px;line-height:1.9}button:disabled{opacity:.55;cursor:wait}@media(max-width:360px){.header-actions{gap:4px}#device-check{font-size:8px;padding:6px}.identity b{font-size:17px}.identity b span{display:none}}@media(max-height:560px)and (min-width:600px){header{pointer-events:none}.header-actions{pointer-events:auto}#device-check{font-size:9px}#app{padding-top:7px;padding-bottom:7px}.hud{padding-left:185px}}#device-dialog[open]{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;max-height:calc(100vh - 32px);overflow:auto}@media(max-width:600px){.input-hint{display:none}#feedback{left:42%;max-width:65%;bottom:16px}}[hidden]{display:none!important}#welcome{min-height:100svh;display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:radial-gradient(ellipse at 15% 15%,#dbe9e9 0,transparent 52%),radial-gradient(ellipse at 85% 90%,#e2e9d7 0,transparent 55%),#f3f0e8}.welcome-card{width:min(100%,510px);text-align:center}.welcome-logo{display:block;width:clamp(112px,21vh,180px);height:auto;margin:0 auto 16px;border-radius:22px;box-shadow:0 8px 30px #153d4b0d}.welcome-kicker{font-size:12px;color:#67817e}#welcome h1{margin:14px 0;font-size:clamp(30px,5vw,44px);line-height:1.35;letter-spacing:-.8px}#welcome h1 em{color:#247f79}.welcome-about{max-width:450px;margin:0 auto 20px;color:#4c676b;font-size:14px;line-height:1.95}.welcome-mission{padding:16px 20px;border:1px solid #cbd9d1;background:#fffdf7a8;border-radius:18px}.welcome-mission strong{font-size:18px}.welcome-mission p{margin:8px 0 0;font-size:13px;line-height:1.9;color:#58716f}#welcome-start{width:100%;min-height:54px;margin-top:20px;border:0;border-radius:14px;background:#247f79;color:#fff;font-size:17px;font-weight:700;box-shadow:0 8px 20px #247f7920}#welcome-start:hover:not(:disabled){background:#1d6d68}#welcome-status{margin:10px 0;min-height:18px;font-size:11px;color:#67817e}.welcome-challenge{font-size:11px;color:#728580;line-height:1.7}@media(max-width:360px),(max-height:680px){#welcome{padding-top:18px;padding-bottom:18px}.welcome-logo{width:100px;margin-bottom:10px}#welcome h1{font-size:29px;margin:10px 0}.welcome-about{font-size:12px;margin-bottom:12px}.welcome-mission{padding:12px 15px}.welcome-mission p{font-size:12px}#welcome-start{margin-top:14px}}#music-toggle{display:flex;align-items:center;gap:6px;border:1px solid #cbd4cb;background:transparent;color:#34565e;border-radius:100px;padding:7px 12px;font-size:11px}#music-toggle[data-muted=true]{color:#788883}@media(max-width:360px){#music-toggle{padding:6px 9px;font-size:9px}}#welcome-form{margin-top:18px;text-align:right}#welcome-form label{display:block;font-size:13px;font-weight:700;margin-bottom:9px}#player-name{width:100%;min-height:48px;padding:11px 14px;border:1px solid #a7bfba;border-radius:12px;font:15px Tahoma,Arial,sans-serif;color:#193c47;background:#fffdf7}#player-name:focus{outline:3px solid #c5deda;border-color:#247f79}#name-note{display:block;margin-top:7px;color:#728580;font-size:10px;line-height:1.7}#name-error{font-size:12px;color:#a04431;margin:8px 0}#welcome-form #welcome-start{margin-top:12px}#player-year{width:100%;min-height:48px;padding:11px 14px;border:1px solid #a7bfba;border-radius:12px;font:14px Tahoma,Arial,sans-serif;color:#193c47;background:#fffdf7}#player-year:focus{outline:3px solid #c5deda}#welcome-form .year-label{margin-top:13px}
