:root{--charcoal: #15100e;--umber: #2b1b13;--crimson: #7a251f;--bronze: #b88a43;--gold: #e3be76;--stone: #6b625c;--ivory: #e8ddc9;--panel: rgba(21, 16, 14, .82);--panel-2: rgba(43, 27, 19, .72);--line: rgba(184, 138, 67, .55);--line-soft: rgba(184, 138, 67, .22);--ok: #7fa36b;--warn: #d9a441;--bad: #c4553f;--serif: "Noto Serif", Georgia, "Times New Roman", serif;--sans: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--r: 10px;--tap: 48px;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:var(--charcoal);color:var(--ivory);font:15px/1.55 var(--sans);overflow:hidden;overscroll-behavior:none}button,input,select{font:inherit;color:inherit}#stage,#app{position:fixed;inset:0}#stage canvas.game-canvas{display:block;width:100%;height:100%;touch-action:none;outline:none}#app{pointer-events:none;z-index:2}#app>*{pointer-events:auto}.hidden{display:none!important}h1,h2,h3{font-family:var(--serif);font-weight:700;margin:0;letter-spacing:.02em}.btn{min-height:var(--tap);padding:0 20px;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(180deg,#7a251fd9,#46120ee6);color:var(--ivory);font-weight:600;letter-spacing:.02em;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .12s,box-shadow .2s,border-color .2s}.btn:hover{border-color:var(--gold);box-shadow:0 0 18px #e3be7640}.btn:active{transform:translateY(1px) scale(.99)}.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.btn.ghost{background:#15100e8c}.btn.gold{background:linear-gradient(180deg,#c9a05a,#8a6530);color:#1b120c;border-color:#e3be76}.btn.small{min-height:36px;padding:0 12px;font-size:13px}.link{background:none;border:0;color:var(--gold);cursor:pointer;text-decoration:underline;padding:4px}.panel{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 20px 60px #0000008c}.panel:before,.panel:after{content:"";position:absolute;width:22px;height:22px;border:2px solid var(--gold);pointer-events:none;opacity:.8}.panel:before{top:-3px;left:-3px;border-right:0;border-bottom:0;border-top-left-radius:12px}.panel:after{bottom:-3px;right:-3px;border-left:0;border-top:0;border-bottom-right-radius:12px}.ornament{height:12px;margin:10px auto;width:70%;background:radial-gradient(circle,var(--gold) 2px,transparent 3px) center/12px 12px repeat-x;opacity:.55}.muted{color:#b9ad9a}.small-t{font-size:13px}.field{display:grid;gap:6px;margin-bottom:14px}.field label{font-size:13px;color:var(--gold)}.field input{min-height:var(--tap);padding:0 14px;border-radius:var(--r);border:1px solid var(--line-soft);background:#00000059;outline:none}.field input:focus{border-color:var(--gold)}.err{color:#ff9b85;min-height:20px;font-size:13px}.badge{display:inline-block;padding:2px 8px;border-radius:99px;font-size:12px;border:1px solid var(--line-soft)}.badge.ok{color:#b9dba8;border-color:#7fa36b80}.badge.warn{color:var(--warn);border-color:#d9a44180}.badge.bad{color:#ff9b85}.screen{position:fixed;inset:0;display:grid;place-items:center;padding:max(20px,var(--safe-t)) 16px max(20px,var(--safe-b))}.boot canvas{position:absolute;inset:0;width:100%;height:100%}.boot .center{position:relative;text-align:center;width:min(560px,100%);display:grid;gap:10px;justify-items:center}.logo{font-family:var(--serif);line-height:1.05}.logo .n{font-size:clamp(64px,16vw,120px);color:var(--gold);text-shadow:0 0 30px rgba(255,120,40,.45),0 4px 0 #3a1a10;display:block}.logo .t{font-size:clamp(28px,7vw,48px);letter-spacing:.12em;display:block}.logo .s{font-size:clamp(14px,3.6vw,18px);letter-spacing:.5em;color:var(--bronze);display:block;margin-top:6px}.tagline{font-family:var(--serif);font-style:italic;color:#d9cdb7;margin:6px 0 14px}.progress{width:min(420px,90%);height:6px;border-radius:6px;background:#ffffff14;overflow:hidden;border:1px solid var(--line-soft)}.progress>i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--crimson),var(--gold));transition:width .25s}.boot .status{font-size:13px;color:#b9ad9a;min-height:20px}.menu-btns{display:grid;gap:10px;width:min(320px,100%);margin-top:8px}.disclaimer{position:absolute;bottom:max(12px,var(--safe-b));left:16px;right:16px;text-align:center;font-size:12px;color:#8f8576}.modal-wrap{position:fixed;inset:0;display:grid;place-items:center;background:#0503028c;z-index:50;padding:16px;animation:fade .2s}.modal{width:min(520px,100%);max-height:min(86vh,760px);overflow-y:auto;overflow-x:hidden;padding:22px}.modal header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.modal .x{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-soft);background:transparent;cursor:pointer;font-size:20px}.tabs{display:flex;gap:6px;margin:10px 0 16px}.tabs button{flex:1;min-height:42px;border-radius:var(--r);border:1px solid var(--line-soft);background:transparent;cursor:pointer}.tabs button.on{border-color:var(--gold);background:#b88a4326;color:var(--gold)}@keyframes fade{0%{opacity:0}to{opacity:1}}.list{display:grid;gap:10px}.row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r);border:1px solid var(--line-soft);background:#00000040;cursor:pointer;text-align:left;width:100%}.row:hover:not(:disabled){border-color:var(--gold)}.row.on{border-color:var(--gold);background:#b88a431f}.row:disabled{opacity:.55;cursor:not-allowed}.row .grow{flex:1;min-width:0}.creator{width:min(980px,100%);display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px;max-height:92vh;overflow:auto}.preview{position:relative;min-height:380px;border-radius:12px;overflow:hidden;background:radial-gradient(ellipse at 50% 80%,#3a1a12,#120a08 70%);border:1px solid var(--line-soft)}.preview canvas{position:absolute;inset:0;width:100%!important;height:100%!important}.opts{display:grid;gap:12px;align-content:start}.opt h4{margin:0 0 6px;font-size:13px;color:var(--gold);font-weight:600}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{min-height:38px;padding:0 12px;border-radius:99px;border:1px solid var(--line-soft);background:#0000004d;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.chip.on{border-color:var(--gold);color:var(--gold);background:#b88a4324}.chip .sw{width:16px;height:16px;border-radius:50%;border:1px solid rgba(255,255,255,.3)}@media (max-width: 760px){.creator{grid-template-columns:1fr}.preview{min-height:280px}}.hud{position:fixed;inset:0;pointer-events:none;z-index:5}.hud>*{pointer-events:auto}.hud .tl{position:absolute;top:calc(10px + var(--safe-t));left:calc(10px + var(--safe-l));display:flex;gap:10px;align-items:center;padding:8px 14px 8px 8px}.avatar{width:48px;height:48px;border-radius:50%;border:2px solid var(--gold);display:grid;place-items:center;font-family:var(--serif);font-size:20px;background:radial-gradient(circle at 40% 35%,#8a3a2a,#2b1b13)}.hud .who b{display:block;font-size:14px}.hud .who span{font-size:12px;color:var(--gold)}.expbar{width:130px;height:5px;border-radius:4px;background:#ffffff1a;margin-top:4px;overflow:hidden}.expbar i{display:block;height:100%;background:linear-gradient(90deg,var(--bronze),var(--gold));transition:width .5s}.hud .tr{position:absolute;top:calc(10px + var(--safe-t));right:calc(10px + var(--safe-r));display:flex;gap:6px}.ibtn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center;cursor:pointer;position:relative;transition:border-color .2s,transform .1s}.ibtn:hover{border-color:var(--gold)}.ibtn:active{transform:scale(.94)}.ibtn svg{width:22px;height:22px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.ibtn .dot{position:absolute;top:2px;right:2px;min-width:16px;height:16px;border-radius:8px;background:var(--crimson);font-size:10px;display:grid;place-items:center;padding:0 4px;border:1px solid var(--gold)}.side{position:absolute;top:50%;transform:translateY(-50%);display:grid;gap:8px}.side.l{left:calc(10px + var(--safe-l))}.side.l{top:calc(50% + 40px)}.side.r{right:calc(10px + var(--safe-r))}.side .ibtn{width:48px;height:48px}.side .ibtn:after{content:attr(data-label);position:absolute;white-space:nowrap;font-size:12px;padding:4px 8px;border-radius:6px;background:var(--panel);border:1px solid var(--line-soft);opacity:0;pointer-events:none;transition:opacity .15s}.side.l .ibtn:after{left:56px}.side.r .ibtn:after{right:56px}.side .ibtn:hover:after{opacity:1}.tracker{position:absolute;top:calc(78px + var(--safe-t));left:calc(68px + var(--safe-l));width:min(290px,60vw);padding:10px 14px;font-size:13px}.tracker h3{font-size:14px;color:var(--gold);margin-bottom:4px}.tracker li{list-style:none;padding:2px 0}.tracker ul{margin:0;padding:0}.tracker li.done{color:#8fa57e;text-decoration:line-through}.tracker li.cur:before{content:"➤ ";color:var(--gold)}.levelname{position:absolute;top:calc(14px + var(--safe-t));left:50%;transform:translate(-50%);text-align:center;font-family:var(--serif);pointer-events:none;text-shadow:0 2px 8px #000}.levelname small{display:block;color:var(--bronze);letter-spacing:.3em;font-size:11px;font-family:var(--sans)}.bottom{position:absolute;bottom:calc(14px + var(--safe-b));left:50%;transform:translate(-50%);display:flex;gap:8px;align-items:flex-end}.act{min-width:64px;height:64px;border-radius:14px;border:1px solid var(--line);background:var(--panel);cursor:pointer;display:grid;place-items:center;font-size:11px;gap:2px;padding:6px}.act svg{width:24px;height:24px;stroke:var(--gold);fill:none;stroke-width:1.6}.act.on{border-color:var(--gold);background:#b88a4333}.act.primary{min-width:84px;height:84px;border-radius:50%;border:2px solid var(--gold);background:radial-gradient(circle,#7a251fe6,#15100ee6)}.act:disabled{opacity:.4}.prompt{position:absolute;bottom:calc(118px + var(--safe-b));left:50%;transform:translate(-50%);padding:8px 16px;border-radius:99px;font-size:14px;white-space:nowrap;animation:fade .2s;pointer-events:none}.prompt kbd{display:inline-block;border:1px solid var(--gold);border-radius:5px;padding:0 6px;margin-right:6px;color:var(--gold);font:600 12px var(--sans)}.fps{position:absolute;bottom:calc(6px + var(--safe-b));right:calc(8px + var(--safe-r));font-size:11px;color:#8f8576;pointer-events:none}.joy{position:absolute;left:calc(26px + var(--safe-l));bottom:calc(26px + var(--safe-b));width:130px;height:130px;border-radius:50%;border:1px solid var(--line);background:radial-gradient(circle,#2b1b138c,#15100e59);touch-action:none}.joy i{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#c9a05a,#6b4a20);border:2px solid var(--gold)}.touch-only{display:none}@media (pointer: coarse){.touch-only{display:block}.desktop-only{display:none!important}.bottom{left:auto;right:calc(14px + var(--safe-r));transform:none;flex-wrap:wrap;justify-content:flex-end;width:220px}.prompt{bottom:calc(180px + var(--safe-b))}}@media (max-width: 640px){.hud .tr{max-width:calc(100% - 196px);flex-wrap:wrap;justify-content:flex-end}.hud .tr .dup{display:none}}@media (max-width: 640px){.side,.side.l{top:auto;bottom:calc(180px + var(--safe-b));transform:none}.side.l .ibtn,.side.r .ibtn{width:42px;height:42px}.tracker{top:calc(74px + var(--safe-t));width:min(240px,58vw);font-size:12px}.levelname{display:none}.hud .tr .ibtn{width:40px;height:40px}.hud .tl .expbar{width:90px}}@media (max-height: 480px) and (orientation: landscape){.side{gap:4px}.side .ibtn{width:38px;height:38px}.tracker{display:none}}.hud.compact .side,.hud.compact .tracker,.hud.compact .levelname{display:none}.dialogue{position:fixed;left:50%;bottom:calc(18px + var(--safe-b));transform:translate(-50%);width:min(760px,calc(100% - 20px));padding:18px 20px 14px;z-index:20;animation:rise .25s}@keyframes rise{0%{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%)}}.dialogue .speaker{font-family:var(--serif);color:var(--gold);font-size:17px;margin-bottom:6px}.dialogue .text{min-height:52px;font-size:16px}.dialogue .choices{display:grid;gap:8px;margin-top:12px}.dialogue .choices button{text-align:left;min-height:44px;padding:8px 14px;border-radius:var(--r);border:1px solid var(--line-soft);background:#0000004d;cursor:pointer}.dialogue .choices button:hover,.dialogue .choices button:focus-visible{border-color:var(--gold);outline:none}.dialogue .choices button b{color:var(--gold);margin-right:8px}.dialogue .hint{text-align:right;font-size:12px;color:#8f8576;margin-top:6px}.toasts{position:fixed;top:calc(70px + var(--safe-t));right:calc(12px + var(--safe-r));display:grid;gap:8px;z-index:60;pointer-events:none;width:min(340px,calc(100% - 24px))}.toast{padding:12px 14px;animation:slide .3s;pointer-events:auto}.toast b{color:var(--gold);display:block;font-family:var(--serif)}@keyframes slide{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:none}}.map{position:relative;width:100%;height:720px;margin:0 auto;border-radius:12px;overflow:hidden;background:radial-gradient(ellipse at 50% 0%,rgba(122,37,31,.35),transparent 60%),repeating-linear-gradient(0deg,rgba(184,138,67,.04) 0 1px,transparent 1px 28px),#120b09;border:1px solid var(--line-soft)}.map svg.path{position:absolute;inset:0;width:100%;height:100%}.node{position:absolute;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:2px;cursor:pointer;background:none;border:0;padding:0}.node .seal{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font:700 14px var(--serif);border:2px solid var(--stone);background:#1b1311;color:#8f8576;transition:transform .15s}.node:hover .seal{transform:scale(1.1)}.node .nm{font-size:11px;max-width:110px;text-align:center;line-height:1.2;color:#8f8576}.node.UNLOCKED .seal,.node.IN_PROGRESS .seal{border-color:var(--gold);color:var(--gold);background:radial-gradient(circle,#5a1f17,#1b1311);box-shadow:0 0 14px #e3be7659}.node.COMPLETED .seal{border-color:var(--ok);color:#cfe3c2;background:radial-gradient(circle,#2f4026,#141a10)}.node.UNLOCKED .nm,.node.IN_PROGRESS .nm,.node.COMPLETED .nm{color:var(--ivory)}.node.cur .seal{outline:2px dashed var(--gold);outline-offset:4px;animation:pulse 2s infinite}@keyframes pulse{50%{outline-color:transparent}}.map-detail{margin-top:12px;padding:12px;border-radius:var(--r);border:1px solid var(--line-soft);background:#00000040}.items{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.item{padding:12px;border-radius:var(--r);border:1px solid var(--line-soft);background:#00000040}.item b{color:var(--gold);display:block;font-size:14px}.item.locked{opacity:.45;filter:grayscale(1)}.q{padding:12px;border-radius:var(--r);border:1px solid var(--line-soft);margin-bottom:10px;background:#0003}.q h4{margin:0 0 4px;font-family:var(--serif);color:var(--gold)}.q ul{margin:6px 0 0;padding-left:18px}.chatbox{position:absolute;left:calc(68px + var(--safe-l));bottom:calc(170px + var(--safe-b));width:min(320px,70vw);max-height:30vh;display:flex;flex-direction:column;font-size:13px}.chatbox .log{overflow:auto;padding:8px 10px;display:grid;gap:3px}.chatbox .log b{color:var(--gold)}.chatbox form{display:flex;border-top:1px solid var(--line-soft)}.chatbox input{flex:1;min-height:40px;background:transparent;border:0;padding:0 10px;outline:none}@media (pointer: fine){.chatbox{bottom:calc(110px + var(--safe-b))}}.fade{position:fixed;inset:0;background:#000;z-index:40;pointer-events:none;opacity:0;transition:opacity .6s;display:grid;place-items:center;font-family:var(--serif)}.fade.on{opacity:1;pointer-events:auto}.fade h2{font-size:clamp(26px,6vw,44px);color:var(--gold);text-align:center}.fade p{color:#b9ad9a;text-align:center}.tutorial{position:fixed;inset:0;z-index:45;background:#050302b3;display:grid;place-items:center;padding:16px}.tutorial .panel{width:min(520px,100%);padding:24px}.keys{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:14px 0;font-size:14px}.keys kbd{border:1px solid var(--gold);border-radius:6px;padding:2px 8px;color:var(--gold);font:600 12px var(--sans);text-align:center}.range{display:grid;grid-template-columns:120px 1fr 40px;align-items:center;gap:10px;margin-bottom:10px}.range input{accent-color:var(--gold)}.fatal{padding:28px;max-width:520px;text-align:center}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}@media (max-width: 640px){.chatbox{display:none;left:calc(10px + var(--safe-l));right:calc(10px + var(--safe-r));width:auto;bottom:calc(250px + var(--safe-b));max-height:26vh;z-index:6}.hud.chat-open .chatbox{display:flex}}
