*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Tahoma,Arial,sans-serif;background:#091a22;color:#edf8fa}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #ffffff26;background:#102c38ed;border-radius:14px;padding:12px 16px;touch-action:none}button:disabled{opacity:.4;cursor:default}button:active,button.pressed{background:#b8f35e;color:#10221c}button:focus-visible{outline:3px solid #b8f35e}[hidden]{display:none!important}#scene{position:fixed;inset:0;width:100%;height:100%;touch-action:none}#overlay{position:fixed;inset:0;pointer-events:none;padding: max(20px,env(safe-area-inset-top)) 22px max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column}button,.veil,#scan,#map{pointer-events:auto}header{display:flex;justify-content:space-between;align-items:center;gap:10px;text-shadow:0 2px 12px #000}small{font-size:10px;letter-spacing:2px;color:#b8f35e}h1{font-size:28px;margin:6px 0}h1 span{display:block;font-size:11px;font-weight:400;margin-top:5px;color:#c1d4d9}.badge{font-size:10px;background:#0a2028da;padding:12px;border:1px solid #ffffff22;border-radius:14px}.badge b{display:block;font-size:20px;margin-top:4px}.toolbar{display:flex;gap:8px;margin-top:18px;align-items:center}.toolbar button{font-size:12px;padding:11px 14px}#ar{background:#b8f35e;color:#10221c}#timer{margin-right:auto;font:18px monospace;background:#0a2028cf;padding:10px;border-radius:10px}#hint{font-size:12px;line-height:1.8;background:#0a2028d9;border:1px solid #ffffff18;border-radius:12px;align-self:center;max-width:560px;padding:10px 16px;margin-top:15px}#controls{margin-top:auto;display:flex;direction:ltr;justify-content:space-between;align-items:end}.pad{text-align:center}.pad>button{margin-bottom:6px}.pad>div{display:flex;gap:6px}.pad button{height:56px;width:56px;padding:0;background:#10303ede;box-shadow:0 5px 20px #0003;font-size:22px}.pad button.pressed{background:#b8f35e;color:#132a24}#guide{direction:rtl;font-size:11px;line-height:2;text-align:right;text-shadow:0 2px 8px #000}#map{position:absolute;left:22px;top:205px;width:160px;height:208px;background:#06181eef;border:1px solid #b8f35e66;border-radius:12px}#scan{margin:auto;text-align:center;background:#0a2028e8;padding:22px;border-radius:20px;max-width:400px;align-self:center}#scan p{font-size:13px}.veil{position:absolute;inset:0;background:#06151ebd;backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}.card{width:440px;max-width:100%;padding:30px;border:1px solid #ffffff29;border-radius:28px;background:linear-gradient(145deg,#14333d,#0a1e29);box-shadow:0 25px 90px #0006}.card h2{font-size:36px;line-height:1.4;margin:18px 0}.card p{font-size:14px;line-height:1.9;color:#c4d4d8}.facts{display:flex;gap:40px;padding:18px 0 24px}.facts span{font-size:22px}.facts small{letter-spacing:0;color:#9ab3ba;font-size:11px}.primary{width:100%;background:#b8f35e;color:#10221c;padding:17px}.card .note{font-size:11px;margin-bottom:0}body.xr .veil{backdrop-filter:none}body.xr #guide{display:none}body.xr header{opacity:.85}@media(max-height:600px){.card{padding:20px}.card h2{font-size:24px;margin:8px 0}.facts{padding:8px 0}header h1{font-size:20px}.toolbar{margin-top:5px}#hint{margin:6px 0}#map{top:140px;width:120px;height:156px}}


#overlay{height:100dvh;bottom:auto;padding-bottom:max(20px,env(safe-area-inset-bottom))}.mode-switch{display:flex;gap:6px;margin-top:12px;background:#091e29e8;border:1px solid #ffffff22;padding:5px;border-radius:16px;align-self:center;pointer-events:auto;min-width:260px}.mode-switch button{flex:1;border:0;background:transparent;color:#d5e5e9}.mode-switch button.active,.mode-switch #ar.active{background:#b8f35e;color:#11251c}.mode-switch #ar{background:transparent;color:#d5e5e9}.toolbar{margin-top:8px}.secondary{width:100%;margin-top:10px}
#controls{display:flex;direction:ltr;align-items:center;justify-content:space-between;gap:8px;width:min(100%,620px);align-self:center;margin-top:auto;flex-shrink:0;padding:12px 0 0;background:none;pointer-events:none}.stick-wrap{text-align:center}.stick{width:clamp(100px,28vw,140px);height:clamp(100px,28vw,140px);position:relative;border-radius:50%;border:2px solid #b6d2df75;background:radial-gradient(circle,#213f50d9 0 45%,#0a2029e8 46% 65%,#254654dd 66%);box-shadow:0 8px 25px #0005,inset 0 2px 10px #ffffff19;touch-action:none;pointer-events:auto;user-select:none;-webkit-user-select:none}.axis{position:absolute;background:#bad4df25;pointer-events:none}.horizontal{width:76%;height:1px;left:12%;top:50%}.vertical{height:76%;width:1px;top:12%;left:50%}.knob{position:absolute;left:50%;top:50%;width:44%;height:44%;border-radius:50%;transform:translate(-50%,-50%);border:2px solid #aec8d77a;background:radial-gradient(circle at 35% 25%,#647f8d,#253b49 70%);box-shadow:0 5px 10px #0009,inset 0 2px 4px #ffffff30;pointer-events:none}.stick.held{border-color:#b8f35e}.held .knob{border-color:#b8f35e;box-shadow:0 0 15px #b8f35e35}.stick-label{display:block;font-size:12px;margin-top:9px;text-shadow:0 2px 8px #000}.control-center{display:flex;align-items:center;flex-direction:column;gap:10px;text-align:center;direction:rtl}.control-center>span:first-child{font:12px monospace;color:#b8f35e}.control-center button{font-size:11px;padding:9px 12px;background:#17343fd9}#guide{font-size:10px;text-align:center;line-height:1.5;max-width:85px}body.xr #guide{display:block}#arLook{text-align:center;font-size:12px;direction:rtl;width:clamp(100px,28vw,140px);line-height:2;text-shadow:0 2px 6px #000}dialog{pointer-events:auto;background:#102c38;color:#edf8fa;border:1px solid #ffffff33;border-radius:20px;max-width:90vw}dialog::backdrop{background:#0009}dialog input{display:block;width:100%;margin:20px 0}dialog p{font-size:13px}#map{top:245px;z-index:2}@media(max-width:380px){#overlay{padding-left:12px;padding-right:12px}}@media(max-height:650px){header{display:none}.mode-switch{margin-top:0}#hint{font-size:10px;padding:5px;margin:5px 0}#map{top:150px;width:100px;height:130px}.card .facts{display:none}.card h2{font-size:23px}.card p{font-size:12px}.stick{width:100px;height:100px}.stick-label{margin-top:4px;font-size:10px}}

/* Reference layout: single green stick at bottom right, modes on the left. */
.mode-switch{position:absolute;left:18px;top:50%;transform:translateY(-50%);flex-direction:column;min-width:0;width:100px;padding:0;gap:10px;background:none;border:0;margin:0}.mode-switch button{min-height:56px;border-radius:18px;border:1px solid #ffffff35;background:#09131ee8;font-weight:700;font-size:17px}.mode-switch #ar{background:#09131ee8}.mode-switch button.active,.mode-switch #ar.active{background:#159d4a;border:2px solid #80d78f;color:#fff}.toolbar{margin-top:14px}#controls{position:absolute;right:24px;bottom:max(25px,env(safe-area-inset-bottom));width:auto;padding:0;margin:0;display:block}.stick-wrap{position:relative}.stick{width:150px;height:150px;border:1.5px solid #ffffff30;background:radial-gradient(circle,#07111be8 0 55%,#0c1623c9 56% 100%);box-shadow:0 8px 22px #0003}.knob{width:47%;height:47%;border:3px solid #a6e4b5;background:#169d49e6;box-shadow:0 2px 12px #0b4c3150}.stick.held{border-color:#9de5ad}.held .knob{border-color:#d5ffdd;background:#1abb58}.axis{background:#b8cfdf24}.stick-label{display:none}#home{position:absolute;left:0;top:-27px;width:55px;height:55px;padding:0;border:1px solid #ffffff35;border-radius:50%;background:#08121ef2;font-size:30px;z-index:1;pointer-events:auto}.toolbar #reset{display:none}#map{top:195px;left:18px}@media(max-width:380px){#controls{right:18px}.stick{width:132px;height:132px}.mode-switch{left:12px;width:86px}}@media(max-height:650px){.mode-switch{top:50%;width:90px}.mode-switch button{min-height:46px}#controls{bottom:18px;right:22px}.stick{width:122px;height:122px}#home{width:46px;height:46px;top:-23px;font-size:25px}#map{left:120px;top:105px}}

/* Ensure modal screens sit above every gameplay control. */
.veil{z-index:20}#scan{position:relative;z-index:10}body:has(#intro:not([hidden])) #controls,body:has(#scan:not([hidden])) #controls,body:has(#won:not([hidden])) #controls{visibility:hidden}

#help[aria-pressed="true"]{background:#e9b959;color:#2c210e;border-color:#ffe19a}

.choices{display:grid;gap:8px;margin:16px 0}.choices label{font-size:12px;color:#d4e2e7}.choices select{font:inherit;font-size:14px;width:100%;padding:12px;color:#eef9ff;background:#0b202a;border:1px solid #a8c5ce50;border-radius:10px;pointer-events:auto}.choices #mazeSize{font-size:11px;margin:4px 0 12px}.veil{align-items:safe center}#intro .card{margin:auto;max-height:95dvh;overflow-y:auto}#intro h2{font-size:28px;margin:12px 0}#wallBlock{position:absolute;inset:0;z-index:40;background:#10171d;display:flex;align-items:center;justify-content:center;padding:30px;pointer-events:auto;text-align:center}#wallBlock p{line-height:1.9;color:#d0d7da}#wallBlock h2{color:#ffcd84}.wall-blocked #controls{visibility:hidden}#customize{display:block;margin:15px 0}

/* 3D joystick uses the left thumb; AR preserves the right-hand layout. */
body:not(.xr) #controls{left:24px;right:auto}body:not(.xr) .mode-switch{left:auto;right:18px}@media(max-width:380px){body:not(.xr) #controls{left:18px}body:not(.xr) .mode-switch{right:12px}}