@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600;700;800&family=Crimson+Pro:ital,wght@0,400;0,600;1,400&display=swap');

:root {
  --bg: #060610;
  --bg2: #0a0a1a;
  --bg3: #0f0f22;
  --card: #0d0d20;
  --card2: #121228;
  --accent: #e63946;
  --accent2: #ff6b6b;
  --gold: #ffd166;
  --gold2: #f4a261;
  --teal: #06d6a0;
  --blue: #4cc9f0;
  --text: #eeeef5;
  --text-dim: #9898c0;
  --text-muted: #55558a;
  --border: #181832;
  --border2: #222248;
  --max-w: 1280px;
  --radius: 10px;
  --shadow: 0 8px 40px rgba(0,0,0,.7);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;font-size:16px;line-height:1.7;overflow-x:hidden;}

/* grain overlay */
body::after{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.025'/%3E%3C/svg%3E");pointer-events:none;z-index:9999;}

h1,h2,h3,h4,h5{font-family:'Bebas Neue',sans-serif;letter-spacing:.06em;line-height:1.1;}
h1{font-size:clamp(2rem,5vw,3.5rem);}
h2{font-size:clamp(1.5rem,3vw,2.2rem);}
h3{font-size:clamp(1.1rem,2vw,1.6rem);}
p{margin-bottom:1rem;color:var(--text-dim);}
a{color:var(--accent2);text-decoration:none;transition:color .2s;}
a:hover{color:var(--gold);}
strong{color:var(--text);}
em{color:var(--gold);font-style:italic;}

.container{max-width:var(--max-w);margin:0 auto;padding:0 24px;}
.section{padding:64px 0;}

/* ===== NAV ===== */
.site-nav{position:sticky;top:0;z-index:1000;background:rgba(6,6,16,.96);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);transition:box-shadow .3s;}
.site-nav.scrolled{box-shadow:0 2px 40px rgba(0,0,0,.6);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px;max-width:var(--max-w);margin:0 auto;padding:0 24px;gap:16px;}

.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0;}
.logo-icon{width:36px;height:36px;background:linear-gradient(135deg,var(--accent),var(--gold));border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue';font-size:1.2rem;color:#fff;}
.logo-text{font-family:'Bebas Neue';font-size:1.5rem;letter-spacing:.12em;color:var(--text);}
.logo-text span{color:var(--accent);}

/* inline search in nav */
.nav-search{flex:1;max-width:320px;position:relative;}
.nav-search input{width:100%;background:var(--card);border:1px solid var(--border2);padding:8px 16px 8px 36px;border-radius:20px;font-family:'Inter';font-size:.82rem;color:var(--text);outline:none;transition:border-color .2s;}
.nav-search input:focus{border-color:var(--accent);}
.nav-search input::placeholder{color:var(--text-muted);}
.nav-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:.85rem;}

.nav-links{display:flex;align-items:center;gap:4px;list-style:none;}
.nav-links>li{position:relative;}
.nav-links>li>a{display:block;padding:7px 12px;color:var(--text-dim);font-weight:600;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;border-radius:6px;transition:all .2s;}
.nav-links>li>a:hover,.nav-links>li>a.active{color:var(--text);background:var(--card);}
.nav-links>li>a.active{color:var(--accent);}

.dropdown-menu{display:none;position:absolute;top:calc(100% + 8px);left:0;min-width:240px;background:var(--bg2);border:1px solid var(--border2);border-radius:var(--radius);box-shadow:var(--shadow);padding:8px;z-index:200;}
.nav-links>li:hover .dropdown-menu{display:block;}
.dropdown-menu a{display:block;padding:8px 12px;color:var(--text-dim);font-size:.85rem;border-radius:6px;transition:all .15s;}
.dropdown-menu a:hover{background:var(--card2);color:var(--gold);}
.nav-cta{background:linear-gradient(135deg,var(--accent),#c1121f)!important;color:#fff!important;padding:8px 18px!important;border-radius:20px!important;font-weight:700!important;}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;color:var(--text);font-size:1.4rem;flex-shrink:0;}

/* ===== HERO ===== */
.hero{min-height:580px;display:flex;align-items:center;padding:80px 0 60px;background:
  radial-gradient(ellipse at 15% 60%,rgba(230,57,70,.14) 0%,transparent 55%),
  radial-gradient(ellipse at 85% 20%,rgba(255,209,102,.08) 0%,transparent 50%),
  radial-gradient(ellipse at 50% 100%,rgba(76,201,240,.06) 0%,transparent 50%),
  var(--bg);
  position:relative;overflow:hidden;}
/* Hero with background image — darkens the image so text stays readable */
.hero[style*="background-image"]{background-color:rgba(4,4,12,.72);}
.hero[style*="background-image"]::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,6,16,.85) 40%,rgba(6,6,16,.3) 100%);pointer-events:none;z-index:0;}
.hero[style*="background-image"] .container{position:relative;z-index:1;}
.hero::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent 80px,rgba(255,255,255,.008) 80px,rgba(255,255,255,.008) 81px);}

.hero-inner{position:relative;z-index:1;max-width:720px;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(230,57,70,.12);border:1px solid rgba(230,57,70,.25);color:var(--accent2);padding:5px 14px;border-radius:20px;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:20px;}
.hero h1{font-size:clamp(2.8rem,6vw,4.8rem);color:var(--text);margin-bottom:16px;}
.hero h1 .accent{color:var(--accent);}
.hero h1 .gold{color:var(--gold);}
.hero p.lead{font-size:1.05rem;max-width:560px;margin-bottom:28px;color:var(--text-dim);}

/* HERO SEARCH */
.hero-search{margin-bottom:32px;}
.hero-search-form{display:flex;max-width:560px;gap:0;box-shadow:0 4px 40px rgba(230,57,70,.2);}
.hero-search-input{flex:1;background:rgba(255,255,255,.06);border:1px solid var(--border2);border-right:none;padding:15px 22px;font-family:'Inter';font-size:1rem;color:var(--text);border-radius:10px 0 0 10px;outline:none;transition:border-color .2s;}
.hero-search-input:focus{border-color:var(--accent);}
.hero-search-input::placeholder{color:var(--text-muted);}
.hero-search-btn{background:linear-gradient(135deg,var(--accent),#c1121f);color:#fff;border:none;padding:15px 28px;font-family:'Bebas Neue';font-size:1.1rem;letter-spacing:.12em;cursor:pointer;border-radius:0 10px 10px 0;transition:opacity .2s;white-space:nowrap;}
.hero-search-btn:hover{opacity:.9;}

.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:40px;}
.hero-stats{display:flex;gap:36px;padding-top:28px;border-top:1px solid var(--border);}
.hero-stat .num{font-family:'Bebas Neue';font-size:2rem;color:var(--gold);letter-spacing:.05em;line-height:1;}
.hero-stat .lbl{font-size:.73rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-top:3px;}

/* authority strip */
.authority-strip{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:16px 0;}
.authority-inner{display:flex;align-items:center;justify-content:center;gap:48px;flex-wrap:wrap;}
.auth-item{display:flex;align-items:center;gap:10px;font-size:.82rem;color:var(--text-muted);}
.auth-item strong{color:var(--text-dim);font-size:.95rem;}
.auth-sep{color:var(--border2);}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:8px;font-weight:700;font-size:.88rem;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:all .2s;border:none;text-decoration:none;}
.btn-primary{background:linear-gradient(135deg,var(--accent),#c1121f);color:#fff;box-shadow:0 4px 24px rgba(230,57,70,.35);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 30px rgba(230,57,70,.5);color:#fff;}
.btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border2);}
.btn-secondary:hover{background:var(--card);border-color:var(--text-muted);color:var(--text);}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#000;}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 4px 20px rgba(255,209,102,.4);color:#000;}
.btn-sm{padding:8px 18px;font-size:.78rem;}

/* ===== SECTION HEADERS ===== */
.section-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:28px;padding-bottom:16px;border-bottom:1px solid var(--border);}
.section-header h2{color:var(--text);}
.section-header .sub{font-size:.85rem;color:var(--text-muted);margin-top:4px;}
.section-header a{font-size:.82rem;color:var(--accent2);font-weight:700;white-space:nowrap;flex-shrink:0;}
.title-bar{display:inline-flex;align-items:center;gap:12px;}
.title-line{display:block;width:4px;height:2rem;background:var(--accent);border-radius:2px;}

/* ===== CARDS ===== */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:22px;}
.card-grid-4{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;}

.article-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:all .25s;display:flex;flex-direction:column;text-decoration:none;}
.article-card:hover{transform:translateY(-4px);box-shadow:0 8px 40px rgba(0,0,0,.5);border-color:var(--border2);}
.card-img{height:190px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .3s;}
.article-card:hover .card-img img{transform:scale(1.06);}
.card-img-placeholder{font-family:'Bebas Neue';font-size:2.5rem;letter-spacing:.2em;color:rgba(255,255,255,.06);}
.card-cat{position:absolute;top:12px;left:12px;background:var(--accent);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:3px 10px;border-radius:20px;}
.card-body{padding:18px;flex:1;display:flex;flex-direction:column;}
.card-body h3{font-size:1.1rem;color:var(--text);margin-bottom:8px;line-height:1.3;}
.card-body p{font-size:.85rem;color:var(--text-muted);margin-bottom:12px;flex:1;}
.card-meta{display:flex;align-items:center;justify-content:space-between;font-size:.75rem;color:var(--text-muted);margin-top:auto;}
.card-read-more{font-size:.78rem;color:var(--accent2);font-weight:700;text-transform:uppercase;letter-spacing:.05em;}

/* ===== TRENDING SECTION ===== */
.trending-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;}
.trending-item{display:flex;align-items:center;gap:14px;padding:14px 18px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;transition:all .2s;}
.trending-item:hover{background:var(--card2);border-color:var(--border2);transform:translateX(4px);}
.trend-rank{font-family:'Bebas Neue';font-size:1.6rem;color:var(--text-muted);line-height:1;min-width:28px;}
.trend-rank.hot{color:var(--accent);}
.trend-info .trend-title{font-weight:700;font-size:.9rem;color:var(--text);line-height:1.3;margin-bottom:3px;}
.trend-info .trend-cat{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;}
.trend-fire{font-size:1rem;margin-left:auto;}

/* ===== RECENTLY UPDATED ===== */
.updated-list{display:flex;flex-direction:column;gap:0;}
.updated-item{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--border);text-decoration:none;gap:16px;}
.updated-item:last-child{border-bottom:none;}
.updated-item:hover .upd-title{color:var(--accent2);}
.upd-left{display:flex;align-items:center;gap:14px;}
.upd-icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;}
.upd-title{font-weight:600;font-size:.92rem;color:var(--text);}
.upd-cat{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;}
.upd-date{font-size:.75rem;color:var(--teal);font-weight:600;white-space:nowrap;background:rgba(6,214,160,.1);padding:3px 10px;border-radius:20px;}

/* ===== UNIVERSE TILES ===== */
.universe-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;}
.universe-tile{padding:20px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);text-align:center;text-decoration:none;transition:all .25s;position:relative;overflow:hidden;}
.universe-tile::before{content:'';position:absolute;inset:0;background:var(--tile-color,var(--accent));opacity:0;transition:opacity .25s;}
.universe-tile:hover::before{opacity:.08;}
.universe-tile:hover{border-color:var(--tile-color,var(--accent));transform:translateY(-3px);box-shadow:0 6px 30px rgba(0,0,0,.4);}
.universe-tile .uni-emoji{font-size:2.2rem;display:block;margin-bottom:10px;position:relative;z-index:1;}
.universe-tile h3{font-size:.95rem;color:var(--text);position:relative;z-index:1;}
.universe-tile .uni-count{font-size:.72rem;color:var(--text-muted);margin-top:4px;position:relative;z-index:1;}

/* ===== CAT TILES ===== */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;}
.cat-tile{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px 18px;text-align:center;transition:all .25s;text-decoration:none;display:block;}
.cat-tile:hover{background:var(--card2);border-color:var(--accent);transform:translateY(-3px);box-shadow:0 6px 30px rgba(230,57,70,.18);}
.cat-tile .ico{font-size:2rem;display:block;margin-bottom:10px;}
.cat-tile h3{font-size:.95rem;color:var(--text);}
.cat-tile p{font-size:.78rem;color:var(--text-muted);margin:4px 0 0;}

/* ===== ARTICLE LAYOUT ===== */
.article-layout{display:grid;grid-template-columns:1fr 320px;gap:40px;max-width:var(--max-w);margin:0 auto;padding:36px 24px 80px;align-items:start;}
.article-content{min-width:0;}

.breadcrumb{display:flex;align-items:center;gap:8px;font-size:.78rem;color:var(--text-muted);margin-bottom:20px;flex-wrap:wrap;}
.breadcrumb a{color:var(--text-muted);}
.breadcrumb a:hover{color:var(--accent2);}
.breadcrumb span{opacity:.4;}

.article-hero{background:linear-gradient(135deg,var(--bg2),var(--bg3));border:1px solid var(--border);border-radius:14px;padding:32px;margin-bottom:28px;position:relative;overflow:hidden;}
.article-hero::before{content:'';position:absolute;top:-40px;right:-40px;width:180px;height:180px;background:radial-gradient(circle,rgba(230,57,70,.1),transparent);border-radius:50%;}
.article-cat-badge{display:inline-block;background:rgba(230,57,70,.18);color:var(--accent2);border:1px solid rgba(230,57,70,.25);padding:4px 12px;border-radius:20px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px;}
.article-hero h1{color:var(--text);margin-bottom:12px;font-size:clamp(1.8rem,4vw,2.8rem);}
.article-hero .article-desc{font-size:1rem;color:var(--text-dim);max-width:640px;}
.article-meta{display:flex;align-items:center;gap:14px;margin-top:18px;padding-top:18px;border-top:1px solid var(--border);font-size:.78rem;color:var(--text-muted);flex-wrap:wrap;}
.meta-tag{display:inline-flex;align-items:center;gap:5px;background:var(--bg2);border:1px solid var(--border);padding:3px 10px;border-radius:20px;font-size:.74rem;}
.author-tag{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:var(--text-muted);}
.author-tag strong{color:var(--text-dim);}

.article-body{color:var(--text-dim);line-height:1.8;}
.article-body h2{color:var(--text);margin-top:40px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border);font-size:1.7rem;}
.article-body h3{color:var(--text);margin-top:26px;margin-bottom:10px;font-size:1.3rem;}
.article-body h4{color:var(--gold);margin-top:18px;margin-bottom:8px;font-family:'Inter';font-size:.88rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700;}
.article-body p{margin-bottom:1rem;}
.article-body ul,.article-body ol{margin:0 0 1.2rem 1.4rem;color:var(--text-dim);}
.article-body li{margin-bottom:7px;}
.article-body a{color:var(--accent2);border-bottom:1px solid rgba(255,107,107,.2);}
.article-body a:hover{color:var(--gold);border-color:var(--gold);}
.article-body strong{color:var(--text);}
.article-body blockquote{border-left:3px solid var(--accent);padding:12px 20px;background:rgba(230,57,70,.05);border-radius:0 8px 8px 0;margin:18px 0;font-style:italic;}

/* internal link cluster */
.link-cluster{background:linear-gradient(135deg,rgba(230,57,70,.07),rgba(255,209,102,.04));border:1px solid var(--border2);border-left:3px solid var(--accent);border-radius:0 10px 10px 0;padding:20px 24px;margin:32px 0;}
.link-cluster h4{color:var(--gold);font-family:'Bebas Neue';font-size:1rem;letter-spacing:.12em;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.cluster-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;}
.cluster-link{display:flex;align-items:center;gap:8px;padding:9px 12px;background:var(--bg2);border:1px solid var(--border);border-radius:8px;font-size:.85rem;color:var(--text-dim);text-decoration:none;transition:all .15s;}
.cluster-link:hover{color:var(--accent2);border-color:var(--border2);background:var(--card);}
.cluster-link::before{content:'→';color:var(--accent);font-size:.8rem;flex-shrink:0;}

/* ===== TABLES ===== */
.table-wrap{overflow-x:auto;margin:22px 0;border-radius:var(--radius);border:1px solid var(--border);}
table{width:100%;border-collapse:collapse;font-size:.88rem;}
thead{background:linear-gradient(135deg,var(--bg2),var(--bg3));}
th{padding:13px 16px;text-align:left;font-family:'Bebas Neue';font-size:.9rem;letter-spacing:.08em;color:var(--gold);border-bottom:1px solid var(--border2);white-space:nowrap;}
td{padding:11px 16px;border-bottom:1px solid var(--border);color:var(--text-dim);vertical-align:top;}
tr:last-child td{border-bottom:none;}
tbody tr:hover td{background:rgba(255,255,255,.02);}
td strong{color:var(--text);}
.skip-tag{display:inline-block;background:rgba(230,57,70,.15);color:var(--accent2);font-size:.7rem;padding:2px 8px;border-radius:10px;font-weight:700;}
.watch-tag{display:inline-block;background:rgba(6,214,160,.15);color:var(--teal);font-size:.7rem;padding:2px 8px;border-radius:10px;font-weight:700;}
.optional-tag{display:inline-block;background:rgba(255,209,102,.15);color:var(--gold);font-size:.7rem;padding:2px 8px;border-radius:10px;font-weight:700;}

/* ===== POWER BARS ===== */
.power-list{list-style:none;display:flex;flex-direction:column;gap:12px;margin:18px 0;}
.power-item{}
.power-header{display:flex;justify-content:space-between;margin-bottom:5px;align-items:center;}
.power-name{font-weight:700;color:var(--text);font-size:.92rem;}
.power-score{font-family:'Bebas Neue';font-size:1.1rem;color:var(--gold);letter-spacing:.05em;}
.power-bar-wrap{background:rgba(255,255,255,.05);height:7px;border-radius:99px;overflow:hidden;}
.power-bar{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--gold));animation:barGrow 1.2s ease-out forwards;transform-origin:left;}
@keyframes barGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ===== INFO BOXES ===== */
.info-box{border-radius:var(--radius);padding:18px 22px;margin:20px 0;border-left:4px solid;}
.info-box-tip{background:rgba(6,214,160,.07);border-color:var(--teal);}
.info-box-tip .box-title{color:var(--teal);}
.info-box-warning{background:rgba(255,209,102,.07);border-color:var(--gold);}
.info-box-warning .box-title{color:var(--gold);}
.info-box-spoiler{background:rgba(230,57,70,.07);border-color:var(--accent);}
.info-box-spoiler .box-title{color:var(--accent2);}
.box-title{font-weight:800;font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;display:block;margin-bottom:7px;}
.info-box p{margin:0;font-size:.88rem;}

/* ===== TOC ===== */
.toc{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px 22px;margin:24px 0;}
.toc-title{font-family:'Bebas Neue';font-size:.95rem;letter-spacing:.1em;color:var(--gold);margin-bottom:10px;}
.toc ol{margin:0 0 0 1.2rem;}
.toc li{margin-bottom:5px;}
.toc a{color:var(--text-dim);font-size:.86rem;border:none!important;}
.toc a:hover{color:var(--accent2);}

/* ===== TIMELINE ===== */
.watch-timeline{position:relative;padding-left:30px;margin:20px 0;}
.watch-timeline::before{content:'';position:absolute;left:10px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--accent),var(--gold),transparent);}
.timeline-item{position:relative;margin-bottom:16px;padding:14px 18px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);}
.timeline-item::before{content:'';position:absolute;left:-26px;top:50%;transform:translateY(-50%);width:11px;height:11px;border-radius:50%;background:var(--accent);border:2px solid var(--bg);box-shadow:0 0 8px rgba(230,57,70,.5);}
.timeline-item.optional::before{background:var(--gold);box-shadow:0 0 8px rgba(255,209,102,.5);}
.timeline-num{font-family:'Bebas Neue';font-size:1.3rem;color:var(--accent);letter-spacing:.05em;line-height:1;}
.timeline-title{font-weight:700;color:var(--text);margin:3px 0;}
.timeline-ep{font-size:.8rem;color:var(--text-muted);}
.timeline-badge{display:inline-block;font-size:.68rem;font-weight:700;padding:2px 8px;border-radius:20px;margin-left:6px;text-transform:uppercase;letter-spacing:.06em;}
.badge-essential{background:rgba(6,214,160,.15);color:var(--teal);}
.badge-optional{background:rgba(255,209,102,.15);color:var(--gold);}
.badge-skip{background:rgba(230,57,70,.15);color:var(--accent2);}

/* ===== RANKING LIST ===== */
.rank-list{list-style:none;display:flex;flex-direction:column;gap:10px;margin:18px 0;}
.rank-item{display:flex;align-items:flex-start;gap:14px;padding:14px 18px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);transition:all .2s;}
.rank-item:hover{border-color:var(--border2);background:var(--card2);}
.rank-num{font-family:'Bebas Neue';font-size:1.8rem;line-height:1;min-width:36px;letter-spacing:.05em;}
.rank-num.top3{color:var(--gold);}
.rank-num.top10{color:var(--accent2);}
.rank-num.rest{color:var(--text-muted);}
.rank-info{flex:1;}
.rank-info h4{color:var(--text);font-size:.95rem;font-weight:700;margin-bottom:5px;}
.rank-info p{font-size:.83rem;color:var(--text-muted);margin:0;}

/* ===== HIGHLIGHT GRID ===== */
.highlight-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin:20px 0;}
.highlight-card{padding:18px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);border-top:3px solid;}
.highlight-card.red{border-top-color:var(--accent);}
.highlight-card.gold{border-top-color:var(--gold);}
.highlight-card.teal{border-top-color:var(--teal);}
.highlight-card.blue{border-top-color:var(--blue);}
.highlight-card h4{color:var(--text);font-size:.9rem;margin-bottom:7px;}
.highlight-card p{font-size:.83rem;margin:0;}

/* ===== SIDEBAR ===== */
.sidebar{position:sticky;top:80px;display:flex;flex-direction:column;gap:22px;}
.sidebar-widget{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.widget-head{background:linear-gradient(135deg,var(--bg2),var(--bg3));padding:11px 16px;font-family:'Bebas Neue';letter-spacing:.08em;font-size:.92rem;color:var(--gold);border-bottom:1px solid var(--border);}
.widget-body{padding:14px;}
.related-article{display:flex;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px solid var(--border);text-decoration:none;}
.related-article:last-child{border-bottom:none;}
.ra-thumb{width:56px;height:42px;border-radius:6px;background:var(--bg3);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.1rem;}
.ra-title{font-size:.82rem;color:var(--text-dim);line-height:1.35;font-weight:600;}
.related-article:hover .ra-title{color:var(--accent2);}
.ra-cat{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em;display:block;margin-top:2px;}

/* ===== ADS ===== */
.ad-box{background:var(--card);border:1px dashed var(--border2);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;position:relative;}
.ad-label{position:absolute;top:4px;left:8px;font-size:.62rem;color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;}
.ad-leaderboard{width:100%;height:90px;margin:22px 0;}
.ad-sidebar{width:100%;height:250px;}
.ad-rectangle{width:300px;height:250px;margin:0 auto 18px;}
.ad-inner{color:var(--text-muted);font-size:.72rem;text-align:center;}
.ad-dims{font-family:'Bebas Neue';font-size:1.1rem;color:var(--border2);letter-spacing:.1em;display:block;}

/* ===== EMAIL CAPTURE ===== */
.email-capture{background:linear-gradient(135deg,rgba(230,57,70,.1),rgba(76,201,240,.06));border:1px solid var(--border2);border-radius:14px;padding:40px;text-align:center;margin:48px 0;position:relative;overflow:hidden;}
.email-capture::before{content:'📧';position:absolute;top:-10px;right:20px;font-size:8rem;opacity:.04;}
.email-capture h3{color:var(--text);font-size:1.8rem;margin-bottom:8px;}
.email-capture p{color:var(--text-muted);font-size:.92rem;max-width:500px;margin:0 auto 10px;}
.email-perks{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin:14px 0 22px;font-size:.82rem;color:var(--text-dim);}
.email-perks span::before{content:'✓ ';color:var(--teal);}
.email-form{display:flex;gap:0;max-width:420px;margin:0 auto;}
.email-input{flex:1;background:var(--bg2);border:1px solid var(--border2);border-right:none;padding:12px 18px;color:var(--text);font-family:'Inter';font-size:.9rem;border-radius:8px 0 0 8px;outline:none;}
.email-input:focus{border-color:var(--accent);}
.email-btn{background:linear-gradient(135deg,var(--accent),#c1121f);color:#fff;border:none;padding:12px 22px;font-family:'Bebas Neue';letter-spacing:.1em;font-size:1rem;cursor:pointer;border-radius:0 8px 8px 0;}
.email-disclaimer{font-size:.72rem;color:var(--text-muted);margin-top:10px;}

/* ===== PAGE HERO ===== */
.page-hero{background:linear-gradient(135deg,var(--bg2),var(--bg));border-bottom:1px solid var(--border);padding:56px 0 40px;position:relative;overflow:hidden;}
.page-hero .cat-icon{font-size:3rem;display:block;margin-bottom:14px;line-height:1;}
.page-hero h1{margin-bottom:10px;}
.page-hero p{color:var(--text-dim);max-width:600px;margin:0;}

/* ===== UNIVERSE HUB ===== */
.universe-hero{min-height:400px;display:flex;align-items:center;padding:70px 0;background:var(--bg2);position:relative;overflow:hidden;}
.universe-hero .hub-badge{display:inline-block;background:rgba(255,209,102,.15);border:1px solid rgba(255,209,102,.25);color:var(--gold);padding:4px 14px;border-radius:20px;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;}
.hub-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:20px;}
.hub-link{display:flex;align-items:center;gap:8px;padding:9px 14px;background:var(--card);border:1px solid var(--border);border-radius:8px;font-size:.85rem;color:var(--text-dim);text-decoration:none;transition:all .15s;font-weight:600;}
.hub-link:hover{color:var(--gold);border-color:var(--gold);background:var(--card2);}
.hub-link::before{content:'→';color:var(--accent);font-size:.75rem;}

/* ===== START HERE ===== */
.start-step{display:flex;gap:20px;padding:24px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;align-items:flex-start;}
.step-num{font-family:'Bebas Neue';font-size:2.2rem;color:var(--accent);line-height:1;min-width:40px;}
.step-body h3{color:var(--text);margin-bottom:6px;}
.step-body p{margin:0;font-size:.9rem;}
.step-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.step-link{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;background:var(--bg2);border:1px solid var(--border2);border-radius:20px;font-size:.8rem;color:var(--text-dim);text-decoration:none;transition:all .15s;}
.step-link:hover{color:var(--accent2);border-color:var(--accent);}

/* ===== TOPIC LIST ===== */
.topic-list{list-style:none;display:flex;flex-direction:column;gap:3px;}
.topic-list li a{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;color:var(--text-dim);font-size:.88rem;border-radius:6px;transition:all .15s;border:1px solid transparent;}
.topic-list li a:hover{background:var(--card);border-color:var(--border);color:var(--accent2);}
.topic-list li a::after{content:'→';opacity:.4;font-size:.78rem;}

/* ===== FOOTER ===== */
.site-footer{background:var(--bg2);border-top:1px solid var(--border);padding:56px 0 28px;margin-top:72px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:44px;}
.footer-brand .logo-text{font-family:'Bebas Neue';font-size:1.7rem;letter-spacing:.1em;color:var(--text);}
.footer-brand .logo-text span{color:var(--accent);}
.footer-brand p{font-size:.85rem;color:var(--text-muted);margin-top:10px;max-width:280px;}
.footer-col h4{font-family:'Bebas Neue';letter-spacing:.1em;font-size:.9rem;color:var(--gold);margin-bottom:14px;}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:7px;}
.footer-col ul li a{color:var(--text-muted);font-size:.85rem;}
.footer-col ul li a:hover{color:var(--accent2);}
.footer-bottom{padding-top:22px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;font-size:.78rem;color:var(--text-muted);flex-wrap:wrap;gap:12px;}
.footer-links{display:flex;gap:18px;}
.footer-links a{color:var(--text-muted);}
.footer-links a:hover{color:var(--text);}

/* ===== SCROLL TOP ===== */
.scroll-top{position:fixed;bottom:28px;right:28px;width:42px;height:42px;background:var(--accent);color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:1.1rem;display:none;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(230,57,70,.5);z-index:998;transition:all .2s;}
.scroll-top.visible{display:flex;}
.scroll-top:hover{transform:translateY(-3px);}

/* ===== SEARCH RESULTS ===== */
#search-overlay{display:none;position:fixed;inset:0;background:rgba(6,6,16,.96);z-index:2000;padding:80px 24px 24px;overflow-y:auto;}
#search-overlay.open{display:block;}
.search-overlay-inner{max-width:720px;margin:0 auto;}
.search-overlay-bar{display:flex;gap:0;margin-bottom:32px;}
.search-overlay-input{flex:1;background:var(--card);border:1px solid var(--border2);border-right:none;padding:16px 22px;font-family:'Inter';font-size:1.1rem;color:var(--text);border-radius:10px 0 0 10px;outline:none;}
.search-overlay-input:focus{border-color:var(--accent);}
.search-close{background:var(--card);color:var(--text);border:1px solid var(--border2);padding:16px 22px;font-size:1rem;cursor:pointer;border-radius:0 10px 10px 0;}
.search-results{list-style:none;display:flex;flex-direction:column;gap:10px;}
.search-result-item a{display:flex;flex-direction:column;padding:16px 20px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;transition:all .2s;}
.search-result-item a:hover{border-color:var(--border2);}
.sr-cat{font-size:.72rem;color:var(--accent2);text-transform:uppercase;letter-spacing:.1em;font-weight:700;}
.sr-title{font-family:'Bebas Neue';font-size:1.2rem;color:var(--text);letter-spacing:.05em;margin:4px 0;}
.sr-desc{font-size:.84rem;color:var(--text-muted);}

/* ===== RESPONSIVE ===== */
@media(max-width:1100px){
  .article-layout{grid-template-columns:1fr;}
  .sidebar{position:static;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:768px){
  .nav-links{display:none;}
  .nav-search{display:none;}
  .nav-toggle{display:block;}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:64px;left:0;right:0;background:var(--bg2);border-bottom:1px solid var(--border);padding:14px;gap:3px;z-index:100;}
  .hero{padding:60px 0 48px;}
  .hero-stats{gap:18px;flex-wrap:wrap;}
  .authority-inner{gap:20px;}
  .auth-sep{display:none;}
  .article-layout{padding:20px 16px 60px;}
}
@media(max-width:480px){
  .footer-grid{grid-template-columns:1fr;}
  .cat-grid{grid-template-columns:1fr 1fr;}
  .email-form{flex-direction:column;}
  .email-input{border-right:1px solid var(--border2);border-bottom:none;border-radius:8px 8px 0 0;}
  .email-btn{border-radius:0 0 8px 8px;}
}

/* ===== STICKY SIDEBAR UPGRADE ===== */
@media(min-width:1100px){
  .sidebar{position:sticky;top:80px;max-height:calc(100vh - 100px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border2) transparent;}
  .sidebar::-webkit-scrollbar{width:4px;}
  .sidebar::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px;}
}

/* ===== QUICK ANSWER BOX ===== */
.quick-answer{background:linear-gradient(135deg,rgba(6,214,160,.08),rgba(76,201,240,.05));border:1px solid rgba(6,214,160,.25);border-left:4px solid var(--teal);border-radius:0 12px 12px 0;padding:22px 26px;margin-bottom:28px;position:relative;}
.quick-answer::before{content:'⚡ QUICK ANSWER';position:absolute;top:-11px;left:20px;background:var(--teal);color:#000;font-size:.68rem;font-weight:800;letter-spacing:.12em;padding:3px 12px;border-radius:20px;}
.quick-answer p{margin:0;color:var(--text);font-size:.96rem;line-height:1.7;font-weight:500;}
.quick-answer strong{color:var(--teal);}

/* ===== CONTINUE READING ===== */
.continue-reading{background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:28px;margin:40px 0;}
.continue-reading h3{color:var(--text);margin-bottom:18px;font-size:1.3rem;display:flex;align-items:center;gap:10px;}
.cr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;}
.cr-card{display:flex;align-items:flex-start;gap:12px;padding:14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;transition:all .2s;}
.cr-card:hover{border-color:var(--border2);transform:translateY(-2px);box-shadow:0 4px 20px rgba(0,0,0,.4);}
.cr-icon{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;}
.cr-info .cr-cat{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;display:block;margin-bottom:3px;}
.cr-info .cr-title{font-size:.88rem;font-weight:700;color:var(--text);line-height:1.3;}
.cr-card:hover .cr-title{color:var(--accent2);}

/* ===== COMPARISON SECTION ===== */
.comparison-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;}
.comparison-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;text-decoration:none;transition:all .25s;position:relative;overflow:hidden;}
.comparison-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(230,57,70,.06),rgba(255,209,102,.04));opacity:0;transition:opacity .25s;}
.comparison-card:hover::before{opacity:1;}
.comparison-card:hover{border-color:var(--border2);transform:translateY(-3px);box-shadow:0 8px 30px rgba(0,0,0,.4);}
.vs-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.vs-fighter{font-family:'Bebas Neue';font-size:1.3rem;color:var(--text);letter-spacing:.05em;flex:1;}
.vs-fighter.right{text-align:right;}
.vs-badge{background:linear-gradient(135deg,var(--accent),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-family:'Bebas Neue';font-size:1rem;letter-spacing:.15em;flex-shrink:0;}
.comparison-card p{font-size:.83rem;color:var(--text-muted);margin:0;}
.comparison-tag{display:inline-block;margin-top:10px;font-size:.72rem;font-weight:700;color:var(--accent2);text-transform:uppercase;letter-spacing:.08em;}

/* ===== POPULAR THIS WEEK ===== */
.popular-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.popular-item{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;transition:all .2s;}
.popular-item:hover{background:var(--card2);border-color:var(--border2);}
.pop-rank{font-family:'Bebas Neue';font-size:2rem;line-height:1;color:var(--text-muted);min-width:32px;}
.pop-rank.gold{color:var(--gold);}
.pop-rank.silver{color:#aaa;}
.pop-rank.bronze{color:#cd7f32;}
.pop-info .pop-title{font-weight:700;font-size:.9rem;color:var(--text);line-height:1.3;margin-bottom:4px;}
.popular-item:hover .pop-title{color:var(--accent2);}
.pop-info .pop-meta{font-size:.73rem;color:var(--text-muted);}
.pop-info .pop-views{color:var(--teal);font-weight:600;}
.pop-bar{height:3px;background:var(--border);border-radius:2px;margin-top:6px;overflow:hidden;}
.pop-bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--gold));border-radius:2px;}

/* ===== HOT QUESTIONS SECTION ===== */
.questions-grid{display:flex;flex-direction:column;gap:12px;}
.question-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;text-decoration:none;transition:all .2s;display:flex;align-items:flex-start;gap:14px;}
.question-card:hover{border-color:var(--accent);background:var(--card2);}
.q-icon{font-size:1.3rem;flex-shrink:0;margin-top:2px;}
.q-text{font-weight:700;color:var(--text);font-size:.92rem;margin-bottom:4px;}
.question-card:hover .q-text{color:var(--accent2);}
.q-preview{font-size:.82rem;color:var(--text-muted);}
.q-cat{font-size:.7rem;color:var(--accent2);text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-top:6px;display:block;}

/* ===== AUTHOR BOX ===== */
.author-box{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:24px;margin:32px 0;display:flex;gap:18px;align-items:flex-start;}
.author-avatar{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--gold));display:flex;align-items:center;justify-content:center;font-size:1.8rem;flex-shrink:0;}
.author-info h4{color:var(--text);font-family:'Bebas Neue';font-size:1.1rem;letter-spacing:.08em;margin-bottom:2px;}
.author-info .author-role{font-size:.75rem;color:var(--accent2);text-transform:uppercase;letter-spacing:.1em;font-weight:700;margin-bottom:8px;display:block;}
.author-info p{font-size:.84rem;color:var(--text-muted);margin:0;}
.author-info .author-link{display:inline-block;margin-top:10px;font-size:.8rem;color:var(--teal);font-weight:700;}

/* ===== BREADCRUMB (article) ===== */
.breadcrumb{display:flex;align-items:center;gap:7px;font-size:.78rem;color:var(--text-muted);margin-bottom:18px;flex-wrap:wrap;}
.breadcrumb a{color:var(--text-muted);transition:color .15s;}
.breadcrumb a:hover{color:var(--accent2);}
.breadcrumb .bc-sep{opacity:.35;}
.breadcrumb .bc-current{color:var(--text-dim);}

/* ===== SIDEBAR TRENDING WIDGET ===== */
.sidebar-pop-list{display:flex;flex-direction:column;gap:2px;}
.sidebar-pop-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border);text-decoration:none;}
.sidebar-pop-item:last-child{border-bottom:none;}
.sp-num{font-family:'Bebas Neue';font-size:1.1rem;min-width:20px;color:var(--text-muted);}
.sp-num.top{color:var(--gold);}
.sp-title{font-size:.82rem;color:var(--text-dim);font-weight:600;line-height:1.3;}
.sidebar-pop-item:hover .sp-title{color:var(--accent2);}

/* ===== TITLE CTR BADGE ===== */
.title-year-badge{display:inline-block;background:var(--accent);color:#fff;font-size:.65rem;font-weight:800;padding:2px 8px;border-radius:4px;letter-spacing:.08em;vertical-align:middle;margin-left:8px;font-family:'Inter';}

/* ===== MOBILE BREADCRUMB ===== */
@media(max-width:600px){.breadcrumb{font-size:.72rem;}}

/* ===== INTERNAL LINK MAP ===== */
.universe-link-map{background:var(--bg2);border:1px solid var(--border2);border-radius:12px;padding:22px 24px;margin:28px 0;}
.ulm-title{font-family:'Bebas Neue';font-size:1rem;letter-spacing:.1em;color:var(--gold);margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.ulm-links{display:flex;flex-wrap:wrap;gap:8px;}
.ulm-link{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;background:var(--card);border:1px solid var(--border);border-radius:20px;font-size:.82rem;color:var(--text-dim);text-decoration:none;font-weight:600;transition:all .15s;}
.ulm-link:hover{color:var(--gold);border-color:var(--gold);background:var(--card2);}
.ulm-link .ulm-cat{font-size:.68rem;color:var(--text-muted);margin-left:2px;}

/* Universe hero background image overlay */
.universe-hero[style*="background-image"]::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(6,6,16,.82) 0%,rgba(6,6,16,.55) 100%);
  z-index:0;
}
.universe-hero[style*="background-image"] .container{position:relative;z-index:1;}