/* Library, Story, Gallery + Atlas port (sci-fi x medieval, mobile-first) */
.lib-main{max-width:1240px;margin:0 auto;padding:8px clamp(14px,4vw,36px) 60px;position:relative;z-index:1}
.lib-nav a[aria-current]{color:#fff}.lib-nav a[aria-current]::after{transform:scaleX(1)}
.lib-tabs{position:sticky;top:58px;z-index:40;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:8px clamp(14px,4vw,36px);background:rgba(5,6,15,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.lib-tabs::-webkit-scrollbar{display:none}
.lib-tabs a{flex:none;font-family:var(--f-ui);font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--muted);padding:9px 14px;border-radius:999px;border:1px solid transparent;min-height:36px}
.lib-tabs a[aria-current]{color:#05060f;background:linear-gradient(90deg,var(--cyan),#9ff7ff);box-shadow:var(--glow)}
.lib-tabs a:hover{border-color:var(--line);color:#fff}
.es-todo-note{max-width:1240px;margin:10px auto 0;padding:8px 14px;font-size:14px;color:var(--gold);text-align:center}
.es-todo-note[hidden]{display:none}
html[data-lang=es] .es-todo::after{content:"EN";display:inline-block;margin-left:6px;padding:0 5px;border-radius:4px;font:700 9px/16px var(--f-ui);letter-spacing:.1em;color:#05060f;background:var(--gold);vertical-align:middle}
.lib-hero{text-align:center;padding:34px 0 18px}.lib-hero.sm{padding:26px 0 8px}
.lib-hero .kicker{font-family:var(--f-ui);font-size:12px;letter-spacing:.3em;color:var(--cyan);text-transform:uppercase;margin:0}
.lib-hero h1{font-size:clamp(30px,5.4vw,58px);margin:8px 0 10px;line-height:1.08}
.lib-hero .lead{max-width:760px;margin:0 auto 18px;color:var(--muted);font-size:18px}
.lib-search{position:relative;max-width:640px;margin:0 auto 12px}
.lib-search span{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--cyan);font-size:22px}
.lib-search input{width:100%;padding:15px 18px 15px 46px;border-radius:999px;border:1px solid var(--line);background:rgba(10,14,39,.8);font-size:17px;outline:none;box-shadow:inset 0 0 0 1px rgba(62,240,255,.08)}
.lib-search input:focus{border-color:var(--cyan);box-shadow:var(--glow)}
.lib-results{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));max-width:1000px;margin:10px auto 0;text-align:left}
.lr{display:flex;gap:10px;align-items:center;padding:8px 12px;border-radius:12px;text-decoration:none;color:var(--txt)}
.lr img{width:52px;height:52px;object-fit:contain;flex:none}.lr small{display:block;color:var(--dim);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.hub-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:26px}
.hub-tile{display:flex;flex-direction:column;padding:18px;border-radius:var(--r);text-decoration:none;color:var(--txt);transition:transform .2s,box-shadow .2s}
.hub-tile:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--cyan),var(--glow)}
.ht-art{display:grid;place-items:center;height:150px;margin-bottom:10px;background:radial-gradient(closest-side,rgba(155,92,255,.25),transparent);border-radius:12px}
.ht-img{max-height:150px;width:auto;object-fit:contain}
.hub-tile h2{font-family:var(--f-head);font-size:22px;margin:4px 0 6px}.hub-tile p{color:var(--muted);margin:0 0 10px;font-size:16px;flex:1}
.ht-go{font-family:var(--f-ui);font-size:12px;letter-spacing:.14em;color:var(--cyan)}
.lib-fine{text-align:center;color:var(--dim);font-size:14px;margin-top:28px}
.flts{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:end;margin:6px 0 12px}
.flt{display:flex;flex-direction:column;gap:4px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);text-align:left}
.flt select{min-width:150px;min-height:42px;padding:8px 12px;border-radius:10px;border:1px solid var(--line);background:#0a0e27;font-size:15px;text-transform:none;letter-spacing:0;color:var(--txt)}
.flt-count{font-family:var(--f-ui);font-size:12px;color:var(--cyan);padding:0 0 12px 6px}
.lc-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.lc{border-radius:14px;position:relative;overflow:hidden;--rc:var(--line)}
.lc[hidden],.gi[hidden],[data-group-sec][hidden]{display:none!important}
.lc-open{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;height:100%;padding:12px 10px 12px;text-align:center}
.lc-open:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px;border-radius:14px}
.lc-img{width:120px;height:120px;object-fit:contain;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45));transition:transform .25s}
.lc:hover .lc-img{transform:translateY(-4px) scale(1.04)}
.lc-name{font-size:15px;line-height:1.2}.lc-meta{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
.lc-type{font-size:12px;color:var(--dim);line-height:1.25}
.lc::before{content:"";position:absolute;inset:0;border-radius:14px;padding:1px;background:linear-gradient(160deg,var(--rc),transparent 60%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.r-common{--rc:#94a3b8}.r-uncommon{--rc:#4dffa8}.r-rare{--rc:#3ef0ff}.r-epic{--rc:#b07bff}.r-mythic{--rc:#ffcf5a}.r-immortal{--rc:#ff4fd8}
.chip{display:inline-block;padding:1px 8px;border-radius:999px;font:600 10px/18px var(--f-ui);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--rc,var(--line));color:var(--rc,var(--muted))}
.chip.pk{--rc:#7c8ad6}
.lib-empty{text-align:center;color:var(--muted);padding:30px}
.ch-sec{margin:26px 0 8px}.sec-h{display:inline;font-family:var(--f-head);font-size:clamp(22px,3vw,30px)}.sec-n{font-family:var(--f-ui);color:var(--cyan);font-size:13px;margin-left:8px}
.sec-p{color:var(--muted);margin:4px 0 14px}
.jump{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:8px}
.jump a{font-size:13px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--muted)}
.jump a:hover{color:#fff;border-color:var(--cyan)}
/* dialog */
.lc-dialog{max-width:min(860px,94vw);max-height:90vh;width:100%;padding:0;border:1px solid var(--line);border-radius:18px;color:var(--txt);background:linear-gradient(160deg,#121a45,#0a0e27 70%);box-shadow:0 0 60px rgba(62,240,255,.25)}
.lc-dialog::backdrop{background:rgba(3,4,12,.75);backdrop-filter:blur(4px)}
.lc-x{position:sticky;top:8px;float:right;margin:8px;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#0a0e27;cursor:pointer;z-index:2}
.lc-dbody{display:grid;gap:18px;padding:22px;grid-template-columns:1fr}
@media(min-width:700px){.lc-dbody{grid-template-columns:260px 1fr}.lc-dbody.is-ch{grid-template-columns:240px 1fr}}
.d-art{align-self:start;display:grid;place-items:center;background:radial-gradient(closest-side,rgba(155,92,255,.3),transparent);border-radius:14px;min-height:220px}
.d-img{width:240px;height:240px;object-fit:contain}
.d-txt h3{font-family:var(--f-head);font-size:28px;margin:2px 0 8px;line-height:1.1}.d-txt h4{margin:16px 0 4px;color:var(--cyan);font-family:var(--f-ui);font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.d-type{margin:0;font-family:var(--f-ui);font-size:11px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase}
.d-chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 8px}.d-flavor{font-style:italic;color:#d9defa;font-size:18px}.d-line{color:var(--muted);margin:6px 0}
.ph,.ph-note{color:var(--gold)!important;opacity:.85}.ph-note{text-align:center;font-size:14px;margin-top:18px}
.gi-big{margin:0;grid-column:1/-1;text-align:center}.gi-big img{max-height:70vh;width:auto}.gi-big figcaption{margin-top:8px;color:var(--muted)}
/* rule cards */
.rdeck{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.rc{position:relative;min-height:190px;perspective:900px;cursor:pointer;outline:none}
.rc-f,.rc-b{position:absolute;inset:0;padding:12px 14px;border-radius:12px;backface-visibility:hidden;transition:transform .5s;overflow:auto;border:1px solid var(--line)}
.rc-f{background:linear-gradient(160deg,rgba(255,207,90,.12),rgba(10,14,39,.9))}.rc-b{background:linear-gradient(160deg,rgba(62,240,255,.12),rgba(10,14,39,.95));transform:rotateY(180deg)}
.rc.flipped .rc-f{transform:rotateY(180deg)}.rc.flipped .rc-b{transform:rotateY(360deg)}
.rc h5{margin:0 0 6px;font-size:15px;color:var(--gold)}.rc p{margin:0 0 6px;font-size:14px;line-height:1.35}.rc small{color:var(--dim);font-size:12px}
.rc:focus-visible .rc-f,.rc:focus-visible .rc-b{outline:2px solid var(--cyan)}
.rc-src a{display:block;font-size:12px;word-break:break-word}
@media(prefers-reduced-motion:reduce){.rc-f,.rc-b{transition:none}.lc-img,.hub-tile{transition:none}}
/* gallery */
.g-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.gi{margin:0;border-radius:14px;overflow:hidden;padding:10px}.gi-open{all:unset;cursor:pointer;display:block;border-radius:10px;overflow:hidden;background:#070a1c}
.gi-img{width:100%;height:170px;object-fit:contain}.gi figcaption{font-size:14px;color:var(--muted);padding:6px 2px 0}
/* story */
.st-book{margin:26px 0}.st-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.st-card{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:14px;text-decoration:none;color:var(--txt);transition:transform .2s}
.st-card:hover{transform:translateY(-3px);box-shadow:0 0 0 1px var(--cyan)}
.st-card small{font-family:var(--f-ui);font-size:11px;letter-spacing:.16em;color:var(--cyan);text-transform:uppercase}
.st-card h3{margin:0;font-family:var(--f-head);font-size:19px}.st-card>span{color:var(--dim);font-size:14px}
.st-img{width:100%;height:120px;object-fit:contain;border-radius:10px;background:rgba(0,0,0,.25)}
.st-card.legend{border-top:3px solid var(--lc)}
.st-page{max-width:820px;margin:0 auto;padding-top:24px}
.st-page .kicker{font-family:var(--f-ui);font-size:12px;letter-spacing:.24em;color:var(--cyan);text-transform:uppercase;text-align:center;margin:0}
.st-page h1{text-align:center;font-size:clamp(30px,5vw,52px);margin:8px 0 16px}
.st-art{margin:0 0 18px;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#070a1c}.st-hero{width:100%;height:auto;display:block}
.st-page .lead{font-size:19px;color:#d6dbf7;text-align:center}
.st-page h2{font-family:var(--f-head);margin:26px 0 10px}
.st-quests{display:grid;gap:10px;padding:0;list-style:none;counter-reset:q}
.st-quests li{padding:12px 14px 12px 50px;border-radius:12px;position:relative;counter-increment:q}
.st-quests .qn{position:absolute;left:14px;top:12px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:700 13px var(--f-ui);color:#05060f;background:var(--gold)}
.st-quests p{margin:2px 0;color:var(--muted)}.st-quests small{color:var(--dim)}
.motto{text-align:center;font-family:var(--f-head);font-size:22px;color:var(--lc,var(--gold));margin:6px 0 18px}
.lg-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.lg-box{padding:14px 16px;border-radius:14px}.lg-box h2{font-size:13px!important;font-family:var(--f-ui)!important;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin:0 0 8px!important}
.lg-box h3{margin:0 0 4px;font-family:var(--f-head)}.lg-box ul{margin:0;padding-left:18px}.lg-box li small{color:var(--dim)}
.lg-box.rival{border-left:3px solid var(--lc)}
.st-nav{display:flex;justify-content:space-between;gap:10px;margin:30px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.st-nav a{min-height:44px;display:inline-flex;align-items:center;padding:0 10px}
/* atlas port */
.atlas-sitenav{position:relative;z-index:60;display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:8px 16px;background:rgba(5,6,15,.9);border-bottom:1px solid var(--line);font-size:14px}
.atlas-sitenav a{color:var(--muted);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}.atlas-sitenav a:hover{color:#fff}
.brand-mini{gap:6px;font-family:var(--f-head);color:#fff!important;margin-right:auto}
@media(max-width:600px){.lc-grid{grid-template-columns:repeat(2,1fr);gap:10px}.lc-img{width:96px;height:96px}.g-grid{grid-template-columns:repeat(2,1fr)}.gi-img{height:120px}.lib-tabs{top:52px}.flt select{min-width:130px}}
.ch-art{max-width:520px;margin-left:auto;margin-right:auto}.ch-art .st-hero{max-height:150px;object-fit:contain;padding:10px}
.lc-dialog[open]{position:fixed;inset:0;margin:auto;height:fit-content}
/* story prose (app synced static/lore/story/lore.json) */
.st-prose{max-width:680px;margin:18px auto 8px;font-size:18px;line-height:1.7;color:#dfe3fb}
.st-prose p{margin:0 0 1em}
.st-prose .st-read{display:block;text-align:center;font-family:var(--f-ui);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
@media(max-width:480px){.st-prose{font-size:17px;line-height:1.65}}
.atlas-port .hero>*,.atlas-port main>*{min-width:0}.atlas-port .hero h1{overflow-wrap:anywhere}.atlas-port{overflow-x:hidden}