/* FILE: game.css — styles for ui.js, quest.js, choices.js, settings.js, aim.js */
.ww-ui{position:fixed;inset:0;pointer-events:none;z-index:20;font-family:system-ui,sans-serif;color:#fff}
.ww-ui *{box-sizing:border-box}
.ww-ui [hidden]{display:none!important}
.ww-ui button,.ww-ui a{touch-action:manipulation;pointer-events:auto}
.ww-ui button{font:inherit;cursor:pointer;border:0}
.ww-ui button:focus-visible,.ww-ui a:focus-visible{outline:3px solid #fff;outline-offset:4px}
.ww-mute{position:absolute;right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));width:48px;height:48px;border-radius:14px;background:#163127e8;color:#fff;font-size:24px!important;box-shadow:0 4px 0 #071a16;z-index:5}
.ww-hud{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:76px;display:flex;gap:6px;flex-wrap:wrap;align-items:flex-start}
.ww-stat{padding:8px 11px;background:#163127db;border:1px solid #ffffff24;border-radius:12px;box-shadow:0 3px 0 #071a1644;font-size:12px}
.ww-stat strong{display:block;font-size:20px;line-height:1.2;font-variant-numeric:tabular-nums}
.ww-navrow{flex-basis:100%;display:flex;justify-content:center;margin-top:4px}
.ww-nav{display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:24px;background:#163127db;box-shadow:0 3px 0 #071a1644}
.ww-arrow{display:block;font-size:29px;line-height:1;color:#d8ff96;transform-origin:center}
.ww-distance{font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.ww-open{position:absolute;bottom:calc(max(20px,env(safe-area-inset-bottom)) + 16px);left:50%;transform:translateX(-50%);width:70px;height:70px;border-radius:20px;background:#e1ff9d;color:#203a24;font-weight:900!important;font-size:36px!important;box-shadow:0 6px 0 #6b963f,0 10px 25px #0004;border:2px solid #f6ffe3!important}
.ww-open:active{transform:translate(-50%,4px);box-shadow:0 2px 0 #6b963f}
.ww-bubble{position:absolute;left:50%;bottom:calc(max(16px,env(safe-area-inset-bottom)) + 164px);transform:translateX(-50%);width:min(430px,calc(100% - 32px));background:#fff9e9;color:#25382d;border-radius:18px;padding:14px 18px;box-shadow:0 5px 0 #0002;font-size:15px;line-height:1.45}
.ww-bubble:after{content:"";position:absolute;bottom:-10px;left:30px;border-top:11px solid #fff9e9;border-right:12px solid transparent}
.ww-bubble strong{display:block;color:#658343;font-size:12px;margin-bottom:4px}
.ww-screen{position:absolute;inset:0;pointer-events:auto;display:flex;align-items:flex-start;justify-content:center;padding:76px max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:linear-gradient(#112d3180,#132e25d9);overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
.ww-card{width:min(440px,100%);margin:auto;text-align:center;padding:28px 24px;background:#183d32f5;border:2px solid #b3d68e66;border-radius:24px;box-shadow:0 8px 0 #0a211b,0 18px 55px #0004}
.ww-mark{font-size:46px;line-height:1;margin-bottom:14px;color:#d7ff99;text-shadow:4px 4px #658343}
.ww-card h1,.ww-card h2{font-size:clamp(25px,7vw,36px);line-height:1.15;margin:0 0 22px;color:#f3ffdb}
.ww-level{margin:-12px 0 18px;font-size:16px;color:#d7f59b;font-weight:700}
.ww-primary{display:block;width:100%;padding:16px 12px;background:#d7f59b;color:#263d23;border-radius:13px;font-weight:750!important;font-size:18px!important;box-shadow:0 5px 0 #73984a}
.ww-primary:active{transform:translateY(3px);box-shadow:0 2px 0 #73984a}
.ww-secondary{display:block;width:100%;margin-top:12px;padding:12px;background:#ffffff14;color:#fff;border:1px solid #ffffff30!important;border-radius:13px;font-weight:700}
.ww-languages{display:flex;justify-content:center;gap:8px;margin:24px 0 20px}
.ww-languages button{min-height:48px;min-width:56px;padding:10px 18px;border-radius:10px;background:#ffffff12;color:#fff;border:1px solid #ffffff30;font-weight:700}
.ww-languages button[aria-pressed="true"]{background:#d7f59b;color:#263d23;border-color:#d7f59b}
.ww-hint{margin:12px 0 0;color:#d3dfd4;font-size:14px;line-height:1.5}
.ww-result-line{font-size:19px;margin:0 0 18px;color:#e3f4da}
.ww-result-score{font-size:48px;font-weight:850;line-height:1.1;color:#d7f59b;font-variant-numeric:tabular-nums}
.ww-result-label{font-size:14px;color:#d3dfd4;margin:5px 0 16px}
.ww-best{margin:0 0 24px;font-size:14px;color:#d3dfd4}
.ww-result-msg{margin:0 0 18px;font-size:17px;font-weight:700;color:#ffe9a3}
.ww-result-msg:empty{display:none}
.ww-link{display:inline-block;color:#e3f4da;margin-top:24px;padding:6px;font-size:14px;text-underline-offset:4px}
@media(max-height:560px){.ww-card{padding:20px}.ww-mark{display:none}.ww-card h1,.ww-card h2{margin-bottom:16px}.ww-languages{margin:16px 0}.ww-bubble{font-size:13px;padding:10px 14px}}

/* settings */
.ww-setscreen{background:#132e25f5}
.ww-set{text-align:left}
.ww-set h3{font-size:15px;margin:18px 0 8px;color:#d3dfd4}
.ww-grid{display:flex;flex-wrap:wrap;gap:8px}
.ww-grid button{min-width:48px;min-height:48px;padding:8px 12px;border-radius:12px;background:#ffffff12;color:#fff;border:1px solid #ffffff30;font-weight:700}
.ww-grid button[aria-pressed="true"]{background:#d7f59b;color:#263d23;border-color:#d7f59b}
.ww-grid button:disabled{opacity:.45;cursor:default}
.ww-chips button{font-weight:600;font-size:14px;text-align:left}

/* quest overlay */
.ww-quest[hidden]{display:none!important}
.ww-quest{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:16px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));background:rgba(12,25,30,.65);box-sizing:border-box;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
.ww-quest *{box-sizing:border-box}
.ww-quest-card{width:min(100%,440px);max-height:100%;overflow:auto;background:#172e35;color:#f5faf7;border:2px solid #71978a;border-radius:20px;padding:22px;font-family:system-ui,sans-serif;box-shadow:0 16px 60px #0006;touch-action:pan-y}
.ww-quest-head{display:flex;align-items:center;gap:12px}
.ww-quest h2{font-size:20px;margin:0;flex:1}
.ww-quest button{font:inherit;cursor:pointer;touch-action:manipulation;border:0;border-radius:12px;min-height:48px}
.ww-quest-close{background:#ffffff12;color:#fff;padding:8px 12px}
.ww-quest-meaning{font-size:30px;font-weight:750;margin:20px 0;overflow-wrap:anywhere;line-height:1.2;color:#d8f5b5}
.ww-quest-meaning small{display:block;font-size:17px;font-weight:600;color:#c3d6d3;margin-top:4px}
.ww-quest label,.ww-quest-field>span{display:block;font-size:13px;color:#c3d6d3;margin:12px 0 6px}
.ww-quest input{display:block;width:100%;min-height:48px;padding:10px 12px;font:18px system-ui,sans-serif;border:2px solid #58787b;border-radius:10px;background:#0d2028;color:#fff;outline:none;touch-action:manipulation}
.ww-quest input:focus{border-color:#b6e986;box-shadow:0 0 0 2px #b6e98633}
.ww-quest input.ok,.ww-word.ok{border-color:#92df9a;background:#173c2d}
.ww-quest input.bad,.ww-word.bad{border-color:#ff9393;background:#48282e}
.ww-quest input:disabled{opacity:1;-webkit-text-fill-color:#fff}
.ww-quest-feedback{margin-top:16px;line-height:1.5;overflow-wrap:anywhere}
.ww-quest-feedback:empty{display:none}
.ww-quest-forms{font-weight:700;color:#f5faf7;margin-top:6px}
.ww-quest-later{color:#c3d6d3;margin-top:8px}
.ww-quest-action{width:100%;margin-top:20px;padding:12px;background:#c0ec89;color:#173224;font-weight:750!important}
.ww-quest-action:disabled{opacity:.5;cursor:default}
.ww-quest-mic{width:100%;margin-top:14px;padding:10px;background:#ffffff14;color:#fff;border:1px solid #ffffff30!important}
.ww-quest-mic-status{margin-top:8px;font-size:14px;color:#c3d6d3;min-height:1.2em}
.ww-quest button:focus-visible{outline:3px solid #f8dc82;outline-offset:3px}
/* soft keyboard open (short visual viewport): compact card, question + inputs + check stay visible */
.ww-quest.kbd .ww-quest-head,.ww-quest.kbd .ww-quest-mic,.ww-quest.kbd .ww-quest-mic-status{display:none}
.ww-quest.kbd{padding:8px}.ww-quest.kbd .ww-quest-card{padding:10px 14px}
.ww-quest.kbd .ww-quest-meaning{font-size:20px;margin:4px 0}.ww-quest.kbd .ww-quest-meaning small{display:inline;margin-left:8px}
.ww-quest.kbd .ww-quest-field>span{margin:6px 0 2px}.ww-quest.kbd .ww-quest-action{margin-top:10px}
.ww-timer{height:8px;border-radius:4px;background:#ffffff1a;margin-top:12px;overflow:hidden}
.ww-timer i{display:block;height:100%;background:#d7f59b;transition:width .25s linear}
/* choices + tiles */
.ww-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-height:450px){.ww-opts{grid-template-columns:1fr 1fr 1fr 1fr}}
.ww-opts button{min-height:48px;padding:8px 10px;background:#ffffff12;color:#fff;border:2px solid #58787b!important;font-size:17px;font-weight:600;overflow-wrap:anywhere}
.ww-opts button[aria-pressed="true"]{background:#2a4a5a;border-color:#b6e986!important}
.ww-opts button.ok{background:#173c2d;border-color:#92df9a!important}
.ww-opts button.bad{background:#48282e;border-color:#ff9393!important}
.ww-word{min-height:48px;padding:10px 12px;border:2px solid #58787b;border-radius:10px;background:#0d2028;font-size:20px;letter-spacing:2px;font-weight:700}
.ww-tiles{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ww-tiles button{min-width:48px;min-height:48px;padding:0 10px;background:#e1ff9d;color:#203a24;font-size:20px;font-weight:800;box-shadow:0 3px 0 #6b963f}
.ww-tiles button:disabled{opacity:.25;box-shadow:none}
.ww-tiles .ww-tool{background:#ffffff14;color:#fff;font-size:15px;font-weight:600;box-shadow:none;border:1px solid #ffffff30!important}
@media(max-height:600px){.ww-quest-card{padding:16px}.ww-quest-meaning{margin:12px 0;font-size:26px}.ww-quest label{margin-top:8px}}