:root{--panel:#12161cb8;--line:#ffffff24;--text:#f3f1ec;--muted:#b9b6ae;--accent:#e9b872;color:var(--text);font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:#c9d9ea;height:100%;margin:0;overflow:hidden}#app,#app canvas{width:100%;height:100%;display:block;position:fixed;inset:0}#app canvas{touch-action:none}body.tactile .souris,body:not(.tactile) .doigt{display:none}kbd{border:1px solid var(--line);text-align:center;min-width:1.6em;color:var(--text);background:#ffffff0f;border-bottom-width:2px;border-radius:5px;margin:0 .12em;padding:.05em .4em;font:600 .82em/1.4 ui-monospace,monospace;display:inline-block}button{font:inherit;color:var(--text);cursor:pointer;border:1px solid var(--line);background:#ffffff0f;border-radius:10px;padding:.6em 1em;transition:background .15s,border-color .15s}button:hover{background:#ffffff24;border-color:#ffffff4d}button.primary{background:var(--accent);color:#1d1a14;border-color:#0000;font-weight:650}button.primary:hover{background:#f3c98b}#overlay{padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));z-index:20;background:radial-gradient(#0a0c1059,#0a0c10b3);place-items:center;display:grid;position:fixed;inset:0}#overlay.hidden{display:none}.card{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);border-radius:18px;width:min(640px,100%);max-height:100%;padding:28px 30px;overflow-y:auto;box-shadow:0 30px 80px #00000059}.eyebrow{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;margin:0 0 6px;font-size:.82rem}h1{margin:0 0 20px;font-size:clamp(1.4rem,3.2vw,1.9rem);line-height:1.15}.actions{flex-wrap:wrap;gap:10px;margin-bottom:20px;display:flex}.actions button{padding:.8em 1.3em}.tp>span{color:var(--muted);margin-bottom:8px;font-size:.85rem;display:block}.tp-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.tp-grid button{text-align:left;padding:.55em .7em;font-size:.9rem}@media (max-width:560px){.tp-grid{grid-template-columns:repeat(2,1fr)}}body.tactile .tp-grid kbd{display:none}body.tactile .tp-grid button{padding:.8em}@media (max-width:560px),(max-height:480px){.card{padding:20px 18px}h1,.actions{margin-bottom:14px}.actions button{flex:auto}}.keys{border-top:1px solid var(--line);color:var(--muted);margin:20px 0 0;padding:14px 0 0;font-size:.86rem;line-height:1.9;list-style:none}#hud{pointer-events:none;z-index:10;position:fixed;inset:0}#crosshair{background:#ffffffe6;border-radius:50%;width:6px;height:6px;margin:-3px 0 0 -3px;position:absolute;top:50%;left:50%;box-shadow:0 0 0 1.5px #00000059}#hud.maquette #crosshair,#hud.maquette #hint{display:none}#room{left:max(16px, env(safe-area-inset-left));top:max(16px, env(safe-area-inset-top));background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;flex-direction:column;gap:2px;padding:10px 14px;display:flex;position:absolute}#room-name{font-size:1.05rem;font-weight:650}#room-level{color:var(--muted);font-size:.8rem}#hint{background:var(--panel);border:1px solid var(--line);white-space:nowrap;border-radius:999px;padding:8px 14px;font-size:.92rem;position:absolute;bottom:14%;left:50%;transform:translate(-50%)}#hint:empty{display:none}#minimap{right:max(16px, env(safe-area-inset-right));bottom:max(16px, env(safe-area-inset-bottom));background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px;width:240px;height:240px;position:absolute}#toast{background:var(--panel);border:1px solid var(--line);opacity:0;border-radius:10px;padding:8px 14px;font-size:.9rem;transition:opacity .3s;position:absolute;top:16px;left:50%;transform:translate(-50%)}#toast.show{opacity:1}@media (max-width:640px){#minimap{width:160px;height:160px}}body.tactile #minimap{top:calc(max(12px, env(safe-area-inset-top)) + 56px);bottom:auto;right:max(12px, env(safe-area-inset-right));width:120px;height:120px}body.tactile #room{left:max(12px, env(safe-area-inset-left));top:max(12px, env(safe-area-inset-top));max-width:calc(100vw - 170px)}body.tactile #toast{text-align:center;max-width:calc(100vw - 32px);top:auto;bottom:calc(14% + 52px)}body.tactile #hint{white-space:normal;text-align:center;max-width:calc(100vw - 32px);bottom:27%}body.tactile #toast{bottom:calc(27% + 52px)}@media (max-height:480px){body.tactile #hud.maquette #room{display:none}}#touch-ui{z-index:12;pointer-events:none;position:fixed;inset:0}#touch-ui[hidden]{display:none}#touch-btns{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));pointer-events:auto;gap:8px;display:flex;position:absolute}#touch-btns button{background:var(--panel);-webkit-backdrop-filter:blur(10px);min-width:44px;height:44px;padding:0 .9em}#joy{left:calc(max(28px, env(safe-area-inset-left)) + 56px);top:calc(100% - max(36px, env(safe-area-inset-bottom)) - 56px);opacity:.55;background:#12161c4d;border:1.5px solid #ffffff4d;border-radius:50%;width:112px;height:112px;margin:-56px 0 0 -56px;transition:opacity .15s;position:absolute}#joy.on{opacity:1}#joy.course{border-color:var(--accent)}#joy-knob{background:#ffffffd9;border-radius:50%;width:48px;height:48px;margin:-24px 0 0 -24px;position:absolute;top:50%;left:50%;box-shadow:0 2px 10px #0000004d}#maquette-ui{left:max(16px, env(safe-area-inset-left));bottom:max(16px, env(safe-area-inset-bottom));z-index:15;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:14px;flex-direction:column;gap:9px;width:260px;padding:14px 16px;display:flex;position:fixed}#maquette-ui[hidden]{display:none}#maquette-ui label{cursor:pointer;align-items:center;gap:8px;font-size:.92rem;display:flex}#maquette-ui p{color:var(--muted);margin:2px 0;font-size:.8rem;line-height:1.5}body.tactile #maquette-ui label{min-height:32px}#loading{z-index:30;color:var(--text);background:#1b1f26;place-items:center;font-size:1rem;display:grid;position:fixed;inset:0}#loading.done{display:none}#gate{z-index:40;padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));background:#1b1f26;place-items:center;display:grid;position:fixed;inset:0}#gate[hidden]{display:none}#gate .card{width:min(420px,100%)}#gate label{color:var(--muted);margin-bottom:8px;font-size:.85rem;display:block}.gate-ligne{gap:10px;display:flex}#gate-mdp{border:1px solid var(--line);min-width:0;height:46px;color:var(--text);font:inherit;-webkit-user-select:text;user-select:text;background:#ffffff0f;border-radius:10px;flex:1;padding:0 .9em;font-size:16px}#gate-mdp:focus{outline:2px solid var(--accent);outline-offset:1px}.gate-ligne button{height:46px;padding:0 1.3em}#gate-erreur{color:#ff8d84;min-height:1.3em;margin:10px 0 0;font-size:.88rem}
