/* Build 1778972400 - assistant polish, love ratio fix, mobile sidebar, themes, events calendar */
:root {
  --bg: #fdf5f8;
  --surface: #ffffff;
  --surface2: #fdebf3;
  --surface3: #fde4ee;
  --border: #f0d0e0;
  --border-bright: #e8b8d0;
  --gold: #d6307a;
  --gold-dim: #a8205e;
  --amber: #ff5da8;
  --red: #d6307a;
  --green: #1ea96a;
  --blue: #6a4cd9;
  --text: #1e1018;
  --text-dim: #6a5560;
  --text-muted: #9a8590;
  --accent: #d6307a;
  --sidebar-w: 240px;
  --header-h: 64px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;font-size:15px;line-height:1.6;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;}
body::before{content:'';position:fixed;inset:0;background-image:
  radial-gradient(ellipse at 15% 0%,rgba(214,48,122,0.08) 0%,transparent 55%),
  radial-gradient(ellipse at 85% 90%,rgba(168,32,94,0.05) 0%,transparent 50%);
  pointer-events:none;z-index:0;}

/* FOCUS */

/* iOS tap highlight */
*{-webkit-tap-highlight-color:transparent;}
a,button{touch-action:manipulation;}

:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:2px;}

/* ── TOP BAR ── */
header{position:fixed;top:0;left:0;right:0;height:var(--header-h);z-index:300;background:rgba(253,245,248,0.96);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--border);display:flex;align-items:center;box-shadow:0 8px 32px rgba(168,32,94,0.15);}
.header-inner{width:100%;display:flex;align-items:center;padding:0 1.5rem;gap:1rem;}
.logo{font-family:'Orbitron',sans-serif;font-size:1rem;font-weight:700;color:var(--gold);letter-spacing:0.14em;white-space:nowrap;flex-shrink:0;cursor:pointer;display:flex;flex-direction:column;line-height:1.2;width:var(--sidebar-w);padding-right:1.5rem;}
.logo span{color:var(--text-muted);font-weight:400;font-size:0.6rem;letter-spacing:0.16em;margin-top:6px;font-family:'DM Mono',monospace;text-transform:uppercase;}
.header-center{flex:1;display:flex;align-items:center;gap:0.75rem;}
.header-search-btn{display:flex;align-items:center;gap:0.6rem;background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:0.5rem 1rem;cursor:pointer;transition:all 0.2s;flex:1;max-width:420px;}
.header-search-btn:hover{border-color:var(--border-bright);background:var(--surface3);}
.header-search-btn span.icon{color:var(--text-muted);font-size:0.85rem;}
.header-search-btn p{font-size:0.8rem;color:var(--text-muted);flex:1;font-family:'DM Sans',sans-serif;}
.header-search-btn kbd{font-family:'DM Mono',monospace;font-size:0.58rem;color:var(--text-muted);border:1px solid var(--border);border-radius:3px;padding:1px 5px;}
.header-right{display:flex;align-items:center;gap:0.75rem;margin-left:auto;}
.hamburger:hover{border-color:var(--gold);color:var(--gold);background:rgba(214,48,122,0.06);}

/* ── SIDEBAR NAV ── */
.sidebar{
  position:fixed;
  top:var(--header-h);
  left:0;
  bottom:0;
  width:var(--sidebar-w);
  z-index:200;
  background:var(--surface);
  border-right:1px solid var(--border);
  overflow-y:auto;
  padding:1.75rem 0 2rem;
  display:flex;
  flex-direction:column;
  transform:translateX(0);
  transition:transform 0.3s cubic-bezier(0.4,0,0.2,1);
  -webkit-overflow-scrolling:touch;
}

/* ── SIDEBAR STATES ── */
/* Desktop: sidebar visible by default. body.sidebar-collapsed hides it. */
body.sidebar-collapsed .sidebar{transform:translateX(-100%);}
body.sidebar-collapsed main,
body.sidebar-collapsed footer,
body.sidebar-collapsed .hero-banner,
body.sidebar-collapsed .hero-strip{
  margin-left:0;
  width:100%;
}
body.sidebar-collapsed .sidebar-backdrop{opacity:0;visibility:hidden;}
body.sidebar-open .sidebar-toggle{
  background:rgba(214,48,122,0.1);
  color:var(--gold);
  border-color:var(--gold);
}

.sidebar-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  background:none;
  border:1px solid var(--border);
  border-radius:8px;
  color:var(--text-dim);
  padding:7px 12px;
  font-size:1rem;
  cursor:pointer;
  transition:all 0.2s;
  flex-shrink:0;
  min-width:40px;
  min-height:36px;
}
.sidebar-toggle:hover{background:var(--surface2);color:var(--gold);border-color:var(--gold);}
.sidebar-toggle .hamburger-icon{display:inline-block;transition:transform 0.2s;}
/* SIDEBAR BACKDROP (mobile drawer overlay) */
.sidebar-backdrop{
  position:fixed;
  inset:var(--header-h) 0 0 0;
  background:rgba(20,8,18,0.55);
  z-index:190;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity 0.25s,visibility 0.25s;
  -webkit-tap-highlight-color:transparent;
}
.sidebar::-webkit-scrollbar{width:3px;}
.sidebar::-webkit-scrollbar-thumb{background:var(--border-bright);border-radius:2px;}
.nav-section-label{font-family:'DM Mono',monospace;font-size:0.65rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);padding:0 1.25rem 0.35rem;margin:1.5rem 0 0.35rem;border-bottom:1px solid var(--border);}
.nav-section-label:first-child{margin-top:0;}
nav{display:flex;flex-direction:column;gap:2px;padding:0 0.75rem;}
nav a{font-family:'DM Sans',sans-serif;font-size:0.875rem;font-weight:500;color:var(--text-dim);text-decoration:none;padding:0.6rem 1rem;border-radius:8px;border:none;letter-spacing:0.01em;transition:all 0.15s;white-space:nowrap;cursor:pointer;display:flex;align-items:center;gap:0.65rem;margin:0 0.5rem;}
nav a .nav-icon{font-size:1rem;width:1.4rem;text-align:center;flex-shrink:0;}
nav a:hover{color:var(--text);background:var(--surface2);}
nav a.active{color:var(--gold);background:rgba(214,48,122,0.1);font-weight:600;}
nav a.fam-link{color:var(--amber);}
nav a.fam-link:hover{background:var(--surface2);}
nav a.fam-link.active{color:var(--amber);background:rgba(255,93,168,0.08);}
#mainNav{display:flex;}

/* ── MOBILE DRAWER ── */
.mobile-nav a{font-family:'DM Sans',sans-serif;font-size:1rem;font-weight:500;letter-spacing:0.01em;color:var(--text-dim);text-decoration:none;padding:0.85rem 1.1rem;border:1px solid var(--border);border-radius:10px;cursor:pointer;transition:all 0.15s;background:var(--surface);}
.mobile-nav a:hover,.mobile-nav a.mob-active{color:var(--gold);border-color:rgba(214,48,122,0.3);background:rgba(214,48,122,0.06);}
.mobile-nav a.fam-link{color:var(--amber);}

/* ── MAIN CONTENT AREA ── */
.app-body{display:flex;flex-direction:column;padding-top:var(--header-h);min-height:100vh;}
main{margin-left:var(--sidebar-w);flex:1;padding:2.5rem 3rem 4rem;position:relative;z-index:1;max-width:1400px;width:100%;}

/* ── SEARCH OVERLAY ── */
.search-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.88);z-index:500;align-items:flex-start;justify-content:center;padding-top:100px;}
.search-overlay.open{display:flex;}
.search-box{background:var(--surface);border:1px solid var(--border);border-radius:16px;width:90%;max-width:620px;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,0.9);}
.search-input-wrap{display:flex;align-items:center;gap:0.6rem;padding:1rem 1.25rem;border-bottom:1px solid var(--border);}
.search-input-wrap span{color:var(--text-muted);font-size:1rem;}
.search-input-wrap input{flex:1;background:none;border:none;outline:none;color:var(--text);font-family:'DM Sans',sans-serif;font-size:1rem;}
.search-input-wrap input::placeholder{color:var(--text-muted);}
.search-close{background:none;border:none;color:var(--text-muted);font-size:0.75rem;font-family:'DM Mono',monospace;cursor:pointer;padding:3px 7px;border:1px solid var(--border);border-radius:3px;}
.search-results{padding:0.5rem;max-height:420px;overflow-y:auto;}
.search-result{padding:0.8rem 1rem;border-radius:8px;cursor:pointer;border-bottom:1px solid var(--border);transition:background 0.12s;margin:2px 4px;}
.search-result:hover,.search-result.sr-selected{background:var(--surface2);border-color:transparent;}
.search-result:last-child{border-bottom:none;}
.sr-title{font-family:'DM Sans',sans-serif;font-size:0.9rem;color:var(--text);letter-spacing:0.01em;font-weight:600;}
.sr-section{font-family:'DM Mono',monospace;font-size:0.58rem;color:var(--text-muted);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:2px;}
.sr-snippet{font-size:0.72rem;color:var(--text-dim);margin-top:3px;line-height:1.45;}
.search-empty{padding:1.25rem;text-align:center;color:var(--text-muted);font-size:0.8rem;}
.search-hint{padding:0.85rem 1.1rem;font-family:'DM Mono',monospace;font-size:0.58rem;color:var(--text-muted);letter-spacing:0.08em;}

/* ── PAGE LAYOUT ── */
.page{display:none;}
.page.active{display:block;}
.page-search{display:none;}

/* ── PAGE HEADER ── */
.page-header{margin-bottom:2.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border);display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:1rem;position:relative;}
.page-header h1{font-family:'Orbitron',sans-serif;font-size:1.75rem;font-weight:700;color:var(--text);letter-spacing:0.06em;line-height:1.1;}
.page-header p{font-size:0.78rem;color:var(--text-muted);margin-top:0.3rem;font-family:'DM Mono',monospace;letter-spacing:0.04em;}

/* ── SECTION LABEL ── */
.section-label{font-family:'DM Mono',monospace;font-size:0.7rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:0.85rem;margin-top:2rem;padding-bottom:0.5rem;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:0.5rem;}
.section-label::before{content:'';display:block;width:3px;height:14px;background:var(--gold);border-radius:2px;flex-shrink:0;}

/* ── GRID ── */
.qr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;}
.qr-grid-2{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:1rem;}

/* ── CARDS ── */
.qr-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:all 0.2s;position:relative;}
.qr-card:hover{border-color:var(--border-bright);box-shadow:0 4px 24px rgba(168,32,94,0.1);transform:translateY(-1px);}
.qr-card-header{background:var(--surface2);padding:0.9rem 1.1rem;display:flex;align-items:center;gap:0.65rem;border-bottom:1px solid var(--border);}
.qr-card-header .icon{font-size:1rem;}
.qr-card-header h3{font-family:'DM Sans',sans-serif;font-size:0.875rem;color:var(--text);letter-spacing:0.01em;font-weight:600;}
.qr-card-body{padding:1.1rem 1.1rem;}

/* ── TABLE ── */
.data-table{width:100%;border-collapse:collapse;font-size:0.85rem;}
.data-table th{font-family:'DM Mono',monospace;font-size:0.72rem;letter-spacing:0.04em;text-transform:uppercase;color:var(--text-muted);padding:0.65rem 0.75rem;text-align:left;border-bottom:1px solid var(--border);background:transparent;font-weight:500;}
.data-table td{padding:0.55rem 0.65rem;border-bottom:1px solid rgba(42,42,42,0.5);color:var(--text);font-size:0.8rem;vertical-align:top;}
.data-table tr:last-child td{border-bottom:none;}
.data-table tr:hover td{background:var(--surface2);}

/* ── TAGS ── */
.tag{display:inline-block;font-family:'DM Mono',monospace;font-size:0.72rem;padding:2px 10px;border-radius:20px;letter-spacing:0.02em;font-weight:500;}
.tag-gold{background:rgba(214,48,122,0.15);color:var(--gold);border:1px solid rgba(214,48,122,0.3);}
.tag-green{background:rgba(57,201,122,0.12);color:var(--green);border:1px solid rgba(57,201,122,0.25);}
.tag-red{background:rgba(224,85,85,0.12);color:var(--red);border:1px solid rgba(224,85,85,0.25);}
.tag-blue{background:rgba(214,48,122,0.12);color:var(--blue);border:1px solid rgba(214,48,122,0.25);}
.tag-amber{background:rgba(255,160,64,0.12);color:var(--amber);border:1px solid rgba(255,160,64,0.25);}

/* ── EXPANDABLE ── */
.expandable{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:0.6rem;overflow:hidden;transition:all 0.2s;}
.expandable:hover{border-color:var(--border-bright);box-shadow:0 4px 20px rgba(168,32,94,0.08);}
.expand-trigger{width:100%;background:none;border:none;padding:1rem 1.1rem;display:flex;align-items:center;justify-content:space-between;cursor:pointer;text-align:left;gap:0.5rem;}
.expand-trigger:hover{background:var(--surface2);}
.et-left{display:flex;align-items:center;gap:0.75rem;}
.et-icon{font-size:1rem;flex-shrink:0;}
.expand-trigger h3{font-family:'DM Sans',sans-serif;font-size:0.95rem;color:var(--text);letter-spacing:0.01em;font-weight:600;}
.et-sub{font-family:'DM Mono',monospace;font-size:0.62rem;color:var(--text-dim);letter-spacing:0.03em;display:block;margin-top:2px;}
.expand-arrow{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--text-muted);transition:transform 0.2s;flex-shrink:0;}
.expandable.open{border-color:rgba(214,48,122,0.2);box-shadow:0 4px 24px rgba(168,32,94,0.08);}.expandable.open .expand-arrow{transform:rotate(90deg);}
.expand-content{display:none;padding:0.5rem 1.1rem 1.2rem;border-top:1px solid var(--border);}
.expandable.open .expand-content{display:block;}

/* ── ALERTS ── */
.alert{padding:0.85rem 1rem;border-radius:10px;font-size:0.875rem;margin:0.75rem 0;display:flex;gap:0.65rem;align-items:flex-start;line-height:1.6;}
.alert-icon{flex-shrink:0;font-size:0.9rem;margin-top:1px;}
.alert-gold{background:rgba(214,48,122,0.1);border-left:3px solid var(--gold);}
.alert-red{background:rgba(224,85,85,0.1);border-left:3px solid var(--red);}
.alert-green{background:rgba(30,169,106,0.1);border-left:3px solid var(--green);}
.alert-amber{background:rgba(255,93,168,0.1);border-left:3px solid var(--amber);}
.alert-blue{background:rgba(106,76,217,0.08);border-left:3px solid var(--blue);}

/* ── STAT ROWS ── */
.stat-row{display:flex;align-items:flex-start;gap:0.6rem;padding:0.45rem 0;border-bottom:1px solid rgba(42,42,42,0.4);font-size:0.8rem;}
.stat-row:last-child{border-bottom:none;}
.stat-label{color:var(--text-muted);width:145px;flex-shrink:0;font-size:0.8rem;padding-top:1px;font-family:'DM Mono',monospace;}
.stat-value{color:var(--text);font-family:'DM Mono',monospace;font-size:0.82rem;}
.stat-note{color:var(--text-muted);font-size:0.68rem;margin-left:auto;text-align:right;flex-shrink:0;}

/* ── FORMATION BAR ── */
.formation-bar{display:flex;height:28px;border-radius:8px;overflow:hidden;margin:0.5rem 0;}
.fb-inf{background:rgba(214,48,122,0.5);border-right:1px solid var(--bg);}
.fb-cav{background:rgba(255,160,64,0.4);border-right:1px solid var(--bg);}
.fb-arc{background:rgba(214,48,122,0.3);}
.formation-bar div{display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.9);font-size:0.62rem;font-family:'DM Mono',monospace;letter-spacing:0.03em;min-width:20px;}

/* ── PHASE TIMELINE ── */
.phase-timeline{display:flex;flex-direction:column;gap:0;}
.phase-block{display:flex;gap:1rem;}
.phase-line{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:20px;}
.phase-dot{width:10px;height:10px;border-radius:50%;background:var(--gold);flex-shrink:0;margin-top:7px;border:2px solid var(--bg);}
.phase-connector{width:2px;background:var(--border);flex:1;min-height:14px;}
.phase-content{padding-bottom:1.25rem;flex:1;min-width:0;}
.phase-title{font-family:'DM Sans',sans-serif;font-size:0.95rem;color:var(--text);letter-spacing:0.01em;margin-bottom:0.25rem;font-weight:700;}
.phase-meta{font-family:'DM Mono',monospace;font-size:0.75rem;color:var(--text-dim);margin-bottom:0.5rem;}

/* ── GEN TABS ── */
.gen-tabs{display:flex;gap:0.4rem;margin-bottom:1rem;flex-wrap:wrap;}
.gen-tab{font-family:'DM Sans',sans-serif;font-size:0.82rem;font-weight:500;padding:6px 16px;border:1px solid var(--border);border-radius:20px;background:none;color:var(--text-dim);cursor:pointer;letter-spacing:0.01em;transition:all 0.15s;}
.gen-tab:hover{border-color:var(--border-bright);color:var(--text);background:var(--surface2);}
.gen-tab.active{background:rgba(214,48,122,0.1);border-color:var(--gold);color:var(--gold);font-weight:600;}
.gen-panel{display:none;}
.gen-panel.active{display:block;}

/* ── HERO CHIPS ── */
.hero-lineup{display:flex;gap:0.4rem;flex-wrap:wrap;margin:0.5rem 0;}
.hero-chip{background:var(--surface2);border:1px solid var(--border);border-radius:20px;padding:4px 12px;font-size:0.78rem;font-family:'DM Mono',monospace;display:flex;align-items:center;}
.hero-chip.inf{border-left:3px solid var(--blue);}
.hero-chip.cav{border-left:3px solid var(--gold);}
.hero-chip.arc{border-left:3px solid var(--red);}

/* ── HOME GRID ── */
.home-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-top:1rem;}
.home-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:1.5rem 1.25rem;cursor:pointer;transition:all 0.22s;text-decoration:none;display:block;position:relative;overflow:hidden;}
.home-card:hover{border-color:var(--border-bright);background:var(--surface2);transform:translateY(-4px);box-shadow:0 8px 28px rgba(168,32,94,0.15);}
.home-card .hc-icon{font-size:2rem;margin-bottom:0.75rem;display:block;}
.home-card h3{font-family:'DM Sans',sans-serif;font-size:0.95rem;color:var(--text);letter-spacing:0.01em;margin-bottom:0.3rem;font-weight:700;}
.home-card p{font-size:0.82rem;color:var(--text-muted);line-height:1.5;font-family:'DM Sans',sans-serif;}
.home-card.p1{border-top:2px solid var(--gold);}
.home-card.p2{border-top:2px solid var(--gold-dim);}

/* ── GOOGLE TRANSLATE ── */
#google_translate_element{flex-shrink:0;}
#google_translate_element .goog-te-gadget{font-family:'DM Mono',monospace!important;font-size:0!important;color:transparent!important;}
#google_translate_element .goog-te-gadget span{display:none;}
#google_translate_element select.goog-te-combo{background:var(--surface2);border:1px solid var(--border-bright);border-radius:5px;color:var(--text-dim);font-family:'DM Mono',monospace;font-size:0.62rem;padding:5px 8px;cursor:pointer;outline:none;letter-spacing:0.06em;transition:border-color 0.15s;}
#google_translate_element select.goog-te-combo:hover{border-color:var(--gold-dim);color:var(--gold);}
.goog-te-banner-frame{display:none!important;}
body{top:0!important;}

/* ── POWER GRID ── */
.power-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;}

/* ── PASSWORD GATE ── */
.pw-gate{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:55vh;gap:1.5rem;text-align:center;}
.pw-icon{font-size:3rem;opacity:0.3;}
.pw-gate h2{font-family:'Orbitron',sans-serif;font-size:1.2rem;color:var(--text);letter-spacing:0.08em;font-weight:700;}
.pw-gate p{font-size:0.8rem;color:var(--text-dim);max-width:320px;line-height:1.65;}
.pw-form{display:flex;gap:0.6rem;}
.pw-input{background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:0.65rem 1rem;color:var(--text);font-family:'DM Mono',monospace;font-size:0.85rem;letter-spacing:0.1em;width:190px;outline:none;transition:border-color 0.2s;}
.pw-input:focus{border-color:var(--gold);}
.pw-btn{background:rgba(214,48,122,0.13);border:1px solid var(--gold);border-radius:6px;color:var(--gold);font-family:'DM Mono',monospace;font-size:0.76rem;padding:0.6rem 1.2rem;cursor:pointer;letter-spacing:0.1em;transition:all 0.15s;}
.pw-btn:hover{background:rgba(214,48,122,0.22);}
.pw-error{color:var(--red);font-size:0.72rem;font-family:'DM Mono',monospace;height:1rem;}

/* ── PROSE ── */
.prose p{font-size:0.9rem;line-height:1.75;color:var(--text);margin-bottom:0.6rem;}
.prose ul{padding-left:1.1rem;margin-bottom:0.5rem;}
.prose li{font-size:0.88rem;line-height:1.7;color:var(--text);margin-bottom:0.3rem;}
.prose strong{color:var(--text);font-weight:700;}
.prose p:last-child{margin-bottom:0;}

/* ── DAY GRID ── */
.day-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:0.4rem;margin:0.65rem 0;}
.day-cell{background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:0.6rem 0.3rem;text-align:center;transition:border-color 0.15s;}
.day-num{font-family:'DM Sans',sans-serif;font-size:0.9rem;color:var(--text);margin-bottom:0.2rem;font-weight:700;}
.day-action{font-size:0.6rem;color:var(--text-dim);line-height:1.35;}
.day-save{font-size:0.58rem;color:var(--red);margin-top:4px;line-height:1.35;}

/* ── DIVIDER ── */
hr.divider{border:none;border-top:1px solid var(--border);margin:1.25rem 0;}

/* ── CODE ── */
code{font-family:'DM Mono',monospace;font-size:0.78rem;background:var(--surface2);border:1px solid var(--border);padding:3px 8px;border-radius:6px;color:var(--amber);}

/* ── FOOTER ── */
footer{margin-left:var(--sidebar-w);border-top:1px solid var(--border);padding:1.5rem 3rem;font-family:'DM Mono',monospace;font-size:0.72rem;color:var(--text-muted);letter-spacing:0.06em;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0.5rem;background:var(--surface);}

/* ── BACK TO TOP ── */
#back-to-top{position:fixed;bottom:5.5rem;right:1.5rem;z-index:800;width:40px;height:40px;border-radius:12px;background:var(--surface2);border:1px solid var(--border);color:var(--text-dim);font-size:1rem;cursor:pointer;display:none;align-items:center;justify-content:center;transition:all 0.2s;box-shadow:0 4px 16px rgba(168,32,94,0.1);}
#back-to-top:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px);box-shadow:0 0 15px rgba(214,48,122,0.25);}
#back-to-top.visible{display:flex;}

/* ── RESPONSIVE ── */

/* ════════════════════════════════════════════
   TABLET  (≤900px)
════════════════════════════════════════════ */

/* ── HERO BANNER ── */
.hero-banner{
  margin-left:var(--sidebar-w);
  position:relative;
  width:calc(100% - var(--sidebar-w));
  height:500px;overflow:hidden;
  flex-shrink:0;
  box-shadow:0 6px 24px rgba(168,32,94,0.12);
}

/* ── HERO STRIP ── Tagline + scroll prompt below the banner image ── */
.hero-strip{
  margin-left:var(--sidebar-w);
  width:calc(100% - var(--sidebar-w));
  padding:1.2rem 2rem 1.4rem;
  background:linear-gradient(180deg,rgba(214,48,122,0.04) 0%,var(--bg) 100%);
  border-bottom:1px solid var(--border);
  text-align:center;
  flex-shrink:0;
}
.hero-sub{
  font-family:'Orbitron',sans-serif;
  font-weight:700;
  font-size:1.4rem;
  color:var(--gold);
  letter-spacing:0.05em;
  margin:0;
  line-height:1.2;
  text-shadow:0 1px 0 rgba(255,255,255,0.4);
}
.hero-scroll{
  font-family:'DM Mono',monospace;
  font-size:0.7rem;
  font-weight:500;
  letter-spacing:0.2em;
  color:var(--text-muted);
  margin:0.5rem 0 0;
  text-transform:uppercase;
  animation:hero-scroll-pulse 2s ease-in-out infinite;
}
@keyframes hero-scroll-pulse{
  0%,100%{opacity:0.6;transform:translateY(0);}
  50%{opacity:1;transform:translateY(2px);}
}

@media(max-width:1024px){
  .hero-strip{margin-left:0;width:100%;padding:1rem 1.25rem 1.1rem;}
  .hero-sub{font-size:1.2rem;}
  .hero-scroll{font-size:0.65rem;}
}
@media(max-width:480px){
  .hero-strip{padding:0.85rem 1rem 1rem;}
  .hero-sub{font-size:1rem;letter-spacing:0.04em;}
  .hero-scroll{font-size:0.6rem;letter-spacing:0.15em;}
}

.hero-banner::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,transparent 0%,var(--gold-dim) 20%,var(--gold) 50%,var(--gold-dim) 80%,transparent 100%);
  animation:ember-line 3s ease-in-out infinite;
}
@keyframes ember-line{
  0%,100%{opacity:0.5;}
  50%{opacity:1;box-shadow:0 0 20px var(--gold);}
}
.hero-img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;}

/* Desktop full-banner hero polish */
@media (min-width:1025px){
  .hero-banner{
    height:clamp(560px, calc((100vw - var(--sidebar-w))*0.5625), 860px);
    background:
      linear-gradient(90deg,rgba(8,3,10,.78),rgba(214,48,122,.08),rgba(8,3,10,.78)),
      url('hero.jpg') center center / cover no-repeat;
  }
  body.sidebar-collapsed .hero-banner{
    height:clamp(560px, calc(100vw*0.5625), 860px);
  }
  .hero-banner::before{
    content:'';
    position:absolute;
    inset:-24px;
    background:url('hero.jpg') center center / cover no-repeat;
    filter:blur(18px) saturate(1.12) brightness(.74);
    transform:scale(1.035);
    opacity:.48;
    pointer-events:none;
  }
  .hero-img{
    position:relative;
    z-index:1;
    object-fit:contain;
    object-position:center center;
    filter:drop-shadow(0 18px 34px rgba(0,0,0,.28));
  }
  .hero-banner::after{z-index:2;}
}
/* End desktop full-banner hero polish */

/* ════════════════════════════════
   TABLET (≤900px)
════════════════════════════════ */

/* ════════════════════════════════
   TABLET (≤900px)
════════════════════════════════ */
@media(max-width:1024px){
  /* ── MOBILE SIDEBAR: hidden by default, slides in when body.sidebar-open ── */
  aside.sidebar{
    transform:translateX(-110%) !important;
    box-shadow:none;
    width:min(86vw,320px);
    max-width:320px;
    will-change:transform;
    visibility:hidden;
    pointer-events:none;
    z-index:400;
  }
  body.sidebar-open aside.sidebar{
    transform:translateX(0) !important;
    visibility:visible;
    pointer-events:auto;
    box-shadow:0 0 30px rgba(0,0,0,0.25);
  }
  body.sidebar-open{overflow:hidden;}
  /* Force-show backdrop on mobile when open */
  body.sidebar-open .sidebar-backdrop{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto;
    z-index:350;
  }
  /* Main content always full-width on mobile */
  main,footer,.hero-banner,.hero-strip{margin-left:0;width:100%;}
  /* Disable collapsed-state margins on mobile (different mechanic) */
  body.sidebar-collapsed main,
  body.sidebar-collapsed footer,
  body.sidebar-collapsed .hero-banner,
  body.sidebar-collapsed .hero-strip{margin-left:0;width:100%;}

/* Mobile: sidebar starts hidden, slides in when opened */
/* On mobile, sidebar-collapsed state doesn't apply — clear it */
  .logo{width:auto;font-size:1.1rem;}
  .header-inner{padding:0 1rem;}
  .header-search-btn{max-width:none;}
  main{margin-left:0;padding:1.5rem 1.25rem 5rem;}
  footer{margin-left:0;padding:1rem 1.25rem 2rem;font-size:0.52rem;letter-spacing:0.1em;}
  .hero-banner{margin-left:0;width:100%;height:300px;}
  .home-grid{grid-template-columns:repeat(2,1fr);gap:0.75rem;}
  .qr-grid{grid-template-columns:1fr;}
  .qr-grid-2{grid-template-columns:1fr;}
  .power-grid{grid-template-columns:1fr;}
  .day-grid{grid-template-columns:repeat(4,1fr);}
  .page-header h1{font-size:1.4rem;}
  .page-header{margin-bottom:1.25rem;padding-bottom:0.9rem;}
  .qr-card-header h3{font-size:0.9rem;}
  .expand-trigger h3{font-size:1rem;}
  #fam-chat{bottom:1rem;right:0.5rem;left:0.5rem;width:auto;max-width:none;}
  .data-table{font-size:0.76rem;}
  .data-table th,.data-table td{padding:0.45rem 0.5rem;}
  .gen-tabs{gap:0.3rem;}
  .gen-tab{font-size:0.62rem;padding:5px 10px;}
.hero-banner{margin-left:0;width:100%;height:280px;}
  main{padding:1.75rem 1.5rem 5rem;}
  .page-header h1{font-size:1.4rem;}
  /* ── mobile additions ── */
  .header-search-btn p{font-size:0.78rem;}
  .gen-tab{min-height:36px;display:inline-flex;align-items:center;}
}

/* ════════════════════════════════
   PHONE (≤480px)
════════════════════════════════ */
@media(max-width:480px){
:root{--header-h:56px;}
  main{padding:1rem 0.9rem 5rem;}
  .header-inner{padding:0 0.75rem;gap:0.5rem;}
  .logo{font-size:1rem;letter-spacing:0.12em;}
  .logo span{font-size:0.44rem;letter-spacing:0.16em;}
  .header-search-btn{padding:0.4rem 0.65rem;}
  .header-search-btn p{font-size:0.7rem;}
  .header-search-btn kbd{display:none;}
  .hero-banner{height:240px;}
  .home-grid{grid-template-columns:repeat(2,1fr);gap:0.6rem;}
  .day-grid{grid-template-columns:repeat(2,1fr);}
  .page-header h1{font-size:1.2rem;}
  .page-header p{font-size:0.62rem;}
  .section-label{font-size:0.54rem;letter-spacing:0.14em;margin-top:1.25rem;}
  .home-card{padding:1rem 0.85rem;border-radius:12px;}
  .home-card h3{font-size:0.88rem;letter-spacing:0.08em;}
  .home-card p{font-size:0.72rem;}
  .home-card .hc-icon{font-size:1.5rem;margin-bottom:0.4rem;}
  .qr-card{border-radius:10px;}
  .qr-card-header{padding:0.6rem 0.85rem;}
  .qr-card-header h3{font-size:0.85rem;}
  .qr-card-body{padding:0.85rem;}
  .expandable{border-radius:10px;}
  .expand-trigger{padding:0.75rem 0.9rem;}
  .expand-trigger h3{font-size:0.95rem;}
  .expand-content{padding:0.75rem 0.9rem 0.9rem;}
  .data-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:10px;border:1px solid var(--border);}
  .data-table{min-width:420px;font-size:0.74rem;}
  .data-table th,.data-table td{padding:0.4rem 0.5rem;white-space:nowrap;}
  .stat-row{flex-wrap:wrap;gap:0.25rem;}
  .stat-label{width:100%;font-size:0.68rem;}
  .stat-value{font-size:0.78rem;}
  .stat-note{margin-left:0;text-align:left;}
  .formation-bar{height:32px;}
  .alert{font-size:0.8rem;padding:0.6rem 0.75rem;border-radius:8px;}
  .hero-lineup{gap:0.3rem;}
  .hero-chip{font-size:0.68rem;padding:3px 8px;border-radius:12px;}
  .prose p,.prose li{font-size:0.82rem;}
  .pw-form{flex-direction:column;align-items:center;gap:0.5rem;}
  .pw-input{width:100%;max-width:260px;}
  .pw-btn{width:100%;max-width:260px;text-align:center;}
  .gen-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;padding-bottom:4px;}
  .gen-tab{flex-shrink:0;}
  .phase-content{padding-bottom:0.9rem;}
  .phase-title{font-size:0.9rem;}
  .mobile-nav a{font-size:1rem;padding:0.8rem 1rem;border-radius:10px;}
  footer{font-size:0.5rem;letter-spacing:0.08em;padding:1rem 0.9rem 2rem;}
  #back-to-top{bottom:5rem;right:1rem;width:36px;height:36px;border-radius:10px;}
.hero-banner{height:220px;}
  main{padding:1.25rem 1rem 5rem;}
  .page-header h1{font-size:1.2rem;}
  footer{font-size:0.65rem;letter-spacing:0.04em;}
  .qr-card{border-radius:10px;}
  .expandable{border-radius:10px;}
  .home-card{border-radius:12px;}
  .mobile-nav a{border-radius:10px;}
  /* ── phone enhancements ── */
  body{font-size:14.5px;}
  .home-grid{grid-template-columns:1fr;gap:0.7rem;}
  .home-card{padding:1.1rem 1rem;display:flex;align-items:center;gap:0.85rem;text-align:left;}
  .home-card .hc-icon{font-size:1.7rem;margin-bottom:0;flex-shrink:0;}
  .home-card h3{margin-bottom:2px;}
  .home-card p{font-size:0.74rem;}
  .header-inner{padding:0 0.65rem;}
  .header-search-btn{padding:0.45rem 0.6rem;}
  .header-search-btn p{font-size:0.72rem;}
  .hero-banner{height:260px;}
  .page-search{padding:0.6rem 0.85rem;}
  .page-search p{font-size:0.78rem;}
  .alert{padding:0.65rem 0.8rem;border-radius:8px;gap:0.5rem;}
  .alert-icon{font-size:1rem;}
  .qr-card-body{padding:0.85rem 0.9rem;}
  .data-table{font-size:0.72rem;}
  .data-table th,.data-table td{padding:0.4rem 0.5rem;}
  /* ensure scrollable tables on phones */
  .data-table-wrap{margin:0 -0.9rem;padding:0 0.9rem 4px;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  /* bigger tap targets */
  nav a{padding:0.85rem 1rem;min-height:48px;display:flex;align-items:center;}
  .expand-trigger{min-height:54px;}
  .mobile-nav a{min-height:54px;}

  #fam-chat{
      right:0.5rem;left:0.5rem;
      width:auto;max-width:none;
      bottom:1rem;
    }
    #fam-fab{
      width:48px;height:48px;
      bottom:1rem;right:1rem;
      font-size:1.2rem;
    }
}

/* ════════════════════════════════
   TINY PHONES (≤360px)
════════════════════════════════ */
@media(max-width:360px){
main{padding:0.85rem 0.75rem 5rem;}
  .hero-banner{height:200px;}
  .home-grid{grid-template-columns:1fr;}
  .page-header h1{font-size:1.1rem;}
  .home-card .hc-icon{font-size:1.5rem;}
  .home-card h3{font-size:0.85rem;}
  .page-header h1{font-size:1.05rem;}
}

/* ════════════════════════════════
   TOUCH / iOS OVERRIDES
════════════════════════════════ */
@media(hover:none) and (pointer:coarse){
  body{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
  .home-card:active{transform:scale(0.98);transition:transform 0.1s;}
  button:active,.action-btn:active{transform:scale(0.97);transition:transform 0.1s;}
}

/* ════════════════════════════════
   SAFE AREA (iPhone notch)
════════════════════════════════ */
@supports(padding-bottom:env(safe-area-inset-bottom)){
  footer{padding-bottom:calc(1.5rem + env(safe-area-inset-bottom));}
  #fam-chat{bottom:calc(1rem + env(safe-area-inset-bottom));}
}


/* ── CHAT FAB & WINDOW ── */
#fam-fab{
  position:fixed;bottom:1.25rem;right:1.25rem;z-index:900;
  width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,#d6307a,#a8205e);
  border:none;cursor:pointer;
  box-shadow:0 6px 20px rgba(214,48,122,0.35);
  display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;transition:transform 0.2s,box-shadow 0.2s;
  color:#fff;
}
#fam-fab:hover{
  transform:scale(1.08);
  box-shadow:0 8px 28px rgba(214,48,122,0.45);
}
#fam-fab:active{transform:scale(0.96);}

#fam-chat{
  position:fixed;bottom:5rem;right:1.25rem;z-index:900;
  width:360px;max-height:520px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 12px 40px rgba(168,32,94,0.18);
  display:none;flex-direction:column;
  overflow:hidden;
}
#fam-chat.open{display:flex;}
.chat-header{
  padding:0.75rem 1rem;
  background:linear-gradient(135deg,#d6307a,#a8205e);
  color:#fff;
  display:flex;align-items:center;justify-content:space-between;
  font-family:'DM Sans',sans-serif;font-weight:600;font-size:0.85rem;
  letter-spacing:0.05em;
}
.chat-header .chat-title{display:flex;align-items:center;gap:0.5rem;}
.chat-close{
  background:none;border:none;color:#fff;cursor:pointer;
  font-size:1.2rem;line-height:1;padding:4px 8px;
  border-radius:6px;transition:background 0.15s;
}
.chat-close:hover{background:rgba(255,255,255,0.18);}
.chat-body{
  flex:1;padding:0.85rem 0.9rem;overflow-y:auto;
  display:flex;flex-direction:column;gap:0.6rem;
  background:var(--surface2);
}
.chat-msg{
  padding:0.6rem 0.85rem;border-radius:12px;
  font-size:0.85rem;line-height:1.55;
  max-width:85%;word-wrap:break-word;
}
.chat-msg.bot{
  background:var(--surface);
  border:1px solid var(--border);
  color:var(--text);
  align-self:flex-start;
  border-top-left-radius:4px;
}
.chat-msg.user{
  background:linear-gradient(135deg,#d6307a,#a8205e);
  color:#fff;
  align-self:flex-end;
  border-top-right-radius:4px;
}
.chat-input-row{
  padding:0.6rem;
  background:var(--surface);
  border-top:1px solid var(--border);
  display:flex;gap:0.4rem;
}
.chat-input{
  flex:1;
  background:var(--surface2);
  border:1px solid var(--border);
  border-radius:10px;
  padding:0.55rem 0.85rem;
  color:var(--text);
  font-family:'DM Sans',sans-serif;font-size:0.85rem;
  outline:none;transition:border-color 0.15s;
}
.chat-input:focus{border-color:var(--gold);}
.chat-input::placeholder{color:var(--text-muted);}
.chat-send{
  background:linear-gradient(135deg,#d6307a,#a8205e);
  color:#fff;border:none;
  padding:0 1rem;border-radius:10px;
  font-family:'DM Sans',sans-serif;font-weight:600;font-size:0.82rem;
  cursor:pointer;
  transition:transform 0.15s,box-shadow 0.15s;
}
.chat-send:hover{box-shadow:0 4px 12px rgba(214,48,122,0.25);}
.chat-send:active{transform:scale(0.96);}
.chat-greeting{
  font-family:'DM Mono',monospace;font-size:0.7rem;
  color:var(--text-muted);letter-spacing:0.05em;
  text-align:center;padding:0.3rem 0;
}



/* ── SOURCE ATTRIBUTION ── */
.source-note{
  margin-top:2rem;padding-top:1rem;
  border-top:1px solid var(--border);
  font-family:'DM Mono',monospace;
  font-size:0.72rem;color:var(--text-muted);
  letter-spacing:0.04em;
}
.source-note a{
  color:var(--gold);text-decoration:none;
  border-bottom:1px dotted var(--border-bright);
}
.source-note a:hover{color:var(--gold-dim);border-bottom-color:var(--gold);}


/* ── SIDEBAR CLOSE BUTTON (mobile only) ── */
.sidebar-close{
  display:none;
  background:none;
  border:1px solid var(--border);
  border-radius:8px;
  color:var(--text-dim);
  padding:8px 14px;
  font-family:'DM Sans',sans-serif;
  font-size:0.85rem;
  font-weight:600;
  cursor:pointer;
  margin:0 1rem 1rem;
  align-items:center;
  justify-content:center;
  gap:0.4rem;
  transition:all 0.15s;
  align-self:stretch;
  position:relative;
  z-index:410;
}
.sidebar-close:hover{
  background:rgba(214,48,122,0.08);
  border-color:var(--gold);
  color:var(--gold);
}
.sidebar-close span:first-child{font-size:1.3rem;line-height:1;}

/* ── SIDEBAR TOGGLE DUAL ICONS ── */
.sidebar-toggle .close-icon{display:none;font-size:1.3rem;line-height:1;}
body.sidebar-open .sidebar-toggle .hamburger-icon{display:none;}
body.sidebar-open .sidebar-toggle .close-icon{display:inline-block;}

@media(max-width:1024px){
  .sidebar-close{display:flex;}
}


/* ═════════════════════════════════════════════
   Build 1778962800 — Kingshot-style polish + themes
═════════════════════════════════════════════ */
html[data-theme="dark"]{
  --bg:#15131b;--surface:#201d2a;--surface2:#2a2635;--surface3:#352f42;--border:#463b57;--border-bright:#7657a4;
  --gold:#ff5db8;--gold-dim:#c34b95;--amber:#ff8ccd;--red:#ff5db8;--green:#6ee7b7;--blue:#9b7cff;
  --text:#fff6fb;--text-dim:#d8c5df;--text-muted:#a999b2;--accent:#ff5db8;
}
html[data-theme="dark"] body{background:var(--bg);color:var(--text);}
html[data-theme="dark"] body::before{background-image:radial-gradient(ellipse at 20% 0%,rgba(255,93,184,0.14) 0%,transparent 55%),radial-gradient(ellipse at 90% 75%,rgba(155,124,255,0.12) 0%,transparent 55%);} 
html[data-theme="dark"] header{background:rgba(21,19,27,0.94);box-shadow:0 8px 32px rgba(0,0,0,0.28);} 
html[data-theme="dark"] .hero-strip{background:linear-gradient(180deg,rgba(255,93,184,0.08) 0%,var(--bg) 100%);} 
.header-center{min-width:0;}
.top-nav{display:flex;align-items:center;gap:0.35rem;flex-shrink:0;}
.top-nav a{font-size:0.78rem;font-weight:700;color:var(--text-dim);text-decoration:none;border:1px solid transparent;border-radius:999px;padding:0.45rem 0.75rem;cursor:pointer;transition:all .18s;white-space:nowrap;}
.top-nav a:hover{color:var(--gold);border-color:var(--border);background:var(--surface2);} 
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:0.4rem;border:1px solid var(--border);background:var(--surface2);color:var(--text-dim);border-radius:999px;min-height:36px;padding:0 0.8rem;font-family:'DM Mono',monospace;font-size:0.68rem;cursor:pointer;transition:all .18s;white-space:nowrap;}
.theme-toggle:hover{color:var(--gold);border-color:var(--gold);background:var(--surface3);} 
.site-footer{margin-left:var(--sidebar-w);background:linear-gradient(180deg,var(--surface) 0%,var(--surface2) 100%);border-top:1px solid var(--border);padding:2rem 3rem 1.25rem;display:grid;grid-template-columns:minmax(220px,1fr) 2fr;gap:2rem;font-family:'DM Sans',sans-serif;color:var(--text-dim);}
.site-footer .footer-brand{display:flex;flex-direction:column;gap:.45rem;}
.site-footer strong{font-family:'Orbitron',sans-serif;color:var(--gold);letter-spacing:.12em;font-size:.9rem;}
.site-footer span{font-size:.82rem;line-height:1.55;max-width:360px;}
.footer-links{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:1rem;}
.footer-links h4{font-family:'DM Mono',monospace;text-transform:uppercase;letter-spacing:.12em;font-size:.65rem;color:var(--text-muted);margin-bottom:.5rem;}
.footer-links a{display:block;color:var(--text-dim);text-decoration:none;font-size:.82rem;margin:.32rem 0;cursor:pointer;}
.footer-links a:hover{color:var(--gold);} 
.footer-bottom{grid-column:1/-1;border-top:1px solid var(--border);padding-top:1rem;text-align:center;font-family:'DM Mono',monospace;font-size:.68rem;color:var(--text-muted);letter-spacing:.08em;}
@media(max-width:1180px){.top-nav{display:none;}.header-search-btn{max-width:520px;}}
@media(max-width:1024px){.site-footer{margin-left:0;grid-template-columns:1fr;padding:1.5rem 1.25rem 2rem;}.footer-links{grid-template-columns:1fr 1fr 1fr;}}
@media(max-width:640px){.theme-toggle span[data-theme-label]{display:none;}.theme-toggle{min-width:38px;padding:0 .7rem;}.header-right{gap:.45rem;}#google_translate_element{display:none;}.footer-links{grid-template-columns:1fr;}.site-footer{gap:1.25rem;}.footer-bottom{text-align:left;}}


/* FAM Events & Packs Calendar */
.today-board{display:grid;grid-template-columns:1.25fr .95fr;gap:1rem;margin:1rem 0 1.25rem;}
.today-card,.today-pack-card,.command-category,.calendar-hero,.calendar-card,.calendar-week-panel,.timeline-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 14px 36px rgba(168,32,94,.10);}
.today-card{padding:1.15rem;position:relative;overflow:hidden;}
.today-card::after{content:'';position:absolute;right:-60px;top:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(214,48,122,.20),transparent 70%);pointer-events:none;}
.today-card-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.75rem;}
.today-card h2{font-family:'Orbitron',sans-serif;font-size:1.15rem;line-height:1.25;letter-spacing:.04em;color:var(--text);}
.live-pill,.week-pill,.calendar-badge{display:inline-flex;align-items:center;gap:.35rem;border:1px solid rgba(214,48,122,.25);background:rgba(214,48,122,.08);color:var(--gold);border-radius:999px;padding:.32rem .65rem;font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;}
.live-pill::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(30,169,106,.14);}
.today-meta{font-family:'DM Mono',monospace;font-size:.72rem;color:var(--text-muted);margin:.35rem 0 .75rem;}
.today-prep{color:var(--text-dim);font-size:.9rem;line-height:1.55;max-width:780px;}
.today-clock-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin-top:1rem;}
.today-clock-grid div{background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:.65rem;}
.today-clock-grid span{display:block;font-family:'DM Mono',monospace;font-size:.58rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.15rem;}
.today-clock-grid strong{font-family:'DM Mono',monospace;color:var(--text);font-size:.9rem;line-height:1.2;}
.today-pack-card{padding:1.15rem;}
.today-pack-card h3{font-size:.95rem;margin-bottom:.7rem;color:var(--text);}
.pack-list{list-style:none;display:flex;flex-direction:column;gap:.55rem;margin:0;padding:0;}
.pack-list li{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:1px solid var(--border);background:var(--surface2);border-radius:12px;padding:.6rem .75rem;color:var(--text);}
.pack-list li span{font-family:'DM Mono',monospace;font-size:.62rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;}
.today-source{font-size:.72rem;color:var(--text-muted);margin-top:.85rem;line-height:1.45;}
.command-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem;margin:1rem 0 1.35rem;}
.command-category{padding:1rem;text-decoration:none;color:var(--text);display:block;transition:.2s ease;position:relative;overflow:hidden;}
.command-category:hover{transform:translateY(-3px);border-color:var(--border-bright);background:var(--surface2);}
.command-category span{font-size:1.6rem;display:block;margin-bottom:.45rem;}
.command-category h3{font-size:.92rem;margin-bottom:.22rem;}
.command-category p{font-size:.78rem;color:var(--text-muted);line-height:1.45;}
.calendar-shell{max-width:1280px;margin:0 auto;padding:2rem 1.25rem 4rem;}
.calendar-hero{padding:1.3rem;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:1rem;align-items:stretch;margin-bottom:1rem;}
.calendar-hero h1{font-family:'Orbitron',sans-serif;font-size:clamp(1.65rem,4vw,3rem);line-height:1.05;letter-spacing:.04em;margin:.35rem 0;color:var(--text);}
.calendar-hero p{color:var(--text-dim);line-height:1.65;}
.calendar-live-card{background:linear-gradient(135deg,rgba(214,48,122,.14),rgba(106,76,217,.12));border:1px solid rgba(214,48,122,.22);border-radius:16px;padding:1rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;}
.calendar-live-card span{font-family:'DM Mono',monospace;font-size:.65rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;}
.calendar-live-card strong{font-family:'Orbitron',sans-serif;font-size:1.35rem;color:var(--gold);}
.calendar-grid-two{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem;margin-bottom:1rem;}
.calendar-card{padding:1rem;}
.calendar-card h2{font-size:1rem;margin-bottom:.75rem;color:var(--text);}
.calendar-today-title{font-family:'Orbitron',sans-serif;font-size:1.2rem;line-height:1.3;color:var(--text);margin-bottom:.45rem;}
.calendar-control-row{display:grid;grid-template-columns:1fr 1fr auto auto;gap:.65rem;align-items:end;}
.calendar-field label{display:block;font-family:'DM Mono',monospace;font-size:.62rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.25rem;}
.calendar-field select{width:100%;background:var(--surface2);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:.62rem .7rem;font-family:'DM Sans',sans-serif;}
.calendar-action{border:1px solid var(--border);background:var(--surface2);color:var(--text);border-radius:10px;padding:.65rem .85rem;font-weight:700;cursor:pointer;white-space:nowrap;}
.calendar-action.primary{background:rgba(214,48,122,.12);color:var(--gold);border-color:rgba(214,48,122,.35);}
.calendar-action:hover{border-color:var(--gold);}
.timeline-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem;}
.timeline-list li{display:grid;grid-template-columns:48px 1fr auto;gap:.7rem;align-items:center;background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:.55rem .7rem;}
.timeline-list li.active{border-color:rgba(214,48,122,.45);background:rgba(214,48,122,.08);}
.timeline-list span{font-family:'DM Mono',monospace;color:var(--gold);font-size:.68rem;}
.timeline-list strong{font-size:.85rem;}
.timeline-list em{font-style:normal;font-family:'DM Mono',monospace;color:var(--text-muted);font-size:.62rem;}
.week-panel-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.9rem;}
.week-panel-head h2{font-family:'Orbitron',sans-serif;font-size:1.05rem;color:var(--text);}
.week-panel-head p{color:var(--text-muted);font-size:.82rem;}
.week-panel-head span{font-family:'DM Mono',monospace;font-size:.6rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;border:1px solid var(--border);border-radius:999px;padding:.25rem .55rem;white-space:nowrap;}
.calendar-week-panel{padding:1rem;margin-bottom:1rem;}
.calendar-days-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.65rem;}
.calendar-day-card{border:1px solid var(--border);background:var(--surface2);border-radius:14px;padding:.75rem;min-height:164px;cursor:pointer;transition:.18s ease;display:flex;flex-direction:column;gap:.4rem;}
.calendar-day-card:hover,.calendar-day-card.is-current{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 10px 24px rgba(168,32,94,.14);}
.calendar-day-card.is-current{background:linear-gradient(180deg,rgba(214,48,122,.14),var(--surface2));}
.day-card-top{display:flex;justify-content:space-between;gap:.5rem;font-family:'DM Mono',monospace;font-size:.62rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;}
.calendar-day-card h3{font-size:.86rem;line-height:1.32;color:var(--text);}
.calendar-day-card p{font-size:.72rem;color:var(--text-muted);}
.day-pack-strip{display:flex;flex-wrap:wrap;gap:.28rem;margin-top:auto;}
.day-pack-strip span{font-family:'DM Mono',monospace;font-size:.55rem;color:var(--gold);border:1px solid rgba(214,48,122,.22);background:rgba(214,48,122,.08);border-radius:999px;padding:.18rem .42rem;}
.event-note-box{background:var(--surface2);border:1px dashed var(--border-bright);border-radius:14px;padding:.85rem;color:var(--text-dim);font-size:.84rem;line-height:1.6;margin-top:1rem;}
@media(max-width:1024px){.today-board,.calendar-hero,.calendar-grid-two{grid-template-columns:1fr}.command-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.calendar-days-row{grid-template-columns:repeat(2,minmax(0,1fr))}.calendar-control-row{grid-template-columns:1fr 1fr}.calendar-shell{padding-top:1rem}.today-clock-grid{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:640px){.today-board{gap:.75rem}.today-clock-grid{grid-template-columns:1fr}.command-grid{grid-template-columns:1fr}.calendar-days-row{grid-template-columns:1fr}.calendar-control-row{grid-template-columns:1fr}.timeline-list li{grid-template-columns:44px 1fr}.timeline-list em{display:none}.calendar-hero{padding:1rem}.calendar-card{padding:.85rem}}



/* ═════════════════════════════════════════════
   v4.8 — FAM Guide Assistant polish
   Matches the live HTML/JS classes: .chat-messages, .msg-bot, .msg-user
═════════════════════════════════════════════ */
#fam-chat{
  width:min(390px, calc(100vw - 2rem));
  max-height:min(580px, calc(100dvh - 7.25rem));
  border-radius:20px;
  border:1px solid rgba(214,48,122,.24);
  background:var(--surface);
  box-shadow:0 24px 60px rgba(70,28,52,.22), 0 0 0 1px rgba(255,255,255,.25) inset;
}
html[data-theme="dark"] #fam-chat{box-shadow:0 24px 70px rgba(0,0,0,.45),0 0 34px rgba(255,93,184,.08);}
.chat-header{padding:.9rem 1rem;border-bottom:1px solid rgba(255,255,255,.18);gap:.8rem;}
.chat-header-left{display:flex;align-items:center;gap:.72rem;min-width:0;}
.chat-avatar{width:38px;height:38px;display:grid;place-items:center;border-radius:14px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.25);font-size:1.1rem;flex:0 0 auto;}
.chat-title{font-family:'Orbitron',sans-serif;font-weight:800;font-size:.82rem;letter-spacing:.08em;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chat-subtitle{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.25;color:rgba(255,255,255,.82);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chat-close{min-width:36px;min-height:36px;display:grid;place-items:center;flex:0 0 auto;}
.chat-messages{flex:1;min-height:190px;max-height:330px;padding:.95rem;overflow-y:auto;display:flex;flex-direction:column;gap:.65rem;background:linear-gradient(180deg,var(--surface2),var(--surface));scrollbar-width:thin;scrollbar-color:var(--border-bright) transparent;}
.chat-messages:empty::before{content:'Ask anything from the FAM guide.';align-self:center;margin:auto 0;color:var(--text-muted);font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.06em;text-align:center;}
.msg{max-width:88%;padding:.72rem .85rem;border-radius:15px;font-size:.84rem;line-height:1.55;color:var(--text);overflow-wrap:anywhere;word-break:normal;}
.msg-bot{align-self:flex-start;background:var(--surface);border:1px solid var(--border);border-top-left-radius:5px;box-shadow:0 8px 18px rgba(168,32,94,.06);}
.msg-user{align-self:flex-end;background:linear-gradient(135deg,var(--gold),var(--gold-dim));color:#fff;border-top-right-radius:5px;box-shadow:0 8px 18px rgba(214,48,122,.18);}
.msg a{display:inline-flex;margin-top:.25rem;color:var(--gold);font-weight:800;text-decoration:none;border-bottom:1px dotted rgba(214,48,122,.35);cursor:pointer;}
.msg-user a{color:#fff;border-bottom-color:rgba(255,255,255,.55);}
.chat-suggestions{display:flex;flex-wrap:wrap;gap:.45rem;padding:.75rem .85rem;background:var(--surface);border-top:1px solid var(--border);}
.sug-btn{border:1px solid var(--border);background:var(--surface2);color:var(--text-dim);border-radius:999px;padding:.45rem .65rem;font-family:'DM Mono',monospace;font-size:.64rem;line-height:1;cursor:pointer;transition:all .16s ease;white-space:nowrap;}
.sug-btn:hover{border-color:var(--gold);color:var(--gold);background:var(--surface3);transform:translateY(-1px);}
.chat-input-row{padding:.72rem;background:var(--surface);border-top:1px solid var(--border);align-items:flex-end;}
#chat-input{flex:1;min-height:42px;max-height:92px;resize:none;background:var(--surface2);border:1px solid var(--border);border-radius:14px;padding:.7rem .85rem;color:var(--text);font-family:'DM Sans',sans-serif;font-size:.86rem;line-height:1.35;outline:none;transition:border-color .16s,box-shadow .16s;}
#chat-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(214,48,122,.12);}
#chat-input::placeholder{color:var(--text-muted);}
#chat-send{width:42px;height:42px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--gold),var(--gold-dim));color:#fff;font-size:1rem;font-weight:800;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 22px rgba(214,48,122,.22);transition:transform .15s,box-shadow .15s;}
#chat-send:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(214,48,122,.30);}
#chat-send:active{transform:scale(.96);}
@media(max-width:480px){
  #fam-chat{left:.7rem;right:.7rem;bottom:4.55rem;width:auto;max-height:calc(100dvh - 6rem);border-radius:18px;}
  .chat-header{padding:.82rem .85rem;}
  .chat-avatar{width:34px;height:34px;border-radius:12px;}
  .chat-title{font-size:.72rem;}
  .chat-subtitle{font-size:.52rem;}
  .chat-messages{max-height:calc(100dvh - 18rem);min-height:180px;padding:.75rem;}
  .msg{max-width:92%;font-size:.8rem;padding:.65rem .75rem;}
  .chat-suggestions{padding:.65rem;gap:.35rem;}
  .sug-btn{font-size:.58rem;padding:.4rem .52rem;}
  #chat-input{font-size:.82rem;min-height:40px;border-radius:12px;}
  #chat-send{width:40px;height:40px;border-radius:12px;}
}


/* v4.9 responsive hero artwork */
.hero-banner{
  background:linear-gradient(135deg,rgba(22,4,20,.92),rgba(214,48,122,.14));
}
.hero-picture{display:block;width:100%;height:100%;}
.hero-picture source{display:none;}
.hero-banner::before{content:none !important;background:none !important;}
.hero-img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center;opacity:1 !important;position:static !important;filter:none !important;}
@media (min-width:1600px){
  .hero-banner{height:clamp(270px,22vw,400px) !important;}
  .hero-img{object-position:center center !important;}
}
@media (min-width:1100px) and (max-width:1599px){
  .hero-banner{height:clamp(290px,26vw,420px) !important;}
  .hero-img{object-position:center center !important;}
}
@media (min-width:700px) and (max-width:1099px){
  .hero-banner{height:clamp(300px,42vw,430px) !important;}
  .hero-img{object-position:center 40% !important;}
}
@media (max-width:699px){
  .hero-banner{height:300px !important;}
  .hero-img{object-position:center 18% !important;}
}
@media (max-width:480px){
  .hero-banner{height:260px !important;}
}
@media (max-width:360px){
  .hero-banner{height:220px !important;}
}


/* v4.10 mobile hero revert — keep previous phone framing */
@media (max-width:699px){
  .hero-banner{
    height:260px !important;
  }
  .hero-img{
    object-fit:cover !important;
    object-position:center 20% !important;
  }
}
@media (max-width:480px){
  .hero-banner{
    height:260px !important;
  }
}
@media (max-width:360px){
  .hero-banner{
    height:200px !important;
  }
}


/* v4.16 assistant routing + quick links */
.msg .chat-link-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:.28rem .25rem .05rem 0;
  padding:.42rem .62rem;
  border-radius:999px;
  border:1px solid rgba(214,48,122,.28);
  background:linear-gradient(135deg,rgba(214,48,122,.12),rgba(124,58,237,.08));
  color:var(--gold);
  font-family:'DM Mono',monospace;
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.03em;
  text-decoration:none;
  cursor:pointer;
  transition:transform .14s ease,border-color .14s ease,background .14s ease;
}
.msg .chat-link-btn:hover{
  transform:translateY(-1px);
  border-color:var(--gold);
  background:var(--surface3);
}
.msg-bot strong,.msg-user strong{font-weight:800;}
.chat-messages .msg{overflow-wrap:anywhere;}
@media(max-width:480px){
  .msg .chat-link-btn{font-size:.6rem;padding:.38rem .52rem;}
}


/* v4.17 FAM 1245 live sync badges */
.sync-badge{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  margin:.75rem 0;
  padding:.65rem .8rem;
  border-radius:14px;
  border:1px solid var(--border);
  background:var(--surface2);
  color:var(--text-dim);
}
.sync-badge strong{
  color:var(--text);
  font-family:'Orbitron',sans-serif;
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.sync-badge span{
  font-family:'DM Mono',monospace;
  font-size:.68rem;
  text-align:right;
}
.sync-badge.live{border-color:rgba(30,169,106,.38);background:rgba(30,169,106,.08);}
.sync-badge.cache,.sync-badge.stale-cache{border-color:rgba(214,48,122,.28);background:rgba(214,48,122,.08);}
.sync-badge.fallback{border-color:rgba(255,93,168,.35);background:rgba(255,93,168,.08);}
.k1245-panel{
  border:1px solid var(--border);
  background:linear-gradient(135deg,rgba(214,48,122,.10),rgba(124,58,237,.07));
  border-radius:16px;
  padding:.85rem;
  margin:.75rem 0;
}
.k1245-panel strong{display:block;color:var(--gold);font-family:'Orbitron',sans-serif;font-size:.82rem;margin-bottom:.25rem;}
.k1245-panel p,.k1245-panel li{color:var(--text-dim);font-size:.82rem;line-height:1.55;}
.k1245-panel ul{margin:.35rem 0 0 1.1rem;}
@media(max-width:640px){.sync-badge{align-items:flex-start;flex-direction:column}.sync-badge span{text-align:left}}


/* v4.18 readability + structure contrast pass */
:root{
  --section-ink:#32242c;
  --structure-grey:#514852;
  --structure-grey-2:#6f6570;
  --soft-grey-panel:#f4eef2;
  --soft-grey-line:#d7c8d1;
}
html[data-theme="dark"]{
  --section-ink:#fff6fb;
  --structure-grey:#ded3e4;
  --structure-grey-2:#bcaec5;
  --soft-grey-panel:#2c2934;
  --soft-grey-line:#51465e;
}

/* Section heads should read like real chapters, not tiny labels */
.section-label{
  position:relative;
  margin-top:2.25rem;
  margin-bottom:1rem;
  padding:.78rem 1rem .78rem 1.15rem;
  border:1px solid var(--soft-grey-line);
  border-left:7px solid var(--gold);
  border-radius:14px;
  background:linear-gradient(135deg,var(--soft-grey-panel),rgba(214,48,122,.065));
  color:var(--section-ink);
  font-family:'Orbitron',sans-serif;
  font-size:clamp(1rem,1.6vw,1.28rem);
  line-height:1.15;
  letter-spacing:.055em;
  font-weight:900;
  box-shadow:0 10px 28px rgba(45,34,42,.065);
}
.section-label::before{display:none;}
.section-label::after{
  content:'';
  position:absolute;
  left:1.15rem;
  right:1.15rem;
  bottom:.38rem;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--gold),transparent 70%);
  opacity:.65;
}
.section-label-primary{
  margin-top:1.25rem;
  border-left-color:var(--gold);
  background:linear-gradient(135deg,rgba(214,48,122,.16),var(--soft-grey-panel));
}
.section-label-critical{
  border-color:rgba(196,20,64,.30);
  border-left-color:#c41440;
  background:linear-gradient(135deg,rgba(196,20,64,.15),var(--soft-grey-panel));
  color:#2b1017;
}
html[data-theme="dark"] .section-label-critical{color:#fff6fb;background:linear-gradient(135deg,rgba(255,93,130,.16),var(--soft-grey-panel));}
.section-label-command{border-left-color:#6a4cd9;}
.section-label-tools{border-left-color:#a8205e;}
.section-label-navigate{border-left-color:var(--structure-grey-2);}

/* Darker structure on cards so sections are visible from far away */
.command-category,
.home-card,
.qr-card,
.today-card,
.today-pack-card{
  border-color:var(--soft-grey-line);
  box-shadow:0 12px 30px rgba(45,34,42,.075);
}
.command-category:hover,
.home-card:hover,
.qr-card:hover{
  border-color:var(--gold);
  box-shadow:0 16px 34px rgba(45,34,42,.13);
}
.command-category h3,
.home-card h3,
.qr-card-header h3,
.today-pack-card h3{
  color:var(--section-ink);
  font-weight:850;
}
.home-card p,
.command-category p,
.today-meta,
.today-prep,
.qr-card-body,
.prose p,
.stat-value{
  color:var(--structure-grey);
}
.today-card h2{
  font-size:clamp(1.35rem,2.2vw,1.75rem);
  color:var(--section-ink);
  letter-spacing:.055em;
}
.today-pack-card h3{
  font-family:'Orbitron',sans-serif;
  font-size:1.02rem;
  letter-spacing:.05em;
  border-bottom:1px solid var(--soft-grey-line);
  padding-bottom:.5rem;
  margin-bottom:.75rem;
}
.qr-card-header{
  background:linear-gradient(135deg,var(--soft-grey-panel),var(--surface2));
  border-bottom-color:var(--soft-grey-line);
}
.qr-card-header .icon{
  color:var(--gold);
  font-size:1.15rem;
}
.stat-label,
.data-table th{
  color:var(--structure-grey-2);
  font-weight:800;
}

/* Critical rules should look important without making the whole site harsh */
.section-label-critical + .qr-grid .qr-card{
  border-color:rgba(196,20,64,.24);
}
.section-label-critical + .qr-grid .qr-card:first-child{
  border-color:rgba(196,20,64,.42);
  box-shadow:0 14px 34px rgba(196,20,64,.10);
}
.section-label-critical + .qr-grid .qr-card:first-child .qr-card-header{
  background:linear-gradient(135deg,rgba(196,20,64,.12),var(--soft-grey-panel));
}

/* Mobile: category titles remain clear but not huge */
@media(max-width:640px){
  .section-label{
    font-size:.98rem;
    padding:.72rem .85rem .72rem .95rem;
    border-left-width:6px;
    margin-top:1.65rem;
  }
  .section-label::after{left:.95rem;right:.95rem;}
  .today-card h2{font-size:1.18rem;}
}



/* v4.22 — Gray + Red Fiery Theme */
html[data-theme="fire"]{
  --bg:#141112;
  --surface:#201b1c;
  --surface2:#2a2425;
  --surface3:#372f30;
  --border:#514243;
  --border-bright:#b43a32;
  --gold:#ff3b2f;
  --gold-dim:#b8241e;
  --amber:#ff8a3d;
  --red:#ff3b2f;
  --green:#59d48f;
  --blue:#d45b50;
  --text:#fff5f1;
  --text-dim:#d9c5c0;
  --text-muted:#aa9692;
  --accent:#ff3b2f;
  --section-ink:#fff5f1;
  --structure-grey:#d4c3bf;
  --structure-grey-2:#b5a19d;
  --soft-grey-panel:#2b2526;
  --soft-grey-line:#5d4c4d;
}
html[data-theme="fire"] body{
  background:
    radial-gradient(ellipse at 18% 0%,rgba(255,59,47,.18) 0%,transparent 48%),
    radial-gradient(ellipse at 90% 82%,rgba(255,138,61,.13) 0%,transparent 52%),
    linear-gradient(180deg,#171314 0%,#110f10 100%);
  color:var(--text);
}
html[data-theme="fire"] body::before{
  background-image:
    radial-gradient(ellipse at 20% 0%,rgba(255,59,47,.20) 0%,transparent 55%),
    radial-gradient(ellipse at 75% 95%,rgba(255,138,61,.10) 0%,transparent 50%);
}
html[data-theme="fire"] header,
html[data-theme="fire"] .sidebar{
  background:rgba(20,17,18,.95);
  border-color:#3b3031;
}
html[data-theme="fire"] .logo,
html[data-theme="fire"] .page-header h1,
html[data-theme="fire"] .section-label,
html[data-theme="fire"] .calc-category-head h2{
  text-shadow:0 0 18px rgba(255,59,47,.18);
}
html[data-theme="fire"] .section-label,
html[data-theme="fire"] .calc-category-head,
html[data-theme="fire"] .sim-hero,
html[data-theme="fire"] .opt-hero{
  background:linear-gradient(135deg,rgba(255,59,47,.13),rgba(43,37,38,.96));
  border-color:#5d4c4d;
  border-left-color:#ff3b2f;
}
html[data-theme="fire"] .home-card,
html[data-theme="fire"] .command-category,
html[data-theme="fire"] .qr-card,
html[data-theme="fire"] .today-card,
html[data-theme="fire"] .today-pack-card,
html[data-theme="fire"] .calc-tile,
html[data-theme="fire"] .calc-card,
html[data-theme="fire"] .tool-card,
html[data-theme="fire"] .sim-card,
html[data-theme="fire"] .sim-panel,
html[data-theme="fire"] .opt-card,
html[data-theme="fire"] .opt-panel{
  background:linear-gradient(180deg,rgba(42,36,37,.98),rgba(32,27,28,.98));
  border-color:#5d4c4d;
  box-shadow:0 16px 38px rgba(0,0,0,.28),0 0 0 1px rgba(255,59,47,.035);
}
html[data-theme="fire"] .home-card:hover,
html[data-theme="fire"] .command-category:hover,
html[data-theme="fire"] .qr-card:hover,
html[data-theme="fire"] .calc-tile:hover{
  border-color:#ff3b2f;
  box-shadow:0 18px 42px rgba(0,0,0,.34),0 0 24px rgba(255,59,47,.12);
}
html[data-theme="fire"] .theme-toggle{
  color:#fff5f1;
  border-color:#6d5451;
  background:linear-gradient(135deg,rgba(255,59,47,.16),rgba(55,47,48,.92));
}
html[data-theme="fire"] .theme-toggle:hover{
  color:#ff8a3d;
  border-color:#ff3b2f;
  box-shadow:0 0 18px rgba(255,59,47,.16);
}
html[data-theme="fire"] .alert-gold,
html[data-theme="fire"] .k1245-panel,
html[data-theme="fire"] .info-box{
  background:linear-gradient(135deg,rgba(255,59,47,.13),rgba(255,138,61,.06));
  border-color:rgba(255,59,47,.28);
}
.sidebar-theme-wrap{
  padding:0 .75rem .35rem;
}
.sidebar-theme-toggle{
  width:100%;
  justify-content:flex-start;
  min-height:42px;
  padding:0 1rem;
}
.nav-theme-label{
  margin-top:1rem;
}



/* v4.23 — Fire theme contrast final pass */
html[data-theme="fire"]{
  color-scheme:dark;
  --bg:#100d0e;
  --surface:#1b1718;
  --surface2:#252020;
  --surface3:#322a2a;
  --border:#554342;
  --border-bright:#ff4938;
  --gold:#ff4938;
  --gold-dim:#c42b22;
  --amber:#ff9a45;
  --red:#ff4938;
  --text:#fff7f3;
  --text-dim:#e2d0cb;
  --text-muted:#bba8a3;
  --accent:#ff4938;
  --section-ink:#fff7f3;
  --structure-grey:#e2d0cb;
  --structure-grey-2:#c8b4af;
  --soft-grey-panel:#241f20;
  --soft-grey-line:#614d4b;
}

/* Stop light/white cards from leaking into Fire theme */
html[data-theme="fire"] .surface,
html[data-theme="fire"] .card,
html[data-theme="fire"] .content-card,
html[data-theme="fire"] .panel,
html[data-theme="fire"] .page-card,
html[data-theme="fire"] .guide-card,
html[data-theme="fire"] .command-category,
html[data-theme="fire"] .home-card,
html[data-theme="fire"] .qr-card,
html[data-theme="fire"] .today-card,
html[data-theme="fire"] .today-pack-card,
html[data-theme="fire"] .calc-tile,
html[data-theme="fire"] .calc-card,
html[data-theme="fire"] .tool-card,
html[data-theme="fire"] .metric-card,
html[data-theme="fire"] .hub-status-card,
html[data-theme="fire"] .sim-card,
html[data-theme="fire"] .sim-panel,
html[data-theme="fire"] .opt-card,
html[data-theme="fire"] .opt-panel,
html[data-theme="fire"] .planner-card,
html[data-theme="fire"] .result-panel,
html[data-theme="fire"] .clock-card,
html[data-theme="fire"] .help-card,
html[data-theme="fire"] .calendar-card,
html[data-theme="fire"] .calendar-control-panel,
html[data-theme="fire"] .calendar-hero,
html[data-theme="fire"] .event-day-card,
html[data-theme="fire"] .pack-card,
html[data-theme="fire"] .changelog-entry,
html[data-theme="fire"] .msg,
html[data-theme="fire"] .modal-content{
  background:linear-gradient(180deg,rgba(37,32,32,.98),rgba(27,23,24,.98)) !important;
  color:var(--text) !important;
  border-color:var(--soft-grey-line) !important;
}

/* Inner blocks should be dark grey, not white */
html[data-theme="fire"] .summary-card,
html[data-theme="fire"] .rec,
html[data-theme="fire"] .item-card,
html[data-theme="fire"] .mini-status-card,
html[data-theme="fire"] .launch-row,
html[data-theme="fire"] .player-row,
html[data-theme="fire"] .empty-state,
html[data-theme="fire"] .table-wrap,
html[data-theme="fire"] .data-table,
html[data-theme="fire"] .opt-table,
html[data-theme="fire"] .sim-table,
html[data-theme="fire"] .gift-code-card,
html[data-theme="fire"] .transfer-card,
html[data-theme="fire"] .timeline-item,
html[data-theme="fire"] .stat-card,
html[data-theme="fire"] .search-box,
html[data-theme="fire"] .filter-bar,
html[data-theme="fire"] .chat-suggestions,
html[data-theme="fire"] .chat-input-wrap,
html[data-theme="fire"] .sync-badge{
  background:#252020 !important;
  color:var(--text) !important;
  border-color:#614d4b !important;
}

/* Tables and rows */
html[data-theme="fire"] table,
html[data-theme="fire"] thead,
html[data-theme="fire"] tbody,
html[data-theme="fire"] tr,
html[data-theme="fire"] td,
html[data-theme="fire"] th{
  background-color:transparent !important;
  color:var(--text) !important;
  border-color:#554342 !important;
}
html[data-theme="fire"] th,
html[data-theme="fire"] .data-table th,
html[data-theme="fire"] .opt-table th,
html[data-theme="fire"] .sim-table th{
  color:#ffb19a !important;
  background:rgba(255,73,56,.08) !important;
}
html[data-theme="fire"] tr:hover td{
  background:rgba(255,73,56,.055) !important;
}

/* Inputs/selects/buttons must stay readable */
html[data-theme="fire"] input,
html[data-theme="fire"] select,
html[data-theme="fire"] textarea,
html[data-theme="fire"] .input,
html[data-theme="fire"] .select,
html[data-theme="fire"] .form-input,
html[data-theme="fire"] .form-select,
html[data-theme="fire"] .search-input,
html[data-theme="fire"] #chat-input{
  background:#161313 !important;
  color:#fff7f3 !important;
  border-color:#6b5451 !important;
  caret-color:#ff9a45 !important;
}
html[data-theme="fire"] input::placeholder,
html[data-theme="fire"] textarea::placeholder,
html[data-theme="fire"] .search-input::placeholder,
html[data-theme="fire"] #chat-input::placeholder{
  color:#a99590 !important;
}
html[data-theme="fire"] option{
  background:#1b1718 !important;
  color:#fff7f3 !important;
}

/* Text hierarchy */
html[data-theme="fire"] h1,
html[data-theme="fire"] h2,
html[data-theme="fire"] h3,
html[data-theme="fire"] h4,
html[data-theme="fire"] .page-title,
html[data-theme="fire"] .section-label,
html[data-theme="fire"] .card-title h2,
html[data-theme="fire"] .calc-tile h3,
html[data-theme="fire"] .home-card h3,
html[data-theme="fire"] .command-category h3,
html[data-theme="fire"] .qr-card-header h3,
html[data-theme="fire"] .today-card h2,
html[data-theme="fire"] .rec strong,
html[data-theme="fire"] .summary-card strong,
html[data-theme="fire"] .metric-card strong{
  color:#fff7f3 !important;
}
html[data-theme="fire"] p,
html[data-theme="fire"] li,
html[data-theme="fire"] span,
html[data-theme="fire"] .muted-copy,
html[data-theme="fire"] .hint-text,
html[data-theme="fire"] .opt-note,
html[data-theme="fire"] .today-meta,
html[data-theme="fire"] .today-prep,
html[data-theme="fire"] .rec span,
html[data-theme="fire"] .card-title p,
html[data-theme="fire"] .calc-tile p,
html[data-theme="fire"] .home-card p,
html[data-theme="fire"] .command-category p{
  color:var(--text-dim);
}
html[data-theme="fire"] .text-muted,
html[data-theme="fire"] .hint,
html[data-theme="fire"] small,
html[data-theme="fire"] .stat-label,
html[data-theme="fire"] .summary-card span,
html[data-theme="fire"] .metric-card span{
  color:var(--text-muted) !important;
}

/* Section headers: fire, but not washed out */
html[data-theme="fire"] .section-label,
html[data-theme="fire"] .calc-category-head,
html[data-theme="fire"] .sim-hero,
html[data-theme="fire"] .opt-hero{
  background:linear-gradient(135deg,rgba(255,73,56,.17),rgba(36,31,32,.98)) !important;
  color:#fff7f3 !important;
  border-color:#684f4c !important;
  border-left-color:#ff4938 !important;
  box-shadow:0 14px 34px rgba(0,0,0,.32),0 0 22px rgba(255,73,56,.08) !important;
}
html[data-theme="fire"] .section-label::after{
  background:linear-gradient(90deg,#ff4938,rgba(255,154,69,.4),transparent 75%) !important;
}

/* Links and action elements */
html[data-theme="fire"] a,
html[data-theme="fire"] nav a,
html[data-theme="fire"] .top-nav a{
  color:#ffd4c9;
}
html[data-theme="fire"] a:hover,
html[data-theme="fire"] nav a:hover,
html[data-theme="fire"] nav a.active{
  color:#ff9a45 !important;
  background:rgba(255,73,56,.10) !important;
  border-color:rgba(255,73,56,.35) !important;
}
html[data-theme="fire"] .btn,
html[data-theme="fire"] .btn-small,
html[data-theme="fire"] .action-btn,
html[data-theme="fire"] .secondary-btn,
html[data-theme="fire"] .tiny-btn,
html[data-theme="fire"] .sug-btn,
html[data-theme="fire"] .copy-btn{
  background:#252020 !important;
  color:#fff7f3 !important;
  border-color:#6b5451 !important;
}
html[data-theme="fire"] .btn-main,
html[data-theme="fire"] .primary-btn,
html[data-theme="fire"] .capture-btn,
html[data-theme="fire"] .action-pill,
html[data-theme="fire"] .calc-tile-badge,
html[data-theme="fire"] .badge-soft{
  background:linear-gradient(135deg,#ff4938,#a51f1b) !important;
  color:#fff7f3 !important;
  border-color:rgba(255,154,69,.34) !important;
}

/* Alerts / notes */
html[data-theme="fire"] .alert,
html[data-theme="fire"] .alert-amber,
html[data-theme="fire"] .alert-gold,
html[data-theme="fire"] .k1245-panel,
html[data-theme="fire"] .info-box{
  background:linear-gradient(135deg,rgba(255,73,56,.13),rgba(37,32,32,.98)) !important;
  border-color:rgba(255,73,56,.32) !important;
  color:var(--text-dim) !important;
}
html[data-theme="fire"] code,
html[data-theme="fire"] pre,
html[data-theme="fire"] kbd{
  background:#161313 !important;
  color:#ffb19a !important;
  border-color:#684f4c !important;
}

/* Assistant: keep user/bot bubbles distinct */
html[data-theme="fire"] .msg-bot{
  background:#252020 !important;
  color:#fff7f3 !important;
}
html[data-theme="fire"] .msg-user{
  background:linear-gradient(135deg,#ff4938,#8d1d19) !important;
  color:#fff7f3 !important;
}
html[data-theme="fire"] .msg .chat-link-btn{
  background:rgba(255,73,56,.13) !important;
  color:#ffb19a !important;
  border-color:rgba(255,73,56,.35) !important;
}

/* Scrollbar and selection */
html[data-theme="fire"] ::selection{
  background:rgba(255,73,56,.35);
  color:#fff7f3;
}
html[data-theme="fire"] ::-webkit-scrollbar-thumb{
  background:#6b5451;
}
html[data-theme="fire"] ::-webkit-scrollbar-thumb:hover{
  background:#ff4938;
}

.legal-disclaimer{
  border-top:1px solid var(--border);
}
html[data-theme="fire"] .legal-disclaimer{
  color:var(--text-muted) !important;
  border-color:#554342;
}



/* v4.25 — Venator-inspired cinematic rebuild layer */
:root{
  --venator-bg:#120e0e;
  --venator-panel:#1d1718;
  --venator-panel-2:#2a2020;
  --venator-line:rgba(255,255,255,.11);
  --venator-red:#e5382d;
  --venator-orange:#ff9a45;
  --venator-cream:#fff1df;
  --venator-muted:#cdb6aa;
  --venator-shadow:0 24px 80px rgba(0,0,0,.34);
  --venator-radius:22px;
}

body{
  scroll-behavior:smooth;
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 78%);
}

html[data-theme="fire"] body,
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 15% 10%,rgba(229,56,45,.20),transparent 34%),
    radial-gradient(circle at 86% 12%,rgba(255,154,69,.12),transparent 32%),
    radial-gradient(circle at 50% 100%,rgba(229,56,45,.13),transparent 46%),
    linear-gradient(180deg,#171111 0%,#0f0d0d 100%) !important;
}

header{
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

html[data-theme="fire"] header,
html[data-theme="dark"] header{
  background:linear-gradient(180deg,rgba(18,14,14,.92),rgba(18,14,14,.70)) !important;
  border-bottom-color:rgba(255,255,255,.11) !important;
}

.logo{
  letter-spacing:.09em;
  text-transform:uppercase;
}

.top-nav a,
.sidebar a,
.header-back,
.action-pill{
  position:relative;
  overflow:hidden;
}

.top-nav a::after,
.sidebar a::after,
.header-back::after,
.action-pill::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:5px;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .22s ease;
}

.top-nav a:hover::after,
.sidebar a:hover::after,
.header-back:hover::after,
.action-pill:hover::after{
  transform:scaleX(1);
}

/* Landing hero: turn page-header into cinematic intro */
.page-header,
.calc-hero,
.hub-hero,
.calendar-hero,
.sim-hero,
.opt-hero,
.castle-hero-main{
  position:relative;
  overflow:hidden;
  border-radius:clamp(22px,3vw,36px) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:var(--venator-shadow) !important;
}

.page-header{
  min-height:clamp(330px,48vh,560px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  padding:clamp(2rem,6vw,5rem) !important;
  background:
    linear-gradient(100deg,rgba(18,14,14,.96) 0%,rgba(26,18,18,.74) 48%,rgba(229,56,45,.18) 100%),
    radial-gradient(circle at 80% 20%,rgba(255,154,69,.18),transparent 33%),
    radial-gradient(circle at 18% 80%,rgba(229,56,45,.20),transparent 38%),
    var(--surface) !important;
  isolation:isolate;
}

.page-header::before,
.calc-hero::before,
.hub-hero::before,
.calendar-hero::before,
.sim-hero::before,
.opt-hero::before,
.castle-hero-main::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    linear-gradient(115deg,transparent 0%,rgba(255,255,255,.08) 38%,transparent 58%),
    radial-gradient(circle at 85% 50%,rgba(255,154,69,.18),transparent 36%);
  opacity:.8;
  z-index:0;
  pointer-events:none;
}

.page-header::after{
  content:"SCROLL DOWN";
  position:absolute;
  right:clamp(1rem,3vw,2.2rem);
  bottom:clamp(1rem,3vw,2.2rem);
  padding:.55rem .8rem;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:var(--gold);
  font-family:'DM Mono',monospace;
  font-size:.66rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  background:rgba(0,0,0,.25);
  animation:famPulse 2.2s ease-in-out infinite;
}

.page-header > *{
  position:relative;
  z-index:1;
}

.page-header h1,
.calc-hero h1,
.hub-hero h1,
.sim-hero h1,
.opt-hero h1,
.castle-hero-main h1{
  max-width:980px;
  font-size:clamp(2.7rem,9vw,7.25rem) !important;
  line-height:.86 !important;
  letter-spacing:.035em !important;
  text-transform:uppercase;
  color:var(--venator-cream) !important;
  text-shadow:0 20px 50px rgba(0,0,0,.45),0 0 28px rgba(229,56,45,.14);
}

.page-header p,
.calc-hero p,
.hub-hero p,
.sim-hero p,
.opt-hero p,
.castle-hero-main p{
  max-width:760px;
  color:var(--venator-muted) !important;
  font-size:clamp(.95rem,1.4vw,1.15rem) !important;
  line-height:1.65 !important;
}

.page-search{
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.025)) !important;
  box-shadow:0 16px 44px rgba(0,0,0,.18);
}

/* Chapter headings like Venator sections */
.section-label,
.calc-category-head{
  text-transform:uppercase;
  letter-spacing:.08em !important;
  border-radius:20px !important;
  padding:1rem 1.15rem !important;
  background:
    linear-gradient(135deg,rgba(229,56,45,.14),rgba(255,255,255,.035)) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-left:8px solid var(--gold) !important;
  box-shadow:0 18px 50px rgba(0,0,0,.15) !important;
}

.section-label::after{
  height:1px !important;
  bottom:.48rem !important;
  background:linear-gradient(90deg,var(--gold),rgba(255,154,69,.6),transparent 72%) !important;
}

/* Cards: game-feature panels */
.command-category,
.home-card,
.qr-card,
.today-card,
.today-pack-card,
.calc-tile,
.calc-card,
.tool-card,
.sim-card,
.sim-panel,
.opt-card,
.opt-panel,
.planner-card,
.result-panel,
.changelog-entry,
.calendar-control-panel,
.alert,
.k1245-panel,
.info-box{
  position:relative;
  overflow:hidden;
  border-radius:var(--venator-radius) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 20px 60px rgba(0,0,0,.12);
  transform-style:preserve-3d;
  transition:transform .28s ease, border-color .28s ease, box-shadow .28s ease, background .28s ease;
}

.command-category::before,
.home-card::before,
.qr-card::before,
.calc-tile::before,
.today-card::before,
.sim-card::before,
.opt-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(120deg,transparent 0%,rgba(255,255,255,.07) 42%,transparent 62%),
    radial-gradient(circle at 80% 0%,rgba(229,56,45,.14),transparent 36%);
  opacity:0;
  transition:opacity .28s ease;
  pointer-events:none;
}

.command-category:hover,
.home-card:hover,
.qr-card:hover,
.calc-tile:hover,
.tool-card:hover,
.sim-card:hover,
.opt-card:hover{
  transform:translateY(-7px) scale(1.01);
  border-color:rgba(255,154,69,.42) !important;
  box-shadow:0 26px 72px rgba(0,0,0,.22),0 0 34px rgba(229,56,45,.11) !important;
}

.is-tilting{
  transform:translateY(-7px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) scale(1.012) !important;
}

.command-category:hover::before,
.home-card:hover::before,
.qr-card:hover::before,
.calc-tile:hover::before,
.today-card:hover::before,
.sim-card:hover::before,
.opt-card:hover::before{
  opacity:1;
}

/* Venator-like numbered feature cards */
.home-grid,
.command-grid,
.qr-grid,
.calc-grid{
  counter-reset:famCard;
}

.home-card,
.command-category,
.qr-card,
.calc-tile{
  counter-increment:famCard;
}

.home-card::after,
.command-category::after,
.calc-tile::after{
  content:"." counter(famCard, decimal-leading-zero);
  position:absolute;
  right:1rem;
  bottom:.85rem;
  font-family:'Orbitron',sans-serif;
  font-weight:900;
  font-size:clamp(1.25rem,3vw,2.2rem);
  color:rgba(229,56,45,.18);
  pointer-events:none;
}

/* Buttons/CTAs */
.btn-main,
.primary-btn,
.capture-btn,
.action-pill,
button[type="submit"],
.header-search-btn,
.theme-toggle,
.copy-btn{
  border-radius:999px !important;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.btn-main,
.primary-btn,
.capture-btn,
.action-pill{
  background:linear-gradient(135deg,var(--gold),#8f1a15) !important;
  box-shadow:0 14px 34px rgba(229,56,45,.24);
}

.btn-main:hover,
.primary-btn:hover,
.capture-btn:hover,
.action-pill:hover{
  filter:saturate(1.12) brightness(1.05);
  transform:translateY(-2px);
}

/* Expandables: show-more style */
.expand-trigger{
  border-radius:20px !important;
  overflow:hidden;
  position:relative;
}

.expand-trigger::before{
  content:"SHOW MORE";
  position:absolute;
  right:3.5rem;
  top:50%;
  transform:translateY(-50%);
  font-family:'DM Mono',monospace;
  font-size:.62rem;
  letter-spacing:.12em;
  color:var(--gold);
  opacity:.8;
}

.expandable.open .expand-trigger::before{
  content:"SHOW LESS";
}

/* Roadmap/timeline feel */
.timeline-item,
.roadmap-card{
  border-left:3px solid var(--gold) !important;
  position:relative;
}

.timeline-item::before,
.roadmap-card::before{
  content:"";
  position:absolute;
  left:-8px;
  top:1rem;
  width:13px;
  height:13px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 20px rgba(229,56,45,.5);
}

/* Scroll reveal animation */
.reveal-on-scroll{
  opacity:0;
  transform:translateY(34px) scale(.985);
  transition:
    opacity .7s cubic-bezier(.2,.8,.2,1) var(--reveal-delay,0ms),
    transform .7s cubic-bezier(.2,.8,.2,1) var(--reveal-delay,0ms);
  will-change:opacity,transform;
}

.reveal-on-scroll.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

@keyframes famPulse{
  0%,100%{transform:translateY(0);opacity:.72}
  50%{transform:translateY(-4px);opacity:1}
}

/* Simulator/calculator pages get cinematic intro too */
.calc-shell,
.sim-shell,
.optimizer-shell,
.castle-shell{
  position:relative;
}

.calc-shell::before,
.sim-shell::before,
.optimizer-shell::before,
.castle-shell::before{
  content:"";
  position:absolute;
  inset:0 auto auto 50%;
  width:min(680px,80vw);
  height:380px;
  transform:translateX(-50%);
  background:radial-gradient(circle,rgba(229,56,45,.13),transparent 66%);
  pointer-events:none;
  z-index:-1;
}

/* Mobile tuning */
@media(max-width:760px){
  .page-header{
    min-height:360px;
    padding:2rem 1.15rem !important;
  }
  .page-header h1,
  .calc-hero h1,
  .hub-hero h1,
  .sim-hero h1,
  .opt-hero h1,
  .castle-hero-main h1{
    font-size:clamp(2.15rem,14vw,4.4rem) !important;
  }
  .page-header::after{
    left:1rem;
    right:auto;
    bottom:.9rem;
  }
  .expand-trigger::before{
    display:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .reveal-on-scroll,
  .command-category,
  .home-card,
  .qr-card,
  .calc-tile,
  .tool-card,
  .sim-card,
  .opt-card{
    transition:none !important;
    transform:none !important;
    animation:none !important;
  }
  .page-header::after{animation:none !important;}
}


/* v4.25 homepage command strip */
.venator-command-strip{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.8rem;
  margin:-2.1rem 1rem 1.15rem;
  position:relative;
  z-index:3;
}
.venator-command-strip a{
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-areas:"num title" "num sub";
  gap:.1rem .75rem;
  padding:1rem;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(22,18,18,.92),rgba(229,56,45,.12));
  box-shadow:0 18px 44px rgba(0,0,0,.22);
  text-decoration:none;
  color:var(--text);
  cursor:pointer;
  overflow:hidden;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.venator-command-strip a:hover{
  transform:translateY(-5px);
  border-color:rgba(255,154,69,.45);
  box-shadow:0 22px 58px rgba(0,0,0,.30),0 0 28px rgba(229,56,45,.12);
}
.venator-command-strip span{
  grid-area:num;
  font-family:'Orbitron',sans-serif;
  font-size:1.35rem;
  color:var(--gold);
  opacity:.9;
}
.venator-command-strip strong{
  grid-area:title;
  font-family:'Orbitron',sans-serif;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--venator-cream,#fff1df);
}
.venator-command-strip em{
  grid-area:sub;
  font-style:normal;
  font-size:.8rem;
  color:var(--text-dim);
}
@media(max-width:820px){
  .venator-command-strip{grid-template-columns:1fr;margin:.75rem 0 1rem;}
}



/* v4.26 — Full Venator default rebuild polish */
html[data-theme="fire"]{
  --bg:#0d0b0b;
  --surface:#171313;
  --surface2:#211a1a;
  --surface3:#2f2424;
  --border:#5d4643;
  --gold:#ff4b38;
  --amber:#ff9c4a;
  --text:#fff4e8;
  --text-dim:#d9c0b2;
  --text-muted:#aa9186;
}

/* Make the cinematic theme feel like the actual site, not a skin */
html[data-theme="fire"] .page.active main,
html[data-theme="fire"] .calc-shell,
html[data-theme="fire"] .sim-shell,
html[data-theme="fire"] .optimizer-shell,
html[data-theme="fire"] .castle-shell{
  animation:famPageIn .55s cubic-bezier(.2,.8,.2,1) both;
}

@keyframes famPageIn{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:translateY(0)}
}

html[data-theme="fire"] header{
  min-height:76px;
  background:
    linear-gradient(180deg,rgba(11,9,9,.94),rgba(11,9,9,.76)),
    radial-gradient(circle at 0% 0%,rgba(255,75,56,.18),transparent 34%) !important;
  box-shadow:0 12px 40px rgba(0,0,0,.34);
}

html[data-theme="fire"] .header-inner{
  max-width:1480px;
}

html[data-theme="fire"] .logo{
  color:#fff4e8;
  font-size:1.04rem;
}
html[data-theme="fire"] .logo span{
  color:#ff9c4a;
  letter-spacing:.18em;
}

html[data-theme="fire"] .top-nav{
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  padding:.3rem;
}
html[data-theme="fire"] .top-nav a{
  border-radius:999px;
  padding:.58rem .82rem;
  font-family:'DM Mono',monospace;
  letter-spacing:.07em;
  text-transform:uppercase;
  font-size:.68rem;
}

html[data-theme="fire"] .sidebar{
  background:
    linear-gradient(180deg,rgba(13,11,11,.98),rgba(23,19,19,.98)),
    radial-gradient(circle at 0 0,rgba(255,75,56,.14),transparent 44%) !important;
  box-shadow:18px 0 60px rgba(0,0,0,.45);
}

html[data-theme="fire"] .nav-section-label{
  color:#ff9c4a;
  font-family:'DM Mono',monospace;
  letter-spacing:.18em;
}

html[data-theme="fire"] .sidebar a{
  border:1px solid transparent;
  border-radius:14px;
}
html[data-theme="fire"] .sidebar a:hover,
html[data-theme="fire"] .sidebar a.active{
  background:rgba(255,75,56,.10) !important;
  border-color:rgba(255,75,56,.25);
}

/* More Venator-like landing layout */
html[data-theme="fire"] .page-header{
  margin-top:.7rem;
  min-height:clamp(420px,62vh,720px);
  background:
    linear-gradient(105deg,rgba(9,7,7,.98) 0%,rgba(23,14,14,.88) 45%,rgba(71,18,15,.55) 100%),
    radial-gradient(circle at 82% 38%,rgba(255,75,56,.24),transparent 34%),
    radial-gradient(circle at 68% 0%,rgba(255,156,74,.13),transparent 38%),
    linear-gradient(180deg,#171313,#0d0b0b) !important;
}

html[data-theme="fire"] .page-header h1::before{
  content:"K1245 / FAM";
  display:block;
  margin-bottom:.65rem;
  color:#ff9c4a;
  font-family:'DM Mono',monospace;
  font-size:clamp(.68rem,1.2vw,.92rem);
  letter-spacing:.28em;
  line-height:1;
}

html[data-theme="fire"] .page-header p{
  max-width:680px;
  border-left:3px solid rgba(255,75,56,.75);
  padding-left:1rem;
  margin-top:1rem;
}

/* Section groups become strong game content blocks */
html[data-theme="fire"] .today-board,
html[data-theme="fire"] .command-grid,
html[data-theme="fire"] .home-grid,
html[data-theme="fire"] .qr-grid,
html[data-theme="fire"] .calc-grid{
  position:relative;
}

html[data-theme="fire"] .command-category,
html[data-theme="fire"] .home-card,
html[data-theme="fire"] .qr-card,
html[data-theme="fire"] .calc-tile{
  min-height:170px;
  background:
    linear-gradient(180deg,rgba(33,26,26,.98),rgba(18,14,14,.98)),
    radial-gradient(circle at 82% 10%,rgba(255,75,56,.13),transparent 44%) !important;
}

/* Feature card labels feel more like a game landing page */
html[data-theme="fire"] .command-category span,
html[data-theme="fire"] .hc-icon,
html[data-theme="fire"] .calc-tile-icon,
html[data-theme="fire"] .qr-card-header .icon{
  filter:drop-shadow(0 0 18px rgba(255,75,56,.24));
}

html[data-theme="fire"] .command-category h3,
html[data-theme="fire"] .home-card h3,
html[data-theme="fire"] .calc-tile h3,
html[data-theme="fire"] .qr-card h3{
  font-family:'Orbitron',sans-serif;
  text-transform:uppercase;
  letter-spacing:.07em;
}

/* Calculator hub should also look like the reference theme */
html[data-theme="fire"] .calc-category-section{
  margin-top:2.2rem;
}
html[data-theme="fire"] .calc-category-head{
  min-height:120px;
  align-items:center;
  background:
    linear-gradient(110deg,rgba(255,75,56,.17),rgba(23,19,19,.98) 70%),
    radial-gradient(circle at 100% 0%,rgba(255,156,74,.14),transparent 40%) !important;
}
html[data-theme="fire"] .calc-category-head h2{
  font-size:clamp(1.25rem,2.4vw,2.2rem) !important;
}

/* Assistant/chat inherits the cinematic UI */
html[data-theme="fire"] .chat-box,
html[data-theme="fire"] #fam-chat{
  background:linear-gradient(180deg,rgba(23,19,19,.98),rgba(13,11,11,.98)) !important;
  border-color:rgba(255,75,56,.24) !important;
  box-shadow:0 26px 80px rgba(0,0,0,.45),0 0 34px rgba(255,75,56,.08) !important;
}

html[data-theme="fire"] .chat-header{
  background:linear-gradient(135deg,rgba(255,75,56,.18),rgba(255,255,255,.035)) !important;
}

/* Give non-fire themes a cleaner Venator layout without forcing dark colors */
html[data-theme="light"] .page-header{
  background:
    linear-gradient(105deg,rgba(255,255,255,.96),rgba(255,238,246,.88) 55%,rgba(214,48,122,.12)),
    radial-gradient(circle at 82% 38%,rgba(214,48,122,.18),transparent 35%) !important;
}
html[data-theme="dark"] .page-header{
  background:
    linear-gradient(105deg,rgba(18,14,24,.98),rgba(34,24,48,.88) 55%,rgba(214,48,122,.20)),
    radial-gradient(circle at 82% 38%,rgba(214,48,122,.20),transparent 35%) !important;
}

/* Bigger, clearer mobile nav like the reference */
@media(max-width:820px){
  html[data-theme="fire"] header{min-height:66px;}
  html[data-theme="fire"] .page-header{
    min-height:470px;
  }
  html[data-theme="fire"] .top-nav{
    display:none;
  }
  .venator-command-strip{
    margin:.95rem 0 1.25rem !important;
  }
}



/* v4.27 — Uploaded Venator web-app theme integration
   Source design cues from uploaded Next app:
   --bg #0d0c22, --bgSoft #2d2b42, --text white, --textSoft #e5e5e5, --btn #3673fd.
*/
html[data-theme="venator"]{
  color-scheme:dark;
  --bg:#0d0c22;
  --surface:#2d2b42;
  --surface2:#222038;
  --surface3:#363450;
  --border:#46445e;
  --border-bright:#3673fd;
  --gold:#3673fd;
  --gold-dim:#2756c8;
  --amber:#6ea0ff;
  --red:#e54761;
  --green:#26a380;
  --blue:#3673fd;
  --text:#ffffff;
  --text-dim:#e5e5e5;
  --text-muted:#b8b8c8;
  --accent:#3673fd;
  --section-ink:#ffffff;
  --structure-grey:#e5e5e5;
  --structure-grey-2:#b8b8c8;
  --soft-grey-panel:#2d2b42;
  --soft-grey-line:#46445e;
  --venator-bg:#0d0c22;
  --venator-panel:#2d2b42;
  --venator-panel-2:#222038;
  --venator-line:#46445e;
  --venator-red:#3673fd;
  --venator-orange:#6ea0ff;
  --venator-cream:#ffffff;
  --venator-muted:#e5e5e5;
  --venator-shadow:rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px,rgba(10,37,64,.35) 0px -2px 6px 0px inset;
}

html[data-theme="venator"] *,
html[data-theme="venator"] *::before,
html[data-theme="venator"] *::after{
  scrollbar-width:none;
  -ms-overflow-style:none;
}
html[data-theme="venator"] *::-webkit-scrollbar{display:none;}

html[data-theme="venator"] body{
  background:
    radial-gradient(circle at 16% 10%,rgba(54,115,253,.22),transparent 35%),
    radial-gradient(circle at 82% 18%,rgba(38,163,128,.13),transparent 32%),
    radial-gradient(circle at 50% 100%,rgba(54,115,253,.13),transparent 44%),
    #0d0c22 !important;
  color:#fff !important;
}

html[data-theme="venator"] body::before{
  background:
    radial-gradient(circle at 15% 10%,rgba(54,115,253,.20),transparent 35%),
    radial-gradient(circle at 90% 80%,rgba(38,163,128,.12),transparent 42%) !important;
}

/* Uploaded app container feel: centered, max width, generous side padding */
html[data-theme="venator"] .app-body,
html[data-theme="venator"] .calc-shell,
html[data-theme="venator"] .sim-shell,
html[data-theme="venator"] .optimizer-shell,
html[data-theme="venator"] .castle-shell,
html[data-theme="venator"] .hub-shell,
html[data-theme="venator"] .calendar-shell,
html[data-theme="venator"] .changelog-shell{
  max-width:1536px;
  margin-left:auto;
  margin-right:auto;
  padding-left:50px;
  padding-right:50px;
}

html[data-theme="venator"] header{
  height:100px;
  background:rgba(13,12,34,.88) !important;
  border-bottom:1px solid rgba(229,229,229,.10) !important;
  box-shadow:none !important;
  backdrop-filter:blur(18px);
}
html[data-theme="venator"] .header-inner{
  max-width:1536px;
  min-height:100px;
  padding-left:50px;
  padding-right:50px;
}

html[data-theme="venator"] .logo{
  font-size:30px;
  font-weight:800;
  color:#fff !important;
  letter-spacing:.02em;
  text-transform:none;
}
html[data-theme="venator"] .logo span{
  color:#e5e5e5 !important;
  letter-spacing:.08em;
}

html[data-theme="venator"] .top-nav{
  background:transparent !important;
  border:0 !important;
  gap:10px;
  padding:0;
}
html[data-theme="venator"] .top-nav a,
html[data-theme="venator"] .header-back,
html[data-theme="venator"] .theme-toggle{
  min-width:100px;
  padding:10px 14px !important;
  border-radius:20px !important;
  border:1px solid transparent !important;
  font-weight:600;
  font-family:'DM Sans',sans-serif;
  text-align:center;
  background:transparent !important;
  color:#fff !important;
}
html[data-theme="venator"] .top-nav a:hover,
html[data-theme="venator"] .top-nav a.active,
html[data-theme="venator"] .header-back:hover,
html[data-theme="venator"] .theme-toggle:hover{
  background:#fff !important;
  color:#0d0c22 !important;
  border-color:#fff !important;
}

/* Hero copied from uploaded home.module feel: 2 columns, huge text, buttons */
html[data-theme="venator"] .page-header{
  min-height:calc(100vh - 170px);
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);
  align-items:center;
  gap:100px;
  padding:50px 0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:visible;
}
html[data-theme="venator"] .page-header::before{
  content:"";
  position:relative;
  grid-column:2;
  grid-row:1 / span 3;
  width:min(520px,38vw);
  height:min(520px,38vw);
  justify-self:center;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,rgba(54,115,253,.05) 0 36%,transparent 37%),
    conic-gradient(from 0deg,rgba(38,163,128,.12),rgba(54,115,253,.95),rgba(255,255,255,.12),rgba(54,115,253,.95),rgba(38,163,128,.12));
  mask:radial-gradient(circle,transparent 0 41%,#000 42% 47%,transparent 48% 55%,#000 56% 61%,transparent 62%);
  animation:venatorSpin 18s linear infinite;
  filter:drop-shadow(0 0 55px rgba(54,115,253,.22));
  opacity:1;
  pointer-events:none;
  z-index:0;
}
html[data-theme="venator"] .page-header::after{
  content:"";
  position:absolute;
  right:10%;
  top:50%;
  width:130px;
  height:130px;
  transform:translateY(-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(54,115,253,.95),rgba(54,115,253,.12) 58%,transparent 64%);
  box-shadow:0 0 70px rgba(54,115,253,.35);
  animation:venatorFloat 4s ease-in-out infinite;
}

html[data-theme="venator"] .page-header h1{
  grid-column:1;
  font-size:76.8px !important;
  line-height:1.02 !important;
  max-width:760px;
  color:#fff !important;
  text-transform:none !important;
  letter-spacing:-.04em !important;
  text-shadow:none !important;
}
html[data-theme="venator"] .page-header h1::before{
  content:"Statistics for your alliance.";
  display:block;
  margin-bottom:24px;
  font-size:16px;
  font-family:'DM Mono',monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#6ea0ff;
}
html[data-theme="venator"] .page-header p{
  grid-column:1;
  max-width:620px;
  margin:0;
  padding:0;
  border:0;
  color:#e5e5e5 !important;
  font-size:16px !important;
  line-height:1.7 !important;
}

/* Use uploaded app card feel */
html[data-theme="venator"] .home-card,
html[data-theme="venator"] .command-category,
html[data-theme="venator"] .qr-card,
html[data-theme="venator"] .calc-tile,
html[data-theme="venator"] .calc-card,
html[data-theme="venator"] .tool-card,
html[data-theme="venator"] .sim-card,
html[data-theme="venator"] .sim-panel,
html[data-theme="venator"] .opt-card,
html[data-theme="venator"] .opt-panel,
html[data-theme="venator"] .today-card,
html[data-theme="venator"] .today-pack-card,
html[data-theme="venator"] .calendar-control-panel,
html[data-theme="venator"] .changelog-entry,
html[data-theme="venator"] .alert,
html[data-theme="venator"] .k1245-panel,
html[data-theme="venator"] .info-box{
  background-color:#2d2b42 !important;
  background-image:none !important;
  border:1px solid rgba(13,12,34,.65) !important;
  border-radius:30px !important;
  box-shadow:var(--venator-shadow) !important;
  opacity:.88;
  transition:opacity .3s ease,transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
html[data-theme="venator"] .home-card:hover,
html[data-theme="venator"] .command-category:hover,
html[data-theme="venator"] .qr-card:hover,
html[data-theme="venator"] .calc-tile:hover,
html[data-theme="venator"] .tool-card:hover{
  opacity:1;
  transform:translateY(-5px);
  border-color:#3673fd !important;
}

/* Forms and calculator input blocks from uploaded app */
html[data-theme="venator"] input,
html[data-theme="venator"] textarea,
html[data-theme="venator"] select,
html[data-theme="venator"] .input,
html[data-theme="venator"] .select,
html[data-theme="venator"] .form-input,
html[data-theme="venator"] .form-select,
html[data-theme="venator"] .search-input,
html[data-theme="venator"] #chat-input{
  padding:20px !important;
  background-color:#0d0c22 !important;
  border:none !important;
  border-radius:5px !important;
  color:#fff !important;
  outline:1px solid rgba(255,255,255,.08);
}
html[data-theme="venator"] input:focus,
html[data-theme="venator"] textarea:focus,
html[data-theme="venator"] select:focus,
html[data-theme="venator"] .input:focus,
html[data-theme="venator"] .select:focus{
  outline:2px solid #3673fd !important;
  box-shadow:none !important;
}
html[data-theme="venator"] option{
  background:#0d0c22 !important;
  color:#fff !important;
}

/* Buttons from uploaded app */
html[data-theme="venator"] button,
html[data-theme="venator"] .btn,
html[data-theme="venator"] .btn-small,
html[data-theme="venator"] .btn-main,
html[data-theme="venator"] .primary-btn,
html[data-theme="venator"] .action-pill,
html[data-theme="venator"] .copy-btn,
html[data-theme="venator"] .sug-btn{
  border:none !important;
  border-radius:5px !important;
  padding:14px 20px !important;
  cursor:pointer;
  background-color:#3673fd !important;
  color:#fff !important;
  font-weight:700;
  box-shadow:none !important;
}
html[data-theme="venator"] .btn-small,
html[data-theme="venator"] .sug-btn{
  background-color:#2d2b42 !important;
  outline:1px solid rgba(255,255,255,.12);
}
html[data-theme="venator"] button:hover,
html[data-theme="venator"] .btn:hover,
html[data-theme="venator"] .btn-small:hover,
html[data-theme="venator"] .btn-main:hover,
html[data-theme="venator"] .action-pill:hover{
  filter:brightness(1.08);
  transform:translateY(-1px);
}

/* Section hierarchy */
html[data-theme="venator"] .section-label,
html[data-theme="venator"] .calc-category-head{
  background:#2d2b42 !important;
  border:0 !important;
  border-radius:5px !important;
  box-shadow:none !important;
  padding:20px !important;
  color:#fff !important;
  text-transform:none;
}
html[data-theme="venator"] .section-label::after{display:none;}
html[data-theme="venator"] .calc-category-head h2,
html[data-theme="venator"] .section-label{
  font-size:24px !important;
  font-weight:300 !important;
  letter-spacing:0 !important;
}
html[data-theme="venator"] .calc-category-head p{
  color:#e5e5e5 !important;
}

/* Text and tables */
html[data-theme="venator"] h1,
html[data-theme="venator"] h2,
html[data-theme="venator"] h3,
html[data-theme="venator"] h4,
html[data-theme="venator"] strong{
  color:#fff !important;
}
html[data-theme="venator"] p,
html[data-theme="venator"] li,
html[data-theme="venator"] span,
html[data-theme="venator"] .muted-copy,
html[data-theme="venator"] .card-title p,
html[data-theme="venator"] .calc-tile p,
html[data-theme="venator"] .home-card p,
html[data-theme="venator"] .command-category p,
html[data-theme="venator"] .rec span{
  color:#e5e5e5;
}
html[data-theme="venator"] table,
html[data-theme="venator"] .table-wrap,
html[data-theme="venator"] .data-table-wrap{
  background:#2d2b42 !important;
  border-radius:30px !important;
  border:0 !important;
}
html[data-theme="venator"] th{
  color:#fff !important;
  background:#222038 !important;
}
html[data-theme="venator"] td{
  color:#e5e5e5 !important;
  border-color:rgba(255,255,255,.08) !important;
}

/* Navbar/sidebar mobile from uploaded menu pattern */
html[data-theme="venator"] .sidebar{
  background-color:#0d0c22 !important;
}
html[data-theme="venator"] .mobile-menu-btn img,
html[data-theme="venator"] .menu-icon{
  content:url("venator-assets/menu.png");
}

/* Command strip adapted to uploaded app */
html[data-theme="venator"] .venator-command-strip{
  margin:0 0 2rem;
  gap:20px;
}
html[data-theme="venator"] .venator-command-strip a{
  background-color:#2d2b42 !important;
  background-image:none !important;
  border:0 !important;
  border-radius:30px !important;
  box-shadow:var(--venator-shadow) !important;
  opacity:.88;
}
html[data-theme="venator"] .venator-command-strip a:hover{
  opacity:1;
  border-color:#3673fd !important;
}
html[data-theme="venator"] .venator-command-strip span{
  color:#3673fd;
}

/* Decorative theme image from uploaded public/versus.png */
html[data-theme="venator"] .page-header{
  isolation:isolate;
}
html[data-theme="venator"] .page-header .venator-theme-art{
  position:absolute;
}
html[data-theme="venator"] .page-header:not(.no-theme-art){
  background-image:
    radial-gradient(circle at 12% 20%,rgba(54,115,253,.18),transparent 35%),
    url("venator-assets/versus.png") !important;
  background-repeat:no-repeat !important;
  background-position:calc(100% - 70px) 50% !important;
  background-size:min(420px,34vw) auto !important;
}

@keyframes venatorSpin{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
@keyframes venatorFloat{
  0%,100%{transform:translateY(-50%) scale(1);opacity:.76}
  50%{transform:translateY(calc(-50% - 16px)) scale(1.04);opacity:1}
}

@media(max-width:1536px){
  html[data-theme="venator"] .app-body,
  html[data-theme="venator"] .calc-shell,
  html[data-theme="venator"] .sim-shell,
  html[data-theme="venator"] .optimizer-shell,
  html[data-theme="venator"] .castle-shell,
  html[data-theme="venator"] .hub-shell,
  html[data-theme="venator"] .calendar-shell,
  html[data-theme="venator"] .changelog-shell,
  html[data-theme="venator"] .header-inner{max-width:1366px;}
}
@media(max-width:1280px){
  html[data-theme="venator"] .app-body,
  html[data-theme="venator"] .calc-shell,
  html[data-theme="venator"] .sim-shell,
  html[data-theme="venator"] .optimizer-shell,
  html[data-theme="venator"] .castle-shell,
  html[data-theme="venator"] .hub-shell,
  html[data-theme="venator"] .calendar-shell,
  html[data-theme="venator"] .changelog-shell,
  html[data-theme="venator"] .header-inner{
    max-width:1024px;
    padding-left:20px;
    padding-right:20px;
  }
}
@media(max-width:1024px){
  html[data-theme="venator"] .page-header{
    display:flex !important;
    flex-direction:column;
    text-align:center;
    min-height:auto;
    gap:50px;
  }
  html[data-theme="venator"] .page-header::before,
  html[data-theme="venator"] .page-header::after{
    display:none;
  }
  html[data-theme="venator"] .page-header p{
    margin-left:auto;
    margin-right:auto;
  }
  html[data-theme="venator"] .page-header:not(.no-theme-art){
    background-image:none !important;
  }
}
@media(max-width:768px){
  html[data-theme="venator"] .page-header h1{
    font-size:64px !important;
  }
  html[data-theme="venator"] .app-body,
  html[data-theme="venator"] .calc-shell,
  html[data-theme="venator"] .sim-shell,
  html[data-theme="venator"] .optimizer-shell,
  html[data-theme="venator"] .castle-shell,
  html[data-theme="venator"] .hub-shell,
  html[data-theme="venator"] .calendar-shell,
  html[data-theme="venator"] .changelog-shell,
  html[data-theme="venator"] .header-inner{
    padding-left:18px;
    padding-right:18px;
  }
}
@media(max-width:475px){
  html[data-theme="venator"] .page-header h1{
    font-size:48px !important;
  }
}


/* v4.27 uploaded theme hero buttons */
.venator-hero-buttons{
  display:flex;
  gap:20px;
  margin:-3.5rem 0 2.25rem;
  position:relative;
  z-index:4;
}
.venator-hero-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:120px;
  padding:20px;
  border:none;
  border-radius:5px;
  background:#2d2b42;
  color:#fff;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
}
.venator-hero-btn.primary{
  background:#3673fd;
}
.venator-hero-btn:hover{
  filter:brightness(1.08);
  transform:translateY(-1px);
}
html[data-theme="venator"] .venator-hero-buttons{
  margin:-4rem 0 2.25rem;
}
@media(max-width:1024px){
  .venator-hero-buttons{
    justify-content:center;
    margin:1rem 0 1.5rem;
  }
}
@media(max-width:520px){
  .venator-hero-buttons{
    flex-direction:column;
  }
}



/* v4.28 — Three Venator Theme System
   Themes kept: pink, fire, purple.
   Old named themes removed from theme-core; these are all Venator-layout variants.
*/
html[data-theme="pink"]{
  color-scheme:light;
  --bg:#fff7fb;
  --surface:#ffffff;
  --surface2:#fff0f6;
  --surface3:#f7dce9;
  --border:#ead0dc;
  --border-bright:#d6307a;
  --gold:#d6307a;
  --gold-dim:#a8205e;
  --amber:#ff70ad;
  --red:#d6307a;
  --green:#1ea96a;
  --blue:#d6307a;
  --text:#221820;
  --text-dim:#5e4d57;
  --text-muted:#86727d;
  --accent:#d6307a;
  --section-ink:#221820;
  --structure-grey:#5e4d57;
  --structure-grey-2:#86727d;
  --soft-grey-panel:#fff0f6;
  --soft-grey-line:#ead0dc;
  --venator-bg:#fff7fb;
  --venator-panel:#ffffff;
  --venator-panel-2:#fff0f6;
  --venator-line:#ead0dc;
  --venator-red:#d6307a;
  --venator-orange:#ff70ad;
  --venator-cream:#221820;
  --venator-muted:#5e4d57;
  --venator-shadow:rgba(214,48,122,.12) 0px 40px 90px -24px,rgba(44,24,36,.10) 0px 24px 48px -28px,rgba(214,48,122,.10) 0px -2px 6px 0px inset;
}
html[data-theme="fire"]{
  color-scheme:dark;
  --bg:#151313;
  --surface:#241f20;
  --surface2:#2f2929;
  --surface3:#3b3333;
  --border:#5f4e4d;
  --border-bright:#ff4b38;
  --gold:#ff4b38;
  --gold-dim:#b62b22;
  --amber:#ff9c4a;
  --red:#ff4b38;
  --green:#4ee08d;
  --blue:#ff6b58;
  --text:#fff4e8;
  --text-dim:#dcc8bd;
  --text-muted:#ad968c;
  --accent:#ff4b38;
  --section-ink:#fff4e8;
  --structure-grey:#dcc8bd;
  --structure-grey-2:#ad968c;
  --soft-grey-panel:#2f2929;
  --soft-grey-line:#5f4e4d;
  --venator-bg:#151313;
  --venator-panel:#241f20;
  --venator-panel-2:#2f2929;
  --venator-line:#5f4e4d;
  --venator-red:#ff4b38;
  --venator-orange:#ff9c4a;
  --venator-cream:#fff4e8;
  --venator-muted:#dcc8bd;
  --venator-shadow:rgba(0,0,0,.34) 0px 50px 100px -20px,rgba(0,0,0,.38) 0px 30px 60px -30px,rgba(255,75,56,.13) 0px -2px 8px 0px inset;
}
html[data-theme="purple"]{
  color-scheme:dark;
  --bg:#17151f;
  --surface:#262333;
  --surface2:#302c40;
  --surface3:#3d374f;
  --border:#554d68;
  --border-bright:#9b5cff;
  --gold:#b07cff;
  --gold-dim:#7c3aed;
  --amber:#d8b4fe;
  --red:#c084fc;
  --green:#63d39d;
  --blue:#9b5cff;
  --text:#faf6ff;
  --text-dim:#dacde8;
  --text-muted:#b5a4c7;
  --accent:#9b5cff;
  --section-ink:#faf6ff;
  --structure-grey:#dacde8;
  --structure-grey-2:#b5a4c7;
  --soft-grey-panel:#302c40;
  --soft-grey-line:#554d68;
  --venator-bg:#17151f;
  --venator-panel:#262333;
  --venator-panel-2:#302c40;
  --venator-line:#554d68;
  --venator-red:#9b5cff;
  --venator-orange:#d8b4fe;
  --venator-cream:#faf6ff;
  --venator-muted:#dacde8;
  --venator-shadow:rgba(0,0,0,.28) 0px 50px 100px -20px,rgba(0,0,0,.32) 0px 30px 60px -30px,rgba(155,92,255,.16) 0px -2px 8px 0px inset;
}

/* Base page background per new themes */
html[data-theme="pink"] body{
  background:
    radial-gradient(circle at 14% 10%,rgba(214,48,122,.16),transparent 35%),
    radial-gradient(circle at 84% 18%,rgba(255,112,173,.14),transparent 34%),
    linear-gradient(180deg,#fff7fb 0%,#fff1f7 100%) !important;
  color:var(--text) !important;
}
html[data-theme="fire"] body{
  background:
    radial-gradient(circle at 16% 10%,rgba(255,75,56,.22),transparent 35%),
    radial-gradient(circle at 82% 18%,rgba(255,156,74,.13),transparent 32%),
    radial-gradient(circle at 50% 100%,rgba(255,75,56,.13),transparent 44%),
    #151313 !important;
  color:var(--text) !important;
}
html[data-theme="purple"] body{
  background:
    radial-gradient(circle at 16% 10%,rgba(155,92,255,.22),transparent 35%),
    radial-gradient(circle at 82% 18%,rgba(216,180,254,.12),transparent 32%),
    radial-gradient(circle at 50% 100%,rgba(80,65,110,.22),transparent 44%),
    #17151f !important;
  color:var(--text) !important;
}

/* Apply same Venator layout across all three themes */
html[data-theme="pink"] .app-body,
html[data-theme="fire"] .app-body,
html[data-theme="purple"] .app-body,
html[data-theme="pink"] .calc-shell,
html[data-theme="fire"] .calc-shell,
html[data-theme="purple"] .calc-shell,
html[data-theme="pink"] .sim-shell,
html[data-theme="fire"] .sim-shell,
html[data-theme="purple"] .sim-shell,
html[data-theme="pink"] .optimizer-shell,
html[data-theme="fire"] .optimizer-shell,
html[data-theme="purple"] .optimizer-shell,
html[data-theme="pink"] .castle-shell,
html[data-theme="fire"] .castle-shell,
html[data-theme="purple"] .castle-shell,
html[data-theme="pink"] .hub-shell,
html[data-theme="fire"] .hub-shell,
html[data-theme="purple"] .hub-shell,
html[data-theme="pink"] .calendar-shell,
html[data-theme="fire"] .calendar-shell,
html[data-theme="purple"] .calendar-shell,
html[data-theme="pink"] .changelog-shell,
html[data-theme="fire"] .changelog-shell,
html[data-theme="purple"] .changelog-shell{
  max-width:1536px;
  margin-left:auto;
  margin-right:auto;
  padding-left:50px;
  padding-right:50px;
}

/* Header/nav */
html[data-theme="pink"] header,
html[data-theme="fire"] header,
html[data-theme="purple"] header{
  height:100px;
  background:color-mix(in srgb, var(--bg) 88%, transparent) !important;
  border-bottom:1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  box-shadow:none !important;
  backdrop-filter:blur(18px);
}
html[data-theme="pink"] .header-inner,
html[data-theme="fire"] .header-inner,
html[data-theme="purple"] .header-inner{
  max-width:1536px;
  min-height:100px;
  padding-left:50px;
  padding-right:50px;
}
html[data-theme="pink"] .logo,
html[data-theme="fire"] .logo,
html[data-theme="purple"] .logo{
  font-size:30px;
  font-weight:800;
  color:var(--text) !important;
  letter-spacing:.02em;
  text-transform:none;
}
html[data-theme="pink"] .logo span,
html[data-theme="fire"] .logo span,
html[data-theme="purple"] .logo span{
  color:var(--text-dim) !important;
  letter-spacing:.08em;
}
html[data-theme="pink"] .top-nav,
html[data-theme="fire"] .top-nav,
html[data-theme="purple"] .top-nav{
  background:transparent !important;
  border:0 !important;
  gap:10px;
  padding:0;
}
html[data-theme="pink"] .top-nav a,
html[data-theme="fire"] .top-nav a,
html[data-theme="purple"] .top-nav a,
html[data-theme="pink"] .header-back,
html[data-theme="fire"] .header-back,
html[data-theme="purple"] .header-back,
html[data-theme="pink"] .theme-toggle,
html[data-theme="fire"] .theme-toggle,
html[data-theme="purple"] .theme-toggle{
  min-width:100px;
  padding:10px 14px !important;
  border-radius:20px !important;
  border:1px solid transparent !important;
  font-weight:600;
  font-family:'DM Sans',sans-serif;
  text-align:center;
  background:transparent !important;
  color:var(--text) !important;
}
html[data-theme="pink"] .top-nav a:hover,
html[data-theme="fire"] .top-nav a:hover,
html[data-theme="purple"] .top-nav a:hover,
html[data-theme="pink"] .top-nav a.active,
html[data-theme="fire"] .top-nav a.active,
html[data-theme="purple"] .top-nav a.active,
html[data-theme="pink"] .header-back:hover,
html[data-theme="fire"] .header-back:hover,
html[data-theme="purple"] .header-back:hover,
html[data-theme="pink"] .theme-toggle:hover,
html[data-theme="fire"] .theme-toggle:hover,
html[data-theme="purple"] .theme-toggle:hover{
  background:var(--text) !important;
  color:var(--bg) !important;
  border-color:var(--text) !important;
}

/* Hero */
html[data-theme="pink"] .page-header,
html[data-theme="fire"] .page-header,
html[data-theme="purple"] .page-header{
  min-height:calc(100vh - 170px);
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);
  align-items:center;
  gap:100px;
  padding:50px 0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:visible;
}
html[data-theme="pink"] .page-header::before,
html[data-theme="fire"] .page-header::before,
html[data-theme="purple"] .page-header::before{
  content:"";
  position:relative;
  grid-column:2;
  grid-row:1 / span 3;
  width:min(520px,38vw);
  height:min(520px,38vw);
  justify-self:center;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,color-mix(in srgb, var(--gold) 8%, transparent) 0 36%,transparent 37%),
    conic-gradient(from 0deg,color-mix(in srgb, var(--green) 14%, transparent),var(--gold),color-mix(in srgb, var(--text) 13%, transparent),var(--gold),color-mix(in srgb, var(--green) 14%, transparent));
  mask:radial-gradient(circle,transparent 0 41%,#000 42% 47%,transparent 48% 55%,#000 56% 61%,transparent 62%);
  animation:venatorSpin 18s linear infinite;
  filter:drop-shadow(0 0 55px color-mix(in srgb, var(--gold) 24%, transparent));
  opacity:1;
  pointer-events:none;
  z-index:0;
}
html[data-theme="pink"] .page-header:not(.no-theme-art),
html[data-theme="fire"] .page-header:not(.no-theme-art),
html[data-theme="purple"] .page-header:not(.no-theme-art){
  background-image:
    radial-gradient(circle at 12% 20%,color-mix(in srgb, var(--gold) 16%, transparent),transparent 35%),
    url("venator-assets/versus.png") !important;
  background-repeat:no-repeat !important;
  background-position:calc(100% - 70px) 50% !important;
  background-size:min(420px,34vw) auto !important;
}
html[data-theme="pink"] .page-header h1,
html[data-theme="fire"] .page-header h1,
html[data-theme="purple"] .page-header h1{
  grid-column:1;
  font-size:76.8px !important;
  line-height:1.02 !important;
  max-width:760px;
  color:var(--text) !important;
  text-transform:none !important;
  letter-spacing:-.04em !important;
  text-shadow:none !important;
}
html[data-theme="pink"] .page-header h1::before,
html[data-theme="fire"] .page-header h1::before,
html[data-theme="purple"] .page-header h1::before{
  content:"Statistics for your alliance.";
  display:block;
  margin-bottom:24px;
  font-size:16px;
  font-family:'DM Mono',monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold);
}
html[data-theme="pink"] .page-header p,
html[data-theme="fire"] .page-header p,
html[data-theme="purple"] .page-header p{
  grid-column:1;
  max-width:620px;
  margin:0;
  padding:0;
  border:0;
  color:var(--text-dim) !important;
  font-size:16px !important;
  line-height:1.7 !important;
}

/* Cards/panels */
html[data-theme="pink"] .home-card,
html[data-theme="fire"] .home-card,
html[data-theme="purple"] .home-card,
html[data-theme="pink"] .command-category,
html[data-theme="fire"] .command-category,
html[data-theme="purple"] .command-category,
html[data-theme="pink"] .qr-card,
html[data-theme="fire"] .qr-card,
html[data-theme="purple"] .qr-card,
html[data-theme="pink"] .calc-tile,
html[data-theme="fire"] .calc-tile,
html[data-theme="purple"] .calc-tile,
html[data-theme="pink"] .calc-card,
html[data-theme="fire"] .calc-card,
html[data-theme="purple"] .calc-card,
html[data-theme="pink"] .tool-card,
html[data-theme="fire"] .tool-card,
html[data-theme="purple"] .tool-card,
html[data-theme="pink"] .sim-card,
html[data-theme="fire"] .sim-card,
html[data-theme="purple"] .sim-card,
html[data-theme="pink"] .sim-panel,
html[data-theme="fire"] .sim-panel,
html[data-theme="purple"] .sim-panel,
html[data-theme="pink"] .opt-card,
html[data-theme="fire"] .opt-card,
html[data-theme="purple"] .opt-card,
html[data-theme="pink"] .opt-panel,
html[data-theme="fire"] .opt-panel,
html[data-theme="purple"] .opt-panel,
html[data-theme="pink"] .today-card,
html[data-theme="fire"] .today-card,
html[data-theme="purple"] .today-card,
html[data-theme="pink"] .today-pack-card,
html[data-theme="fire"] .today-pack-card,
html[data-theme="purple"] .today-pack-card,
html[data-theme="pink"] .calendar-control-panel,
html[data-theme="fire"] .calendar-control-panel,
html[data-theme="purple"] .calendar-control-panel,
html[data-theme="pink"] .changelog-entry,
html[data-theme="fire"] .changelog-entry,
html[data-theme="purple"] .changelog-entry,
html[data-theme="pink"] .alert,
html[data-theme="fire"] .alert,
html[data-theme="purple"] .alert,
html[data-theme="pink"] .k1245-panel,
html[data-theme="fire"] .k1245-panel,
html[data-theme="purple"] .k1245-panel,
html[data-theme="pink"] .info-box,
html[data-theme="fire"] .info-box,
html[data-theme="purple"] .info-box{
  background-color:var(--surface) !important;
  background-image:none !important;
  border:1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  border-radius:30px !important;
  box-shadow:var(--venator-shadow) !important;
  opacity:.92;
  color:var(--text) !important;
}
html[data-theme="pink"] .home-card:hover,
html[data-theme="fire"] .home-card:hover,
html[data-theme="purple"] .home-card:hover,
html[data-theme="pink"] .command-category:hover,
html[data-theme="fire"] .command-category:hover,
html[data-theme="purple"] .command-category:hover,
html[data-theme="pink"] .qr-card:hover,
html[data-theme="fire"] .qr-card:hover,
html[data-theme="purple"] .qr-card:hover,
html[data-theme="pink"] .calc-tile:hover,
html[data-theme="fire"] .calc-tile:hover,
html[data-theme="purple"] .calc-tile:hover{
  opacity:1;
  transform:translateY(-5px);
  border-color:var(--gold) !important;
}

/* Forms/buttons */
html[data-theme="pink"] input,
html[data-theme="fire"] input,
html[data-theme="purple"] input,
html[data-theme="pink"] textarea,
html[data-theme="fire"] textarea,
html[data-theme="purple"] textarea,
html[data-theme="pink"] select,
html[data-theme="fire"] select,
html[data-theme="purple"] select,
html[data-theme="pink"] .input,
html[data-theme="fire"] .input,
html[data-theme="purple"] .input,
html[data-theme="pink"] .select,
html[data-theme="fire"] .select,
html[data-theme="purple"] .select,
html[data-theme="pink"] #chat-input,
html[data-theme="fire"] #chat-input,
html[data-theme="purple"] #chat-input{
  padding:20px !important;
  background-color:var(--bg) !important;
  border:none !important;
  border-radius:5px !important;
  color:var(--text) !important;
  outline:1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
html[data-theme="pink"] input:focus,
html[data-theme="fire"] input:focus,
html[data-theme="purple"] input:focus,
html[data-theme="pink"] textarea:focus,
html[data-theme="fire"] textarea:focus,
html[data-theme="purple"] textarea:focus,
html[data-theme="pink"] select:focus,
html[data-theme="fire"] select:focus,
html[data-theme="purple"] select:focus{
  outline:2px solid var(--gold) !important;
  box-shadow:none !important;
}
html[data-theme="pink"] option,
html[data-theme="fire"] option,
html[data-theme="purple"] option{
  background:var(--bg) !important;
  color:var(--text) !important;
}

html[data-theme="pink"] button,
html[data-theme="fire"] button,
html[data-theme="purple"] button,
html[data-theme="pink"] .btn,
html[data-theme="fire"] .btn,
html[data-theme="purple"] .btn,
html[data-theme="pink"] .btn-small,
html[data-theme="fire"] .btn-small,
html[data-theme="purple"] .btn-small,
html[data-theme="pink"] .btn-main,
html[data-theme="fire"] .btn-main,
html[data-theme="purple"] .btn-main,
html[data-theme="pink"] .primary-btn,
html[data-theme="fire"] .primary-btn,
html[data-theme="purple"] .primary-btn,
html[data-theme="pink"] .action-pill,
html[data-theme="fire"] .action-pill,
html[data-theme="purple"] .action-pill,
html[data-theme="pink"] .copy-btn,
html[data-theme="fire"] .copy-btn,
html[data-theme="purple"] .copy-btn,
html[data-theme="pink"] .sug-btn,
html[data-theme="fire"] .sug-btn,
html[data-theme="purple"] .sug-btn{
  border:none !important;
  border-radius:5px !important;
  padding:14px 20px !important;
  cursor:pointer;
  background-color:var(--gold) !important;
  color:#fff !important;
  font-weight:700;
  box-shadow:none !important;
}
html[data-theme="pink"] .btn-small,
html[data-theme="fire"] .btn-small,
html[data-theme="purple"] .btn-small,
html[data-theme="pink"] .sug-btn,
html[data-theme="fire"] .sug-btn,
html[data-theme="purple"] .sug-btn{
  background-color:var(--surface2) !important;
  color:var(--text) !important;
  outline:1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

/* Headings/text/sections */
html[data-theme="pink"] .section-label,
html[data-theme="fire"] .section-label,
html[data-theme="purple"] .section-label,
html[data-theme="pink"] .calc-category-head,
html[data-theme="fire"] .calc-category-head,
html[data-theme="purple"] .calc-category-head{
  background:var(--surface) !important;
  border:0 !important;
  border-radius:5px !important;
  box-shadow:none !important;
  padding:20px !important;
  color:var(--text) !important;
  text-transform:none;
}
html[data-theme="pink"] .section-label::after,
html[data-theme="fire"] .section-label::after,
html[data-theme="purple"] .section-label::after{display:none;}
html[data-theme="pink"] h1,
html[data-theme="fire"] h1,
html[data-theme="purple"] h1,
html[data-theme="pink"] h2,
html[data-theme="fire"] h2,
html[data-theme="purple"] h2,
html[data-theme="pink"] h3,
html[data-theme="fire"] h3,
html[data-theme="purple"] h3,
html[data-theme="pink"] h4,
html[data-theme="fire"] h4,
html[data-theme="purple"] h4,
html[data-theme="pink"] strong,
html[data-theme="fire"] strong,
html[data-theme="purple"] strong{
  color:var(--text) !important;
}
html[data-theme="pink"] p,
html[data-theme="fire"] p,
html[data-theme="purple"] p,
html[data-theme="pink"] li,
html[data-theme="fire"] li,
html[data-theme="purple"] li,
html[data-theme="pink"] span,
html[data-theme="fire"] span,
html[data-theme="purple"] span,
html[data-theme="pink"] .muted-copy,
html[data-theme="fire"] .muted-copy,
html[data-theme="purple"] .muted-copy,
html[data-theme="pink"] .card-title p,
html[data-theme="fire"] .card-title p,
html[data-theme="purple"] .card-title p,
html[data-theme="pink"] .calc-tile p,
html[data-theme="fire"] .calc-tile p,
html[data-theme="purple"] .calc-tile p,
html[data-theme="pink"] .home-card p,
html[data-theme="fire"] .home-card p,
html[data-theme="purple"] .home-card p{
  color:var(--text-dim);
}

/* Tables */
html[data-theme="pink"] table,
html[data-theme="fire"] table,
html[data-theme="purple"] table,
html[data-theme="pink"] .table-wrap,
html[data-theme="fire"] .table-wrap,
html[data-theme="purple"] .table-wrap,
html[data-theme="pink"] .data-table-wrap,
html[data-theme="fire"] .data-table-wrap,
html[data-theme="purple"] .data-table-wrap{
  background:var(--surface) !important;
  border-radius:30px !important;
  border:0 !important;
}
html[data-theme="pink"] th,
html[data-theme="fire"] th,
html[data-theme="purple"] th{
  color:var(--text) !important;
  background:var(--surface2) !important;
}
html[data-theme="pink"] td,
html[data-theme="fire"] td,
html[data-theme="purple"] td{
  color:var(--text-dim) !important;
  border-color:color-mix(in srgb, var(--border) 50%, transparent) !important;
}

/* Command strip and hero buttons */
html[data-theme="pink"] .venator-command-strip a,
html[data-theme="fire"] .venator-command-strip a,
html[data-theme="purple"] .venator-command-strip a{
  background:var(--surface) !important;
  background-image:none !important;
  border:0 !important;
  border-radius:30px !important;
  box-shadow:var(--venator-shadow) !important;
  opacity:.92;
}
html[data-theme="pink"] .venator-command-strip span,
html[data-theme="fire"] .venator-command-strip span,
html[data-theme="purple"] .venator-command-strip span{
  color:var(--gold);
}
html[data-theme="pink"] .venator-hero-btn,
html[data-theme="fire"] .venator-hero-btn,
html[data-theme="purple"] .venator-hero-btn{
  background:var(--surface) !important;
  color:var(--text) !important;
}
html[data-theme="pink"] .venator-hero-btn.primary,
html[data-theme="fire"] .venator-hero-btn.primary,
html[data-theme="purple"] .venator-hero-btn.primary{
  background:var(--gold) !important;
  color:#fff !important;
}

/* Sidebar and assistant */
html[data-theme="pink"] .sidebar,
html[data-theme="fire"] .sidebar,
html[data-theme="purple"] .sidebar,
html[data-theme="pink"] .chat-box,
html[data-theme="fire"] .chat-box,
html[data-theme="purple"] .chat-box,
html[data-theme="pink"] #fam-chat,
html[data-theme="fire"] #fam-chat,
html[data-theme="purple"] #fam-chat{
  background:var(--bg) !important;
  border-color:var(--border) !important;
}
html[data-theme="pink"] .msg-bot,
html[data-theme="fire"] .msg-bot,
html[data-theme="purple"] .msg-bot{
  background:var(--surface) !important;
  color:var(--text) !important;
}
html[data-theme="pink"] .msg-user,
html[data-theme="fire"] .msg-user,
html[data-theme="purple"] .msg-user{
  background:var(--gold) !important;
  color:#fff !important;
}

@media(max-width:1536px){
  html[data-theme="pink"] .app-body, html[data-theme="fire"] .app-body, html[data-theme="purple"] .app-body,
  html[data-theme="pink"] .calc-shell, html[data-theme="fire"] .calc-shell, html[data-theme="purple"] .calc-shell,
  html[data-theme="pink"] .sim-shell, html[data-theme="fire"] .sim-shell, html[data-theme="purple"] .sim-shell,
  html[data-theme="pink"] .optimizer-shell, html[data-theme="fire"] .optimizer-shell, html[data-theme="purple"] .optimizer-shell,
  html[data-theme="pink"] .castle-shell, html[data-theme="fire"] .castle-shell, html[data-theme="purple"] .castle-shell,
  html[data-theme="pink"] .hub-shell, html[data-theme="fire"] .hub-shell, html[data-theme="purple"] .hub-shell,
  html[data-theme="pink"] .calendar-shell, html[data-theme="fire"] .calendar-shell, html[data-theme="purple"] .calendar-shell,
  html[data-theme="pink"] .changelog-shell, html[data-theme="fire"] .changelog-shell, html[data-theme="purple"] .changelog-shell,
  html[data-theme="pink"] .header-inner, html[data-theme="fire"] .header-inner, html[data-theme="purple"] .header-inner{max-width:1366px;}
}
@media(max-width:1280px){
  html[data-theme="pink"] .app-body, html[data-theme="fire"] .app-body, html[data-theme="purple"] .app-body,
  html[data-theme="pink"] .calc-shell, html[data-theme="fire"] .calc-shell, html[data-theme="purple"] .calc-shell,
  html[data-theme="pink"] .sim-shell, html[data-theme="fire"] .sim-shell, html[data-theme="purple"] .sim-shell,
  html[data-theme="pink"] .optimizer-shell, html[data-theme="fire"] .optimizer-shell, html[data-theme="purple"] .optimizer-shell,
  html[data-theme="pink"] .castle-shell, html[data-theme="fire"] .castle-shell, html[data-theme="purple"] .castle-shell,
  html[data-theme="pink"] .hub-shell, html[data-theme="fire"] .hub-shell, html[data-theme="purple"] .hub-shell,
  html[data-theme="pink"] .calendar-shell, html[data-theme="fire"] .calendar-shell, html[data-theme="purple"] .calendar-shell,
  html[data-theme="pink"] .changelog-shell, html[data-theme="fire"] .changelog-shell, html[data-theme="purple"] .changelog-shell,
  html[data-theme="pink"] .header-inner, html[data-theme="fire"] .header-inner, html[data-theme="purple"] .header-inner{
    max-width:1024px;
    padding-left:20px;
    padding-right:20px;
  }
}
@media(max-width:1024px){
  html[data-theme="pink"] .page-header,
  html[data-theme="fire"] .page-header,
  html[data-theme="purple"] .page-header{
    display:flex !important;
    flex-direction:column;
    text-align:center;
    min-height:auto;
    gap:50px;
  }
  html[data-theme="pink"] .page-header::before,
  html[data-theme="fire"] .page-header::before,
  html[data-theme="purple"] .page-header::before{
    display:none;
  }
  html[data-theme="pink"] .page-header:not(.no-theme-art),
  html[data-theme="fire"] .page-header:not(.no-theme-art),
  html[data-theme="purple"] .page-header:not(.no-theme-art){
    background-image:none !important;
  }
  html[data-theme="pink"] .page-header p,
  html[data-theme="fire"] .page-header p,
  html[data-theme="purple"] .page-header p{
    margin-left:auto;
    margin-right:auto;
  }
}
@media(max-width:768px){
  html[data-theme="pink"] .page-header h1,
  html[data-theme="fire"] .page-header h1,
  html[data-theme="purple"] .page-header h1{
    font-size:64px !important;
  }
}
@media(max-width:475px){
  html[data-theme="pink"] .page-header h1,
  html[data-theme="fire"] .page-header h1,
  html[data-theme="purple"] .page-header h1{
    font-size:48px !important;
  }
}



/* v4.29 — Venator framed homepage image + hero spacing fix */
.hero-banner{
  position:relative !important;
  margin-top:24px !important;
  margin-right:24px !important;
  margin-bottom:0 !important;
  margin-left:calc(var(--sidebar-w) + 24px) !important;
  width:calc(100% - var(--sidebar-w) - 48px) !important;
  height:clamp(420px,42vw,720px) !important;
  padding:16px !important;
  border-radius:28px !important;
  overflow:visible !important;
  background:linear-gradient(180deg,#ffffff,#f2eef2) !important;
  border:1px solid rgba(255,255,255,.65) !important;
  box-shadow:
    0 35px 90px rgba(0,0,0,.28),
    0 0 0 1px rgba(0,0,0,.08) inset !important;
  isolation:isolate;
}
body.sidebar-collapsed .hero-banner{
  margin-left:24px !important;
  width:calc(100% - 48px) !important;
}
.hero-banner::before{
  content:"" !important;
  position:absolute !important;
  inset:16px !important;
  z-index:0 !important;
  pointer-events:none !important;
  background:
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.18)),
    radial-gradient(circle at 50% 92%,rgba(0,0,0,.32),transparent 45%) !important;
  opacity:1 !important;
  filter:none !important;
  transform:none !important;
  clip-path:polygon(
    0 0,
    43% 0,
    46% 8%,
    54% 8%,
    57% 0,
    100% 0,
    100% 86%,
    88% 86%,
    85% 100%,
    15% 100%,
    12% 86%,
    0 86%
  );
}
.hero-picture{
  position:relative !important;
  z-index:1 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
  background:#111 !important;
  border-radius:10px !important;
  clip-path:polygon(
    0 0,
    43% 0,
    46% 8%,
    54% 8%,
    57% 0,
    100% 0,
    100% 86%,
    88% 86%,
    85% 100%,
    15% 100%,
    12% 86%,
    0 86%
  ) !important;
}
.hero-img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center 28% !important;
  opacity:1 !important;
  filter:saturate(1.08) contrast(1.04) brightness(.92) !important;
  transform:scale(1.01);
}
.hero-banner::after{
  content:"" !important;
  position:absolute !important;
  inset:16px !important;
  z-index:2 !important;
  pointer-events:none !important;
  height:auto !important;
  background:
    linear-gradient(180deg,transparent 58%,rgba(0,0,0,.50) 100%),
    linear-gradient(90deg,rgba(255,255,255,.10),transparent 18%,transparent 82%,rgba(255,255,255,.10)) !important;
  clip-path:polygon(
    0 0,
    43% 0,
    46% 8%,
    54% 8%,
    57% 0,
    100% 0,
    100% 86%,
    88% 86%,
    85% 100%,
    15% 100%,
    12% 86%,
    0 86%
  );
  animation:none !important;
  box-shadow:none !important;
}
.hero-strip{
  margin-left:calc(var(--sidebar-w) + 24px) !important;
  width:calc(100% - var(--sidebar-w) - 48px) !important;
  padding:1.15rem 1rem 1.25rem !important;
  border:1px solid color-mix(in srgb,var(--border) 70%,transparent) !important;
  border-top:0 !important;
  border-radius:0 0 24px 24px !important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 72%,transparent),var(--bg)) !important;
  box-shadow:0 18px 50px rgba(0,0,0,.10);
}
body.sidebar-collapsed .hero-strip{
  margin-left:24px !important;
  width:calc(100% - 48px) !important;
}
.venator-hero-buttons{
  margin:2rem auto 1.2rem !important;
  justify-content:center !important;
  align-items:center !important;
  position:relative !important;
  z-index:3 !important;
  clear:both !important;
}
.venator-command-strip{
  margin:0 auto 1.6rem !important;
  position:relative !important;
  z-index:2 !important;
}
html[data-theme="pink"] .hero-banner{
  background:linear-gradient(180deg,#ffffff,#f5eaf0) !important;
}
html[data-theme="fire"] .hero-banner{
  background:linear-gradient(180deg,#f4f0ec,#bbb0ad) !important;
  box-shadow:0 35px 90px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.08) inset !important;
}
html[data-theme="purple"] .hero-banner{
  background:linear-gradient(180deg,#f4efff,#c7bed6) !important;
  box-shadow:0 35px 90px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.08) inset !important;
}
@media(max-width:1024px){
  .hero-banner{
    margin:18px 14px 0 !important;
    width:calc(100% - 28px) !important;
    height:clamp(360px,56vw,560px) !important;
    padding:12px !important;
    border-radius:22px !important;
  }
  .hero-banner::before,
  .hero-banner::after{
    inset:12px !important;
  }
  .hero-strip{
    margin-left:14px !important;
    width:calc(100% - 28px) !important;
  }
  .hero-picture{
    clip-path:polygon(0 0,42% 0,46% 7%,54% 7%,58% 0,100% 0,100% 88%,86% 88%,83% 100%,17% 100%,14% 88%,0 88%) !important;
  }
}
@media(max-width:699px){
  .hero-banner{
    height:360px !important;
  }
  .hero-img{
    object-position:center 20% !important;
  }
}
@media(max-width:480px){
  .hero-banner{
    height:310px !important;
    padding:9px !important;
    border-radius:18px !important;
  }
  .hero-banner::before,
  .hero-banner::after{
    inset:9px !important;
  }
  .hero-strip{
    padding:.9rem .75rem 1rem !important;
  }
  .venator-hero-buttons{
    margin:1.4rem auto 1rem !important;
  }
}



/* v4.30 — Mobile header/sidebar optimization + theme guide */
:root{
  --mobile-header-h:64px;
}

/* Better top bar scaling so all controls remain reachable */
@media(max-width:1280px){
  .header-inner{
    padding:0 .9rem !important;
    gap:.65rem !important;
  }
  .logo{
    width:auto !important;
    min-width:170px;
    max-width:240px;
    padding-right:.5rem !important;
    font-size:.9rem !important;
  }
  .logo span{
    font-size:.52rem !important;
    letter-spacing:.12em !important;
  }
  .top-nav{
    display:none !important;
  }
  .header-center{
    min-width:0;
    flex:1 1 auto;
  }
  .header-search-btn{
    min-width:0;
    max-width:none !important;
    flex:1 1 auto;
  }
  .header-right{
    flex:0 0 auto;
    gap:.45rem !important;
  }
  .theme-toggle{
    min-width:84px !important;
    white-space:nowrap;
  }
}
@media(max-width:760px){
  header{
    height:var(--mobile-header-h) !important;
    min-height:var(--mobile-header-h) !important;
  }
  .header-inner{
    min-height:var(--mobile-header-h) !important;
    padding:0 .6rem !important;
    gap:.45rem !important;
  }
  .logo{
    min-width:0 !important;
    max-width:44vw !important;
    width:auto !important;
    font-size:.78rem !important;
    letter-spacing:.06em !important;
    line-height:1.08 !important;
    padding-right:0 !important;
  }
  .logo span{
    display:block !important;
    max-width:42vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.46rem !important;
    letter-spacing:.08em !important;
    margin-top:3px !important;
  }
  .header-center{
    flex:1 1 auto !important;
    min-width:0 !important;
    justify-content:flex-end;
  }
  .header-search-btn{
    flex:0 0 42px !important;
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    padding:0 !important;
    justify-content:center !important;
    border-radius:14px !important;
  }
  .header-search-btn p,
  .header-search-btn kbd{
    display:none !important;
  }
  .header-search-btn .icon{
    font-size:1rem !important;
  }
  .header-right{
    gap:.35rem !important;
    align-items:center !important;
  }
  #google_translate_element{
    display:none !important;
  }
  .theme-toggle{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    padding:0 !important;
    border-radius:14px !important;
    justify-content:center !important;
    overflow:hidden;
  }
  .theme-toggle [data-theme-label]{
    position:absolute;
    width:1px;
    height:1px;
    clip:rect(0 0 0 0);
    overflow:hidden;
  }
  .theme-toggle [data-theme-icon]{
    font-size:1rem;
  }
  .sidebar-toggle{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    padding:0 !important;
    border-radius:14px !important;
  }
  .hamburger-icon{
    font-size:1rem !important;
  }
}

/* Mobile sidebar must show every option and scroll cleanly */
@media(max-width:1024px){
  .sidebar{
    position:fixed !important;
    top:var(--mobile-header-h) !important;
    left:0 !important;
    bottom:0 !important;
    height:calc(100dvh - var(--mobile-header-h)) !important;
    width:min(86vw,340px) !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    padding-bottom:calc(2rem + env(safe-area-inset-bottom)) !important;
    z-index:500 !important;
    transform:translateX(-105%) !important;
  }
  body.sidebar-open .sidebar{
    transform:translateX(0) !important;
  }
  body.sidebar-open .sidebar-backdrop{
    opacity:1 !important;
    visibility:visible !important;
    z-index:450 !important;
  }
  .sidebar nav{
    display:flex !important;
    flex-direction:column !important;
    gap:.28rem !important;
  }
  .sidebar a{
    min-height:42px !important;
    display:flex !important;
    align-items:center !important;
    padding:.68rem .85rem !important;
    font-size:.82rem !important;
  }
  .sidebar .nav-section-label{
    position:sticky;
    top:0;
    z-index:2;
    background:var(--bg);
    padding-top:.75rem !important;
    padding-bottom:.35rem !important;
  }
  main,
  footer,
  .hero-banner,
  .hero-strip{
    margin-left:0 !important;
    width:100% !important;
  }
}

/* Fix misplaced hero/button/card spacing on mobile */
@media(max-width:760px){
  .app-body{
    padding-top:var(--mobile-header-h) !important;
  }
  .hero-banner{
    margin-top:14px !important;
  }
  .page-header{
    margin-top:1rem !important;
    min-height:auto !important;
    padding-top:1.4rem !important;
    padding-bottom:1.4rem !important;
  }
  .page-header h1{
    font-size:clamp(2.65rem,14vw,4.1rem) !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }
  .page-header p{
    font-size:.86rem !important;
  }
  .venator-hero-buttons{
    width:100%;
    max-width:360px;
    margin:1.15rem auto .9rem !important;
    gap:.65rem !important;
  }
  .venator-hero-btn{
    flex:1 1 0;
    min-width:0 !important;
    padding:.92rem .75rem !important;
    text-align:center;
  }
  .venator-command-strip{
    grid-template-columns:1fr !important;
    gap:.65rem !important;
    margin:.85rem 0 1.15rem !important;
  }
  .venator-command-strip a{
    min-height:78px !important;
  }
  .section-label{
    margin-top:1.35rem !important;
  }
  .home-grid,
  .command-grid,
  .qr-grid,
  .calc-grid,
  .metric-grid,
  .opt-grid,
  .input-grid{
    grid-template-columns:1fr !important;
  }
}

/* First visit theme guide */
.theme-guide-popover{
  position:fixed;
  top:78px;
  right:1rem;
  z-index:900;
  width:min(330px,calc(100vw - 2rem));
  padding:1rem;
  border-radius:18px;
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--border);
  box-shadow:0 24px 70px rgba(0,0,0,.22);
  animation:themeGuideIn .36s cubic-bezier(.2,.8,.2,1) both;
}
.theme-guide-popover::before{
  content:"";
  position:absolute;
  top:-9px;
  right:74px;
  width:18px;
  height:18px;
  transform:rotate(45deg);
  background:var(--surface);
  border-left:1px solid var(--border);
  border-top:1px solid var(--border);
}
.theme-guide-popover strong{
  display:block;
  font-family:'Orbitron',sans-serif;
  font-size:.86rem;
  letter-spacing:.04em;
  margin-bottom:.35rem;
  color:var(--text);
}
.theme-guide-popover p{
  margin:0 0 .75rem;
  color:var(--text-dim);
  font-size:.82rem;
  line-height:1.45;
}
.theme-guide-actions{
  display:flex;
  gap:.5rem;
}
.theme-guide-actions button{
  flex:1;
  min-height:38px;
  border-radius:12px !important;
  padding:.55rem .7rem !important;
  font-size:.72rem;
}
.theme-guide-dismiss{
  background:var(--surface2) !important;
  color:var(--text) !important;
}
.theme-guide-highlight{
  position:relative;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--gold) 24%, transparent),0 0 22px color-mix(in srgb,var(--gold) 34%, transparent) !important;
}
@keyframes themeGuideIn{
  from{opacity:0;transform:translateY(-10px) scale(.97)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@media(max-width:760px){
  .theme-guide-popover{
    top:calc(var(--mobile-header-h) + .6rem);
    right:.6rem;
    left:.6rem;
    width:auto;
  }
  .theme-guide-popover::before{
    right:74px;
  }
}

/* Theme-specific polish fixes */
html[data-theme="pink"] header,
html[data-theme="pink"] .sidebar{
  background:rgba(255,247,251,.96) !important;
}
html[data-theme="pink"] .theme-guide-popover{
  background:#fff;
}
html[data-theme="fire"] .theme-guide-popover,
html[data-theme="purple"] .theme-guide-popover{
  background:var(--surface);
}
html[data-theme="fire"] .sidebar .nav-section-label,
html[data-theme="purple"] .sidebar .nav-section-label{
  background:var(--bg);
}



/* v4.31 — Remove homepage stat headline block and normalize spacing */
#page-home > main{
  padding-top:1rem;
}
#page-home > main .venator-hero-buttons{
  margin:1.25rem auto 1rem !important;
}
#page-home > main .venator-command-strip{
  margin:0 auto 1.35rem !important;
}
#page-home > main .section-label:first-of-type{
  margin-top:1.1rem !important;
}
@media(max-width:760px){
  #page-home > main{
    padding-top:.6rem;
  }
  #page-home > main .venator-hero-buttons{
    margin:.95rem auto .85rem !important;
  }
  #page-home > main .venator-command-strip{
    margin:0 auto 1rem !important;
  }
}



/* v4.31 — Remove homepage statistics headline text */
#page-home > main{
  padding-top:1rem;
}
#page-home > main .venator-hero-buttons{
  margin:1.25rem auto 1rem !important;
}
#page-home > main .venator-command-strip{
  margin:0 auto 1.35rem !important;
}
@media(max-width:760px){
  #page-home > main{
    padding-top:.6rem;
  }
  #page-home > main .venator-hero-buttons{
    margin:.95rem auto .85rem !important;
  }
  #page-home > main .venator-command-strip{
    margin:0 auto 1rem !important;
  }
}



/* v4.32 — Calculator + theme naturalization pass */
/* Normalize remaining legacy calculator pages/classes so every theme applies naturally. */
.calc-legacy-page .page-container,
.page-container{
  max-width:1180px;
}
.calc-legacy-page .tool-tabs,
.tool-tabs{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
}
.calc-legacy-page .tool-tab,
.tool-tab{
  border-radius:999px !important;
  border:1px solid var(--border) !important;
  background:var(--surface2) !important;
  color:var(--text-dim) !important;
  padding:.65rem 1rem !important;
  font-weight:800 !important;
}
.calc-legacy-page .tool-tab.active,
.tool-tab.active{
  background:var(--gold) !important;
  color:#fff !important;
  border-color:var(--gold) !important;
}

/* Forms/results used by older calculators */
.form-grid,
.form-grid-3,
.gear-inputs,
.item-grid,
.mini-grid,
.stat-result-grid,
.resource-grid,
.copy-row,
.quick-row{
  gap:1rem;
}
.form-input,
.form-select,
.gear-input,
.resource-input,
.love-input,
input[type="number"],
input[type="text"],
input[type="search"],
select,
textarea{
  background:var(--bg) !important;
  color:var(--text) !important;
  border:1px solid color-mix(in srgb,var(--border) 72%,transparent) !important;
  border-radius:12px !important;
  box-shadow:none !important;
}
.form-input::placeholder,
.gear-input::placeholder,
.resource-input::placeholder,
.love-input::placeholder,
textarea::placeholder{
  color:var(--text-muted) !important;
}
.form-input:focus,
.form-select:focus,
.gear-input:focus,
.resource-input:focus,
.love-input:focus,
input:focus,
select:focus,
textarea:focus{
  outline:2px solid color-mix(in srgb,var(--gold) 80%,transparent) !important;
  border-color:var(--gold) !important;
}
.form-label,
.gear-input-label,
.resource-label,
.stat-result-label,
.summary-label,
.results-header,
.results-title,
.gear-name,
.gear-stat,
.field label{
  color:var(--text-muted) !important;
}
.stat-result-box,
.stat-result-item,
.summary-stat,
.item-card,
.resource-card,
.mini-status-card,
.results-section,
.tool-panel,
.tool-card,
.planner-card,
.queue-empty,
.love-card,
.gift-code-card,
.transfer-card,
.timeline-item{
  background:var(--surface) !important;
  color:var(--text) !important;
  border:1px solid color-mix(in srgb,var(--border) 74%,transparent) !important;
  border-radius:22px !important;
  box-shadow:var(--venator-shadow,0 16px 44px rgba(0,0,0,.12)) !important;
}
.stat-result-value,
.summary-value,
.summary-card strong,
.metric-card strong,
.result-good{
  color:var(--gold) !important;
}
.hint,
.muted,
.source-note,
.help-text,
.note,
.stat-result-label,
.summary-label,
.resource-label{
  color:var(--text-dim) !important;
}
.badge,
.gear-type-badge,
.quality-selector,
.filter-chip,
.calc-category-count,
.calc-tile-badge{
  background:var(--surface2) !important;
  color:var(--gold) !important;
  border:1px solid color-mix(in srgb,var(--gold) 35%,transparent) !important;
  border-radius:999px !important;
}
.badge.active,
.filter-chip.active,
.quality-selector.active{
  background:var(--gold) !important;
  color:#fff !important;
}

/* Tables used by calculators */
.table-wrap,
.data-table-wrap,
.opt-table-wrap,
.sim-table-wrap{
  overflow-x:auto;
  background:var(--surface) !important;
  border:1px solid color-mix(in srgb,var(--border) 74%,transparent) !important;
  border-radius:22px !important;
}
table,
.data-table,
.opt-table,
.sim-table{
  background:transparent !important;
  color:var(--text) !important;
}
th{
  background:var(--surface2) !important;
  color:var(--text) !important;
}
td{
  color:var(--text-dim) !important;
  border-color:color-mix(in srgb,var(--border) 55%,transparent) !important;
}

/* Buttons across old + new calculator pages */
.q-btn,
.tiny-btn,
.action-btn,
.secondary-btn,
.btn-danger,
.copy-btn,
button{
  border-radius:12px !important;
}
.q-btn,
.tiny-btn,
.secondary-btn,
.btn-danger{
  background:var(--surface2) !important;
  color:var(--text) !important;
  border:1px solid color-mix(in srgb,var(--border) 72%,transparent) !important;
}
.q-btn:hover,
.tiny-btn:hover,
.secondary-btn:hover,
.btn-danger:hover{
  border-color:var(--gold) !important;
  color:var(--gold) !important;
}

/* Hero/header/card consistency across the three active themes */
html[data-theme="pink"] .calc-card-header,
html[data-theme="fire"] .calc-card-header,
html[data-theme="purple"] .calc-card-header,
html[data-theme="pink"] .qr-card-header,
html[data-theme="fire"] .qr-card-header,
html[data-theme="purple"] .qr-card-header,
html[data-theme="pink"] .chat-header,
html[data-theme="fire"] .chat-header,
html[data-theme="purple"] .chat-header{
  background:var(--surface2) !important;
  color:var(--text) !important;
  border-color:color-mix(in srgb,var(--border) 70%,transparent) !important;
}
html[data-theme="pink"] .alert-red,
html[data-theme="fire"] .alert-red,
html[data-theme="purple"] .alert-red,
html[data-theme="pink"] .alert-amber,
html[data-theme="fire"] .alert-amber,
html[data-theme="purple"] .alert-amber,
html[data-theme="pink"] .alert-info,
html[data-theme="fire"] .alert-info,
html[data-theme="purple"] .alert-info{
  background:color-mix(in srgb,var(--gold) 10%,var(--surface)) !important;
  border-color:color-mix(in srgb,var(--gold) 32%,var(--border)) !important;
  color:var(--text-dim) !important;
}
html[data-theme="pink"] .sync-badge,
html[data-theme="fire"] .sync-badge,
html[data-theme="purple"] .sync-badge{
  background:var(--surface2) !important;
  color:var(--text-dim) !important;
  border-color:var(--border) !important;
}

/* Theme-specific final polish */
html[data-theme="pink"] .calc-legacy-page header,
html[data-theme="pink"] header{
  background:rgba(255,247,251,.95) !important;
}
html[data-theme="pink"] .hero-banner{
  box-shadow:rgba(214,48,122,.16) 0 35px 90px -18px,rgba(44,24,36,.08) 0 20px 50px -22px !important;
}
html[data-theme="fire"] .hero-banner{
  box-shadow:rgba(0,0,0,.50) 0 35px 90px -18px,rgba(255,75,56,.13) 0 20px 50px -22px !important;
}
html[data-theme="purple"] .hero-banner{
  box-shadow:rgba(0,0,0,.42) 0 35px 90px -18px,rgba(155,92,255,.16) 0 20px 50px -22px !important;
}

/* Mobile calculator fixes */
@media(max-width:760px){
  .calc-legacy-page .page-container,
  .page-container,
  .calc-shell,
  .sim-shell,
  .optimizer-shell,
  .castle-shell{
    padding-left:.85rem !important;
    padding-right:.85rem !important;
  }
  .form-grid,
  .form-grid-3,
  .gear-inputs,
  .item-grid,
  .mini-grid,
  .stat-result-grid,
  .resource-grid,
  .summary-grid,
  .input-grid{
    grid-template-columns:1fr !important;
  }
  .calc-card,
  .tool-card,
  .sim-card,
  .opt-card,
  .planner-card,
  .result-panel,
  .stat-result-box{
    border-radius:18px !important;
  }
  .tool-tabs{
    overflow-x:auto;
    flex-wrap:nowrap !important;
    padding-bottom:.35rem;
  }
  .tool-tab{
    white-space:nowrap;
    flex:0 0 auto;
  }
  .table-wrap,
  .data-table-wrap{
    margin-left:-.1rem;
    margin-right:-.1rem;
  }
}

/* Hide old inactive theme visual leakage by forcing old theme names to mimic active defaults only if leftover user localStorage exists. */
html[data-theme="light"],
html[data-theme="venator"]{
  color-scheme:light;
}
html[data-theme="dark"]{
  color-scheme:dark;
}



/* v4.33 — Mobile text containment + integrated hero frame */
html, body{
  overflow-x:hidden !important;
}
*{
  min-width:0;
}
.page-header h1,
.calc-hero h1,
.hub-hero h1,
.sim-hero h1,
.opt-hero h1,
.castle-hero-main h1,
.calc-card-header h2,
.card-title h2,
.results-header h2,
.section-label,
.calc-category-head h2,
.home-card h3,
.command-category h3,
.qr-card h3,
.calc-tile h3{
  overflow-wrap:anywhere;
  word-break:normal;
  max-width:100%;
}

/* Universal mobile title clamp for all calculator/guide pages */
@media(max-width:760px){
  .page-header,
  .calc-hero,
  .hub-hero,
  .sim-hero,
  .opt-hero,
  .castle-hero-main{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
    padding:1.25rem !important;
    border-radius:22px !important;
  }
  .page-header h1,
  .calc-hero h1,
  .hub-hero h1,
  .sim-hero h1,
  .opt-hero h1,
  .castle-hero-main h1{
    font-size:clamp(2rem,13vw,3.7rem) !important;
    line-height:.98 !important;
    letter-spacing:-.035em !important;
    max-width:100% !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    hyphens:auto;
  }
  .calc-card-header,
  .card-title,
  .results-header,
  .calc-category-head{
    align-items:flex-start !important;
    flex-wrap:wrap !important;
    gap:.6rem !important;
    max-width:100% !important;
  }
  .calc-card-header h2,
  .card-title h2,
  .results-header h2,
  .calc-category-head h2,
  .section-label{
    font-size:clamp(1.05rem,7vw,1.75rem) !important;
    line-height:1.12 !important;
    overflow-wrap:anywhere !important;
    max-width:100% !important;
  }
  .calc-card-header p,
  .card-title p,
  .calc-category-head p,
  .sim-hero p,
  .opt-hero p,
  .page-header p{
    font-size:clamp(.88rem,4vw,1.05rem) !important;
    line-height:1.45 !important;
    max-width:100% !important;
  }
  .badge-soft,
  .calc-tile-badge,
  .badge,
  .filter-chip{
    max-width:100%;
    white-space:normal !important;
    overflow-wrap:anywhere;
  }
  .calc-card,
  .sim-card,
  .opt-card,
  .tool-card,
  .planner-card,
  .result-panel,
  .home-card,
  .command-category,
  .qr-card,
  .calc-tile{
    overflow:hidden !important;
  }
  .input,
  .select,
  .form-input,
  .form-select,
  .gear-input,
  .resource-input,
  .love-input,
  input,
  select,
  textarea{
    max-width:100% !important;
    min-width:0 !important;
    font-size:16px !important;
  }
}

/* Extra-small screens: keep all hero/calculator titles inside borders */
@media(max-width:430px){
  .page-header h1,
  .calc-hero h1,
  .hub-hero h1,
  .sim-hero h1,
  .opt-hero h1,
  .castle-hero-main h1{
    font-size:clamp(1.8rem,12vw,3rem) !important;
    letter-spacing:-.045em !important;
  }
  .calc-card-header h2,
  .card-title h2,
  .section-label{
    font-size:clamp(1rem,6.2vw,1.45rem) !important;
  }
}

/* Integrated Venator-style hero frame that adapts naturally to all themes */
.hero-banner{
  display:grid !important;
  grid-template-rows:minmax(0,1fr) auto !important;
  gap:0 !important;
  height:auto !important;
  min-height:0 !important;
  padding:14px !important;
  border-radius:28px !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--text) 88%,var(--surface)),color-mix(in srgb,var(--surface) 62%,var(--bg))) !important;
}
.hero-picture{
  height:clamp(280px,37vw,620px) !important;
  min-height:0 !important;
}
.hero-strip.hero-strip-inside{
  position:relative !important;
  z-index:3 !important;
  margin:0 !important;
  width:100% !important;
  padding:1rem .75rem 1.05rem !important;
  border:0 !important;
  border-radius:0 0 18px 18px !important;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--surface) 56%,transparent),color-mix(in srgb,var(--bg) 90%,#000)) !important;
  box-shadow:none !important;
  text-align:center !important;
}
.hero-strip.hero-strip-inside .hero-sub{
  margin:0 !important;
  font-size:clamp(1.05rem,4.8vw,1.85rem) !important;
  line-height:1.1 !important;
  color:var(--text) !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
}
.hero-strip.hero-strip-inside .hero-scroll{
  margin:.45rem 0 0 !important;
  font-size:clamp(.62rem,2.4vw,.85rem) !important;
  color:var(--text-dim) !important;
  letter-spacing:.22em !important;
}
.hero-banner::after{
  bottom:auto !important;
}
html[data-theme="pink"] .hero-banner{
  background:linear-gradient(180deg,#ffffff,#f5eaf0) !important;
}
html[data-theme="fire"] .hero-banner{
  background:linear-gradient(180deg,#f2ece7,#b9aeaa) !important;
}
html[data-theme="purple"] .hero-banner{
  background:linear-gradient(180deg,#f4efff,#c8bed8) !important;
}
@media(max-width:760px){
  .hero-banner{
    padding:10px !important;
    border-radius:22px !important;
    margin-top:12px !important;
  }
  .hero-picture{
    height:clamp(250px,58vw,390px) !important;
  }
  .hero-strip.hero-strip-inside{
    padding:.86rem .6rem .9rem !important;
  }
}
@media(max-width:430px){
  .hero-picture{
    height:clamp(220px,60vw,330px) !important;
  }
}

/* Keep Open Tools + Quick Ref side-by-side on mobile */
.venator-hero-buttons{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  justify-content:center !important;
  align-items:stretch !important;
  gap:.75rem !important;
  width:min(100%,420px) !important;
}
.venator-hero-btn{
  flex:1 1 0 !important;
  min-width:0 !important;
  max-width:190px !important;
  white-space:nowrap !important;
}
@media(max-width:520px){
  .venator-hero-buttons{
    width:min(100%,340px) !important;
    gap:.55rem !important;
  }
  .venator-hero-btn{
    padding:.9rem .65rem !important;
    font-size:.95rem !important;
  }
}
@media(max-width:360px){
  .venator-hero-btn{
    font-size:.84rem !important;
    padding:.82rem .45rem !important;
  }
}

/* Prevent mobile floating buttons from covering important command cards */
@media(max-width:760px){
  .floating-btn,
  .floating-action,
  .chat-launcher,
  #famAssistantToggle,
  .assistant-toggle{
    bottom:calc(86px + env(safe-area-inset-bottom)) !important;
    right:14px !important;
    transform:scale(.88);
    transform-origin:bottom right;
  }
  .venator-command-strip{
    padding-bottom:1.5rem;
  }
}



/* v4.34 — Critical Rules dedicated category */
#page-critical .section-label-critical{
  border-left-color:var(--red) !important;
}
#page-critical .qr-card{
  min-height:auto;
}
#page-critical .stat-row{
  gap:.65rem;
}
@media(max-width:760px){
  #page-critical .page-header h1{
    font-size:clamp(2.1rem,13vw,3.4rem) !important;
  }
  #page-critical .qr-grid{
    grid-template-columns:1fr !important;
  }
  #page-critical .stat-row{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:.2rem !important;
  }
  #page-critical .stat-value,
  #page-critical .stat-label{
    font-size:.86rem !important;
  }
}



/* v4.35 — Header/footer alignment + single hero frame + framed page titles */
/* Center the desktop top bar content instead of letting nav/footer drift left. */
header{
  justify-content:center !important;
}
.header-inner{
  max-width:1536px !important;
  margin:0 auto !important;
  width:100% !important;
  box-sizing:border-box !important;
}
@media(min-width:1025px){
  .header-inner{
    display:grid !important;
    grid-template-columns:minmax(220px,280px) minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:1rem !important;
  }
  .logo{
    width:auto !important;
    min-width:0 !important;
    max-width:280px !important;
    padding-right:0 !important;
  }
  .header-center{
    justify-content:center !important;
    min-width:0 !important;
  }
  .top-nav{
    justify-content:center !important;
    flex-wrap:wrap !important;
    min-width:0 !important;
  }
  .header-search-btn{
    flex:0 1 360px !important;
  }
  .header-right{
    justify-content:flex-end !important;
    margin-left:0 !important;
  }
}

/* Footer centered with the same content width as the page. */
.site-footer{
  width:min(100% - 2rem, 1180px) !important;
  max-width:1180px !important;
  margin:3rem auto 0 !important;
  padding:2rem 2rem 1.25rem !important;
  border:1px solid color-mix(in srgb,var(--border) 78%,transparent) !important;
  border-radius:24px 24px 0 0 !important;
  box-sizing:border-box !important;
  align-items:start !important;
}
.footer-links{
  justify-items:start !important;
}
.footer-bottom{
  text-align:center !important;
}
@media(max-width:820px){
  .site-footer{
    width:calc(100% - 1.25rem) !important;
    margin:2rem auto 0 !important;
    padding:1.4rem 1rem 1rem !important;
    grid-template-columns:1fr !important;
    gap:1.2rem !important;
  }
  .footer-links{
    grid-template-columns:1fr 1fr !important;
  }
}
@media(max-width:520px){
  .footer-links{
    grid-template-columns:1fr !important;
  }
}

/* Homepage hero: one clean border/frame, no double border/pseudo overlay shell. */
.hero-banner{
  border:1px solid color-mix(in srgb,var(--text) 82%,var(--border)) !important;
  box-shadow:var(--venator-shadow,0 28px 80px rgba(0,0,0,.22)) !important;
  background:color-mix(in srgb,var(--surface) 82%,var(--text)) !important;
  overflow:hidden !important;
}
.hero-banner::before,
.hero-banner::after{
  display:none !important;
  content:none !important;
}
.hero-picture{
  border:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
.hero-img{
  border:0 !important;
  box-shadow:none !important;
}
.hero-strip.hero-strip-inside{
  border-top:1px solid color-mix(in srgb,var(--border) 62%,transparent) !important;
  border-radius:0 !important;
}
html[data-theme="pink"] .hero-banner{
  background:#fff !important;
  border-color:#fff !important;
  box-shadow:rgba(214,48,122,.16) 0 34px 90px -22px, rgba(44,24,36,.10) 0 18px 46px -24px !important;
}
html[data-theme="fire"] .hero-banner{
  background:#eee6df !important;
  border-color:#eee6df !important;
  box-shadow:rgba(0,0,0,.48) 0 34px 90px -18px, rgba(255,75,56,.16) 0 22px 52px -22px !important;
}
html[data-theme="purple"] .hero-banner{
  background:#efe8fb !important;
  border-color:#efe8fb !important;
  box-shadow:rgba(0,0,0,.38) 0 34px 90px -18px, rgba(155,92,255,.18) 0 22px 52px -22px !important;
}

/* All non-home page hero/title text now lives in one natural border card. */
.page:not(#page-home) .page-header,
.calc-hero,
.hub-hero,
.sim-hero,
.opt-hero,
.castle-hero-main,
.calendar-hero,
.changelog-hero{
  display:block !important;
  width:100% !important;
  max-width:1180px !important;
  margin:1.5rem auto 1.4rem !important;
  padding:clamp(1.25rem,3vw,2.4rem) !important;
  border:1px solid color-mix(in srgb,var(--border) 78%,transparent) !important;
  border-radius:28px !important;
  background:
    radial-gradient(circle at 18% 0%, color-mix(in srgb,var(--gold) 12%, transparent), transparent 38%),
    linear-gradient(180deg, color-mix(in srgb,var(--surface) 94%,transparent), color-mix(in srgb,var(--surface2) 88%,transparent)) !important;
  box-shadow:var(--venator-shadow,0 20px 60px rgba(0,0,0,.14)) !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}
.page:not(#page-home) .page-header::before,
.page:not(#page-home) .page-header::after,
.calc-hero::before,
.calc-hero::after,
.hub-hero::before,
.hub-hero::after,
.sim-hero::before,
.sim-hero::after,
.opt-hero::before,
.opt-hero::after,
.castle-hero-main::before,
.castle-hero-main::after,
.calendar-hero::before,
.calendar-hero::after,
.changelog-hero::before,
.changelog-hero::after{
  display:none !important;
  content:none !important;
}
.page:not(#page-home) .page-header h1,
.calc-hero h1,
.hub-hero h1,
.sim-hero h1,
.opt-hero h1,
.castle-hero-main h1,
.calendar-hero h1,
.changelog-hero h1{
  font-size:clamp(2rem,7vw,4.7rem) !important;
  line-height:.98 !important;
  letter-spacing:-.035em !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  color:var(--text) !important;
  text-transform:none !important;
  text-shadow:none !important;
}
.page:not(#page-home) .page-header p,
.calc-hero p,
.hub-hero p,
.sim-hero p,
.opt-hero p,
.castle-hero-main p,
.calendar-hero p,
.changelog-hero p{
  max-width:760px !important;
  margin:.85rem 0 0 !important;
  padding:0 !important;
  border:0 !important;
  color:var(--text-dim) !important;
  font-size:clamp(.92rem,2.3vw,1.1rem) !important;
  line-height:1.55 !important;
  letter-spacing:.02em !important;
}
html[data-theme="pink"] .page:not(#page-home) .page-header,
html[data-theme="pink"] .calc-hero,
html[data-theme="pink"] .hub-hero,
html[data-theme="pink"] .sim-hero,
html[data-theme="pink"] .opt-hero,
html[data-theme="pink"] .castle-hero-main,
html[data-theme="pink"] .calendar-hero,
html[data-theme="pink"] .changelog-hero{
  background:linear-gradient(180deg,#ffffff,#fff0f6) !important;
}
html[data-theme="fire"] .page:not(#page-home) .page-header,
html[data-theme="fire"] .calc-hero,
html[data-theme="fire"] .hub-hero,
html[data-theme="fire"] .sim-hero,
html[data-theme="fire"] .opt-hero,
html[data-theme="fire"] .castle-hero-main,
html[data-theme="fire"] .calendar-hero,
html[data-theme="fire"] .changelog-hero{
  background:
    radial-gradient(circle at 12% 0%,rgba(255,75,56,.16),transparent 42%),
    linear-gradient(180deg,var(--surface),var(--surface2)) !important;
}
html[data-theme="purple"] .page:not(#page-home) .page-header,
html[data-theme="purple"] .calc-hero,
html[data-theme="purple"] .hub-hero,
html[data-theme="purple"] .sim-hero,
html[data-theme="purple"] .opt-hero,
html[data-theme="purple"] .castle-hero-main,
html[data-theme="purple"] .calendar-hero,
html[data-theme="purple"] .changelog-hero{
  background:
    radial-gradient(circle at 12% 0%,rgba(176,124,255,.18),transparent 42%),
    linear-gradient(180deg,var(--surface),var(--surface2)) !important;
}

@media(max-width:760px){
  .page:not(#page-home) .page-header,
  .calc-hero,
  .hub-hero,
  .sim-hero,
  .opt-hero,
  .castle-hero-main,
  .calendar-hero,
  .changelog-hero{
    margin:1rem auto 1rem !important;
    border-radius:22px !important;
    padding:1.15rem !important;
  }
  .page:not(#page-home) .page-header h1,
  .calc-hero h1,
  .hub-hero h1,
  .sim-hero h1,
  .opt-hero h1,
  .castle-hero-main h1,
  .calendar-hero h1,
  .changelog-hero h1{
    font-size:clamp(1.85rem,12vw,3.1rem) !important;
  }
}



/* v4.36 — Page layout repair: home-only hero, compact title frames, aligned header/footer */
#page-home .hero-banner{
  display:grid !important;
  width:min(100%, 1180px) !important;
  max-width:1180px !important;
  margin:1rem auto 1.25rem !important;
}

/* Internal page titles are compact framed bars, not giant hero blocks. */
.page:not(#page-home) .page-header,
.calc-hero,
.hub-hero,
.sim-hero,
.opt-hero,
.castle-hero-main,
.calendar-hero,
.changelog-hero{
  display:block !important;
  width:min(100%, 1180px) !important;
  max-width:1180px !important;
  min-height:0 !important;
  margin:1rem auto 1.25rem !important;
  padding:1.05rem 1.2rem !important;
  border:1px solid color-mix(in srgb,var(--border) 78%,transparent) !important;
  border-radius:18px !important;
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 96%,transparent), color-mix(in srgb,var(--surface2) 84%,transparent)) !important;
  box-shadow:0 14px 42px color-mix(in srgb,#000 14%,transparent) !important;
  overflow:hidden !important;
}
.page:not(#page-home) .page-header::before,
.page:not(#page-home) .page-header::after,
.calc-hero::before,
.calc-hero::after,
.hub-hero::before,
.hub-hero::after,
.sim-hero::before,
.sim-hero::after,
.opt-hero::before,
.opt-hero::after,
.castle-hero-main::before,
.castle-hero-main::after,
.calendar-hero::before,
.calendar-hero::after,
.changelog-hero::before,
.changelog-hero::after{
  display:none !important;
  content:none !important;
}
.page:not(#page-home) .page-header h1,
.calc-hero h1,
.hub-hero h1,
.sim-hero h1,
.opt-hero h1,
.castle-hero-main h1,
.calendar-hero h1,
.changelog-hero h1{
  font-size:clamp(1.55rem,4.8vw,2.65rem) !important;
  line-height:1.05 !important;
  letter-spacing:-.015em !important;
  max-width:100% !important;
  margin:0 !important;
  color:var(--text) !important;
  text-transform:none !important;
  text-shadow:none !important;
  overflow-wrap:anywhere !important;
}
.page:not(#page-home) .page-header h1::before,
.calc-hero h1::before,
.hub-hero h1::before,
.sim-hero h1::before,
.opt-hero h1::before,
.castle-hero-main h1::before,
.calendar-hero h1::before,
.changelog-hero h1::before{
  content:"FAM FIELD MANUAL";
  display:block;
  margin-bottom:.35rem;
  font-family:'DM Mono',monospace;
  font-size:.62rem;
  line-height:1;
  letter-spacing:.18em;
  color:var(--gold);
}
.page:not(#page-home) .page-header p,
.calc-hero p,
.hub-hero p,
.sim-hero p,
.opt-hero p,
.castle-hero-main p,
.calendar-hero p,
.changelog-hero p{
  margin:.55rem 0 0 !important;
  max-width:760px !important;
  color:var(--text-dim) !important;
  font-size:clamp(.82rem,2.1vw,.98rem) !important;
  line-height:1.5 !important;
  letter-spacing:.02em !important;
  padding:0 !important;
  border:0 !important;
}

/* Header alignment and spacing */
header{justify-content:center !important;}
.header-inner{
  width:min(100%, 1536px) !important;
  max-width:1536px !important;
  margin:0 auto !important;
  display:flex !important;
  align-items:center !important;
  gap:.8rem !important;
  box-sizing:border-box !important;
}
.logo{
  width:auto !important;
  min-width:210px !important;
  max-width:260px !important;
  padding-right:0 !important;
  flex:0 0 auto !important;
}
.header-center{
  flex:1 1 auto !important;
  min-width:0 !important;
  justify-content:center !important;
}
.top-nav{
  flex:1 1 auto !important;
  justify-content:center !important;
  gap:.25rem !important;
  min-width:0 !important;
}
.top-nav a{
  padding:.42rem .55rem !important;
  font-size:.68rem !important;
  letter-spacing:.08em !important;
}
.header-search-btn{
  flex:0 1 210px !important;
  max-width:210px !important;
  min-width:0 !important;
  padding:.42rem .65rem !important;
}
.header-search-btn p{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.header-right{
  flex:0 0 auto !important;
  margin-left:0 !important;
  gap:.45rem !important;
}
.theme-toggle{
  min-width:74px !important;
  padding:0 .55rem !important;
}

/* Footer alignment */
.site-footer{
  width:min(100% - 2rem, 1180px) !important;
  max-width:1180px !important;
  margin:3rem auto 0 !important;
  padding:1.8rem 1.8rem 1.1rem !important;
  display:grid !important;
  grid-template-columns:minmax(220px,.9fr) minmax(0,1.8fr) !important;
  gap:2rem !important;
  border:1px solid color-mix(in srgb,var(--border) 78%,transparent) !important;
  border-radius:22px 22px 0 0 !important;
  box-sizing:border-box !important;
}
.footer-links{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(120px,1fr)) !important;
  gap:1rem !important;
}
.footer-bottom{
  grid-column:1/-1 !important;
  text-align:center !important;
}

@media(max-width:1180px){
  .logo{min-width:170px !important;}
  .top-nav a{font-size:.62rem !important;padding:.36rem .42rem !important;}
  .header-search-btn{flex-basis:150px !important;max-width:150px !important;}
}
@media(max-width:1024px){
  .top-nav{display:none !important;}
  .logo{min-width:0 !important;}
  .header-search-btn{flex:0 0 42px !important;max-width:42px !important;}
  main,.site-footer{margin-left:auto !important;margin-right:auto !important;}
}
@media(max-width:760px){
  #page-home .hero-banner{
    width:calc(100% - 1rem) !important;
    margin:.75rem auto 1rem !important;
  }
  .page:not(#page-home) .page-header,
  .calc-hero,
  .hub-hero,
  .sim-hero,
  .opt-hero,
  .castle-hero-main,
  .calendar-hero,
  .changelog-hero{
    width:100% !important;
    margin:.8rem auto 1rem !important;
    padding:1rem !important;
    border-radius:16px !important;
  }
  .page:not(#page-home) .page-header h1,
  .calc-hero h1,
  .hub-hero h1,
  .sim-hero h1,
  .opt-hero h1,
  .castle-hero-main h1,
  .calendar-hero h1,
  .changelog-hero h1{
    font-size:clamp(1.45rem,10vw,2.5rem) !important;
  }
  .site-footer{
    width:calc(100% - 1rem) !important;
    grid-template-columns:1fr !important;
    padding:1.25rem 1rem 1rem !important;
    gap:1.1rem !important;
  }
  .footer-links{grid-template-columns:1fr 1fr !important;}
}
@media(max-width:520px){
  .footer-links{grid-template-columns:1fr !important;}
}



/* v4.37 — Simple header, fixed footer/sidebar flow, unified hero strip */
/* Header: no desktop quick-link nav; only logo, search, translator, theme, menu. */
.header-inner{
  display:grid !important;
  grid-template-columns:minmax(210px,310px) minmax(220px,1fr) auto !important;
  align-items:center !important;
  gap:1rem !important;
}
.header-center{
  display:flex !important;
  justify-content:center !important;
  min-width:0 !important;
}
.header-center .top-nav{
  display:none !important;
}
.header-search-btn{
  width:min(100%,520px) !important;
  max-width:520px !important;
  flex:0 1 520px !important;
  justify-content:flex-start !important;
}
.header-right{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:.6rem !important;
  min-width:max-content !important;
}
.logo{
  min-width:0 !important;
  max-width:310px !important;
}
.theme-toggle{
  min-width:92px !important;
}
.sidebar-toggle{
  flex:0 0 auto !important;
}

/* Sidebar should overlay, never push footer/content around. */
.sidebar{
  position:fixed !important;
  top:var(--header-h, 76px) !important;
  left:0 !important;
  bottom:0 !important;
  height:calc(100dvh - var(--header-h, 76px)) !important;
  z-index:500 !important;
  transform:translateX(-105%) !important;
  transition:transform .25s ease !important;
}
body.sidebar-open .sidebar{
  transform:translateX(0) !important;
}
body.sidebar-open .sidebar-backdrop{
  opacity:1 !important;
  visibility:visible !important;
  z-index:450 !important;
}
.app-body,
main,
.site-footer,
.hero-banner,
.hero-strip{
  margin-left:auto !important;
  margin-right:auto !important;
}
body.sidebar-collapsed .app-body,
body.sidebar-collapsed main,
body.sidebar-collapsed .site-footer,
body.sidebar-collapsed .hero-banner,
body.sidebar-collapsed .hero-strip,
body.sidebar-open .app-body,
body.sidebar-open main,
body.sidebar-open .site-footer,
body.sidebar-open .hero-banner,
body.sidebar-open .hero-strip{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Hero text strip should be part of the same clean frame, not a gray separate border. */
.hero-banner{
  border:0 !important;
  padding:14px !important;
  background:color-mix(in srgb,var(--text) 84%,var(--surface)) !important;
  box-shadow:var(--venator-shadow,0 28px 80px rgba(0,0,0,.22)) !important;
}
.hero-picture{
  border-radius:18px 18px 0 0 !important;
  clip-path:none !important;
}
.hero-banner .hero-img{
  border-radius:18px 18px 0 0 !important;
}
.hero-strip.hero-strip-inside{
  margin:0 !important;
  width:100% !important;
  border:0 !important;
  border-top:0 !important;
  border-radius:0 0 18px 18px !important;
  background:
    linear-gradient(180deg,
      color-mix(in srgb,var(--surface) 78%,#000 22%),
      color-mix(in srgb,var(--bg) 90%,#000 10%)
    ) !important;
  box-shadow:none !important;
  outline:0 !important;
}
.hero-strip.hero-strip-inside .hero-sub,
.hero-strip.hero-strip-inside .hero-scroll{
  text-shadow:0 2px 14px rgba(0,0,0,.32);
}
html[data-theme="pink"] .hero-banner{
  background:#fff !important;
}
html[data-theme="fire"] .hero-banner{
  background:#eee6df !important;
}
html[data-theme="purple"] .hero-banner{
  background:#efe8fb !important;
}

/* Footer stable and centered regardless of sidebar state. */
.site-footer{
  clear:both !important;
  width:min(100% - 2rem,1180px) !important;
  max-width:1180px !important;
  margin:3rem auto 0 !important;
  box-sizing:border-box !important;
}

/* Desktop medium screens */
@media(max-width:1180px){
  .header-inner{
    grid-template-columns:minmax(170px,260px) minmax(180px,1fr) auto !important;
    gap:.75rem !important;
  }
  .header-search-btn{
    max-width:420px !important;
  }
}

/* Mobile/tablet header stays compact and natural. */
@media(max-width:760px){
  .header-inner{
    display:flex !important;
    gap:.45rem !important;
  }
  .logo{
    flex:1 1 auto !important;
    max-width:52vw !important;
  }
  .header-center{
    flex:0 0 auto !important;
  }
  .header-search-btn{
    width:42px !important;
    max-width:42px !important;
    flex:0 0 42px !important;
  }
  .header-right{
    gap:.35rem !important;
  }
  .theme-toggle{
    min-width:42px !important;
  }
  .hero-banner{
    padding:10px !important;
  }
  .hero-picture,
  .hero-banner .hero-img{
    border-radius:14px 14px 0 0 !important;
  }
  .hero-strip.hero-strip-inside{
    border-radius:0 0 14px 14px !important;
  }
}



/* v4.38 — Streamable hero embed */
.hero-video-wrap{
  position:relative !important;
  overflow:hidden !important;
  background:#111 !important;
}
.hero-video-wrap iframe{
  display:block !important;
  width:100% !important;
  height:100% !important;
  border:0 !important;
  position:absolute !important;
  inset:0 !important;
}
.hero-banner{
  grid-template-rows:minmax(280px,37vw) auto !important;
}
@media(max-width:760px){
  .hero-banner{
    grid-template-rows:clamp(250px,58vw,390px) auto !important;
  }
}
@media(max-width:430px){
  .hero-banner{
    grid-template-rows:clamp(220px,60vw,330px) auto !important;
  }
}



/* v4.39 — Static FAM hero image restored */
.hero-picture{
  position:relative !important;
  display:block !important;
  overflow:hidden !important;
}
.hero-picture .hero-img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.hero-banner{
  grid-template-rows:minmax(280px,37vw) auto !important;
}
@media(max-width:760px){
  .hero-banner{
    grid-template-rows:clamp(250px,58vw,390px) auto !important;
  }
  .hero-picture .hero-img{
    object-position:center center !important;
  }
}
@media(max-width:430px){
  .hero-banner{
    grid-template-rows:clamp(220px,60vw,330px) auto !important;
  }
}



/* v4.40 — Simplified hero image + Venator-style frame */
#page-home .hero-banner{
  position:relative !important;
  display:block !important;
  width:min(100%, 1180px) !important;
  max-width:1180px !important;
  margin:1rem auto 1.25rem !important;
  padding:14px !important;
  border:0 !important;
  border-radius:28px !important;
  overflow:hidden !important;
  background:#f3efee !important;
  box-shadow:0 24px 70px rgba(0,0,0,.18), 0 10px 28px rgba(0,0,0,.08) !important;
}

#page-home .hero-banner::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:120px;
  height:18px;
  background:#f3efee;
  clip-path:polygon(12% 0, 88% 0, 76% 100%, 24% 100%);
  z-index:3;
}

#page-home .hero-picture{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:clamp(300px, 39vw, 640px) !important;
  overflow:hidden !important;
  border-radius:18px !important;
  background:#120912 !important;
}

#page-home .hero-picture::before,
#page-home .hero-picture::after{
  content:"";
  position:absolute;
  bottom:0;
  width:138px;
  height:74px;
  background:#f3efee;
  z-index:3;
}

#page-home .hero-picture::before{
  left:0;
  clip-path:polygon(0 0, 82% 0, 100% 100%, 0 100%);
}

#page-home .hero-picture::after{
  right:0;
  clip-path:polygon(18% 0, 100% 0, 100% 100%, 0 100%);
}

#page-home .hero-picture .hero-img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}

#page-home .hero-banner .hero-strip,
#page-home .hero-banner .hero-sub,
#page-home .hero-banner .hero-scroll{
  display:none !important;
}

/* Theme-aware frame tints */
html[data-theme="pink"] #page-home .hero-banner{
  background:#f5f1f0 !important;
}
html[data-theme="fire"] #page-home .hero-banner{
  background:#ece5e0 !important;
}
html[data-theme="purple"] #page-home .hero-banner{
  background:#ece7ef !important;
}

html[data-theme="pink"] #page-home .hero-banner::before,
html[data-theme="pink"] #page-home .hero-picture::before,
html[data-theme="pink"] #page-home .hero-picture::after{
  background:#f5f1f0 !important;
}
html[data-theme="fire"] #page-home .hero-banner::before,
html[data-theme="fire"] #page-home .hero-picture::before,
html[data-theme="fire"] #page-home .hero-picture::after{
  background:#ece5e0 !important;
}
html[data-theme="purple"] #page-home .hero-banner::before,
html[data-theme="purple"] #page-home .hero-picture::before,
html[data-theme="purple"] #page-home .hero-picture::after{
  background:#ece7ef !important;
}

@media (max-width: 760px){
  #page-home .hero-banner{
    width:calc(100% - 1rem) !important;
    margin:.75rem auto 1rem !important;
    padding:10px !important;
    border-radius:22px !important;
  }
  #page-home .hero-banner::before{
    width:92px;
    height:14px;
  }
  #page-home .hero-picture{
    height:clamp(230px, 58vw, 390px) !important;
    border-radius:14px !important;
  }
  #page-home .hero-picture::before,
  #page-home .hero-picture::after{
    width:72px;
    height:38px;
  }
}

@media (max-width: 430px){
  #page-home .hero-picture{
    height:clamp(210px, 62vw, 320px) !important;
  }
}



/* v4.41 — Events calendar top spacing fix */
.calendar-shell{
  padding-top:clamp(1.25rem, 3vw, 2.25rem) !important;
}
.calendar-hero{
  margin-top:0 !important;
}
@media(max-width:760px){
  .calendar-shell{
    padding-top:1rem !important;
  }
  .calendar-hero{
    padding:1rem !important;
  }
}

/* Standalone page headers need breathing room below fixed header */
body > main.calendar-shell,
body > main.calc-shell,
body > main.hub-shell,
body > main.sim-shell,
body > main.optimizer-shell,
body > main.castle-shell,
body > main.changelog-shell{
  margin-top:0 !important;
}



/* v4.41b — Clean white hero border only */
#page-home .hero-banner{
  padding:14px !important;
  border:0 !important;
  border-radius:24px !important;
  background:#ffffff !important;
  overflow:hidden !important;
  box-shadow:0 24px 70px rgba(0,0,0,.18), 0 10px 28px rgba(0,0,0,.08) !important;
}
#page-home .hero-banner::before,
#page-home .hero-banner::after,
#page-home .hero-picture::before,
#page-home .hero-picture::after{
  display:none !important;
  content:none !important;
}
#page-home .hero-picture{
  border-radius:14px !important;
  clip-path:none !important;
  overflow:hidden !important;
  background:#111 !important;
}
#page-home .hero-picture .hero-img{
  border-radius:14px !important;
}
html[data-theme="pink"] #page-home .hero-banner,
html[data-theme="fire"] #page-home .hero-banner,
html[data-theme="purple"] #page-home .hero-banner{
  background:#ffffff !important;
  border-color:#ffffff !important;
}
@media(max-width:760px){
  #page-home .hero-banner{
    padding:10px !important;
    border-radius:20px !important;
  }
  #page-home .hero-picture,
  #page-home .hero-picture .hero-img{
    border-radius:12px !important;
  }
}



/* v4.42 — Remove homepage hero buttons */
#page-home .venator-command-strip{
  margin-top:1.1rem !important;
}
@media(max-width:760px){
  #page-home .venator-command-strip{
    margin-top:.9rem !important;
  }
}



/* v4.43 — Desktop sidebar button + theme styling fix */
/* Sidebar is now an overlay on desktop and mobile. It should never push footer/content. */
.sidebar{
  position:fixed !important;
  top:var(--header-h, 76px) !important;
  left:0 !important;
  bottom:0 !important;
  width:min(var(--sidebar-w, 280px), 88vw) !important;
  height:calc(100dvh - var(--header-h, 76px)) !important;
  z-index:900 !important;
  transform:translateX(-110%) !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:transform .25s ease, opacity .2s ease, visibility .2s ease !important;
  border-right:1px solid var(--border) !important;
  box-shadow:22px 0 70px rgba(0,0,0,.24) !important;
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
  padding:1.25rem 0 2rem !important;
}
body.sidebar-open .sidebar{
  transform:translateX(0) !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
body.sidebar-collapsed .sidebar{
  transform:translateX(-110%) !important;
}

/* Backdrop now works on desktop too. */
.sidebar-backdrop{
  position:fixed !important;
  inset:var(--header-h, 76px) 0 0 0 !important;
  z-index:850 !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  background:rgba(14,10,14,.44) !important;
  backdrop-filter:blur(4px) !important;
  transition:opacity .2s ease, visibility .2s ease !important;
}
body.sidebar-open .sidebar-backdrop{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

/* Sidebar never affects document flow. */
main,
.app-body,
.site-footer,
.hero-banner,
.hero-strip,
.calendar-shell,
.calc-shell,
.hub-shell,
.sim-shell,
.optimizer-shell,
.castle-shell,
.changelog-shell,
body.sidebar-open main,
body.sidebar-open .app-body,
body.sidebar-open .site-footer,
body.sidebar-open .hero-banner,
body.sidebar-open .calendar-shell,
body.sidebar-collapsed main,
body.sidebar-collapsed .app-body,
body.sidebar-collapsed .site-footer,
body.sidebar-collapsed .hero-banner,
body.sidebar-collapsed .calendar-shell{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Button state fix */
.sidebar-toggle{
  position:relative !important;
  z-index:950 !important;
  cursor:pointer !important;
}
body.sidebar-open .sidebar-toggle{
  background:var(--gold) !important;
  color:#fff !important;
  border-color:var(--gold) !important;
}
body.sidebar-open .sidebar-toggle .hamburger-icon{
  transform:rotate(90deg) !important;
}

/* Sidebar theme polish */
html[data-theme="pink"] .sidebar{
  background:linear-gradient(180deg,#fff7fb,#fff0f6) !important;
  color:#221820 !important;
  border-right-color:#ead0dc !important;
  box-shadow:22px 0 70px rgba(214,48,122,.18) !important;
}
html[data-theme="fire"] .sidebar{
  background:linear-gradient(180deg,#151313,#241f20) !important;
  color:#fff4e8 !important;
  border-right-color:#5f4e4d !important;
  box-shadow:22px 0 70px rgba(0,0,0,.48) !important;
}
html[data-theme="purple"] .sidebar{
  background:linear-gradient(180deg,#17151f,#262333) !important;
  color:#faf6ff !important;
  border-right-color:#554d68 !important;
  box-shadow:22px 0 70px rgba(0,0,0,.42) !important;
}

.sidebar .nav-section-label{
  color:var(--gold) !important;
  border-bottom:1px solid color-mix(in srgb,var(--border) 78%,transparent) !important;
  background:transparent !important;
}
.sidebar nav a{
  color:var(--text-dim) !important;
  border:1px solid transparent !important;
  background:transparent !important;
}
.sidebar nav a:hover,
.sidebar nav a.active{
  color:var(--text) !important;
  background:color-mix(in srgb,var(--gold) 12%,var(--surface)) !important;
  border-color:color-mix(in srgb,var(--gold) 38%,transparent) !important;
}
.sidebar nav a .nav-icon{
  color:var(--gold) !important;
}

/* Mobile sizing stays compact */
@media(max-width:760px){
  .sidebar{
    width:min(88vw, 340px) !important;
    top:var(--mobile-header-h, 64px) !important;
    height:calc(100dvh - var(--mobile-header-h, 64px)) !important;
  }
  .sidebar-backdrop{
    inset:var(--mobile-header-h, 64px) 0 0 0 !important;
  }
}



/* v4.45 — Mobile guide overflow repair */
/* Stop all guide pages from pushing beyond the phone viewport. */
@media(max-width:760px){
  html,
  body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .app-body,
  .page,
  .page main,
  main,
  .page-container,
  .calendar-shell,
  .calc-shell,
  .hub-shell,
  .sim-shell,
  .optimizer-shell,
  .castle-shell,
  .changelog-shell{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:hidden !important;
    box-sizing:border-box !important;
  }

  .page main,
  .page-container,
  .calendar-shell,
  .calc-shell,
  .hub-shell,
  .sim-shell,
  .optimizer-shell,
  .castle-shell,
  .changelog-shell{
    padding-left:.85rem !important;
    padding-right:.85rem !important;
  }

  #page-quickref,
  #page-bear,
  #page-pets,
  #page-gear,
  #page-timeline,
  #page-kvk,
  #page-vikings,
  #page-transfer,
  #page-joiner,
  #page-tierlist,
  #page-truegold{
    overflow-x:hidden !important;
  }

  #page-quickref *,
  #page-bear *,
  #page-pets *,
  #page-gear *,
  #page-timeline *,
  #page-kvk *,
  #page-vikings *,
  #page-transfer *,
  #page-joiner *,
  #page-tierlist *,
  #page-truegold *{
    max-width:100% !important;
    box-sizing:border-box !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }

  .page-header,
  .page-search,
  .section-label,
  .alert,
  .qr-card,
  .qr-card-body,
  .qr-card-header,
  .expandable,
  .expand-trigger,
  .expand-content,
  .phase-block,
  .phase-content,
  .calendar-card,
  .k1245-panel{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .page-header,
  .page-search,
  .alert,
  .qr-card,
  .expandable,
  .phase-block{
    padding-left:1rem !important;
    padding-right:1rem !important;
  }

  .page-header{
    text-align:left !important;
  }

  .page-header h1,
  .section-label,
  .qr-card h3,
  .alert strong,
  .expand-trigger,
  .phase-title,
  .et-left,
  .et-sub{
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    line-height:1.15 !important;
  }

  .page-header h1{
    font-size:clamp(1.55rem,10vw,2.45rem) !important;
  }

  .page-header p,
  .prose,
  .qr-card-body,
  .alert,
  .expand-content,
  .phase-content{
    font-size:.94rem !important;
    line-height:1.5 !important;
  }

  .qr-grid,
  .command-grid,
  .home-grid,
  .calendar-grid-two,
  .grid,
  .stat-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    max-width:100% !important;
    gap:.85rem !important;
  }

  .qr-card-header{
    display:flex !important;
    align-items:flex-start !important;
    gap:.65rem !important;
    flex-wrap:wrap !important;
  }

  .qr-card-header .icon,
  .alert-icon,
  .et-icon{
    flex:0 0 auto !important;
  }

  .stat-row{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:.2rem !important;
    align-items:start !important;
    padding:.65rem 0 !important;
  }

  .stat-label,
  .stat-value,
  .stat-note{
    display:block !important;
    width:100% !important;
    text-align:left !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  .tag,
  .tag-gold,
  .tag-blue,
  .tag-green,
  .tag-amber,
  .badge,
  .badge-soft,
  .calendar-badge{
    display:inline-flex !important;
    width:auto !important;
    max-width:100% !important;
    white-space:normal !important;
    line-height:1.25 !important;
    text-align:left !important;
  }

  .data-table-wrap,
  .table-wrap,
  .opt-table-wrap,
  .sim-table-wrap{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    margin-left:0 !important;
    margin-right:0 !important;
    border-radius:16px !important;
  }

  .data-table,
  table{
    width:100% !important;
    min-width:0 !important;
    table-layout:auto !important;
  }

  .data-table th,
  .data-table td,
  table th,
  table td{
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    min-width:0 !important;
    padding:.62rem .55rem !important;
    font-size:.82rem !important;
    vertical-align:top !important;
  }

  .phase-timeline{
    width:100% !important;
    max-width:100% !important;
    padding-left:0 !important;
    margin-left:0 !important;
  }

  .phase-line,
  .phase-connector{
    display:none !important;
  }

  .phase-block{
    display:block !important;
    margin-left:0 !important;
    padding:.9rem !important;
  }

  .gen-tabs,
  .tool-tabs{
    width:100% !important;
    overflow-x:auto !important;
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
    padding-bottom:.35rem !important;
  }

  .gen-tab,
  .tool-tab{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  .expand-trigger{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:.75rem !important;
    width:100% !important;
    text-align:left !important;
  }

  .expand-arrow{
    flex:0 0 auto !important;
  }

  .formation-bar{
    width:100% !important;
    min-width:0 !important;
  }
}

/* Extra small phones */
@media(max-width:430px){
  .page main,
  .page-container,
  .calendar-shell,
  .calc-shell,
  .hub-shell,
  .sim-shell,
  .optimizer-shell,
  .castle-shell,
  .changelog-shell{
    padding-left:.65rem !important;
    padding-right:.65rem !important;
  }

  .page-header,
  .page-search,
  .alert,
  .qr-card,
  .expandable,
  .phase-block{
    padding-left:.82rem !important;
    padding-right:.82rem !important;
  }

  .data-table th,
  .data-table td,
  table th,
  table td{
    font-size:.76rem !important;
    padding:.55rem .45rem !important;
  }
}



/* v4.46 — Mobile guide card header blend fix */
@media(max-width:760px){
  #page-quickref .qr-card,
  #page-bear .qr-card,
  #page-pets .qr-card,
  #page-gear .qr-card,
  #page-timeline .qr-card,
  #page-kvk .qr-card,
  #page-vikings .qr-card,
  #page-transfer .qr-card,
  #page-joiner .qr-card,
  #page-tierlist .qr-card,
  #page-truegold .qr-card,
  #page-quickref .expandable,
  #page-bear .expandable,
  #page-pets .expandable,
  #page-gear .expandable,
  #page-timeline .expandable,
  #page-kvk .expandable,
  #page-vikings .expandable,
  #page-transfer .expandable,
  #page-joiner .expandable,
  #page-tierlist .expandable,
  #page-truegold .expandable{
    overflow:hidden !important;
    border-radius:18px !important;
    background:linear-gradient(180deg,
      color-mix(in srgb, var(--surface) 94%, transparent),
      color-mix(in srgb, var(--surface2) 70%, transparent)
    ) !important;
    border:1px solid color-mix(in srgb, var(--border) 90%, transparent) !important;
    box-shadow:0 12px 34px rgba(0,0,0,.16) !important;
  }

  #page-quickref .qr-card-header,
  #page-bear .qr-card-header,
  #page-pets .qr-card-header,
  #page-gear .qr-card-header,
  #page-timeline .qr-card-header,
  #page-kvk .qr-card-header,
  #page-vikings .qr-card-header,
  #page-transfer .qr-card-header,
  #page-joiner .qr-card-header,
  #page-tierlist .qr-card-header,
  #page-truegold .qr-card-header,
  #page-quickref .expand-trigger,
  #page-bear .expand-trigger,
  #page-pets .expand-trigger,
  #page-gear .expand-trigger,
  #page-timeline .expand-trigger,
  #page-kvk .expand-trigger,
  #page-vikings .expand-trigger,
  #page-transfer .expand-trigger,
  #page-joiner .expand-trigger,
  #page-tierlist .expand-trigger,
  #page-truegold .expand-trigger{
    background:linear-gradient(180deg,
      color-mix(in srgb, var(--surface) 86%, transparent),
      color-mix(in srgb, var(--surface2) 62%, transparent)
    ) !important;
    border-bottom:1px solid color-mix(in srgb, var(--border) 80%, transparent) !important;
    box-shadow:none !important;
  }

  #page-quickref .qr-card-header,
  #page-bear .qr-card-header,
  #page-pets .qr-card-header,
  #page-gear .qr-card-header,
  #page-timeline .qr-card-header,
  #page-kvk .qr-card-header,
  #page-vikings .qr-card-header,
  #page-transfer .qr-card-header,
  #page-joiner .qr-card-header,
  #page-tierlist .qr-card-header,
  #page-truegold .qr-card-header{
    padding:.95rem 1rem !important;
    border-radius:18px 18px 0 0 !important;
  }

  #page-quickref .qr-card-body,
  #page-bear .qr-card-body,
  #page-pets .qr-card-body,
  #page-gear .qr-card-body,
  #page-timeline .qr-card-body,
  #page-kvk .qr-card-body,
  #page-vikings .qr-card-body,
  #page-transfer .qr-card-body,
  #page-joiner .qr-card-body,
  #page-tierlist .qr-card-body,
  #page-truegold .qr-card-body,
  #page-quickref .expand-content,
  #page-bear .expand-content,
  #page-pets .expand-content,
  #page-gear .expand-content,
  #page-timeline .expand-content,
  #page-kvk .expand-content,
  #page-vikings .expand-content,
  #page-transfer .expand-content,
  #page-joiner .expand-content,
  #page-tierlist .expand-content,
  #page-truegold .expand-content{
    background:transparent !important;
  }

  #page-quickref .qr-card-header h3,
  #page-bear .qr-card-header h3,
  #page-pets .qr-card-header h3,
  #page-gear .qr-card-header h3,
  #page-timeline .qr-card-header h3,
  #page-kvk .qr-card-header h3,
  #page-vikings .qr-card-header h3,
  #page-transfer .qr-card-header h3,
  #page-joiner .qr-card-header h3,
  #page-tierlist .qr-card-header h3,
  #page-truegold .qr-card-header h3,
  #page-quickref .expand-trigger,
  #page-bear .expand-trigger,
  #page-pets .expand-trigger,
  #page-gear .expand-trigger,
  #page-timeline .expand-trigger,
  #page-kvk .expand-trigger,
  #page-vikings .expand-trigger,
  #page-transfer .expand-trigger,
  #page-joiner .expand-trigger,
  #page-tierlist .expand-trigger,
  #page-truegold .expand-trigger{
    color:var(--text) !important;
  }
}



/* v4.47 — Remaining calculator theme pass */
body.calc-theme-modern{
  --calc-modern-radius:20px;
}
body.calc-theme-modern .page-container,
body.calc-theme-modern .optimizer-shell{
  width:min(100%,1180px);
  max-width:1180px;
}
body.calc-theme-modern .calc-card,
body.calc-theme-modern .opt-card,
body.calc-theme-modern .opt-panel,
body.calc-theme-modern .k1245-panel,
body.calc-theme-modern .master-card{
  background:var(--surface);
  color:var(--text);
  border-color:var(--border);
}
@media(max-width:760px){
  body.calc-theme-modern .page-container,
  body.calc-theme-modern .optimizer-shell{
    padding-left:.85rem !important;
    padding-right:.85rem !important;
    overflow-x:hidden !important;
  }
}



/* v4.48 — Compact target calculator header repair */
body.calc-theme-modern .page-header,
body.calc-theme-modern .opt-hero{
  min-height:0;
}
body.calc-theme-modern .page-header::after,
body.calc-theme-modern .opt-hero::after{
  content:none;
}



/* v4.49 — Remove decorative page art images */
/* Only the homepage hero image should display. Remove old versus/menu decorative art from page headers. */
.page-header,
.opt-hero,
.calc-hero,
.hub-hero,
.calendar-hero,
.sim-hero,
.castle-hero-main,
body.calc-theme-modern .page-header,
body.calc-theme-modern .opt-hero,
html[data-theme="pink"] .page-header,
html[data-theme="fire"] .page-header,
html[data-theme="purple"] .page-header,
html[data-theme="pink"] body.calc-theme-modern .page-header,
html[data-theme="fire"] body.calc-theme-modern .page-header,
html[data-theme="purple"] body.calc-theme-modern .page-header,
html[data-theme="pink"] body.calc-theme-modern .opt-hero,
html[data-theme="fire"] body.calc-theme-modern .opt-hero,
html[data-theme="purple"] body.calc-theme-modern .opt-hero{
  background-image:linear-gradient(180deg,
    color-mix(in srgb,var(--surface) 96%,transparent),
    color-mix(in srgb,var(--surface2) 74%,transparent)
  ) !important;
}
.page-header::before,
.page-header::after,
.opt-hero::before,
.opt-hero::after,
body.calc-theme-modern .page-header::before,
body.calc-theme-modern .page-header::after,
body.calc-theme-modern .opt-hero::before,
body.calc-theme-modern .opt-hero::after{
  display:none !important;
  content:none !important;
  background:none !important;
  background-image:none !important;
}
.venator-theme-art{
  display:none !important;
}



/* v4.51 — Full-site consistency audit fixes */
.calc-footer{
  width:min(100% - 2rem,1180px) !important;
  max-width:1180px !important;
  margin:3rem auto 0 !important;
  padding:1.6rem 1.8rem 1.1rem !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:1.25rem !important;
  border:1px solid color-mix(in srgb,var(--border) 78%,transparent) !important;
  border-radius:22px 22px 0 0 !important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,transparent),color-mix(in srgb,var(--surface2) 72%,transparent)) !important;
  color:var(--text-dim) !important;
  box-sizing:border-box !important;
  box-shadow:0 14px 42px rgba(0,0,0,.10) !important;
}
.calc-footer strong{
  display:block !important;
  color:var(--text) !important;
  font-family:'Orbitron',sans-serif !important;
  letter-spacing:.08em !important;
}
.calc-footer span{
  display:block !important;
  margin-top:.35rem !important;
  color:var(--text-muted) !important;
  font-size:.82rem !important;
}
.calc-footer nav{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  gap:.75rem !important;
}
.calc-footer nav a{
  color:var(--text-dim) !important;
  text-decoration:none !important;
  font-weight:700 !important;
  font-size:.82rem !important;
}
.calc-footer nav a:hover{
  color:var(--gold) !important;
}

/* Standalone calculator/tool pages: same top/header behavior and no content hidden under header */
body:not(.events-calendar-page) > main.calc-shell,
body:not(.events-calendar-page) > main.hub-shell,
body:not(.events-calendar-page) > main.sim-shell,
body:not(.events-calendar-page) > main.optimizer-shell,
body:not(.events-calendar-page) > main.castle-shell,
body:not(.events-calendar-page) > main.changelog-shell,
body:not(.events-calendar-page) > main.page-container{
  padding-top:calc(var(--header-h,64px) + 1rem) !important;
}

/* Ensure three active themes control all standalone surfaces */
html[data-theme="pink"] body,
html[data-theme="fire"] body,
html[data-theme="purple"] body{
  background:var(--bg) !important;
  color:var(--text) !important;
}
html[data-theme="pink"] header,
html[data-theme="fire"] header,
html[data-theme="purple"] header{
  background:color-mix(in srgb,var(--bg) 88%,transparent) !important;
  border-bottom-color:var(--border) !important;
}
html[data-theme="pink"] .calc-footer,
html[data-theme="fire"] .calc-footer,
html[data-theme="purple"] .calc-footer{
  border-color:var(--border) !important;
}

/* Keep hidden / unsupported old decorative art from reappearing */
.venator-theme-art,
.page-header .venator-theme-art,
.opt-hero .venator-theme-art{
  display:none !important;
}
.page-header:not(#page-home .page-header),
.opt-hero,
.calc-hero,
.hub-hero,
.calendar-hero,
.sim-hero,
.castle-hero-main{
  background-image:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,transparent),color-mix(in srgb,var(--surface2) 74%,transparent)) !important;
}
.page-header::after,
.opt-hero::after{
  display:none !important;
  content:none !important;
}

/* Make no-sidebar standalone pages stable and centered */
body:not(.sidebar-open) main,
body.sidebar-open main,
body.sidebar-collapsed main{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Mobile normalization for all standalone pages */
@media(max-width:760px){
  body:not(.events-calendar-page) > main.calc-shell,
  body:not(.events-calendar-page) > main.hub-shell,
  body:not(.events-calendar-page) > main.sim-shell,
  body:not(.events-calendar-page) > main.optimizer-shell,
  body:not(.events-calendar-page) > main.castle-shell,
  body:not(.events-calendar-page) > main.changelog-shell,
  body:not(.events-calendar-page) > main.page-container{
    padding-top:calc(var(--header-h,64px) + .8rem) !important;
    padding-left:.85rem !important;
    padding-right:.85rem !important;
  }
  .calc-footer{
    width:calc(100% - 1rem) !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    margin-top:2rem !important;
    padding:1.2rem 1rem 1rem !important;
    border-radius:18px 18px 0 0 !important;
  }
  .calc-footer nav{
    justify-content:flex-start !important;
  }
  .header-inner{
    min-width:0 !important;
  }
  .logo{
    min-width:0 !important;
  }
}


/* v4.50 — Events page mobile header overlap fix: implemented in event-calendar.css and calc-style.css; marker retained for full-site audit consistency. */