:root{--void:#04070f;--deep:#0a1226;--ivoire:#f2e7d2;--or:#d9b25f;--or-clair:#f0d79a;--cyan:#75f4ff;--vert-schmil:#57ff9a;--rouge:#ff493d;--mono:ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--sans:ui-sans-serif, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ivoire);font-family:var(--sans);background:#04070f;margin:0;padding:0;overflow:hidden}[hidden]{display:none!important}canvas{display:block}#app{position:fixed;inset:0}.clip{clip-path:polygon(0 10px,10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px))}.screen{z-index:40;background:radial-gradient(120% 90% at 50% 20%,#101d38 0%,#060a16 45%,#02040a 100%);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.screen:after{content:"";pointer-events:none;mix-blend-mode:screen;opacity:.5;background:repeating-linear-gradient(#75f4ff09 0 1px,#0000 1px 3px);position:absolute;inset:0}.card{background:linear-gradient(#0a1222eb,#060a14f5);border:1px solid #d9b25f59;width:min(92vw,760px);max-width:760px;padding:34px 38px;position:relative;box-shadow:0 0 0 1px #75f4ff14,0 30px 80px #000000b3}.card:before{content:"";pointer-events:none;border:1px solid #75f4ff21;position:absolute;inset:6px}.eyebrow{font-family:var(--mono);letter-spacing:.34em;text-transform:uppercase;color:var(--cyan);opacity:.85;margin:0 0 14px;font-size:11px}h1{letter-spacing:.14em;text-transform:uppercase;color:var(--ivoire);text-shadow:0 0 26px #d9b25f59;margin:0;font-size:clamp(26px,5.4vw,50px);font-weight:700;line-height:1.02}h1 .or{color:var(--or-clair)}.sub{color:#cbd5e6;max-width:52ch;margin:14px 0 0;font-size:clamp(13px,1.6vw,16px);line-height:1.55}.rule{background:linear-gradient(90deg,#d9b25fcc,#75f4ff59 40%,#0000);height:1px;margin:22px 0}.keys{font-family:var(--mono);color:#a9b8cf;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:10px 18px;font-size:12px;display:grid}.keys b{min-width:52px;color:var(--ivoire);text-align:center;background:#75f4ff14;border:1px solid #75f4ff40;margin-right:9px;padding:2px 7px;font-weight:600;display:inline-block}.btn{cursor:pointer;font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;color:#06131b;background:linear-gradient(180deg,var(--or-clair),var(--or));border:0;align-items:center;gap:12px;margin-top:26px;padding:15px 30px;font-size:13px;transition:transform .15s,box-shadow .15s;display:inline-flex;box-shadow:0 0 30px #d9b25f47}.btn:hover{transform:translateY(-2px);box-shadow:0 0 44px #d9b25f80}.btn:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}.btn.ghost{color:var(--cyan);box-shadow:none;background:0 0;border:1px solid #75f4ff73}.btn.ghost:hover{background:#75f4ff1a}.warn{font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--rouge);opacity:.9;margin-top:20px;font-size:11px}.warn span{border:1px solid #ff493d73;padding:5px 10px;display:inline-block}#loader .bar{background:#75f4ff26;height:2px;margin-top:22px;overflow:hidden}#loader .bar i{background:linear-gradient(90deg,transparent,var(--cyan),transparent);width:32%;height:100%;animation:1.15s linear infinite slide;display:block}@keyframes slide{0%{transform:translate(-120%)}to{transform:translate(420%)}}#loadStep{font-family:var(--mono);color:#8fa3c0;letter-spacing:.12em;margin-top:12px;font-size:12px}#hud{z-index:20;pointer-events:none;font-family:var(--mono);position:fixed;inset:0}#reticle{opacity:.75;width:16px;height:16px;margin:-8px 0 0 -8px;position:absolute;top:50%;left:50%}#reticle:before,#reticle:after{content:"";background:#f2e7d2bf;position:absolute}#reticle:before{width:2px;height:16px;top:0;left:7px}#reticle:after{width:16px;height:2px;top:7px;left:0}#reticle.on:before,#reticle.on:after{background:var(--cyan);box-shadow:0 0 8px var(--cyan)}#zone{letter-spacing:.28em;text-transform:uppercase;color:var(--or-clair);border-left:2px solid var(--or);padding-left:12px;font-size:11px;line-height:1.5;position:absolute;top:20px;left:22px}#zone small{color:#8fa3c0;letter-spacing:.16em;text-transform:none;font-size:10px;display:block}#prompt{letter-spacing:.14em;color:var(--ivoire);white-space:nowrap;opacity:0;background:#040a1499;border:1px solid #75f4ff59;padding:9px 16px;font-size:12px;transition:opacity .18s;position:absolute;bottom:16%;left:50%;transform:translate(-50%)}#prompt.on{opacity:1}#prompt b{color:var(--cyan)}#hints{letter-spacing:.16em;color:#7d8fa8;text-align:right;font-size:10px;line-height:1.9;position:absolute;bottom:18px;right:22px}#hints b{color:#b9c8dd}#fps{letter-spacing:.16em;color:#5f7086;font-size:10px;position:absolute;top:20px;right:22px}#panel{z-index:30;background:radial-gradient(90% 90%,#03070eb8,#020409eb);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#panel .card{max-width:680px;max-height:82vh;overflow:auto}#panel h2{letter-spacing:.1em;text-transform:uppercase;color:var(--ivoire);margin:0;font-size:clamp(19px,3vw,28px)}#panel .body{color:#d3dcea;margin-top:16px;font-size:15px;line-height:1.68}#panel .body p{margin:0 0 14px}#panel .body em{color:var(--or-clair);font-style:normal}#panel .body .lex{font-family:var(--mono);color:var(--cyan);font-size:13px}#panel .body ul{margin:0 0 14px;padding-left:18px}#panel .body li{margin:0 0 6px}#panel .tag{font-family:var(--mono);letter-spacing:.3em;text-transform:uppercase;color:var(--cyan);margin-bottom:10px;font-size:10px}#menu .row{font-family:var(--mono);letter-spacing:.12em;color:#c2cfe2;border-bottom:1px solid #d9b25f29;justify-content:space-between;align-items:center;gap:20px;padding:12px 0;font-size:12px;display:flex}#menu .row:last-of-type{border-bottom:0}.toggle{cursor:pointer;color:var(--cyan);font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;background:0 0;border:1px solid #75f4ff59;padding:7px 14px;font-size:11px}.toggle[data-on="1"]{color:#e9fbff;background:#75f4ff24}.toggle:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}input[type=range]{accent-color:#75f4ff;width:150px}.foot{font-family:var(--mono);letter-spacing:.18em;color:#66788f;margin-top:20px;font-size:10px}@media (width<=640px){.card{padding:24px 20px}#hints{display:none}}#menu h1.menu-h1{font-size:clamp(22px,4vw,36px)}.tctl{display:none}@media (pointer:coarse){body.joue .tctl{display:block}#tjoy{left:max(16px,env(safe-area-inset-left));bottom:calc(max(16px,env(safe-area-inset-bottom)) + 8px);z-index:30;touch-action:none;background:#060a146b;border:1px solid #75f4ff66;border-radius:50%;width:122px;height:122px;position:fixed}#tknob{background:#1e283cd9;border:1px solid #d9b25fbf;border-radius:50%;width:52px;height:52px;position:absolute;top:35px;left:35px}#tbtns{right:max(16px,env(safe-area-inset-right));bottom:calc(max(16px,env(safe-area-inset-bottom)) + 8px);z-index:30;flex-direction:column;gap:12px;position:fixed}body.joue #tbtns{display:flex}#tbtns button{cursor:pointer;width:60px;height:60px;color:var(--ivoire);background:#060a148c;border:1px solid #75f4ff73;border-radius:50%;font-size:24px}#tbtns button:active{background:#75f4ff40}#hints{display:none}#prompt{pointer-events:auto;cursor:pointer}}@media (width<=700px){.card{max-height:88dvh;padding:22px 20px;overflow-y:auto}.keys{grid-template-columns:repeat(2,1fr);font-size:11px}h1{font-size:clamp(22px,7vw,34px)}#zone{font-size:13px}}.back-codex{letter-spacing:.22em;text-transform:uppercase;color:#a9b8cf;border:1px solid #a9b8cf59;margin-top:18px;padding:6px 14px;font-size:11px;text-decoration:none;transition:color .2s,border-color .2s;display:inline-block}.back-codex:hover{color:#75f4ff;border-color:#75f4ff}