@import url("/work.css");
@import url("/brand-theme.css");

:root{
  --bg:#050506;--bg-mid:#080506;--panel:#0b090a;--panel2:#120b0c;
  --cream:#f2ece8;--body-copy:#d9cecb;--muted:#b9aaa8;
  --gold:#a93636;--red:#651111;--line:#351414;
  --soft:rgba(169,54,54,.10);--body-glow:rgba(120,18,18,.14);
  --accent-border:rgba(169,54,54,.32);--accent-border-strong:rgba(185,63,63,.70);
  --accent-faint:rgba(169,54,54,.07);
}
.dt-wrap{width:min(1100px,calc(100% - 40px));margin-left:auto;margin-right:auto}
.dt-nav{margin:16px auto 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:center;gap:34px;padding:13px 10px;font:900 12px/1 Arial,sans-serif;letter-spacing:1.3px;text-transform:uppercase}
.dt-nav a{text-decoration:none;color:color-mix(in srgb,var(--gold) 82%,white 18%);padding:6px 12px;border-radius:20px}
.dt-nav a.active,.dt-nav a:hover{color:#fff;background:#3a0d0d}
.logo-hero{text-align:center;padding:30px 0 18px}.logo-hero img{width:min(680px,85%);max-height:245px;object-fit:contain}
.home-intro{display:grid;grid-template-columns:390px 1fr;gap:46px;align-items:center;padding:28px 0 64px;border-bottom:1px solid var(--line)}
.home-intro img{width:100%;max-height:520px;object-fit:cover;border-radius:14px;border:1px solid var(--accent-border);box-shadow:0 18px 45px #000}
.home-intro h1{font-size:42px;line-height:1.12;margin-top:0}.home-intro .lead{font-size:18px;line-height:1.65;color:var(--body-copy)}
.eyebrow{font-family:Arial,sans-serif;text-transform:uppercase;letter-spacing:2px;color:var(--gold);font-weight:900;font-size:12px;margin:0 0 8px}
.portal{padding:62px 0}.section-head{text-align:center;margin-bottom:28px}.section-head p{color:var(--muted)}
.portal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.portal-card{position:relative;aspect-ratio:4/5;min-height:0;padding:0;overflow:hidden;border-radius:13px;border:1px solid var(--accent-border);text-decoration:none;background:#100b08}
.portal-card img{width:100%;height:100%;object-fit:cover;transition:.35s}.portal-card:hover img{transform:scale(1.035)}
.portal-card:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.92))}
.portal-label{position:absolute;z-index:2;left:22px;bottom:20px}.portal-label small{display:block;color:var(--gold);font-family:Arial,sans-serif;font-weight:900;letter-spacing:1.5px}.portal-label strong{font-size:28px;color:var(--cream)}
.page-head{text-align:center;padding:48px 0 30px}.page-head h1{font-size:42px;line-height:1.12;margin:0 0 10px}.page-head p{max-width:720px;margin:0 auto;color:var(--muted)}
.character-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:760px;margin:0 auto;padding-bottom:70px}
.character-card{text-decoration:none;background:#0a0807;border:1px solid var(--accent-border);border-radius:14px;overflow:hidden}
.character-card img{width:100%;aspect-ratio:4/5;height:360px;object-fit:cover;object-position:center top}.character-card div{padding:20px 22px}.character-card h2{font-size:23px;line-height:1.12;margin:0}.character-card p{color:var(--muted);margin-bottom:0}
.profile{display:grid;grid-template-columns:44% 1fr;gap:46px;padding:46px 0}.profile-art img{width:100%;border-radius:14px;border:1px solid var(--accent-border)}
.profile h1{font-size:42px;line-height:1.12;margin:0}.profile h2{font-size:32px;line-height:1.12}.profile h3{font-size:23px;line-height:1.12}.profile .lead{font-size:18px;color:var(--body-copy)}.profile p{color:var(--body-copy)}
.facts{display:grid;grid-template-columns:150px 1fr;border-top:1px solid var(--line);margin:24px 0}.facts div,.facts b{padding:9px 0;border-bottom:1px solid var(--line)}.facts b{color:var(--gold);font-family:Arial,sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:1px}
.appearance{margin-top:30px;padding:20px;border:1px solid var(--line);border-radius:10px;background:#0d0907}
.character-nav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 64px;padding-top:26px;border-top:1px solid var(--line)}
.character-nav a{display:block;padding:16px 18px;border:1px solid var(--accent-border);border-radius:10px;background:#0d0909;text-decoration:none;color:var(--cream)}
.character-nav a:last-child{text-align:right}.character-nav small{display:block;margin-bottom:3px;color:var(--gold);font:900 11px/1 Arial,sans-serif;letter-spacing:1.3px;text-transform:uppercase}.character-nav strong{font-size:18px}.character-nav a:hover{background:#1b0909;border-color:var(--accent-border-strong)}
.issue-grid{display:grid;grid-template-columns:310px 1fr;gap:38px;align-items:start;padding-bottom:70px}.issue-cover{width:100%;border-radius:10px;border:1px solid var(--accent-border)}.issue-grid h1{font-size:42px;line-height:1.12}.issue-grid .lead{color:var(--body-copy);font-size:18px}
.lore-body{max-width:820px;margin:0 auto;padding:34px 0 70px}.lore-body .wide-art{display:block;width:min(100%,540px);height:auto;margin:0 auto 34px;border-radius:13px;border:1px solid var(--accent-border);box-shadow:0 14px 32px rgba(0,0,0,.32)}
.lore-body h2{font-size:32px;line-height:1.12}.lore-body h3{font-size:23px;line-height:1.12}.lore-body p{color:var(--body-copy)}
@media(max-width:800px){.home-intro,.profile,.issue-grid{grid-template-columns:1fr}.home-intro img{max-width:430px;margin:auto}.portal-grid{grid-template-columns:1fr}.portal-card{aspect-ratio:16/10}.character-grid{grid-template-columns:1fr;max-width:430px}.character-card img{height:auto}.dt-nav{gap:8px;flex-wrap:wrap}.facts{grid-template-columns:120px 1fr}.page-head h1,.home-intro h1,.profile h1,.issue-grid h1{font-size:34px}}
@media(max-width:600px){.character-nav{grid-template-columns:1fr}.character-nav a:last-child{text-align:left}}