:root{--ink:#182536;--night:#111a28;--paper:#f5f1e8;--paper-deep:#e7dfd1;--gold:#bc8429;--gold-soft:#d7af67;--line:#cfc3af;--muted:#667084}
*{box-sizing:border-box}
body.guide-shell{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:"Gowun Batang",Georgia,serif}
button{font:inherit}
.guide-view{display:none;min-height:100vh}.guide-view.is-active{display:block}
.eyebrow{margin:0;color:var(--gold);font:600 .73rem/1.25 "Cinzel",serif;letter-spacing:.2em}
.splash-view{position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 45%,#31465c 0,#1c2b3b 42%,#101924 82%);color:#f7f1e5;cursor:pointer;isolation:isolate}
.splash-view:before,.splash-view:after{position:absolute;content:"";pointer-events:none}.splash-view:before{inset:16px;border:1px solid rgba(215,175,103,.62)}.splash-view:after{inset:24px;background:linear-gradient(130deg,transparent 25%,rgba(255,255,255,.035) 50%,transparent 72%);z-index:-1}
.splash-frame{position:absolute;width:min(84vw,1100px);aspect-ratio:1.65;border:1px solid rgba(215,175,103,.35);transform:rotate(-2deg);box-shadow:0 0 0 18px rgba(215,175,103,.025),0 0 80px rgba(0,0,0,.25)}
.splash-content{position:relative;width:min(100% - 40px,1060px);padding:72px 0 62px;text-align:center}.splash-content h1{margin:8px 0 0;font-size:clamp(3rem,9vw,8.2rem);font-weight:400;letter-spacing:.15em;line-height:1.08;text-shadow:0 4px 30px rgba(0,0,0,.35)}
.splash-subtitle{margin:14px 0 38px;font:600 clamp(.75rem,1.8vw,1rem)/1 "Cinzel",serif;letter-spacing:.65em;color:var(--gold-soft)}.enter-copy{margin:0 0 32px;color:rgba(247,241,229,.74);font-size:.88rem}
.splash-factions{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:8px;margin:0 auto;width:min(100%,820px);cursor:default}.splash-faction{min-height:72px;padding:14px 18px;text-align:left;border:1px solid rgba(247,241,229,.25);background:rgba(10,18,28,.45);color:#f7f1e5;cursor:pointer;text-decoration:none;transition:background .2s,border-color .2s,transform .2s}.splash-faction:hover,.splash-faction:focus-visible{border-color:var(--gold-soft);background:rgba(188,132,41,.22);transform:translateY(-3px)}.splash-faction strong{display:block;font-size:1rem}.splash-faction small{display:block;margin-top:5px;color:rgba(247,241,229,.64);font-size:.69rem}
.guide-topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:1240px;margin:0 auto;padding:22px 32px;border-bottom:1px solid var(--line)}.brand-button,.brand-link{border:0;background:transparent;color:var(--ink);padding:0;text-align:left;cursor:pointer;font-weight:700;font-size:1.05rem;text-decoration:none}.brand-button span,.brand-link span{display:block;margin-bottom:3px;color:var(--gold);font:600 .57rem/1 "Cinzel",serif;letter-spacing:.18em}.guide-topbar nav{display:flex;gap:20px}.topnav-button{border:0;background:transparent;padding:6px 0;color:#697080;cursor:pointer;font-size:.87rem;text-decoration:none}.topnav-button.active,.topnav-button:hover{color:var(--ink);border-bottom:1px solid var(--gold)}
.hub-main,.faction-main,.codex-title,.codex-main{width:min(100% - 64px,1240px);margin:0 auto}.hub-main{padding:82px 0 64px}.hub-intro{max-width:680px;margin-bottom:45px}.hub-intro h2,.codex-title h2,.faction-hero h1{margin:10px 0 13px;font-size:clamp(2.2rem,5vw,4.5rem);font-weight:400;letter-spacing:-.04em}.hub-intro span{color:var(--muted);font-size:1rem;line-height:1.8}
.faction-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.faction-index :is(button,a){position:relative;min-height:176px;padding:26px 30px;overflow:hidden;text-align:left;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#f8f5ef;color:var(--ink);cursor:pointer;text-decoration:none;transition:background .2s,color .2s}.faction-index :is(button,a):hover,.faction-index :is(button,a):focus-visible{background:var(--night);color:#f8f5ef}.faction-index :is(button,a):after{position:absolute;right:23px;bottom:18px;content:"↗";font:1.6rem/1 Georgia;color:var(--gold)}.faction-index i{display:block;margin-bottom:9px;color:var(--gold);font:600 .66rem/1 "Cinzel",serif;letter-spacing:.15em;font-style:normal}.faction-index strong{display:block;font-size:1.45rem}.faction-index small{display:block;max-width:85%;margin-top:12px;color:#697080;font-size:.86rem;line-height:1.55}.faction-index :is(button,a):hover small{color:#cbd0d8}
.codex-entry{display:flex;align-items:center;gap:18px;width:100%;margin-top:42px;padding:21px 24px;border:1px solid var(--night);background:var(--night);color:#f8f5ef;text-align:left;cursor:pointer;text-decoration:none}.codex-entry span{color:var(--gold-soft);font:600 .65rem/1 "Cinzel",serif;letter-spacing:.16em}.codex-entry b{font-weight:400}.codex-entry i{margin-left:auto;color:var(--gold-soft);font-size:1.4rem;font-style:normal}
.faction-main{padding:44px 0 80px}.back-button{padding:0;border:0;background:transparent;color:#666f7e;cursor:pointer;text-decoration:none}.back-button:hover{color:var(--gold)}.faction-hero{margin:28px 0 55px;padding:38px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.faction-hero h1{margin-bottom:13px}.faction-hero p:last-child{max-width:790px;margin:0;color:var(--muted);font-size:1rem;line-height:1.9}.faction-section{margin-top:52px}.faction-section>header{display:flex;align-items:baseline;gap:16px;margin-bottom:17px}.faction-section h2{margin:0;font-size:1.45rem}.faction-places{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.place-card{position:relative;min-height:195px;padding:20px;overflow:hidden;border:1px solid var(--line);background:#263849 center/cover;color:#f7f1e5}.place-card:before{position:absolute;inset:0;content:"";background:linear-gradient(0deg,rgba(12,20,31,.86),rgba(12,20,31,.12))}.place-card>*{position:relative}.place-card span{display:block;color:var(--gold-soft);font:600 .61rem/1 "Cinzel",serif;letter-spacing:.16em}.place-card h3{margin:10px 0 7px;font-size:1.25rem}.place-card p{margin:0;max-width:95%;color:rgba(255,255,255,.82);font-size:.83rem;line-height:1.6}.faction-character-groups>.faction{margin:0}.faction-character-groups>.faction>h3{display:none}.faction-character-groups .character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.faction-character-groups .character{margin:0}
.codex-title{padding:60px 0 27px}.codex-title h2{font-size:clamp(2rem,4vw,3.8rem)}.codex-view .tabs{position:sticky;top:0;z-index:5;display:flex;gap:0;width:100%;max-width:none;margin:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(245,241,232,.96);padding-left:max(32px,calc((100vw - 1240px)/2))}.codex-view .tabs button{min-width:100px;border:0;border-right:1px solid var(--line);background:transparent;padding:16px 24px;color:#657084;cursor:pointer}.codex-view .tabs button.active{background:var(--night);color:#f8f5ef}.codex-main{padding:48px 0 80px}.codex-view footer{display:none}
@media (max-width:760px){.splash-view:before{inset:10px}.splash-content{padding:58px 0 46px}.splash-content h1{font-size:clamp(2.6rem,12vw,4.5rem);letter-spacing:.08em}.splash-factions{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.splash-faction{min-height:66px;padding:12px}.splash-faction strong{font-size:.88rem}.guide-topbar{padding:18px 20px}.guide-topbar nav{gap:13px}.hub-main,.faction-main,.codex-title,.codex-main{width:min(100% - 40px,1240px)}.hub-main{padding-top:52px}.faction-index{grid-template-columns:1fr}.faction-index button{min-height:145px;padding:22px}.faction-places{grid-template-columns:1fr}.faction-character-groups .character-grid{grid-template-columns:1fr}.codex-view .tabs{overflow:auto;padding-left:20px}.codex-view .tabs button{min-width:82px;padding:14px 16px}.codex-title{padding-top:42px}.codex-main{padding-top:32px}.faction-hero{margin-bottom:40px;padding:28px 0}.codex-entry{align-items:flex-start;flex-wrap:wrap}.codex-entry i{display:none}}
@media (max-width:420px){.splash-factions{grid-template-columns:1fr 1fr}.splash-faction small{display:none}.brand-button{font-size:.95rem}.topnav-button{font-size:.8rem}}