:root{color-scheme:dark;--bg:#0e201c;--panel:#19382e;--gold:#e5c486;--gold2:#f9e2b3;--line:rgba(236,197,128,.3);--cream:#fbefd5;--muted:#b5c5b9;--pill:#2b4e3c;--shadow:0 14px 55px #010a0899;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;width:100%;margin:0;overscroll-behavior:none;background:#0a1a16}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:3px solid #fff3ba;outline-offset:3px}#app{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;height:100dvh;min-height:475px;background:#0e211c;position:relative;overflow:hidden}
.topbar{height:68px;min-height:68px;padding:5px max(14px,env(safe-area-inset-right)) 5px max(14px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(95deg,#071c1a,#214337 76%,#182f29);border-bottom:1px solid var(--line);z-index:4}.brand{display:flex;align-items:center;gap:9px;min-width:0}.brand-mark{height:38px;width:38px;display:grid;place-items:center;font-size:30px;color:#e5c486;border:1px solid #9e7d47;border-radius:50%;box-shadow:inset 0 0 0 3px #1b3b30}.brand strong{display:block;font:600 clamp(13px,2.8vw,21px)/1.15 Cinzel,Georgia,serif;color:#f7dfad;letter-spacing:-.1px;white-space:nowrap}.brand em{font-family:Georgia,serif;font-size:.75em;font-weight:400}.brand small{display:block;color:#c4b589;font-size:9px;letter-spacing:1.8px;margin-top:4px;font-weight:800}.top-actions{display:flex;align-items:center;gap:6px}.xp-pill{height:35px;display:flex;align-items:center;gap:4px;background:#17362d;border:1px solid var(--line);border-radius:25px;padding:0 11px;color:var(--gold)}.xp-pill b{font-weight:800;font-size:15px;font-variant-numeric:tabular-nums}.xp-pill small{font-size:10px;font-weight:700}.mini-btn{border:1px solid var(--line);border-radius:8px;height:35px;padding:0 9px;background:#244437;color:#f1d8a4;font-weight:800;font-size:11px;white-space:nowrap}
.playarea{min-height:0;position:relative;isolation:isolate}.world-frame{height:100%;width:100%;overflow:hidden;background:radial-gradient(#568872,#092119);position:relative}#gameCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}#pins{position:absolute;inset:0;pointer-events:none}.poi{pointer-events:auto;position:absolute;display:flex;align-items:center;flex-direction:column;gap:4px;transform:translate(-50%,-100%);background:transparent;border:0;text-shadow:0 2px 5px #0b1c16;padding:7px;z-index:2;min-width:58px;filter:drop-shadow(0 3px 6px #0007);transition:filter .2s}.poi-glyph{width:43px;height:48px;display:grid;place-items:center;background:linear-gradient(150deg,#f7db9d,#a87430);clip-path:polygon(50% 100%,7% 34%,15% 11%,49% 0,85% 11%,93% 34%);color:#15372a;font-size:25px;font-weight:900;box-shadow:0 1px 10px #fff5}.poi-name{font-size:11px;font-weight:800;background:#102820e8;color:#ffe9bd;padding:5px 9px;border:1px solid #e5c48688;border-radius:9px;white-space:nowrap;max-width:145px;text-overflow:ellipsis;overflow:hidden}.poi.near{filter:drop-shadow(0 0 10px #ffd17a)}.poi.near .poi-glyph{background:linear-gradient(145deg,#fff4c9,#dfb250);animation:pop 1.7s ease-in-out infinite}.poi:hover .poi-name{background:#41604a}
.scene-label{position:absolute;top:16px;left:16px;z-index:1;display:flex;gap:8px;align-items:center;background:#0a2620b8;border:1px solid #deb87399;border-radius:12px;padding:10px 12px;color:#fff0d1;letter-spacing:.3px;box-shadow:0 6px 20px #0004;font:600 13px Cinzel,Georgia,serif;pointer-events:none}.scene-dot{display:block;width:8px;height:8px;background:#e7c57f;transform:rotate(45deg)}.environment-label{position:absolute;right:12px;top:20px;font-size:10px;letter-spacing:1.5px;font-weight:800;color:#f3dfb9;text-shadow:0 2px 7px #0009}.environment-label span{color:#e4a74f}.loading{position:absolute;inset:0;display:grid;place-items:center;background:#0f2b24;color:#e6c98b;font:600 22px Cinzel,Georgia,serif;z-index:6;transition:opacity .6s}.loading.hidden{opacity:0;pointer-events:none}
.toast{position:absolute;top:75px;left:50%;transform:translate(-50%,-15px);background:#132e27f2;color:#ffe5ab;padding:10px 15px;border:1px solid var(--gold);border-radius:12px;box-shadow:var(--shadow);font-size:13px;font-weight:800;z-index:10;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:88%;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
.movement{position:absolute;left:max(12px,env(safe-area-inset-left));bottom:12px;display:grid;grid-template-columns:54px 54px;gap:9px;z-index:3}.movement button{height:54px;width:54px;border:1px solid #f4d69d;box-shadow:inset 0 1px #fff6,0 5px 13px #0007;border-radius:16px;background:#153d33df;color:#ffebb9;font-size:26px;touch-action:none;user-select:none}.movement button:active{background:#ba934f;color:#15251f}.movement small{grid-column:1/-1;color:#fff1d2;font-size:9px;letter-spacing:1.5px;font-weight:800;text-align:center;text-shadow:0 2px 5px black}.help{position:absolute;right:12px;bottom:16px;width:44px;height:44px;border-radius:50%;background:#17352acc;border:1px solid #dfbb7b;color:#ffe4ac;font-weight:800;font-size:20px;z-index:3}
.quest-hud{padding:12px 18px 12px;background:linear-gradient(100deg,#183b31,#102c25);border-top:1px solid #c4a56e88;position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px 12px}.quest-top{display:flex;align-items:center;gap:14px;min-width:0}.quest-top>div{min-width:0}.eyebrow{font-size:10px;letter-spacing:1.7px;color:#e2c388;font-weight:800}.quest-top h1{margin:4px 0 0;font:600 clamp(14px,3.6vw,19px)/1.25 Cinzel,Georgia,serif;color:#fff1d2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quest-count{color:#ecd49e;border:1px solid var(--line);background:#294b38;border-radius:9px;padding:7px;font-size:12px;font-weight:800}.meter{height:6px;background:#304d3e;border-radius:10px;overflow:hidden;grid-column:1}.meter span{display:block;height:100%;width:0;background:linear-gradient(90deg,#b98e45,#fae0a2);transition:width .3s}.guide-button{grid-column:2;grid-row:1/3;min-width:105px;max-width:130px;align-self:center;padding:11px 13px;border:1px solid #ffe0a6;border-radius:12px;background:linear-gradient(145deg,#dfb66c,#ad823d);color:#1a3329;font-weight:900;box-shadow:0 4px 0 #6c512b}
.nav{display:flex;gap:4px;align-items:stretch;justify-content:space-around;background:#10271f;border-top:1px solid #b78e5399;padding:6px max(10px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));z-index:4}.nav button{flex:1;min-height:58px;max-width:190px;background:transparent;border:0;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;color:#eed8a8}.nav button:active,.nav button:hover{background:#2b4b3a}.nav button span{font:500 23px Georgia,serif;line-height:1}.nav button small{font-size:9px;font-weight:800;letter-spacing:1.2px}
.overlay{position:fixed;inset:0;z-index:30;display:none;align-items:flex-end;justify-content:center;background:rgba(0,13,13,.67);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);padding:18px 16px max(18px,env(safe-area-inset-bottom))}.overlay.open{display:flex}.dialog{position:relative;width:min(520px,100%);max-height:min(87dvh,850px);overflow:auto;background:linear-gradient(145deg,#204438,#112b25 66%,#19372e);border:1px solid #e1c180;border-radius:22px;padding:27px 23px 23px;color:#e9f0dd;box-shadow:0 16px 55px #000b,inset 0 0 0 2px #d2a96a20;scrollbar-width:thin}.dialog:before{content:'✦';position:absolute;left:16px;top:5px;font-size:24px;color:#bd9e62;opacity:.45}.dialog-close{position:absolute;right:14px;top:12px;display:grid;place-items:center;width:39px;height:39px;color:#f8e0b3;background:#274b3c;border:1px solid #d1aa66;border-radius:50%;font-size:25px}.dialog h2{font:600 clamp(24px,6vw,34px)/1.11 Cinzel,Georgia,serif;color:#ffdf9c;margin:12px 38px 18px 0}.dialog h3{font:600 17px Cinzel,Georgia,serif;color:#f8dfb1;margin:17px 0 10px}.dialog-body p{font-size:15px;line-height:1.63;color:#e5ebdc}.dialog-body p:first-child{margin-top:0}.dialog-body .muted,.muted{color:#becdc2;font-size:12px;line-height:1.5}.dialog-actions{display:grid;gap:10px;margin-top:20px}.dialog .action{min-height:50px;border:1px solid #f9dda3;border-radius:12px;background:linear-gradient(130deg,#e9c989,#c49752);color:#182f24;font-weight:900;font-size:14px;padding:12px}.dialog .action.secondary{background:#284e3d;color:#ffebbd;border-color:#bca06b}.dialog .action:active{transform:translateY(2px)}.dialog-art{background:linear-gradient(130deg,#325844,#182f26);border-radius:14px;padding:17px;margin:3px 0 18px;border:1px solid #d8b87b88;display:flex;align-items:center;gap:14px;font:500 21px/1.3 Georgia,serif;color:#f9dba7}.dialog-art .crown{font-size:43px;color:#f5cf79}.dialog-note{border-left:3px solid #ecd198;background:#f1d39a12;color:#f7e9c9;border-radius:3px 10px 10px 3px;padding:12px 15px;font:italic 17px/1.4 Georgia,serif;margin:20px 0}.questline{display:grid;gap:12px}.questline>div{display:grid;grid-template-columns:37px 1fr;grid-template-rows:auto auto;gap:1px 10px;align-items:center;background:#264a3a;border:1px solid #c2a87966;border-radius:11px;padding:10px}.questline>div span{grid-row:1/3;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e6c386;color:#173428;font-weight:900}.questline>div b{font-size:15px;color:#ffe5b0}.questline>div small{color:#c7d4c9}.passport-banner{display:flex;align-items:center;gap:17px;background:linear-gradient(130deg,#27513b,#152b26);border-radius:13px;padding:18px 14px;border:1px solid #c9ae68}.passport-banner .crest{font-size:55px;color:#e6c88a}.passport-banner h3{margin:5px 0}.passport-banner p{margin:0;color:#e5c486}.passport-banner small{letter-spacing:1.3px;font-weight:700;color:#d2b678}.badge-grid{display:flex;flex-wrap:wrap;gap:9px}.badge-item{background:#34523a;border:1px solid #d4ac63;border-radius:25px;color:#f3dba8;padding:9px 13px;font-size:13px;font-weight:800}.achievement{background:linear-gradient(120deg,#294e3e,#1a352d);border:1px solid #ddbe80;border-radius:14px;padding:17px;display:flex;gap:12px;align-items:center}.achievement>span{font-size:37px;color:#f7d88a}.achievement b{display:block;font:600 21px Cinzel,Georgia,serif;color:#f7d99f}.achievement small{display:block;font-size:12px;color:#b9ccbe;margin-top:3px}.achievement.large{box-shadow:0 0 30px #c6973d44}.reference-photo{width:100%;height:auto;border-radius:13px;border:1px solid #d8bc8a;display:block;margin:14px 0}
@keyframes pop{50%{transform:translateY(-6px)}}
@media(min-width:850px){#app{grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:68px minmax(0,1fr) auto} .topbar{grid-column:1/-1}.playarea{grid-column:1;grid-row:2/4}.quest-hud{grid-column:2;grid-row:2;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;border-top:0;border-left:1px solid var(--line);padding:25px 18px}.quest-top{align-items:flex-start}.quest-top h1{white-space:normal;font-size:23px}.guide-button{max-width:none;min-height:48px}.nav{grid-column:2;grid-row:3;border-left:1px solid var(--line)}.environment-label{top:auto;bottom:20px;right:16px}.overlay{align-items:center}}
@media(max-width:600px){.topbar{height:59px;min-height:59px;padding-top:max(4px,env(safe-area-inset-top));}.brand-mark{width:29px;height:29px;font-size:23px}.brand strong{font-size:12px}.brand small{font-size:7.5px;letter-spacing:1px}.xp-pill{height:32px;padding:0 6px}.xp-pill small{display:none}.mini-btn{height:32px;padding:0 7px;font-size:10px}.environment-label{font-size:8px;top:auto;bottom:15px;right:13px}.scene-label{font-size:10px;padding:7px 9px;top:8px;left:9px}.poi-glyph{width:36px;height:40px;font-size:21px}.poi-name{font-size:9px;max-width:100px;padding:4px 6px}.quest-hud{padding:9px 12px}.quest-top h1{font-size:13px}.eyebrow{font-size:8px}.guide-button{min-width:93px;font-size:12px;padding:10px}.nav button{min-height:48px}.nav button span{font-size:20px}.nav button small{font-size:8px}.movement{grid-template-columns:52px 52px}.movement button{width:52px;height:52px}.dialog{padding:27px 18px 17px}.dialog h2{font-size:25px}}
@media(max-height:640px) and (max-width:849px){.topbar{height:46px;min-height:46px}.quest-hud{padding:6px 12px;gap:4px}.quest-top h1{font-size:12px;margin:0}.eyebrow{font-size:8px}.nav{padding:2px}.nav button{min-height:43px}.nav button small{font-size:8px}.movement{bottom:4px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* V17: contextual one-tap interaction for mobile visitors. */
.interact{position:absolute;right:12px;bottom:77px;z-index:4;max-width:min(230px,56%);min-height:48px;padding:10px 13px;border-radius:13px;border:2px solid #fff0c0;background:linear-gradient(135deg,#f4dba1,#c99645);color:#16362b;font-size:12px;font-weight:900;line-height:1.3;text-align:center;box-shadow:0 5px 0 #785628,0 8px 20px #0009;animation:interact-glow 2.5s ease-in-out infinite;}
.interact[hidden]{display:none!important;}
.interact:active{transform:translateY(2px);box-shadow:0 2px 0 #785628;}
@keyframes interact-glow{50%{filter:brightness(1.14);}}
@media(max-width:600px){.interact{right:10px;bottom:70px;font-size:11px;max-width:53%;}}
@media(prefers-reduced-motion:reduce){.interact{animation:none;}}

/* V18: curated cultural mini-management; purposeful low-friction touch targets. */
.archive-banner{display:flex;gap:14px;align-items:center;border:1px solid #e1bd74b3;border-radius:13px;padding:14px;background:linear-gradient(140deg,#5f4830,#2f3029 45%,#193b32);margin-bottom:16px}
.archive-banner .archive-symbol{font:50px Georgia,serif;color:#f4d79b;text-shadow:0 2px 10px #e9c47b77}
.archive-banner b{font:600 18px/1.3 Georgia,serif;color:#f6deb0;display:block}
.archive-banner small{font-size:12px;line-height:1.5;color:#dae5d7;display:block;margin-top:6px}
.archive-meter{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#f0ddbb;font-size:12px;font-weight:800;letter-spacing:.4px;margin:13px 0 7px}
.archive-track{height:9px;background:#0c211f;border:1px solid #8f7654;border-radius:8px;overflow:hidden;margin-bottom:14px}
.archive-track span{height:100%;display:block;background:linear-gradient(90deg,#c38b44,#ffe0a0);transition:width .3s ease}
.archive-shelf{display:grid;gap:9px}
.archive-slot{display:flex;align-items:center;gap:11px;background:linear-gradient(120deg,#324537,#24382d);border:1px solid #92734a;border-radius:12px;padding:10px 12px;box-shadow:inset 0 -4px 0 #0e211650}
.archive-slot.placed{border-color:#eac77f;background:linear-gradient(110deg,#58442c,#334836)}
.archive-slot.locked{opacity:.65}
.archive-graphic{flex:none;width:48px;height:50px;display:grid;place-items:center;border-radius:10px;font:35px Georgia,serif;color:#f2d69f;background:radial-gradient(circle,#745937,#392a1e);border:1px solid #d2ac6a}
.archive-slot.locked .archive-graphic{filter:grayscale(1);opacity:.63}
.archive-copy{flex:1;min-width:0}.archive-copy b{display:block;font-size:13px;line-height:1.3;color:#f8dfa8}.archive-copy small{display:block;font-size:11px;line-height:1.45;color:#dfdfd3;margin-top:3px}
.archive-status{flex:none;font-size:10px;font-weight:900;color:#f5d38a;max-width:53px;text-align:right}
.archive-slot.placed .archive-status{font-size:18px;color:#b8ecaf}
.archive-journal{background:#e1c78c17;border:1px solid #d0ad6a80;border-radius:11px;padding:11px 12px;color:#f2dcae!important;font-size:13px!important}
@media(max-width:400px){.nav button{min-width:0}.nav button small{font-size:7px;letter-spacing:.5px}.nav button span{font-size:20px}.archive-copy b{font-size:12px}.archive-graphic{width:42px}}

.archive-dialog .dialog-actions{position:sticky;bottom:-19px;background:linear-gradient(180deg,rgba(17,43,37,0),#112b25 12px,#112b25);padding:15px 0 3px;z-index:3}
.archive-dialog .dialog-body{padding-bottom:4px}

/* V19-V21: restrained, readable game systems that fit one-handed mobile sessions */
.discovery-hero{background:linear-gradient(120deg,#4c4930,#1c4338);padding:18px;border:1px solid #d2ab64;border-radius:15px;margin-bottom:13px;box-shadow:inset 0 0 0 1px #fff1b01a}
.discovery-hero b{font:600 19px/1.25 Georgia,serif;color:#ffe4a8;display:block}
.discovery-hero p{color:#dde4d5;font-size:13px;line-height:1.55;margin:8px 0 0}
.mini-facts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:15px}.mini-facts span{border:1px solid #baa36f;border-radius:20px;background:#1b3b30;color:#f5daa6;padding:8px 10px;font-size:12px;font-weight:700}
.culture-card{display:flex;align-items:flex-start;gap:11px;border:1px solid #947b50;background:linear-gradient(130deg,#344a39,#1c342d);padding:12px;border-radius:14px;margin:10px 0}
.culture-card.finished{border-color:#dcb879;background:linear-gradient(130deg,#5b4b33,#264237)}
.culture-icon{display:grid;place-items:center;width:51px;height:51px;flex:0 0 51px;border-radius:12px;background:#142b25;border:1px solid #bf9b60;color:#fce0a4;font-size:25px}
.culture-copy{flex:1;min-width:0}.culture-copy b{display:block;color:#ffe2ad;font-size:15px;margin:1px 0 6px}.culture-copy small{display:block;color:#d6e2d8;font-size:12px;line-height:1.48}.chips{display:flex;flex-wrap:wrap;gap:5px;margin:9px 0}
.chip{border:1px solid #b6ad81;padding:5px 7px;border-radius:12px;font-size:10px;color:#e7d7b7}.chip.owned{background:#456347;border-color:#bdd5a5}.chip.missing{opacity:.7}
.culture-status{display:block;margin:9px 0 0!important;font-size:11px!important;color:#e8c88b!important;font-weight:800}
.community-count{display:flex;align-items:center;gap:12px;padding:12px 15px;background:#234638;border-radius:14px;border:1px solid #bd9b67}
.community-count span{font-size:28px;color:#ecc58d}.community-count b{font:700 23px Georgia,serif;color:#ffe8b3}.community-count small{color:#d3dfd2;font-size:11px}
.map-outlink{display:inline-block;color:#f9d58b;font-size:12px;text-decoration:underline;text-underline-offset:3px;margin:10px 0 4px;min-height:25px}
@media(max-width:390px){.culture-card{gap:8px;padding:9px}.culture-icon{width:42px;height:42px;flex-basis:42px}.culture-copy b{font-size:13px}.chip{font-size:9px}}
