/* FILE: mobile.css — touch controls, landscape, crosshair/toast/tutorial */
/* touch controls (touchui.js) */
.ww-touch{position:fixed;inset:0;pointer-events:none;z-index:19;font-family:system-ui,sans-serif;user-select:none;-webkit-user-select:none}
.ww-touch [hidden]{display:none!important}
.joy{position:fixed;left:calc(max(24px,env(safe-area-inset-left)) + 60px);bottom:calc(max(24px,env(safe-area-inset-bottom)) + 60px);width:120px;height:120px;border-radius:50%;border:2px solid rgba(255,255,255,.7);background:rgba(20,35,45,.35);box-sizing:border-box;opacity:.38;transform:translate(-50%,50%);transition:opacity .15s}
.joy.active{opacity:.9;transform:translate(-50%,-50%);transition:none}
.joy-knob{position:absolute;width:48px;height:48px;left:50%;top:50%;border-radius:50%;background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.8);box-sizing:border-box;transform:translate(-50%,-50%)}
.joy-label{position:absolute;left:50%;top:100%;transform:translate(-50%,6px);font-size:13px;font-weight:700;color:#fff;text-shadow:0 1px 2px #000;white-space:nowrap}
.joy.active .joy-label{display:none}
.ww-run{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:calc(max(24px,env(safe-area-inset-bottom)) + 0px);width:72px;height:72px;border-radius:50%;border:2px solid #f6ffe3;background:#e1ff9dcc;color:#203a24;font:800 15px system-ui,sans-serif;pointer-events:auto;touch-action:none;box-shadow:0 5px 0 #6b963f;opacity:.85}
.ww-run.on{background:#ffd166;transform:translateY(3px);box-shadow:0 2px 0 #6b963f;opacity:1}
.ww-lookhint{position:fixed;left:64%;top:58%;transform:translate(-50%,-50%);text-align:center;color:#fff;text-shadow:0 1px 3px #000;font-size:14px;font-weight:600;opacity:.85;transition:opacity .6s;width:40%}
.ww-lookhint.out{opacity:0}
.ww-lookhint-icon{display:block;font-size:44px;animation:ww-swipe 1.6s ease-in-out infinite}
@keyframes ww-swipe{0%,100%{transform:translateX(-28px)}50%{transform:translateX(28px)}}
.ww-pictos{display:flex;justify-content:center;gap:14px;margin-bottom:14px}
.ww-pictos div{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:13px;color:#c3d6d3}
.ww-pictos b{font-size:34px;line-height:1}
/* landscape / short screens */
@media(max-height:450px){
  .ww-stat{padding:5px 9px;font-size:11px}.ww-stat strong{font-size:16px}
  .ww-nav{padding:5px 12px}.ww-arrow{font-size:22px}
  .ww-screen{padding-top:16px;padding-right:max(76px,env(safe-area-inset-right))}
  .ww-card{padding:16px 20px}.ww-mark{display:none}.ww-card h1,.ww-card h2{margin-bottom:12px}
  .ww-quest-meaning{margin:10px 0;font-size:24px}.ww-quest-meaning small{font-size:15px}
  .ww-quest-field>span{margin:8px 0 4px}.ww-quest-action{margin-top:12px}
  .ww-bubble{bottom:auto;top:calc(max(12px,env(safe-area-inset-top)) + 100px);width:min(360px,50%)}
  .ww-lookhint{top:50%}
}
/* aim */
.ww-cross{position:fixed;left:50%;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;pointer-events:none;z-index:21;opacity:.75}
.ww-cross:before,.ww-cross:after{content:"";position:absolute;background:#fff;box-shadow:0 0 2px #000a}
.ww-cross:before{left:9px;top:0;width:4px;height:22px}
.ww-cross:after{top:9px;left:0;width:22px;height:4px}
.ww-cross.on{opacity:1}.ww-cross.on:before,.ww-cross.on:after{background:#d8ff96}
.ww-toast{position:fixed;left:50%;top:38%;transform:translateX(-50%);z-index:40;padding:10px 18px;border-radius:14px;background:#163127e8;color:#fff;font:600 16px system-ui,sans-serif;white-space:nowrap;pointer-events:none;box-shadow:0 3px 0 #071a1644}
.ww-tutor{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:24px;background:#0c191ea6;font-family:system-ui,sans-serif;color:#f5faf7;touch-action:manipulation}
.ww-tutor>div{width:min(440px,100%);padding:24px;border-radius:20px;background:#172e35;border:2px solid #71978a;font-size:19px;line-height:1.45;text-align:center;box-shadow:0 16px 60px #0006}
.ww-tutor small{display:block;margin-top:14px;font-size:14px;color:#c3d6d3}

/* mode cards, hearts, flash, docked quest panel */
.ww-modes-title{font-size:14px;color:#d3dfd4;margin:0 0 8px}
.ww-modes{display:flex;flex-direction:column;gap:8px;margin:0 0 16px}
.ww-mode{display:block;width:100%;text-align:left;padding:10px 14px;border-radius:12px;background:#ffffff12;color:#fff;border:2px solid #ffffff30!important;min-height:48px}
.ww-mode[aria-pressed="true"]{border-color:#d7f59b!important;background:#2a4a3a}
.ww-mode b{display:block;font-size:16px}.ww-mode small{display:block;font-size:12px;color:#c3d6d3}
.ww-mode i{font-style:normal;float:right;font-size:12px;color:#d7f59b}
.ww-hearts strong{color:#ff6b6b;letter-spacing:2px}
.ww-hearts.shake{animation:ww-shake .5s}
@keyframes ww-shake{0%,100%{transform:none}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.ww-flash{position:fixed;inset:0;z-index:35;pointer-events:none;opacity:.5;transition:opacity .35s}
.ww-flash.out{opacity:0}
#quest-root > .ww-quest.dock{align-items:flex-end;background:transparent;pointer-events:none;padding:8px;padding-bottom:max(8px,env(safe-area-inset-bottom))}
.ww-quest.dock .ww-quest-card{pointer-events:auto;max-height:46%;padding:10px 14px;width:min(100%,520px);background:#172e35f0}
.ww-quest.dock h2{font-size:14px}.ww-quest.dock .ww-quest-close{min-height:40px;padding:4px 10px}
.ww-quest.dock .ww-quest-meaning{font-size:20px;margin:4px 0}.ww-quest.dock .ww-quest-meaning small{display:inline;margin-left:8px}
.ww-quest.dock .ww-quest-field>span{margin:4px 0 2px}.ww-quest.dock .ww-quest-action,.ww-quest.dock .ww-quest-mic{margin-top:8px}
.ww-quest.dock .ww-quest-feedback{margin-top:8px}
.ww-quest.dock.kbd .ww-quest-card{max-height:100%}