/* The crawlable pages (items, monsters, zones, dungeons, bosses, servers, market, guides), written by
   tools/seo/build-seo-pages.js. Same tokens as site/index.html; change one, change both. */
:root{
  --night:#090B15; --night-2:#0E1124; --panel:#12162D; --panel-2:#171C38; --slot:#0B0E1E;
  --line:#22284A; --line-2:#323A66;
  --ink:#EEECF6; --ink-2:#B3B7D3; --muted:#7D84A8; --faint:#565D82;
  --kinah:#EBAE4C; --kinah-ink:#F8D598; --kinah-deep:#B9781F; --kinah-bg:rgba(235,174,76,.10);
  --aether:#5ED8CB; --aether-bg:rgba(94,216,203,.10);
  --g-common:#CDD3E2; --g-rare:#62D98B; --g-legend:#5AA6FF; --g-unique:#F3D35E; --g-epic:#B48BFF;
  --ow:#62D98B; --ow-bg:rgba(98,217,139,.12); --ow-line:rgba(98,217,139,.45);
  --ab:#B48BFF; --ab-bg:rgba(180,139,255,.12); --ab-line:rgba(180,139,255,.45);
  --no:#FF7D6B; --no-bg:rgba(255,125,107,.11); --no-line:rgba(255,125,107,.45);
  --warn:#F2A35E; --up:#62D98B; --down:#FF7D6B;
  --f-display:"Unbounded","Segoe UI",system-ui,sans-serif;
  --f-body:"Figtree","Segoe UI",system-ui,-apple-system,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{background:var(--night);color:var(--ink);font:400 15px/1.6 var(--f-body);margin:0;overflow-x:hidden;
  background-image:radial-gradient(900px 420px at 12% -8%,rgba(235,174,76,.08),transparent 70%),radial-gradient(800px 380px at 92% 0%,rgba(94,216,203,.06),transparent 70%);background-repeat:no-repeat}
a{color:var(--kinah-ink);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--f-display);font-weight:600;letter-spacing:-.02em;text-wrap:balance;margin:0}
h1{font-size:clamp(26px,4vw,40px);line-height:1.15}
h2{font-size:clamp(19px,2.2vw,24px);margin:40px 0 12px}
h3{font-size:16px;margin:24px 0 8px}
p{margin:0 0 12px}
.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
:focus-visible{outline:2px solid var(--kinah);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-999px}
.skip:focus{left:12px;top:12px;z-index:99;background:var(--panel);padding:8px 12px;border-radius:8px}

/* header */
.hdr{position:sticky;top:0;z-index:30;background:rgba(9,11,21,.86);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;gap:18px;min-height:60px}
.brand{display:flex;align-items:center;gap:10px;font:700 14px var(--f-display);letter-spacing:.02em;white-space:nowrap;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand .mark{width:32px;height:32px;display:block;flex:none;filter:drop-shadow(0 4px 14px rgba(235,174,76,.22))}
.nav{display:flex;align-items:stretch;align-self:stretch;gap:2px}
.nav>a,.ddb{display:flex;align-items:center;gap:4px;padding:0 12px;color:var(--muted);font:600 14.5px var(--f-body);border:0;border-bottom:2px solid transparent;background:none;cursor:pointer;white-space:nowrap}
.nav>a:hover,.ddb:hover,.ddb[aria-expanded="true"]{color:var(--ink);text-decoration:none}
.nav>a[aria-current="page"],.ddb[aria-current="page"]{color:var(--ink);border-bottom-color:var(--kinah)}
/* Guides and More dropdowns: the same rules live in site/index.html */
.dd{position:relative;display:flex}
.ddb svg{transition:transform .15s}
.ddb[aria-expanded="true"] svg{transform:rotate(180deg)}
.ddp{position:absolute;top:calc(100% + 1px);left:-6px;z-index:40;width:300px;background:var(--panel);border:1px solid var(--line-2);border-radius:14px;padding:8px;box-shadow:0 24px 60px -20px rgba(0,0,0,.85)}
.ddp[hidden],.msheet[hidden]{display:none}
.me{display:block;padding:8px 12px;border-radius:10px}
.me:hover,.me:focus-visible,.me[aria-current="page"]{background:var(--panel-2);text-decoration:none}
.me b{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.me small{display:block;color:var(--muted);font-size:12.5px;line-height:1.35}
.ddp .all{display:block;margin:4px 12px 2px;padding-top:9px;border-top:1px solid var(--line);color:var(--kinah-ink);font-weight:600;font-size:14px}
.hdr .sp{flex:1}
.me-btn{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:3px 12px 3px 3px;font-weight:600;font-size:13.5px;white-space:nowrap;color:var(--ink)}
.me-btn:hover{background:var(--panel-2);text-decoration:none}
.me-btn .av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2A2F5A,#3B2D63);color:var(--kinah-ink)}
@media (max-width:900px){.me-btn .l{display:none}.me-btn{padding:3px}.hdr .btn-sm .bl{display:none}.hdr .btn-sm{padding:8px 10px}}
.hdr .btn-sm svg{flex:none}
.mnav,.msheet{display:none}
.mnav>*{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 0 9px;color:var(--muted);font:600 12.5px var(--f-body);background:none;border:0;border-bottom:2px solid transparent;cursor:pointer}
.mnav>a:hover{text-decoration:none;color:var(--ink)}
.mnav>[aria-current="page"],.mnav .mbtn[aria-expanded="true"]{color:var(--ink);border-bottom-color:var(--kinah)}
.mh{margin:14px 12px 4px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--kinah-ink);font-weight:600}
.mg{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.hdr .msheet .wrap{display:block;min-height:0}
@media (max-width:900px){.hdr .wrap{gap:12px}.nav>a,.ddb{padding:0 9px;font-size:14px}}
@media (max-width:760px){
  .nav{display:none}
  .mnav{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
  .msheet:not([hidden]){display:block;border-top:1px solid var(--line);background:var(--night-2);max-height:calc(100vh - 120px);overflow:auto;padding-bottom:14px}
}
@media (max-width:560px){.mg{grid-template-columns:1fr}.hdr .btn-sm .bl{display:none}.hdr .btn-sm{padding:8px 10px}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:11px;padding:10px 16px;font-weight:700;font-size:14.5px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--ink);white-space:nowrap}
.btn:hover{text-decoration:none;background:rgba(255,255,255,.07)}
.btn-gold{color:#261702;background:linear-gradient(180deg,var(--kinah-ink),var(--kinah) 55%,#D9952F);border-color:#F6CB7C;box-shadow:0 10px 30px -12px rgba(235,174,76,.7)}
.btn-gold:hover{background:linear-gradient(180deg,#FBE1B0,var(--kinah) 55%,#D9952F)}
.btn-sm{padding:7px 12px;font-size:13px;border-radius:9px}

/* page */
main{padding-bottom:72px}
.crumbs{font-size:13px;color:var(--muted);display:flex;gap:8px;align-items:center;padding-top:22px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--ink)}
.head{display:flex;gap:18px;align-items:flex-start;margin-top:18px}
.head .lead{font-size:16.5px;color:var(--ink-2);max-width:70ch;margin-top:12px}
.tags{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px;font-size:13px;color:var(--muted)}
.cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.gc-Common{--gc:var(--g-common)} .gc-Rare{--gc:var(--g-rare)} .gc-Legend{--gc:var(--g-legend)} .gc-Unique{--gc:var(--g-unique)} .gc-Epic{--gc:var(--g-epic)}
.gname{color:var(--gc)}
a.gname{color:var(--gc)}
.chip{display:inline-flex;align-items:center;gap:6px;font:600 11px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--gc,var(--ink-2));padding:3px 8px;border-radius:999px;background:color-mix(in oklab,var(--gc,var(--ink-2)) 12%,transparent);border:1px solid color-mix(in oklab,var(--gc,var(--ink-2)) 35%,transparent)}
.kp{display:inline-flex;align-items:center;gap:6px;font:700 11.5px var(--f-body);padding:3px 9px;border-radius:999px;white-space:nowrap;border:1px solid}
.kp.ow{color:var(--ow);background:var(--ow-bg);border-color:var(--ow-line)}
.kp.ab{color:var(--ab);background:var(--ab-bg);border-color:var(--ab-line)}
.kp.no{color:var(--no);background:var(--no-bg);border-color:var(--no-line)}
.slot{position:relative;width:64px;height:64px;border-radius:12px;flex:none;background:radial-gradient(circle at 50% 40%,color-mix(in oklab,var(--gc) 26%,transparent),transparent 72%),var(--slot);border:1px solid color-mix(in oklab,var(--gc) 50%,var(--line))}
.slot img{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain}
.slot.sm{width:30px;height:30px;border-radius:7px;display:inline-block;vertical-align:middle;margin-right:8px}
.verdict{margin-top:22px;padding:16px 18px;border-radius:14px;border:1px solid var(--line-2);background:var(--panel);display:flex;gap:12px;align-items:flex-start;max-width:820px}
.verdict.ow{border-color:var(--ow-line);background:linear-gradient(90deg,var(--ow-bg),var(--panel) 60%)}
.verdict.ab{border-color:var(--ab-line);background:linear-gradient(90deg,var(--ab-bg),var(--panel) 60%)}
.verdict.no{border-color:var(--no-line);background:linear-gradient(90deg,var(--no-bg),var(--panel) 60%)}
.verdict b{display:block;font-size:16px}
.verdict span{color:var(--ink-2)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.card{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:14px 16px}
.card h3{margin:0 0 4px;font-size:15px}
.card p{margin:0;color:var(--ink-2);font-size:13.5px}
.card .k{margin-bottom:8px}
a.card{display:block;color:var(--ink)}
a.card:hover{text-decoration:none;border-color:var(--line-2);background:var(--panel-2)}
.stats{display:flex;gap:28px;flex-wrap:wrap;margin-top:18px}
.stats div b{display:block;font:600 22px var(--f-mono);color:var(--kinah-ink)}
.stats div span{font-size:12.5px;color:var(--muted)}

/* tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;background:rgba(255,255,255,.02);white-space:nowrap}
tr:last-child td{border-bottom:0}
td.r,th.r{text-align:right}
td.num{white-space:nowrap}
td .sub{display:block;color:var(--muted);font-size:12.5px}
tr.you td{background:var(--kinah-bg)}
.up{color:var(--up)} .down{color:var(--down)}
details{margin-top:10px}
details>summary{cursor:pointer;color:var(--kinah-ink);font-weight:600;padding:6px 0}
.cols{columns:3 240px;column-gap:24px;font-size:14px}
.cols a,.cols span{display:block;padding:3px 0;break-inside:avoid}
.links{display:flex;flex-wrap:wrap;gap:8px}
.links a{padding:6px 11px;border:1px solid var(--line);border-radius:999px;background:var(--panel);font-size:13.5px;color:var(--ink-2)}
.links a:hover{color:var(--ink);text-decoration:none;border-color:var(--line-2)}
.ex{display:inline-flex;font:700 10.5px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--warn);border:1px dashed rgba(242,163,94,.6);background:rgba(242,163,94,.08);border-radius:6px;padding:1px 7px;vertical-align:middle}
.note{font-size:13px;color:var(--muted);margin-top:10px}
.faq{max-width:820px}
.faq h3{font-family:var(--f-body);font-weight:700;letter-spacing:0;font-size:15.5px;margin:18px 0 4px}
.faq p{color:var(--ink-2)}
.prose{max-width:760px}
.prose p,.prose li{color:var(--ink-2)}
.prose li{margin:4px 0}
.letters{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.letters a{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:var(--panel);font-weight:700;color:var(--ink-2)}
.letters a[aria-current="page"]{border-color:var(--kinah);color:var(--kinah-ink)}

footer{border-top:1px solid var(--line);padding-block:30px;color:var(--muted);font-size:12.5px}
footer nav{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:14px;font-size:13.5px}
footer nav a{color:var(--ink-2)}
footer a{color:var(--ink-2)}
footer p{margin:4px 0}

/* calculators (tools/seo/calc.js) */
.calc{margin-top:12px;padding:16px;border:1px solid var(--line-2);border-radius:14px;background:var(--panel)}
.calc-form{display:flex;flex-wrap:wrap;gap:12px}
.calc-form label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--muted);font-weight:600}
.calc-form select,.calc-form input{background:var(--slot);color:var(--ink);border:1px solid var(--line-2);border-radius:9px;padding:8px 10px;font:500 14px var(--f-body);min-width:110px}
.calc .stats{margin:16px 0 4px}
.calc .tbl-wrap{margin-top:10px}

/* the install card (tools/seo/tracker-page.js cta()) */
.cta-card{margin:28px 0 8px;padding:18px 20px;border-radius:16px;border:1px solid color-mix(in oklab,var(--kinah) 45%,var(--line));background:linear-gradient(120deg,var(--kinah-bg),var(--panel) 55%);display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;max-width:880px}
.cta-card b{display:block;font:600 17px var(--f-display);letter-spacing:-.01em;color:var(--kinah-ink)}
.cta-card p{margin:6px 0 0;color:var(--ink-2);font-size:14px;max-width:60ch}
.cta-card .cta-sub{font-size:12.5px;color:var(--muted)}
.cta-btns{display:flex;gap:10px;flex-wrap:wrap}
.btn svg{flex:none}
ol.prose,ul.prose{padding-left:22px}

/* landing pages: hero with art, filter bar, picture cards (tools/seo/landing.js) */
.lhero{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:22px;margin-top:16px;min-height:280px;display:flex;align-items:flex-end;background:var(--night-2)}
.lhero .mosaic{position:absolute;inset:-30px -40px -30px 36%;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;transform:rotate(-6deg);align-content:center}
.lhero .mosaic img{width:100%;aspect-ratio:1;height:auto;object-fit:cover;border-radius:14px}
.lhero .mosaic>:nth-child(4n+2){transform:translateY(34px)} .lhero .mosaic>:nth-child(4n+4){transform:translateY(18px)}
.lhero .mosaic.icons{inset:-10px -20px -10px 46%;gap:12px}
.lhero .mz{display:grid;place-items:center;aspect-ratio:1;border-radius:16px;background:radial-gradient(circle at 50% 40%,color-mix(in oklab,var(--gc) 30%,transparent),transparent 72%),var(--slot);border:1px solid color-mix(in oklab,var(--gc) 50%,var(--line))}
.lhero .mz img{width:70%;height:70%;object-fit:contain}
.lhero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--night-2) 34%,rgba(14,17,36,.8) 56%,rgba(14,17,36,.2) 100%),linear-gradient(0deg,rgba(14,17,36,.85),transparent 50%)}
.lhero .tx{position:relative;z-index:1;padding:34px 34px 30px;max-width:580px}
.eyebrow{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--kinah-ink);font-weight:600;margin:0 0 10px}
.lhero h1{font-size:clamp(28px,4.2vw,42px);line-height:1.1}
.lhero .lead{color:var(--ink-2);font-size:16px;margin:12px 0 0}
.lstats{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:16px;font-size:13.5px;color:var(--muted)}
.lstats b{color:var(--ink);font:600 14px var(--f-mono);margin-right:5px}
.lcredit{font-size:12.5px;color:var(--muted);margin:8px 2px 0}
.lcredit a{color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--line-2)}
/* filter bar */
.lf{position:sticky;top:61px;z-index:20;display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:18px -16px 0;padding:12px 16px;background:rgba(9,11,21,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.lf[hidden]{display:none}
.lf-q{flex:1 1 260px;display:flex;align-items:center;gap:9px;background:var(--panel);border:1px solid var(--line-2);border-radius:12px;padding:0 13px;color:var(--muted)}
.lf-q:focus-within{border-color:var(--kinah)}
.lf-q input{flex:1;min-width:0;background:none;border:0;outline:0;padding:11px 0;font:400 15px var(--f-body);color:var(--ink)}
.lf-chips{display:flex;flex-wrap:wrap;gap:6px}
.lf-chips button,.lf-seg button{font:600 13.5px var(--f-body);color:var(--ink-2);cursor:pointer}
.lf-chips button{border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:6px 12px}
.lf-chips small{color:var(--faint);font:500 12px var(--f-mono);margin-left:5px}
.lf-chips [aria-pressed="true"]{background:var(--kinah-bg);border-color:var(--kinah);color:var(--kinah-ink)}
.lf-chips [aria-pressed="true"] small{color:var(--kinah)}
.lf-seg{display:flex;border:1px solid var(--line-2);border-radius:12px;overflow:hidden}
.lf-seg button{background:var(--panel);border:0;border-left:1px solid var(--line);padding:7px 11px}
.lf-seg button:first-child{border-left:0}
.lf-seg [aria-pressed="true"]{background:var(--kinah-bg);color:var(--kinah-ink)}
.lf-sel{display:none;gap:8px;width:100%}
.lf-sel select{flex:1;min-width:0;background:var(--panel);color:var(--ink);border:1px solid var(--line-2);border-radius:12px;padding:10px 12px;font:600 14px var(--f-body)}
.lf-n{margin:14px 0 0;color:var(--ink-2);font-size:14px}
.lf-x{margin-left:8px;background:none;border:1px solid var(--line-2);border-radius:8px;padding:3px 10px;color:var(--kinah-ink);font:600 13px var(--f-body);cursor:pointer}
/* sections and cards */
.ls{margin-top:34px}
.ls.sub{margin-top:20px}
.ls>h2{margin:0;display:flex;align-items:baseline;gap:10px}
.lh3{font-size:15px;margin:0 0 12px;color:var(--ink-2);display:flex;gap:8px;align-items:baseline}
.ls .n{font:500 13px var(--f-mono);color:var(--faint);letter-spacing:0}
.lp{color:var(--muted);margin:6px 0 16px}
.ls>h2+.lgrid{margin-top:14px}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.lgrid.sm{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px}
.ac{--tc:var(--g-legend);position:relative;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;color:var(--ink);transition:transform .15s,border-color .15s,box-shadow .15s}
.ac:hover,.ac:focus-visible{text-decoration:none;transform:translateY(-2px);border-color:color-mix(in oklab,var(--tc) 55%,var(--line));box-shadow:0 16px 40px -18px color-mix(in oklab,var(--tc) 50%,transparent)}
.t-party,.t-inst,.t-elyos{--tc:var(--aether)} .t-raid,.t-field{--tc:var(--kinah)} .t-trial,.t-named,.t-asmodian{--tc:var(--g-epic)} .t-sealed{--tc:var(--g-legend)} .t-asc,.t-materials{--tc:var(--g-rare)} .t-arena,.t-abyss{--tc:#FF7D6B} .t-other,.t-consumables{--tc:var(--g-common)} .t-weapons{--tc:var(--kinah)} .t-armor{--tc:var(--g-legend)} .t-accessories{--tc:var(--g-epic)} .t-skins{--tc:#F28BA8}
.ac .art{position:relative;display:grid;place-items:center;height:150px;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,color-mix(in oklab,var(--tc) 28%,transparent),transparent 70%),var(--night-2)}
.ac .art .bg{position:absolute;inset:-20%;width:140%;height:140%;object-fit:cover;filter:blur(22px) saturate(1.4) brightness(.3)}
/* the portraits are cut-outs with no backdrop, so the frame brings its own dark slot (a pale monster showed the blur through it as a grey square) */
.ac .art .fg{position:relative;width:118px;height:118px;border-radius:18px;object-fit:cover;background:radial-gradient(circle at 50% 42%,color-mix(in oklab,var(--tc) 30%,transparent),transparent 72%),var(--night-2);box-shadow:0 0 0 2px color-mix(in oklab,var(--tc) 70%,transparent),0 14px 30px -8px rgba(0,0,0,.8);transition:transform .2s}
.ac:hover .fg{transform:scale(1.04)}
.ac .art.ic{background:radial-gradient(circle at 50% 45%,color-mix(in oklab,var(--gc) 30%,transparent),transparent 65%),var(--night-2)}
.ac .art .ico{width:76px;height:76px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.6))}
.ac .art.none span{font:600 40px var(--f-display);color:color-mix(in oklab,var(--tc) 60%,var(--faint))}
.ac .bd{display:flex;flex-direction:column;gap:3px;padding:13px 15px 14px;flex:1;min-width:0}
.ac .tg{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ac .ty{color:var(--tc);letter-spacing:.07em;text-transform:uppercase;font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac .lv{font:500 12px var(--f-mono);color:var(--ink-2);background:var(--slot);border:1px solid var(--line-2);border-radius:6px;padding:0 6px;white-space:nowrap}
.ac .nm{font:600 16px/1.25 var(--f-display);letter-spacing:-.01em;margin:3px 0 0}
.ac .bs{color:var(--muted);font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ac .ft{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:auto;padding-top:10px}
.ac .loot{display:flex;gap:5px}
.lslot{width:32px;height:32px;border-radius:8px;background:var(--slot);border:1px solid color-mix(in oklab,var(--gc) 60%,transparent);display:grid;place-items:center;overflow:hidden}
.lslot img{width:28px;height:28px;object-fit:contain}
.ac .ct{font-size:12px;color:var(--faint);text-align:right}
.ac.big .art{height:190px} .ac.big .fg{width:150px;height:150px}
/* small cards: picture on the left */
.lgrid.sm .ac{flex-direction:row}
.lgrid.sm .art{width:96px;height:auto;min-height:104px;flex:none}
.lgrid.sm .fg{width:72px;height:72px;border-radius:13px}
.lgrid.sm .ico{width:52px;height:52px}
.lgrid.sm .bd{padding:11px 13px}
.lgrid.sm .nm{font-size:14px}
.lgrid.sm .ft{padding-top:6px} .lgrid.sm .lslot{width:26px;height:26px} .lgrid.sm .lslot img{width:22px;height:22px} .lgrid.sm .ct{display:none}
.lgrid.sm .art.none span{font-size:28px}
/* Show all, and the filter states */
.ac.more{display:none}
.ls.open .ac.more,.lf-on .ac.more{display:flex}
.showall{margin-top:12px;background:none;border:1px solid var(--line-2);border-radius:10px;padding:8px 14px;font:600 14px var(--f-body);color:var(--kinah-ink);cursor:pointer}
.ls.open>.showall,.lf-on .showall{display:none}
.lf-on .ac.hid,.lf-on .ls.none,.lf-hide{display:none}
.lf-on .letters{display:none}
[data-lf-res]{margin-top:12px}
@media (max-width:760px){
  .lf{position:static;margin:16px 0 0;padding:0;background:none;border:0;backdrop-filter:none}
  .lf-chips,.lf-seg{display:none} .lf-sel{display:flex}
}
@media (max-width:700px){
  .lhero{min-height:0}
  .lhero .mosaic,.lhero .mosaic.icons{inset:-20px -60px auto 6%;grid-template-columns:repeat(5,1fr);height:210px;opacity:.6}
  .lhero::after{background:linear-gradient(0deg,var(--night-2) 46%,rgba(14,17,36,.5))}
  .lhero .tx{padding:118px 20px 22px}
  .lgrid,.lgrid.sm{grid-template-columns:1fr}
  .ac.big{flex-direction:row} .ac.big .art{width:112px;height:auto;min-height:120px;flex:none} .ac.big .bg{display:none} .ac.big .fg{width:86px;height:86px;border-radius:14px} .ac.big .ico{width:60px;height:60px}
  .ac.big .bd{padding:12px 13px} .ac.big .nm{font-size:15px} .ac.big .ct{display:none}
}


/* light theme: the same tokens, daylight values. html[data-theme="light"] is set by the pre-paint script in <head>
   from localStorage kl-theme; dark stays the default. The same block lives in site/index.html and tools/seo/seo.css. */
:root[data-theme="light"]{
  --night:#F5F3EE; --night-2:#ECE9E2; --panel:#FFFFFF; --panel-2:#F4F2FA; --slot:#EEEDF4;
  --line:#E2DFEA; --line-2:#CDC9DC;
  --ink:#17192E; --ink-2:#3C4063; --muted:#686D90; --faint:#9296B2;
  --kinah:#C88A2A; --kinah-ink:#8A5A12; --kinah-deep:#8A5A12; --kinah-bg:rgba(200,138,42,.12);
  --aether:#178C82; --aether-bg:rgba(23,140,130,.10); --aether-line:rgba(23,140,130,.4);
  --g-common:#5E6478; --g-rare:#1E8E4E; --g-legend:#1F68C8; --g-unique:#9A7400; --g-epic:#7347CF;
  --ow:#1E8E4E; --ow-bg:rgba(30,142,78,.10); --ow-line:rgba(30,142,78,.4);
  --ab:#7347CF; --ab-bg:rgba(115,71,207,.10); --ab-line:rgba(115,71,207,.4);
  --no:#C8452F; --no-bg:rgba(200,69,47,.09); --no-line:rgba(200,69,47,.4);
  --warn:#B9661E; --up:#1E8E4E; --down:#C8452F;
  color-scheme:light;
}
:root[data-theme="light"] body{background-color:var(--night);background-image:radial-gradient(900px 420px at 12% -8%,rgba(200,138,42,.10),transparent 70%),radial-gradient(800px 380px at 92% 0%,rgba(23,140,130,.07),transparent 70%)}
:root[data-theme="light"] .hdr{background:rgba(250,249,246,.88);border-bottom-color:var(--line)}
:root[data-theme="light"] .ddp,:root[data-theme="light"] .msheet,:root[data-theme="light"] .srv-pop{box-shadow:0 24px 50px -24px rgba(30,30,60,.35)}
:root[data-theme="light"] .brand .mark{filter:none}
:root[data-theme="light"] .chg.up,:root[data-theme="light"] .mk2-chg.up,:root[data-theme="light"] .up{color:#1E8E4E}
:root[data-theme="light"] .chg.down,:root[data-theme="light"] .mk2-chg.down,:root[data-theme="light"] .down{color:#C8452F}
:root[data-theme="light"] .mk2-chg.up{background:rgba(30,142,78,.1)} :root[data-theme="light"] .mk2-chg.down{background:rgba(200,69,47,.09)}
:root[data-theme="light"] .mk2-box h4.up,:root[data-theme="light"] .mk2-tile .up,:root[data-theme="light"] .mk2 .farm,:root[data-theme="light"] .mk2-drawer .farm,:root[data-theme="light"] .mk2-r .pr small.c.up{color:#1E8E4E}
:root[data-theme="light"] .mk2-box h4.down,:root[data-theme="light"] .mk2-tile .down,:root[data-theme="light"] .mk2-r .pr small.c.down{color:#C8452F}
:root[data-theme="light"] .mk2-scrim{background:rgba(20,22,40,.3)}
:root[data-theme="light"] .mk2-drawer{box-shadow:-30px 0 60px -30px rgba(30,30,60,.35)}
:root[data-theme="light"] .me-btn .av{background:linear-gradient(135deg,#F1E6D2,#E6DDF5);color:var(--kinah-ink)}
:root[data-theme="light"] .lhero::after{background:linear-gradient(90deg,var(--night-2) 34%,rgba(236,233,226,.82) 56%,rgba(236,233,226,.15) 100%),linear-gradient(0deg,rgba(236,233,226,.85),transparent 50%)}
:root[data-theme="light"] .ac .art{background:radial-gradient(120% 90% at 50% 0%,color-mix(in oklab,var(--tc) 22%,transparent),transparent 70%),#E9E6F0}
:root[data-theme="light"] .ac .art .bg{filter:blur(22px) saturate(1.3) brightness(1.15);opacity:.55}
:root[data-theme="light"] .ac .art .fg{background:radial-gradient(circle at 50% 42%,color-mix(in oklab,var(--tc) 22%,transparent),transparent 72%),#F3F1F8}
:root[data-theme="light"] .ac:hover{box-shadow:0 16px 36px -20px rgba(30,30,60,.35)}
:root[data-theme="light"] .lf{background:rgba(250,249,246,.92)}
@media (max-width:700px){:root[data-theme="light"] .lhero::after{background:linear-gradient(0deg,var(--night-2) 46%,rgba(236,233,226,.5))}}
/* the theme switch */
.theme-btn{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);cursor:pointer;flex:none}
.theme-btn:hover{color:var(--ink);background:var(--panel-2)}
.theme-btn svg{display:block}.theme-btn .sun{display:none} :root[data-theme="light"] .theme-btn .sun{display:block} :root[data-theme="light"] .theme-btn .moon{display:none}
/* app surfaces that were drawn with fixed dark colors */
:root[data-theme="light"] .search input{background:#FFFFFF;box-shadow:0 14px 34px -22px rgba(30,30,60,.4)}
:root[data-theme="light"] .sugg,:root[data-theme="light"] .ddp,:root[data-theme="light"] .mk-tip{box-shadow:0 24px 50px -24px rgba(30,30,60,.35)}
:root[data-theme="light"] .odds{background:linear-gradient(180deg,#FFFFFF,#F7F5FB);box-shadow:0 30px 60px -36px rgba(30,30,60,.4)}
:root[data-theme="light"] .odds-src,:root[data-theme="light"] .expect,:root[data-theme="light"] .ztop,:root[data-theme="light"] .lhead,:root[data-theme="light"] .lb-row.hd{background:var(--slot)}
:root[data-theme="light"] .you{background:rgba(255,255,255,.97);box-shadow:0 20px 50px -26px rgba(30,30,60,.4)}
:root[data-theme="light"] .zb .tr,:root[data-theme="light"] .meter,:root[data-theme="light"] .you .bar,:root[data-theme="light"] .loot .bar,:root[data-theme="light"] .track,:root[data-theme="light"] .pips i,:root[data-theme="light"] .fam .tr,:root[data-theme="light"] .crange,:root[data-theme="light"] .pf-prof .bar,:root[data-theme="light"] .pf-wait .bar{background:#E4E1EC;box-shadow:inset 0 1px 2px rgba(30,30,60,.12)}
:root[data-theme="light"] .kills input[type=range]{background:linear-gradient(90deg,var(--kinah-deep),var(--kinah)) 0/var(--fill,0%) 100% no-repeat,#E4E1EC;box-shadow:inset 0 1px 2px rgba(30,30,60,.12)}
:root[data-theme="light"] .btn-ghost,:root[data-theme="light"] .tries a,:root[data-theme="light"] .icon-btn,:root[data-theme="light"] .mob,:root[data-theme="light"] .place .rk,:root[data-theme="light"] .fchip,:root[data-theme="light"] .chip,:root[data-theme="light"] .bd,:root[data-theme="light"] .mk2-chg.flat{background:rgba(20,23,43,.04)}
:root[data-theme="light"] .btn-ghost:hover,:root[data-theme="light"] .icon-btn:hover,:root[data-theme="light"] .irow:hover,:root[data-theme="light"] .mrow:hover,:root[data-theme="light"] .mk2-star:hover{background:rgba(20,23,43,.06)}
:root[data-theme="light"] .slot{box-shadow:none}
:root[data-theme="light"] .tbl-wrap,:root[data-theme="light"] .card,:root[data-theme="light"] .links a,:root[data-theme="light"] .letters a{box-shadow:0 1px 0 rgba(30,30,60,.03)}
:root[data-theme="light"] th{background:var(--slot)}
:root[data-theme="light"] .btn:not(.btn-gold){background:rgba(20,23,43,.03)}
:root[data-theme="light"] .cta-card{background:linear-gradient(120deg,var(--kinah-bg),var(--panel) 55%)}
@media (max-width:400px){.hdr .brand{font-size:0;gap:0}}
/* the expedition guides (tools/seo/guides.css) in the light theme: the journal panels stay a dark journal, lifted
   to a dusk blue so they sit lighter on the paper page; everything outside the panels follows the light tokens */
:root[data-theme="light"] .g-guide{--gold-line:#E2CB98;--gold-text:#8A5A12}
:root[data-theme="light"] .g-tag{background:rgba(20,23,43,.03)}
:root[data-theme="light"] .g-tk-list a:hover{background:rgba(20,23,43,.04)}
:root[data-theme="light"] .g-tk-list a[aria-current=step]{background:rgba(200,138,42,.10)}
:root[data-theme="light"] .g-panel,:root[data-theme="light"] .g-mtrack{--panel:#FFFFFF;--panel-2:#F6F4FA;--slot:#F1EFF6;--line:#E6E2EE;--line-2:#D3CEE0;--ink:#17192E;--ink-2:#3C4063;--muted:#686D90;--faint:#9296B2;--kinah:#C88A2A;--kinah-ink:#8A5A12;--kinah-deep:#7A4E0E;--kinah-bg:rgba(200,138,42,.12);--gold-line:#E6D3A8;--gold-text:#8A5A12;color:var(--ink)}
:root[data-theme="light"] .g-panel{background:#FFFFFF;border-color:#E6D3A8;box-shadow:0 22px 46px -30px rgba(30,30,60,.35)}
:root[data-theme="light"] .g-band{background:linear-gradient(90deg,#F5D79B,#FBEBC9 55%,#FFF8EA);border-bottom-color:#E6D3A8}
:root[data-theme="light"] .g-band .g-bt small{color:#7A4E0E}
:root[data-theme="light"] .g-band .g-bt h2{color:#5A3606}
:root[data-theme="light"] .g-band .g-stats dt{color:#7A6A4E}
:root[data-theme="light"] .g-band .g-stats dd{color:#2B2113}
:root[data-theme="light"] .g-mtrack:not([hidden]){background:rgba(250,249,246,.96);border-top:1px solid var(--line)}
:root[data-theme="light"] .g-panel .g-map{background:#F2F0F7;box-shadow:inset 0 0 0 1px rgba(20,23,43,.07)}
:root[data-theme="light"] .g-panel .ga-floor{fill:#E7E4F0;stroke:#C9C4DC}
:root[data-theme="light"] .g-panel .ga-pillar,:root[data-theme="light"] .g-panel .ga-gate{fill:#CFCAE0;stroke:#B4AECB}
:root[data-theme="light"] .g-panel .ga-t{stroke:#F2F0F7}
:root[data-theme="light"] .g-panel th{background:#F1EFF6}
:root[data-theme="light"] .g-panel .g-slot{box-shadow:inset 0 0 0 1px rgba(20,23,43,.12)}
:root[data-theme="light"] .g-panel .chip,:root[data-theme="light"] .g-panel .btn:not(.btn-gold){background:rgba(20,23,43,.04)}
/* guide panels in light: the red and amber accents darkened for a white card */
:root[data-theme="light"] .g-panel .g-stats dd.red,:root[data-theme="light"] .g-panel .g-facts .red,:root[data-theme="light"] .g-p-wipe .g-bt small{color:#B23B26}
:root[data-theme="light"] .g-panel .g-facts .red b,:root[data-theme="light"] .g-p-wipe .g-bt h2{color:#8E2A18}
:root[data-theme="light"] .g-p-wipe{border-color:rgba(178,59,38,.35)}
:root[data-theme="light"] .g-p-wipe .g-band{background:linear-gradient(90deg,rgba(178,59,38,.14),rgba(178,59,38,.03) 60%,transparent);border-bottom-color:rgba(178,59,38,.25)}
:root[data-theme="light"] .g-panel .g-alert{border-color:rgba(178,59,38,.35);background:linear-gradient(180deg,rgba(178,59,38,.06),rgba(255,255,255,.35))}
:root[data-theme="light"] .g-panel .g-ah{background:linear-gradient(90deg,rgba(178,59,38,.16),rgba(178,59,38,.04));color:#8E2A18}
:root[data-theme="light"] .g-panel .g-ah b{color:var(--ink)}
:root[data-theme="light"] .g-panel .g-ah .g-mo{color:#6B3FC4}
:root[data-theme="light"] .g-panel .g-alert.g-d-big{border-color:rgba(176,96,24,.35);background:linear-gradient(180deg,rgba(176,96,24,.06),rgba(255,255,255,.35))}
:root[data-theme="light"] .g-panel .g-alert.g-d-big .g-ah{background:linear-gradient(90deg,rgba(176,96,24,.16),rgba(176,96,24,.04));color:#7E4410}
:root[data-theme="light"] .g-panel .g-skip{background:rgba(107,63,196,.06);border-color:rgba(107,63,196,.25)}
:root[data-theme="light"] .g-panel .g-w-tank,:root[data-theme="light"] .g-panel .g-tips li[data-who=tank] svg.gi{color:#1F5FB8}
:root[data-theme="light"] .g-panel .g-entry th,:root[data-theme="light"] .g-panel .g-entry td{border-bottom-color:rgba(20,23,43,.08)}
:root[data-theme="light"] .g-panel .ga-danger{fill:rgba(178,59,38,.16)}
:root[data-theme="light"] .g-panel .ga-safe{fill:rgba(23,140,130,.14)}
:root[data-theme="light"] .g-panel .g-play{background:rgba(250,249,246,.92)}

/* spawn maps (tools/seo/spawn-map.js): MetaBot.GG's in-game map tiles with a glowing dot per spawn point */
.spawnmap{margin:14px 0 20px;max-width:860px}
.sm-view{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:16px;border:1px solid var(--line-2);background:#A9B7AE;box-shadow:0 24px 50px -30px rgba(0,0,0,.7)}
.sm-tile{position:absolute;display:block;max-width:none;object-fit:cover;filter:saturate(.9) brightness(.92)}
.sm-view::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 60px rgba(0,0,0,.45)}
.sm-dot{position:absolute;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:radial-gradient(circle,#FFE6A8 0 30%,#EBAE4C 31% 55%,rgba(235,174,76,0) 56%);box-shadow:0 0 0 2px rgba(9,11,21,.75),0 0 14px 4px rgba(235,174,76,.65);z-index:2}
.sm-dot::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(235,174,76,.7);animation:smPulse 2.2s ease-out infinite}
@keyframes smPulse{from{transform:scale(.4);opacity:1}to{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.sm-dot::after{animation:none;opacity:.5}}
.sm-tag{position:absolute;left:12px;top:12px;z-index:3;background:rgba(9,11,21,.82);color:#EEECF6;border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:5px 11px;font:600 12.5px var(--f-body);backdrop-filter:blur(6px)}
.sm-tag b{color:#F8D598}
.sm-legend{position:absolute;right:12px;bottom:12px;z-index:3;display:flex;gap:8px;align-items:center;background:rgba(9,11,21,.82);color:#B3B7D3;border-radius:999px;padding:5px 11px;font:600 12px var(--f-body)}
.sm-legend i{width:10px;height:10px;border-radius:50%;background:#EBAE4C;box-shadow:0 0 8px #EBAE4C}
.spawnmap figcaption{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:13.5px;color:var(--ink-2)}
.spawnmap figcaption b{color:var(--ink)}
.spawnmap figcaption .cr{color:var(--muted);font-size:12.5px;margin-left:auto}
.spawnmap figcaption .cr a{color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--line-2)}
.sm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.sm-small{margin:0}
.sm-small .sm-dot{width:12px;height:12px;margin:-6px 0 0 -6px}
.sm-small .sm-dot::after{inset:-5px}
.sm-small .sm-tag{font-size:11.5px;padding:3px 9px;left:8px;top:8px}
.sm-small .sm-legend{font-size:11px;padding:3px 9px;right:8px;bottom:8px}
.sm-small > a{display:block;border-radius:16px}
.sm-small > a:hover .sm-view{border-color:var(--kinah)}
.sm-small figcaption{margin-top:8px;font-size:13px}
@media (max-width:560px){.sm-tag{font-size:11px;padding:3px 8px;left:8px;top:8px}.sm-legend{font-size:11px;padding:3px 8px}.sm-dot{width:14px;height:14px;margin:-7px 0 0 -7px}}
.sm-dense .sm-dot,.sm-small .sm-dense .sm-dot{width:11px;height:11px;margin:-5.5px 0 0 -5.5px;box-shadow:0 0 0 1.5px rgba(9,11,21,.7),0 0 8px 2px rgba(235,174,76,.55)}
.sm-dense .sm-dot::after{display:none}
/* the live map (site/js/spawn-map.js): the whole region, zoom and pan */
.sm-live{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;outline-offset:3px}
.sm-live.sm-drag{cursor:grabbing}
.sm-world{position:absolute;left:0;top:0;will-change:transform}
.sm-tiles,.sm-z,.sm-dots{position:absolute;inset:0}
.sm-dots{z-index:10}
.sm-t{position:absolute;display:block;max-width:none;pointer-events:none;-webkit-user-drag:none;filter:saturate(.9) brightness(.92)}
.sm-ctl{position:absolute;right:10px;top:10px;z-index:4;display:flex;flex-direction:column;gap:6px}
.sm-ctl button{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(9,11,21,.82);color:#EEECF6;cursor:pointer;backdrop-filter:blur(6px)}
.sm-ctl button:hover{background:rgba(23,28,56,.95);color:#F8D598}
.sm-ctl button:disabled{opacity:.4;cursor:default}
.sm-hint{position:absolute;left:50%;top:50%;z-index:5;transform:translate(-50%,-50%);background:rgba(9,11,21,.85);color:#EEECF6;border-radius:10px;padding:8px 14px;font:600 13px var(--f-body);opacity:0;pointer-events:none;transition:opacity .2s}
.sm-hinting .sm-hint{opacity:1}
@media (hover:none){.sm-hint{display:none}}
@media (max-width:560px){.sm-ctl{flex-direction:row;top:auto;right:auto;bottom:8px;left:8px;gap:5px}.sm-ctl button{width:30px;height:30px;border-radius:9px}}

/* tracker screenshots (tools/seo/tracker-page.js) */
.shot{margin:26px 0 8px;max-width:880px}
.shot img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--line-2);box-shadow:0 18px 50px -24px rgba(0,0,0,.7)}
.shot figcaption{margin-top:8px;font-size:13px;color:var(--muted)}


/* /market/ (tools/seo/market-page.js, site/js/market.js) */
.mk-top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-top:18px}
.mk-top h1{margin:4px 0 0}
.mk-top .lead{margin:10px 0 0;max-width:62ch;color:var(--ink-2)}
.mk-srv{display:flex;flex-direction:column;gap:6px;font:600 12px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:260px}
.mk-srv select{background:var(--panel);color:var(--ink);border:1px solid color-mix(in oklab,var(--kinah) 50%,var(--line-2));border-radius:12px;padding:11px 12px;font:600 15px var(--f-body);text-transform:none;letter-spacing:0}
.mk-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:22px 0 18px}
.mk-kpis div{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:12px 14px}
.mk-kpis b{display:block;font:600 22px var(--f-mono);color:var(--kinah-ink)}
.mk-kpis span{font-size:12.5px;color:var(--muted)}
.mk-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.mk-p{border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:16px 16px 10px;min-width:0}
.mk-p h2{margin:0;font-size:17px}
.mk-p>p{margin:4px 0 10px;font-size:12.5px;color:var(--muted)}
.mk-p h3{margin:4px 0 4px;font:700 11px var(--f-body);letter-spacing:.08em;text-transform:uppercase}
.mk-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mk-mini{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.mk-mini li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px solid var(--line);min-width:0;font-size:13.5px}
.mk-mini li:last-child{border-bottom:0}
.mk-it{display:flex;align-items:center;gap:8px;min-width:0;color:var(--ink)}
.mk-it:hover{text-decoration:none}
.mk-it img,.mk-it i{width:28px;height:28px;border-radius:7px;flex:none;background:var(--slot);border:1px solid color-mix(in oklab,var(--gc,var(--line-2)) 45%,var(--line))}
.mk-it .gname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mk-r{display:flex;flex-direction:column;align-items:flex-end;flex:none;text-align:right}
.mk-r b{font:600 13.5px var(--f-mono);color:var(--kinah-ink)}
.mk-r small{font-size:11.5px;color:var(--muted);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mk-empty{color:var(--muted);font-size:13px;padding:10px 0}
.mk-dim{color:var(--muted)}
.mk-tbl{margin-top:26px}
.mk-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.mk-tabs{display:flex;gap:6px;flex-wrap:wrap}
.mk-tabs button{background:var(--panel);color:var(--ink-2);border:1px solid var(--line);border-radius:999px;padding:7px 13px;font:600 13.5px var(--f-body);cursor:pointer}
.mk-tabs button[aria-selected="true"]{background:var(--kinah-bg);color:var(--kinah-ink);border-color:color-mix(in oklab,var(--kinah) 55%,var(--line))}
.mk-q input{background:var(--panel);color:var(--ink);border:1px solid var(--line-2);border-radius:11px;padding:9px 12px;font:500 14px var(--f-body);width:280px;max-width:100%}
.mk-tbl th button{all:unset;cursor:pointer}
.mk-tbl th button.on{color:var(--ink)}
.mk-tbl th button.on[data-dir="desc"]::after{content:" ▼"}
.mk-tbl th button.on[data-dir="asc"]::after{content:" ▲"}
.mk-tbl td .sub{margin-left:36px}
.mk-spot{color:var(--ink-2);font-size:13px;white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}
.mk-more{text-align:center;margin-top:12px}
@media (max-width:980px){.mk-panels{grid-template-columns:minmax(0,1fr)}.mk-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.mk-spot,.mk-tbl th:nth-child(5),.mk-tbl td:nth-child(5),.mk-tbl th:nth-child(6),.mk-tbl td:nth-child(6){display:none}.mk-srv{min-width:0;width:100%}}

.mk-p h3{margin-top:10px}
.mk-mini .up,.mk-mini .down,.mk-r small .up,.mk-r small .down{white-space:nowrap;flex:none;font:600 13px var(--f-mono)}
.mk-p [data-mk-pick]{margin:4px 0 8px}

/* patch notes (tools/seo/patch-notes.js) */
.pn-list{list-style:none;padding:0;margin:0}
.pn-list li{padding:16px 0;border-top:1px solid var(--line);margin:0}
.pn-list li:last-child{border-bottom:1px solid var(--line)}
.pn-list h3{margin:4px 0 6px}
.pn-list p{margin:0}
.pn-when{font:600 12px var(--f-mono,monospace);color:var(--muted);letter-spacing:.04em}
.pn-areas{margin-top:8px!important;display:flex;flex-wrap:wrap;gap:6px}

/* the Discord invite (tools/seo/discord.js) */
.dc-strip{display:flex;align-items:center;gap:12px;margin:14px 0 18px;padding:10px 12px 10px 14px;border:1px solid color-mix(in oklab,#5865F2 40%,var(--line));border-radius:12px;background:color-mix(in oklab,#5865F2 9%,var(--panel));max-width:880px}
.dc-strip>svg{flex:none;color:#8C95FF}
.dc-strip p{margin:0;flex:1;font-size:14px;line-height:1.45;color:var(--ink-2)}
.dc-strip p b{color:var(--ink)}
.dc-strip .btn{flex:none}
@media (max-width:560px){.dc-strip{flex-wrap:wrap}.dc-strip .btn{width:100%;justify-content:center}}
.hdr .dc-btn svg{color:#8C95FF}
:root[data-theme="light"] .dc-strip>svg,:root[data-theme="light"] .hdr .dc-btn svg{color:#5865F2}
/* /discord/ and the strips' "Add to your server" (2026-10-25, discord-page.js) */
.dc-strip .dc-add{background:transparent}
.dc-card{max-width:880px;margin:18px 0;padding:18px 20px;border:1px solid color-mix(in oklab,#5865F2 34%,var(--line));border-radius:14px;background:color-mix(in oklab,#5865F2 6%,var(--panel))}
.dc-card h2{margin:0 0 8px}
.dc-card .cta{margin:14px 0 10px}
.dc-card .note{margin:0}
.dc-added{max-width:880px;margin:14px 0 0;padding:10px 14px;border-radius:10px;font-weight:600;border:1px solid var(--line)}
.dc-added.ok{border-color:color-mix(in oklab,#62D98B 50%,var(--line));background:color-mix(in oklab,#62D98B 10%,var(--panel))}
.dc-added.warn{border-color:color-mix(in oklab,#F2A35E 50%,var(--line));background:color-mix(in oklab,#F2A35E 10%,var(--panel))}
@media (max-width:560px){.dc-strip .dc-add{width:100%}}

/* /embed/ (tools/seo/embed-page.js) */
.emb{display:grid;gap:16px;margin:8px 0 24px;max-width:880px}
.emb-form{display:flex;gap:12px;flex-wrap:wrap}.emb-form label{display:grid;gap:6px;font-size:13px;color:var(--ink-2);flex:1;min-width:220px}
.emb-form input,.emb-form select,.emb-codes textarea{background:var(--panel);color:var(--ink);border:1px solid var(--line-2);border-radius:10px;padding:9px 11px;font:inherit}
.emb-preview{padding:18px;border:1px dashed var(--line-2);border-radius:12px;background:var(--panel-2)}
.emb-codes{display:grid;gap:10px}.emb-codes label{display:grid;gap:6px;font-size:13px;color:var(--ink-2)}.emb-codes textarea{font-family:"JetBrains Mono",monospace;font-size:12px;resize:vertical}

/* Official / Reported tags (progression-pages.js) */
.chip-off{background:color-mix(in oklab,var(--ow,#62D98B) 18%,transparent);color:var(--ink);border:1px solid color-mix(in oklab,var(--ow,#62D98B) 45%,transparent)}
.chip-rep{background:var(--panel-2);color:var(--ink-2);border:1px solid var(--line-2)}
.reset-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:8px 0 20px;max-width:880px}
.reset-box>div{padding:14px 16px;border:1px solid var(--line-2);border-radius:12px;background:var(--panel)}
.reset-box b{display:block;font-size:13px;color:var(--ink-2)}.reset-box span{display:block;font-size:20px;font-weight:700;margin:4px 0}.reset-box small{color:var(--kinah,#EBAE4C);font-weight:600}
.reset-box .note{grid-column:1/-1;margin:0}

/* expedition guides (tools/seo/guides.js, site/js/guide.js); appended to seo.css by build-seo-pages.js.
   Look: the in-game journal Steven picked (2026-10-23): one column, one spine in run order, every big section
   a journal panel like a game tooltip (gold header band, icon slot, stat block), moves as icon slots, wipe
   checks as a red strip. Same tokens as seo.css. */
.g-sprite{position:absolute;width:0;height:0;overflow:hidden}
svg.gi{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.g-guide [id]{scroll-margin-top:84px}
.g-guide{--gold-line:#3B3418;--gold-text:#E9C27A}

/* page frame: a stage rail on the left, one column of content */
.g-layout{display:grid;grid-template-columns:minmax(0,1fr)}
@media (min-width:1000px){.g-layout{grid-template-columns:180px minmax(0,760px);gap:48px}}
.g-col{min-width:0;max-width:760px}
.g-col>.head{margin-top:18px}
@media (min-width:1000px){.g-after{margin-left:228px;max-width:760px}}
.g-tag{display:inline-flex;font:600 12px var(--f-body);color:var(--ink-2);padding:3px 9px;border-radius:999px;border:1px solid var(--line-2);background:rgba(255,255,255,.03)}
.g-h2{font-size:clamp(20px,2.4vw,24px);margin:44px 0 14px}

/* the stage rail (desktop) */
.g-rail{display:none}
@media (min-width:1000px){.g-rail{display:block;position:sticky;top:84px;align-self:start;margin-top:28px}}
.g-tk-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;position:relative}
.g-tk-list::before{content:"";position:absolute;left:21px;top:22px;bottom:22px;width:2px;background:var(--line-2)}
.g-tk-list li{position:relative}
.g-tk-list a{display:flex;gap:10px;align-items:center;padding:5px 8px 5px 4px;border-radius:12px;color:var(--muted)}
.g-tk-list a:hover{background:rgba(255,255,255,.04);text-decoration:none;color:var(--ink)}
.g-tk-n{position:relative;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--night);border:2px solid var(--line-2);color:var(--muted);overflow:hidden}
.g-tk-n img{width:100%;height:100%;object-fit:cover;display:block}
.g-tk-n svg.gi{width:16px;height:16px}
.g-tk-l{min-width:0}
.g-tk-l small,.g-mt-t small{display:block;font:600 11px var(--f-body);color:var(--faint);white-space:nowrap}
.g-tk-l b,.g-mt-t b{display:block;font:600 13.5px var(--f-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.g-tk-list a[aria-current=step]{color:var(--ink);background:rgba(235,174,76,.08)}
.g-tk-list a[aria-current=step] .g-tk-n,.g-mt-now .g-tk-n{border-color:var(--kinah);box-shadow:0 0 0 3px rgba(235,174,76,.16);color:var(--kinah-ink)}
.g-tk-list a[aria-current=step] small,.g-mt-t small{color:var(--kinah-ink)}
.g-tk-list li.done a{color:var(--ink-2)}
.g-tk-list li.done .g-tk-n{border-color:rgba(235,174,76,.55);color:var(--kinah)}

/* phones and tablets: one bar at the bottom with back, where you are, and next */
.g-mtrack{display:none}
.g-tk-bar{height:3px;background:var(--line);overflow:hidden}
.g-tk-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--kinah-ink),var(--kinah));transition:width .25s}
@media (max-width:999px){
  .g-mtrack:not([hidden]){display:flex;position:sticky;bottom:0;z-index:25;align-items:center;gap:10px;margin:32px -16px 0;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(9,11,21,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line-2)}
  .g-mt-btn{width:44px;height:44px;border-radius:12px;border:1px solid var(--line-2);background:var(--panel);color:var(--ink);display:grid;place-items:center;flex:none;cursor:pointer}
  .g-mt-btn:disabled{opacity:.3;cursor:default}
  .g-mt-now{flex:1;min-width:0;display:flex;gap:10px;align-items:center;color:var(--ink)}
  .g-mt-now:hover{text-decoration:none}
  .g-mt-t{min-width:0}
  .g-mtrack .g-tk-bar{position:absolute;left:0;right:0;top:-1px}
}

/* mode and role buttons */
.g-ctl{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;margin-top:16px}
.g-ctl[hidden]{display:none}
.g-modes,.g-roles{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.g-modes>span,.g-roles>span{font:600 12px var(--f-body);color:var(--muted);margin-right:2px;min-width:44px}
.g-ctl button{display:inline-flex;align-items:center;gap:6px;font:600 13px var(--f-body);color:var(--ink-2);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:6px 12px;cursor:pointer}
.g-ctl button svg.gi{width:15px;height:15px}
.g-ctl button:hover{border-color:var(--line-2);color:var(--ink)}
.g-ctl button[aria-pressed=true]{color:#261702;background:linear-gradient(180deg,var(--kinah-ink),var(--kinah));border-color:#F6CB7C}

/* the spine: trip steps between the panels */
.g-spine{list-style:none;margin:26px 0 0;padding:0;position:relative}
.g-spine::before{content:"";position:absolute;left:17px;top:30px;bottom:30px;width:2px;background:var(--line-2)}
.g-sp{position:relative}
.g-sp-step{padding-left:52px;margin:18px 0}
.g-sp-n{position:absolute;left:4px;top:1px;width:28px;height:28px;transform:rotate(45deg);border-radius:6px;background:var(--slot);border:1.5px solid rgba(94,216,203,.6);display:grid;place-items:center}
.g-sp-n span{transform:rotate(-45deg);font:600 12px var(--f-body);color:var(--aether)}
.g-sp-b b{display:block;font:600 15px var(--f-body)}
.g-sp-b>span{display:block;font-size:14px;color:var(--muted)}

/* a journal panel: header band, then the body */
.g-panel{margin:24px 0;border-radius:14px;background:linear-gradient(180deg,#141935,#0E1226);border:1px solid var(--gold-line);box-shadow:inset 0 0 0 1px rgba(235,174,76,.06),0 30px 60px -40px #000;overflow:hidden}
.g-band{display:flex;gap:16px;align-items:center;padding:16px 18px;background:linear-gradient(90deg,rgba(235,174,76,.20),rgba(235,174,76,.04) 60%,transparent);border-bottom:1px solid var(--gold-line)}
.g-bslot{width:62px;height:62px;border-radius:10px;padding:3px;background:linear-gradient(135deg,#F8D598,#B9781F);flex:none;display:grid;place-items:center;color:#261702}
.g-bslot svg.gi{width:28px;height:28px;stroke-width:2.2}
.g-bslot .g-art,.g-bslot img{display:block;width:100%;height:100%;border-radius:7px;object-fit:cover}
.g-p-prep .g-bslot{background:linear-gradient(135deg,#A5F0E7,#2E9C91);color:#062320}
.g-bt{min-width:0}
.g-bt small{display:block;font:700 11.5px var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-text)}
.g-bt h2{font:600 clamp(19px,2.3vw,22px)/1.2 var(--f-display);letter-spacing:-.01em;margin:2px 0 0;color:var(--kinah-ink)}
.g-bt h2 a{color:inherit}
.g-bsub{font-size:13.5px;color:var(--ink-2);margin-top:2px}
.g-stats{margin:0 0 0 auto;display:grid;grid-template-columns:auto auto;gap:2px 14px;font-size:13px;align-self:center}
.g-stats dt{color:var(--muted)}
.g-stats dd{margin:0;color:var(--ink);font-weight:600;text-align:right;white-space:nowrap}
.g-stats dd.red{color:#FF9C8E}
.g-pbody{padding:4px 18px 18px}
.g-bsum{color:var(--ink-2);font-size:15px;margin:12px 0 0}
.g-p-wipe{border-color:rgba(255,125,107,.35)}
.g-p-wipe .g-band{background:linear-gradient(90deg,rgba(255,125,107,.18),rgba(255,125,107,.04) 60%,transparent);border-bottom-color:rgba(255,125,107,.3)}
.g-p-wipe .g-bslot{background:linear-gradient(135deg,#FFB3A8,#C2483A);color:#2A0904}
.g-p-wipe .g-bt small{color:#FFB3A8}
.g-p-wipe .g-bt h2{color:#FFD2CB}
.g-p-wipe .g-pbody,.g-p-claim .g-pbody{padding-top:16px}

/* section headers inside a panel: gold small caps with a fading rule */
.g-sh{display:flex;align-items:center;gap:10px;margin:20px 0 12px;font:700 12px var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-text)}
.g-sh::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(235,174,76,.55),transparent 75%)}
.g-sh em{font:500 13px var(--f-body);letter-spacing:0;text-transform:none;color:var(--ink-2);font-style:normal}
.g-pgrid{display:grid;gap:18px}
.g-pgrid.has-map{grid-template-columns:230px minmax(0,1fr);align-items:start}

/* a line: icon slot, the name in gold, what to do in white, the tell in grey */
.g-rows{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.g-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:12px;align-items:center;transition:opacity .15s}
.g-slot{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;flex:none;color:var(--ink-2);background:radial-gradient(circle at 50% 40%,rgba(179,183,211,.16),transparent 70%),var(--slot);box-shadow:inset 0 0 0 1px rgba(179,183,211,.28)}
.g-slot svg.gi{width:18px;height:18px}
.g-slot.g-d-big{color:var(--warn);background:radial-gradient(circle at 50% 40%,rgba(242,163,94,.28),transparent 70%),var(--slot);box-shadow:inset 0 0 0 1px rgba(242,163,94,.5)}
.g-slot.g-d-wipe{color:var(--no);background:radial-gradient(circle at 50% 40%,rgba(255,125,107,.3),transparent 70%),var(--slot);box-shadow:inset 0 0 0 1px rgba(255,125,107,.55)}
.g-slot.g-d-hard{color:var(--ab);background:radial-gradient(circle at 50% 40%,rgba(180,139,255,.28),transparent 70%),var(--slot);box-shadow:inset 0 0 0 1px rgba(180,139,255,.5)}
.g-slot.g-d-tip{color:var(--aether);background:radial-gradient(circle at 50% 40%,rgba(94,216,203,.24),transparent 70%),var(--slot);box-shadow:inset 0 0 0 1px rgba(94,216,203,.45)}
.g-slot.g-d-loot{color:var(--kinah-ink);background:radial-gradient(circle at 50% 40%,rgba(235,174,76,.28),transparent 70%),var(--slot);box-shadow:inset 0 0 0 1px rgba(235,174,76,.5)}
.g-row-b{min-width:0}
.g-row-b small{display:block;font:600 13px var(--f-body);color:var(--gold-text)}
.g-row-b b{display:block;font:600 15px/1.3 var(--f-body);color:var(--ink)}
.g-row-b span{display:block;font-size:13px;color:var(--muted);line-height:1.35;margin-top:1px}
.g-row-m{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.g-w{display:grid;font-style:normal}
.g-w svg.gi{width:15px;height:15px}
.g-w-tank{color:#7DB5FF}
.g-w-healer{color:var(--g-rare)}
.g-w-dps,.g-w-melee,.g-w-ranged{color:var(--kinah-ink)}
.g-mo{font:600 11px var(--f-body);color:var(--ab);border:1px solid rgba(180,139,255,.45);border-radius:999px;padding:1px 7px;white-space:nowrap}
.g-unsure{font:600 11px var(--f-body);padding:1px 7px;border-radius:999px;color:var(--muted);border:1px dashed var(--line-2);white-space:nowrap}

/* the moments that wipe: a red strip inside the boss panel */
.g-alert{margin-top:20px;border-radius:12px;overflow:hidden;border:1px solid rgba(255,125,107,.45);background:linear-gradient(180deg,rgba(255,125,107,.08),rgba(9,11,21,.2))}
.g-ah{display:flex;align-items:center;gap:10px;padding:9px 14px;background:linear-gradient(90deg,rgba(255,125,107,.35),rgba(255,125,107,.08));font:700 12px var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:#FFD2CB}
.g-ah svg.gi{width:17px;height:17px}
.g-ah b{font:600 16px var(--f-display);letter-spacing:0;text-transform:none;color:#fff;margin-left:4px}
.g-ah .g-mo{margin-left:auto;color:#E2D3FF;letter-spacing:0;text-transform:none}
.g-alert.g-d-big{border-color:rgba(242,163,94,.45);background:linear-gradient(180deg,rgba(242,163,94,.08),rgba(9,11,21,.2))}
.g-alert.g-d-big .g-ah{background:linear-gradient(90deg,rgba(242,163,94,.33),rgba(242,163,94,.07));color:#FFE0C4}
.g-ab{padding:14px;display:grid;gap:18px}
.g-ab.has-map{grid-template-columns:minmax(0,1fr) 200px;align-items:center}
.g-ab-s{color:var(--ink-2);font-size:14px;margin:0}
.g-seq{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.g-seq li{display:flex;gap:10px;align-items:center;font:600 15px var(--f-body)}
.g-seq i{width:24px;height:24px;transform:rotate(45deg);border-radius:5px;background:linear-gradient(135deg,#F8D598,#B9781F);display:grid;place-items:center;flex:none;font-style:normal}
.g-seq i span{transform:rotate(-45deg);font:800 11.5px var(--f-body);color:#261702}
.g-facts{margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--muted)}
.g-facts b{color:var(--ink);font-weight:600}
.g-facts .red{color:#FFB3A8}
.g-facts .red b{color:#FFD2CB}
.g-tips{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:4px;font-size:13.5px;color:var(--ink-2)}
.g-tips li{display:flex;gap:8px;align-items:center;transition:opacity .15s}
.g-tips svg.gi{width:14px;height:14px}
.g-tips li[data-who=tank] svg.gi{color:#7DB5FF}
.g-tips li[data-who=healer] svg.gi{color:var(--g-rare)}
.g-tips li[data-who=dps] svg.gi{color:var(--kinah-ink)}
.g-tips b{color:var(--ink);font-weight:600}
.g-ab-n{font-size:13px;color:var(--muted);margin:10px 0 0}
.g-skip{display:flex;gap:8px;align-items:flex-start;margin:12px 0 0;padding:9px 12px;border-radius:10px;background:rgba(180,139,255,.07);border:1px solid rgba(180,139,255,.28);font-size:13.5px;color:var(--ink-2)}
.g-skip svg.gi{width:16px;height:16px;color:var(--ab);margin-top:2px}
.g-more{margin:14px 0 0;font-weight:600}
.g-more a{display:inline-flex;align-items:center;gap:4px}
.g-more svg.gi{width:16px;height:16px}

/* entry table, video */
.g-entry{overflow-x:auto}
.g-entry table{width:100%;border-collapse:collapse;font-size:14px}
.g-entry th,.g-entry td{padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.06);text-align:left;vertical-align:middle;background:none}
.g-entry thead th{font:600 12px var(--f-body);letter-spacing:0;text-transform:none;color:var(--muted);white-space:nowrap}
.g-entry th[scope=row]{font:500 13.5px var(--f-body);letter-spacing:0;text-transform:none;color:var(--ink-2);white-space:normal}
.g-entry tr:last-child th,.g-entry tr:last-child td{border-bottom:0}
.g-video{max-width:none}
.g-vid{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:1px solid var(--gold-line);border-radius:10px;overflow:hidden;background:#000;cursor:pointer}
.g-vid img{width:100%;height:100%;object-fit:cover;display:block;opacity:.85;transition:opacity .15s}
.g-vid:hover img{opacity:1}
.g-play{position:absolute;left:50%;top:50%;width:72px;height:50px;margin:-25px 0 0 -36px;border-radius:14px;background:rgba(9,11,21,.82);border:1px solid var(--line-2)}
.g-play::after{content:"";position:absolute;left:29px;top:15px;border-style:solid;border-width:10px 0 10px 17px;border-color:transparent transparent transparent var(--kinah-ink)}
.g-vid:hover .g-play{background:var(--kinah);border-color:#F6CB7C}
.g-vid:hover .g-play::after{border-left-color:#261702}
.g-frame{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:10px;background:#000}
.g-vcap{font-size:13px;color:var(--muted);margin-top:8px}
.g-vcap a{color:var(--ink-2)}
.g-vnote{display:block;font-size:12px;color:var(--faint);margin-top:2px}

/* arena maps */
.g-map{margin:0;padding:8px;border-radius:10px;background:rgba(9,11,21,.5);box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.g-map svg{display:block;width:100%;height:auto}
.g-map figcaption{font-size:12px;color:var(--muted);margin-top:6px;text-align:center;line-height:1.35}
.ga-floor{fill:#151A35;stroke:var(--line-2);stroke-width:1.5}
.ga-floor.ga-edge{stroke:var(--no);stroke-dasharray:5 4;stroke-width:1.5}
.ga-hole{fill:var(--night);stroke:var(--line-2)}
.ga-danger{fill:rgba(255,125,107,.24);stroke:var(--no);stroke-width:1.2;stroke-dasharray:4 3}
.ga-wave{fill:none;stroke:var(--no);stroke-width:5;stroke-opacity:.55}
.ga-bar{fill:none;stroke:rgba(255,125,107,.32);stroke-dasharray:none}
.ga-safe{fill:rgba(94,216,203,.16);stroke:var(--aether);stroke-width:1.4}
.ga-pillar{fill:#2A3157;stroke:#3C4675}
.ga-gate{fill:#2A3157}
.ga-arrow{stroke:var(--aether);stroke-width:2.2}
.ga-head{fill:var(--aether)}
.ga-boss{fill:var(--kinah);stroke:#F6CB7C;stroke-width:1.5}
.ga-bl{font:700 12px var(--f-body);fill:#261702}
.ga-tank{fill:#5AA6FF}
.ga-healer{fill:var(--g-rare)}
.ga-ul{font:700 10px var(--f-body);fill:#0B0E1E}
.ga-party circle{fill:var(--ink-2)}
.ga-add{fill:var(--no)}
.ga-t{font:600 10.5px var(--f-body);fill:var(--ink);paint-order:stroke;stroke:#0B0E1E;stroke-width:3px;stroke-linejoin:round}

/* players' runs */
.g-runs{padding:16px 18px;border:1px solid var(--line-2);border-radius:14px;background:linear-gradient(120deg,var(--aether-bg),var(--panel) 55%)}
.g-runs .stats{margin-top:8px}
.g-runs .stats div b{color:var(--aether)}
.g-runs-head{display:flex;gap:10px;align-items:center;font-size:12.5px;color:var(--muted)}
.g-early{font:700 10.5px var(--f-body);letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:999px;color:var(--aether);border:1px solid rgba(94,216,203,.45)}
.g-runs-empty b{display:block;margin-bottom:4px}
.g-runs-empty p{color:var(--ink-2);font-size:14px}

/* questions and sources */
.g-faq{max-width:760px;display:grid;gap:8px}
.g-faq details{margin:0;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:0 14px}
.g-faq summary{cursor:pointer;font-weight:600;padding:12px 0;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:12px}
.g-faq summary::-webkit-details-marker{display:none}
.g-faq summary::after{content:"+";color:var(--kinah);font-weight:800}
.g-faq details[open] summary::after{content:"−"}
.g-faq p{color:var(--ink-2);font-size:14px;margin:0 0 12px}
.g-src{font-size:12.5px;color:var(--muted);max-width:760px;margin-top:22px;line-height:1.6}
.g-src a{color:var(--ink-2)}

/* the /guides/ hub card */
a.card.g-card{display:flex;gap:12px;align-items:flex-start}
.g-card img{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none;border:1px solid color-mix(in oklab,var(--kinah) 45%,var(--line-2))}

/* role buttons dim what isn't yours; wipe checks never dim */
.g-guide[data-role=tank] .g-row[data-who]:not([data-who~=all]):not([data-who~=tank]),
.g-guide[data-role=healer] .g-row[data-who]:not([data-who~=all]):not([data-who~=healer]),
.g-guide[data-role=dps] .g-row[data-who]:not([data-who~=all]):not([data-who~=dps]):not([data-who~=melee]):not([data-who~=ranged]),
.g-guide[data-role=tank] .g-tips li[data-who]:not([data-who=tank]),
.g-guide[data-role=healer] .g-tips li[data-who]:not([data-who=healer]),
.g-guide[data-role=dps] .g-tips li[data-who]:not([data-who=dps]){opacity:.3}
/* mode buttons hide what that mode doesn't have */
.g-guide[data-mode=exploration] .g-entry [data-col]:not([data-col=exploration]),
.g-guide[data-mode=normal] .g-entry [data-col]:not([data-col=normal]),
.g-guide[data-mode=hard] .g-entry [data-col]:not([data-col=hard]),
.g-guide[data-mode=exploration] [data-modes]:not([data-modes~=exploration]),
.g-guide[data-mode=normal] [data-modes]:not([data-modes~=normal]),
.g-guide[data-mode=hard] [data-modes]:not([data-modes~=hard]){display:none}

@media (max-width:640px){
  .g-band{flex-wrap:wrap;gap:12px 14px;padding:14px}
  .g-bslot{width:52px;height:52px}
  .g-bt{flex:1}
  .g-stats{margin:0;width:100%;grid-template-columns:auto 1fr;padding-top:10px;border-top:1px solid var(--gold-line)}
  .g-stats dd{text-align:left}
  .g-pbody{padding:2px 14px 14px}
  .g-pgrid.has-map{grid-template-columns:1fr}
  .g-pgrid .g-map{max-width:300px;width:100%;justify-self:center}
  .g-ab.has-map{grid-template-columns:1fr}
  .g-ab .g-map{max-width:260px;width:100%;justify-self:center}
  .g-ah{flex-wrap:wrap;row-gap:2px}
  .g-ah b{flex-basis:100%;margin-left:27px}
  .g-ah .g-mo{margin-left:27px}
  .g-spine::before{left:14px}
  .g-sp-step{padding-left:44px}
  .g-sp-n{left:3px;width:24px;height:24px}
  .g-sp-n span{font-size:11px}
  .g-ctl{gap:8px}
  .g-modes>span,.g-roles>span{flex-basis:100%;min-width:0}
  .g-ctl button{padding:6px 9px;font-size:12.5px}
  .g-entry table{font-size:12.5px}
  .g-entry th,.g-entry td{padding:7px 6px}
  .g-entry thead th{font-size:11px}
  .g-long{display:none}
}
@media (max-width:400px){.g-roles button svg.gi{display:none}}

/* how-to guides (farming, crafting, gear, leveling, routines) */
.g-text{color:var(--ink-2);font-size:14.5px;margin:12px 0 0}
.g-data{margin-top:4px}
.g-data .tbl-wrap{margin-top:8px}
.g-data .cta-card{margin:10px 0 0}
.g-data .links{margin-top:6px}
.g-data .note{margin-top:8px}
.g-tbl{margin-top:2px}
.g-howto .g-alert{margin-top:16px}
.g-p-how .g-pbody>:first-child:not(.g-sh):not(.g-bsum){margin-top:16px}

/* The dailies and weeklies checklist (site/js/checklist.js), layout B: a short checklist, Today and This week side by
   side, one line per task. On its own so the same card works on the checklist guide (appended to seo.css by the
   build) and on the profile (linked by index.html). Dark by default; the light theme is at the end. */
.kc{--kc-gold:#E9C27A;--kc-edge:#3B3418;--kc-rule:rgba(255,255,255,.07);--kc-row:rgba(255,255,255,.045);--kc-hover:rgba(255,255,255,.03);--kc-box:#4A527E;--kc-bg:linear-gradient(180deg,#141935,#0E1226);
  margin:22px 0 10px;border-radius:14px;background:var(--kc-bg);border:1px solid var(--kc-edge);box-shadow:inset 0 0 0 1px rgba(235,174,76,.05),0 30px 60px -40px #000;overflow:hidden;color:var(--ink);text-align:left;font-family:var(--f-body)}
.kc .kc-i{width:16px;height:16px;flex:none}
.kc a{color:var(--kc-gold);font-weight:600}
.kc-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kc button:focus-visible,.kc select:focus-visible,.kc input:focus-visible,.kc summary:focus-visible{outline:2px solid var(--kinah);outline-offset:2px}
/* header: the name and the character picker */
.kc-hd{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid var(--kc-rule)}
.kc-hd h2{margin:0 auto 0 0;font:600 18px/1.2 var(--f-display);color:var(--kinah-ink);letter-spacing:-.01em}
.kc-who select{appearance:none;-webkit-appearance:none;font:600 14px var(--f-body);color:var(--ink);background:var(--slot) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0h10L5 6z' fill='%237D84A8'/%3E%3C/svg%3E") no-repeat right 10px center;border:1px solid var(--line-2);border-radius:8px;padding:6px 28px 6px 11px;cursor:pointer;max-width:240px}
.kc-who select:hover{border-color:var(--muted)}
/* the two lists */
.kc-cols{display:grid;grid-template-columns:1fr 1fr}
.kc-col{min-width:0;padding-bottom:6px}
.kc-col+.kc-col{border-left:1px solid var(--kc-rule)}
.kc-ch{display:flex;align-items:baseline;gap:8px;padding:12px 18px 8px}
.kc-ch h3{margin:0;font:700 12px var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--kc-gold)}
.kc-c{font:600 13px var(--f-mono);color:var(--ink)}
.kc-w{margin-left:auto;font-size:12.5px;color:var(--muted);white-space:nowrap}
.kc-thin{height:3px;margin:0 18px 4px;border-radius:9px;background:var(--kc-rule);overflow:hidden}
.kc-thin u{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,#B9781F,#F8D598);transition:width .25s}
.kc-rows{list-style:none;margin:0;padding:0}
/* one task */
.kc-r{display:flex;align-items:center;gap:12px;padding:8px 18px;min-height:42px;border-top:1px solid var(--kc-row);cursor:pointer;transition:background .12s}
.kc-r:first-child{border-top:0}
.kc-r:hover{background:var(--kc-hover)}
.kc-bx{all:unset;box-sizing:border-box;cursor:pointer;width:22px;height:22px;border-radius:6px;border:2px solid var(--kc-box);flex:none;display:grid;place-items:center}
.kc-bx svg{width:14px;height:14px;fill:none;stroke:#261702;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.kc-r.part .kc-bx{border-color:var(--kinah)}
.kc-r.done .kc-bx{background:linear-gradient(135deg,#F8D598,#B9781F);border-color:transparent}
.kc-r.done .kc-bx svg{opacity:1}
.kc-r.done.tr .kc-bx{background:linear-gradient(135deg,#9CF0E6,#2BA597)}
.kc-r.done.tr .kc-bx svg{stroke:#04211E}
.kc-t{flex:1;min-width:0;font-weight:600;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kc-t small{font-weight:500;color:var(--faint);font-size:12.5px;margin-left:6px}
.kc-r.done .kc-t{color:var(--muted);font-weight:500;text-decoration:line-through;text-decoration-color:rgba(179,183,211,.4)}
.kc-r.hid{opacity:.45}
.kc-n{font:600 13px var(--f-mono);color:var(--ink-2);min-width:28px;text-align:right}
.kc-r.done .kc-n{color:var(--faint)}
.kc-alts{color:var(--faint);display:grid;place-items:center}
.kc-dot{width:16px;height:16px;flex:none;display:grid;place-items:center}
.kc-dot i,.kc-key i{width:7px;height:7px;border-radius:50%;background:var(--aether);box-shadow:0 0 0 3px rgba(94,216,203,.18)}
.kc-minus{all:unset;box-sizing:border-box;cursor:pointer;width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font:600 16px/1 var(--f-body);color:var(--muted);opacity:0;transition:opacity .12s}
.kc-r:hover .kc-minus,.kc-minus:focus-visible{opacity:1}
.kc-minus:hover{color:var(--ink);background:var(--kc-hover)}
@media (hover:none){.kc-r.part .kc-minus{opacity:1}}
/* the season line */
.kc-season{border-top:1px solid var(--kc-rule)}
.kc-season summary{list-style:none;display:flex;align-items:center;gap:10px;padding:11px 18px;font-size:13.5px;color:var(--ink-2);cursor:pointer}
.kc-season summary::-webkit-details-marker{display:none}
.kc-season summary b{color:#FF9C8E;font-weight:600}
.kc-season summary em{margin-left:auto;font-style:normal;font-weight:600;color:var(--kc-gold)}
.kc-season[open] summary em{font-size:0}
.kc-season[open] summary em::after{content:"Hide";font-size:13.5px}
.kc-season .kc-rows{padding-bottom:6px}
/* the footer */
.kc-ft{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;padding:11px 18px;border-top:1px solid var(--kc-rule);font-size:13px;color:var(--muted)}
.kc-note{margin-right:auto}
.kc-note b{color:var(--ink);font-weight:600}
.kc-key{display:inline-flex;align-items:center;gap:8px}
.kc-link{all:unset;cursor:pointer;font:600 13px var(--f-body);color:var(--kc-gold)}
.kc-link[aria-pressed=true]{color:var(--ink);background:var(--kc-hover);padding:4px 10px;border-radius:7px;border:1px solid var(--line-2)}
.kc-btn,.kc-mini{all:unset;box-sizing:border-box;cursor:pointer;font:600 13px var(--f-body);color:var(--ink-2);padding:6px 12px;border-radius:8px;border:1px solid var(--line-2);white-space:nowrap}
.kc-mini{font-size:12px;padding:3px 9px}
.kc-btn:hover,.kc-mini:hover{color:var(--ink);border-color:var(--muted)}
.kc-pri{color:#261702;background:linear-gradient(135deg,#F8D598,#D79A3A);border-color:transparent}
.kc-pri:hover{color:#261702;border-color:transparent;filter:brightness(1.05)}
.kc-danger{color:#FF9C8E}
/* add or edit a character; add your own task */
.kc-form{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:flex-end;margin:0;padding:14px 18px;border-bottom:1px solid var(--kc-rule);background:rgba(255,255,255,.02)}
.kc-form label{display:grid;gap:4px;font-size:12.5px;color:var(--muted)}
.kc-form input:not([type]),.kc-form select,.kc-own input,.kc-own select{font:500 14px var(--f-body);color:var(--ink);background:var(--slot);border:1px solid var(--line-2);border-radius:8px;padding:7px 10px;min-width:0}
.kc-form input:not([type]){width:180px}
.kc-form select{max-width:260px}
.kc-form .kc-chk{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--ink-2);padding-bottom:8px}
.kc-fa{display:flex;gap:8px;flex-wrap:wrap}
.kc-own{display:flex;gap:8px;margin:6px 18px 4px}
.kc-own input{flex:1;min-width:0}
@media (max-width:700px){
  .kc-cols{grid-template-columns:1fr}
  .kc-col+.kc-col{border-left:0;border-top:1px solid var(--kc-rule)}
  .kc-hd,.kc-ch,.kc-r,.kc-season summary,.kc-ft,.kc-form{padding-left:14px;padding-right:14px}
  .kc-thin{margin-left:14px;margin-right:14px}
  .kc-own{margin-left:14px;margin-right:14px}
  .kc-form input:not([type]),.kc-form select{width:100%;max-width:none}
  .kc-form label{flex:1 1 100%}
}
:root[data-theme="light"] .kc{--slot:#F1EFF6;--line:#E6E2EE;--line-2:#D3CEE0;--ink:#17192E;--ink-2:#3C4063;--muted:#686D90;--faint:#9296B2;--kinah-ink:#8A5A12;
  --kc-gold:#8A5A12;--kc-edge:#E6D3A8;--kc-rule:rgba(20,23,43,.08);--kc-row:rgba(20,23,43,.06);--kc-hover:rgba(20,23,43,.035);--kc-box:#B9B4CC;--kc-bg:#FFFFFF;box-shadow:0 22px 46px -30px rgba(30,30,60,.35)}
:root[data-theme="light"] .kc-season summary b,:root[data-theme="light"] .kc-danger{color:#C8452F}
:root[data-theme="light"] .kc-form{background:#FAF9FC}
:root[data-theme="light"] .kc-r.done .kc-t{text-decoration-color:rgba(60,64,99,.35)}