@font-face{font-family:Cairo;src:url('./assets/Cairo.ttf') format('truetype');font-display:swap;font-weight:200 900}
:root{font-family:Cairo,Arial,sans-serif;color:#f7f1e4;background:#24231e;font-synthesis:none;--gold:#dab77d;--panel:#25251feb;--border:#ffffff29}*{box-sizing:border-box}body{margin:0;overscroll-behavior:none}button{font:inherit;cursor:pointer;color:inherit;touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}button:disabled{cursor:wait;opacity:.5}button[hidden]{display:none!important}#experience{position:relative;height:100dvh;min-height:460px;overflow:hidden;background:linear-gradient(0deg,#17181255,#17181222),url('./assets/cover.jpg') center/cover}#viewport{position:absolute;inset:0;touch-action:none;outline:none}#viewport canvas{display:block;width:100%;height:100%;touch-action:none}.masthead{position:absolute;top:0;inset-inline:0;display:flex;justify-content:space-between;align-items:flex-start;padding:25px 30px 48px;background:linear-gradient(#141611bf,transparent);pointer-events:none}.brand{display:flex;gap:13px;align-items:center}.brand h1{font-size:clamp(18px,2vw,24px);margin:0;font-weight:700;text-shadow:0 2px 12px #0008}.brand p{margin:3px 0 0;font-size:13px;color:#efe6d4}.brand p span{display:inline-block;margin-inline-start:16px}.utilities{display:flex;gap:8px;pointer-events:auto}.icon-btn{background:var(--panel);border:1px solid var(--border);width:43px;height:43px;border-radius:50%;font-size:23px}.loading-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:30px 38px;width:min(400px,calc(100% - 40px));text-align:center;background:#25251ff0;border:1px solid #d9b47770;box-shadow:0 20px 90px #0004;border-radius:4px}.loading-panel h2{margin:10px 0;font-size:30px}.loading-panel p{font-size:15px;color:#e4dbc9}.eyebrow{font-size:13px;color:var(--gold)}.progress{height:3px;background:#ffffff24;margin:25px 0 7px;overflow:hidden}.progress div{height:100%;width:0;background:var(--gold);transition:width .25s}#load-percent{font-size:13px;color:#d2c7b4}.view-controls{position:absolute;bottom:31px;left:50%;transform:translateX(-50%);display:flex;border:1px solid var(--border);background:var(--panel);padding:5px;border-radius:8px;box-shadow:0 8px 25px #0002;white-space:nowrap}.view-controls button{background:transparent;border:0;padding:11px 22px;border-radius:4px;font-size:14px;transition:background .15s}.view-controls button[aria-pressed=true]{background:var(--gold);color:#29291f;font-weight:700}.view-controls button:hover:not([aria-pressed=true]){background:#ffffff12}.location{position:absolute;right:30px;top:132px;display:grid;grid-template-columns:7px 1fr;column-gap:10px;align-items:center;pointer-events:none;text-shadow:0 1px 8px #000}.location i{height:7px;width:7px;background:var(--gold);border-radius:50%}.location span{font-size:15px;font-weight:600}.location small{grid-column:2;font-size:13px;color:#fffbded0}.movement{position:absolute;bottom:60px;left:30px;display:grid;grid-template-columns:47px 47px 47px;grid-template-rows:47px 47px;gap:4px;direction:ltr}.movement button{background:#24261dcc;border:1px solid #e8d7b554;border-radius:7px;font:20px Arial;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.movement button:active,.movement button.active{background:var(--gold);color:#20231b}.forward{grid-column:2}.left{grid-column:1;grid-row:2}.back{grid-column:2;grid-row:2}.right{grid-column:3;grid-row:2}.move-hint{position:absolute;bottom:23px;left:30px;width:149px;text-align:center;font-size:12px;text-shadow:0 1px 8px #000;margin:0}#minimap{position:absolute;right:30px;bottom:52px;width:160px;padding:6px;background:#22251ee8;border:1px solid var(--border);border-radius:6px;text-align:center;pointer-events:none}#map-canvas{width:100%;height:auto;display:block}#minimap span{font-size:11px;color:#ded6c5}.footer-note{position:absolute;bottom:12px;right:30px;font-size:11px;color:#f6eeddbe;text-shadow:0 1px 6px #000}.primary{border:0;background:var(--gold);color:#26271d;border-radius:4px;padding:12px 25px;font-size:15px;font-weight:700}dialog{background:#292a22;color:#f7efdf;border:1px solid #d9b47770;border-radius:8px;padding:36px;width:min(450px,calc(100vw - 34px));box-shadow:0 30px 80px #0008}dialog::backdrop{background:#111b;backdrop-filter:blur(5px)}dialog h2{font-size:26px;margin:10px 0 22px}dialog p{font-size:15px;line-height:1.85}.muted{color:#bcb8aa!important;font-size:13px!important}.close{position:absolute;left:12px;top:7px;border:0;background:none;font-size:30px;color:#dfd6c5}.close-help{width:100%;margin-top:10px}.noscript{position:absolute;inset:40% 15%;padding:30px;background:#25251f}#toast{position:absolute;top:140px;left:50%;transform:translateX(-50%);background:var(--panel);padding:8px 20px;border-radius:4px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s}.ready .loading-panel{display:none}.ready .location{display:grid}.overview .movement,.overview .move-hint,.overview #minimap{display:none}.ready #experience{background:#b8b0a0}@media(max-width:700px){.masthead{padding:calc(env(safe-area-inset-top) + 16px) 17px 42px;gap:10px}.brand{gap:8px}.brand img{width:28px;height:34px}.brand h1{font-size:17px}.brand p{font-size:11px;margin-top:2px}.brand p span{display:block;margin:0}.utilities{gap:5px}.icon-btn{width:34px;height:34px;font-size:20px}.location{top:126px;right:18px}.location span{font-size:14px}.location small{font-size:12px}.view-controls{bottom:calc(env(safe-area-inset-bottom) + 20px);max-width:calc(100% - 28px);width:380px;justify-content:center}.view-controls button{padding:10px 11px;font-size:12px;flex:1}.movement{bottom:calc(env(safe-area-inset-bottom) + 115px);left:19px;grid-template-columns:47px 47px 47px;grid-template-rows:47px 47px}.move-hint{bottom:calc(env(safe-area-inset-bottom) + 88px);left:19px}#minimap{right:18px;bottom:calc(env(safe-area-inset-bottom) + 115px);width:128px}.footer-note{bottom:calc(env(safe-area-inset-bottom) + 79px);right:18px;font-size:10px}#toast{top:190px;width:max-content;max-width:90%;text-align:center}.loading-panel h2{font-size:27px}}@media(max-height:540px) and (min-width:600px){.masthead{padding-top:12px}.location{top:94px}.movement{bottom:70px}.view-controls{bottom:16px}#minimap{bottom:65px;width:128px}.footer-note{bottom:8px}.move-hint{bottom:41px}}
