/* OBSIDIAN / CYAN — original War of Dragons raid interface */
:root {
  --cyan:#35e7d2;
  --cyan-strong:#12cdbb;
  --cyan-soft:rgba(53,231,210,.11);
  --cyan-line:rgba(53,231,210,.28);
  --white:#f5fbfa;
  --muted:#91aaa8;
  --black:#030607;
  --surface:#091012;
  --surface-2:#0d1719;
  --surface-3:#122022;
  --line:rgba(222,255,251,.10);
  --danger:#ff5964;
  --accent-gold:#35e7d2;
  --text-gold:#35e7d2;
  --text-gold-bright:#bafff7;
  --border-gold:rgba(53,231,210,.38);
  --accent-gold-bg:rgba(53,231,210,.09);
  --accent-gold-border:rgba(53,231,210,.28);
  --font-serif:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-sans:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  color-scheme:dark;
}
html { background: #090b0e; }
body {
  color: var(--white);
  background: #090b0e;
  font-family: var(--font-sans);
}
body::before {
  display: none !important;
}
::selection { color:#001210; background:var(--cyan); }
::-webkit-scrollbar-track { background:#020505; }
::-webkit-scrollbar-thumb { background:#1a4d49; border-color:#020505; }

/* Header */
.site-header {
  position:sticky; top:0; background:rgba(3,6,7,.76); border:0;
  border-bottom:1px solid var(--line); backdrop-filter:blur(22px) saturate(135%);
  box-shadow:none;
}
.header-inner { max-width:1440px; min-height:72px; padding:12px 32px; }
.header-brand { gap:12px; }
.brand-icon {
  width:42px; height:42px; border-radius:11px;
  background:linear-gradient(145deg,rgba(53,231,210,.18),rgba(53,231,210,.025));
  border:1px solid var(--cyan-line);
  box-shadow:inset 0 1px rgba(255,255,255,.08),0 0 28px rgba(53,231,210,.08);
  transform:none;
}
.brand-icon svg { width:23px; height:23px; stroke:var(--cyan); }
.brand-text h1 {
  color:var(--white); -webkit-text-fill-color:var(--white); text-transform:none;
  font-size:1.05rem; letter-spacing:.025em; text-shadow:none;
}
.brand-subtitle { color:var(--cyan); font-size:.62rem; letter-spacing:.17em; }

.lang-selector { background:rgba(255,255,255,.025); border-color:var(--line); border-radius:10px; }
.lang-btn { color:#6f8583; font-family:var(--font-sans); }
.lang-btn.active {
  color:var(--cyan); background:var(--cyan-soft);
  box-shadow:inset 0 0 0 1px var(--cyan-line); border:0;
}

/* Unified application shell */
.parchment-shell {
  position:relative; max-width:none; margin:0; padding:0 0 64px;
  background:transparent; border:0; box-shadow:none;
}
.parchment-shell::before,.parchment-shell::after,.ornament { display:none; }

/* Hero */
.hero-section {
  max-width:1440px; padding:78px 32px 54px; text-align:left; gap:16px;
}
.hero-section::before {
  content:"DUNGEON INTELLIGENCE · 01"; color:var(--cyan);
  font:700 .68rem/1 var(--font-mono); letter-spacing:.2em;
}
.hero-title-row { flex-direction:row; align-items:flex-end; gap:30px; }
.hero-title {
  max-width:900px; color:var(--white); -webkit-text-fill-color:transparent;
  background:linear-gradient(105deg,#fff 15%,#d9fffa 62%,#51ead8);
  -webkit-background-clip:text; background-clip:text;
  font:750 clamp(2.8rem,5.1vw,5.7rem)/.94 var(--font-sans);
  letter-spacing:-.065em; text-shadow:none;
}
.hero-title::after { display:none; }
.hero-desc {
  max-width:730px; margin:0; color:#a0b5b3; font-size:1.03rem; line-height:1.75;
}
.hero-stats {
  order:initial; margin-left:auto; flex:0 0 auto; color:#77908d;
  border:1px solid var(--line); background:rgba(255,255,255,.022);
  padding:12px 15px; border-radius:10px; box-shadow:none;
}
.hero-stats span b { color:var(--cyan); }

/* Command bar */
.controls-section {
  position:sticky; top:72px; z-index:40; margin:0; padding:13px 32px;
  background:rgba(3,6,7,.84); border-top:1px solid var(--line);
  border-bottom:1px solid var(--line); box-shadow:none;
  backdrop-filter:blur(22px) saturate(135%);
}
.controls-inner { max-width:1440px; }
.search-input {
  min-height:46px; color:var(--white); background:rgba(255,255,255,.035);
  border-color:var(--line); border-radius:11px; font-family:var(--font-sans);
}
.search-input::placeholder { color:#617572; }
.search-input:focus {
  color:var(--white); background:rgba(255,255,255,.05);
  border-color:rgba(53,231,210,.58); box-shadow:0 0 0 3px rgba(53,231,210,.08);
}
.search-icon { color:#5c7c78; }
.filter-btn,.view-btn {
  min-height:40px; color:#839895; background:rgba(255,255,255,.025);
  border-color:var(--line); border-radius:9px; font-family:var(--font-sans);
}
.filter-btn:hover,.view-btn:hover { color:var(--white); background:rgba(255,255,255,.045); }
.filter-btn.active,.view-btn.active,
.filter-btn.diff-easy.active,.filter-btn.diff-medium.active,.filter-btn.diff-hard.active {
  color:#001411; background:var(--cyan); border-color:var(--cyan);
  box-shadow:0 0 22px rgba(53,231,210,.12);
}
.filter-btn.diff-easy.active::before,.filter-btn.diff-medium.active::before,
.filter-btn.diff-hard.active::before { background:#001411; box-shadow:none; }
.view-modes { padding:3px; background:rgba(255,255,255,.02); border-color:var(--line); border-radius:11px; }

/* Layout */
.main-wrapper {
  max-width:1440px; padding:0 32px; margin:32px auto 0;
  grid-template-columns:250px minmax(0,1fr); gap:28px;
}
.quick-jump-aside {
  top:145px; max-height:calc(100vh - 170px); overflow:auto;
  color:var(--white); background:rgba(9,16,18,.78);
  border:1px solid var(--line); border-radius:14px;
  box-shadow:0 20px 50px rgba(0,0,0,.18); backdrop-filter:blur(16px);
}
.quick-jump-header { border-color:var(--line); }
.quick-jump-header h3 { color:var(--cyan); font-family:var(--font-sans); letter-spacing:.09em; }
.quick-jump-count { color:#657976; }
.quick-jump-link { color:#849794; border-radius:8px; }
.quick-jump-link:hover { color:var(--white); background:var(--cyan-soft); transform:translateX(2px); }
.quick-jump-num { color:var(--cyan); }
.dot-easy,.dot-medium,.dot-hard { box-shadow:0 0 10px currentColor; }

/* Boss cards */
.boss-grid { gap:28px; }
.boss-card {
  color:var(--white); background:linear-gradient(145deg,rgba(13,23,25,.98),rgba(7,13,15,.98));
  border:1px solid var(--line); border-radius:15px;
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.boss-card::before {
  width:2px; background:linear-gradient(180deg,transparent,var(--cyan) 20%,var(--cyan) 80%,transparent);
  opacity:.85; box-shadow:0 0 14px rgba(53,231,210,.28);
}
.boss-card:hover {
  border-color:rgba(53,231,210,.25);
  box-shadow:0 28px 78px rgba(0,0,0,.38),0 0 40px rgba(53,231,210,.025);
}
.boss-card-header {
  min-height:78px; padding:18px 22px;
  background:linear-gradient(90deg,rgba(53,231,210,.055),transparent 58%);
  border-bottom:1px solid var(--line);
}
.boss-id-badge {
  color:var(--cyan); background:var(--cyan-soft); border-color:var(--cyan-line);
  border-radius:8px; box-shadow:none;
}
.boss-name { color:var(--white); font-family:var(--font-sans); font-size:1.35rem; letter-spacing:-.02em; text-shadow:none; }
.threat-badge,.threat-easy,.threat-medium,.threat-hard {
  color:#b7c8c6; background:rgba(255,255,255,.035);
  border-color:var(--line); border-radius:8px; box-shadow:none;
}
.bot-info-link {
  min-height:36px; color:var(--cyan); background:var(--cyan-soft);
  border-color:var(--cyan-line); border-radius:8px;
}
.bot-info-link:hover { color:#00120f; background:var(--cyan); border-color:var(--cyan); box-shadow:none; }
.boss-card-body { grid-template-columns:220px minmax(0,1fr); gap:24px; padding:22px; }
.boss-portrait-frame {
  border:1px solid rgba(53,231,210,.34); border-radius:12px;
  box-shadow:0 18px 45px rgba(0,0,0,.36),0 0 0 5px rgba(53,231,210,.025);
}
.portrait-label {
  color:#bafff7; background:linear-gradient(transparent,rgba(1,8,9,.96));
  font-family:var(--font-sans);
}
.minion-frame { border-color:var(--line); border-radius:8px; }
.boss-tactical-content { gap:14px; }
.loadout-box,.tactic-row,.combos-container,.variants-container {
  color:var(--white); background:rgba(255,255,255,.025);
  border:1px solid var(--line); border-radius:11px; box-shadow:none;
}
.loadout-title,.tactic-title,.combos-title,.variants-title {
  color:var(--cyan); font-family:var(--font-sans);
}
.loadout-summary-text,.tactic-text,.variant-desc { color:#d1dddb; }
.loadout-chip {
  min-height:32px; color:#b8c8c6; background:rgba(255,255,255,.032);
  border-color:var(--line); border-radius:8px;
}
.loadout-chip-qty { color:var(--white); }
.chip-impro,.chip-mana,.chip-heal,.chip-buff,.chip-summon,.chip-poison {
  color:#aaf9ef; background:rgba(53,231,210,.07); border-color:rgba(53,231,210,.22);
}
.tactical-warning-banner {
  min-height:60px; color:#ffb9be; background:linear-gradient(90deg,rgba(255,89,100,.14),rgba(255,89,100,.04));
  border:1px solid rgba(255,89,100,.34); border-left:3px solid var(--danger);
  border-radius:10px; box-shadow:none;
}
.warning-icon {
  color:#ff7a83; background:rgba(255,89,100,.12);
  border:1px solid rgba(255,89,100,.25); border-radius:9px; box-shadow:none;
}
.tactic-row:hover { background:rgba(255,255,255,.04); border-color:rgba(53,231,210,.18); }
.tactic-icon-box {
  background:#061012; border:1px solid var(--cyan-line); border-radius:10px;
  box-shadow:inset 0 0 18px rgba(53,231,210,.06);
}
.tactic-icon-placeholder,.tactic-icon-warning,.tactic-icon-action,
.tactic-icon-tip,.tactic-icon-mechanic,.tactic-icon-summon {
  color:var(--cyan); background:rgba(53,231,210,.055);
  box-shadow:none;
}
.tactic-icon-warning { color:#ff7a83; background:rgba(255,89,100,.08); }
.timer-start-btn {
  color:var(--cyan); background:var(--cyan-soft); border-color:var(--cyan-line); border-radius:8px;
}
.timer-start-btn:hover { color:#00120f; background:var(--cyan); box-shadow:none; }
.timer-display { color:var(--cyan); }
.combo-card,.variant-card { background:rgba(255,255,255,.025); border-color:var(--line); }
.compact-table-wrap { background:var(--surface); border-color:var(--line); border-radius:14px; }
.compact-table th { color:var(--cyan); background:#071012; border-color:var(--line); }
.compact-table td { color:#d1dddb; border-color:var(--line); }
.compact-table tr:hover td { background:rgba(53,231,210,.04); }
.compact-name-link { color:var(--cyan); }

/* Footer */
.site-footer {
  margin:0; color:#667b78; background:#020505; border-top:1px solid var(--line);
}
.footer-title { color:var(--white); font-family:var(--font-sans); }
.back-to-top-btn { color:var(--cyan); background:var(--cyan-soft); border-color:var(--cyan-line); border-radius:9px; }
.back-to-top-btn:hover { color:#00120f; background:var(--cyan); border-color:var(--cyan); }

/* Semantic colors — difficulty and item categories stay instantly scannable */
.threat-easy {
  color:#59e5ad;
  background:rgba(53,216,159,.10);
  border-color:rgba(53,216,159,.34);
}
.threat-medium {
  color:#ffc857;
  background:rgba(245,185,66,.10);
  border-color:rgba(245,185,66,.34);
}
.threat-hard {
  color:#ff7a83;
  background:rgba(255,89,100,.11);
  border-color:rgba(255,89,100,.38);
  box-shadow:0 0 18px rgba(255,89,100,.07);
}
.filter-btn.diff-easy.active {
  color:#03140e;
  background:#35d89f;
  border-color:#35d89f;
}
.filter-btn.diff-medium.active {
  color:#1b1000;
  background:#f5b942;
  border-color:#f5b942;
}
.filter-btn.diff-hard.active {
  color:#1c0204;
  background:#ff5964;
  border-color:#ff5964;
}
.filter-btn.diff-easy.active::before,
.filter-btn.diff-medium.active::before,
.filter-btn.diff-hard.active::before { background:currentColor; }
.chip-impro {
  color:#70f3e4;
  background:rgba(53,231,210,.08);
  border-color:rgba(53,231,210,.27);
}
.chip-mana {
  color:#67c9ff;
  background:rgba(56,189,248,.09);
  border-color:rgba(56,189,248,.28);
}
.chip-heal {
  color:#ff91ac;
  background:rgba(251,113,133,.09);
  border-color:rgba(251,113,133,.28);
}
.chip-buff {
  color:#ffad70;
  background:rgba(251,146,60,.09);
  border-color:rgba(251,146,60,.28);
}
.chip-summon {
  color:#d4a6ff;
  background:rgba(192,132,252,.09);
  border-color:rgba(192,132,252,.28);
}
.chip-poison {
  color:#bdf26b;
  background:rgba(163,230,53,.09);
  border-color:rgba(163,230,53,.28);
}

@media (max-width:1080px) {
  .main-wrapper { grid-template-columns:1fr; }
  .quick-jump-aside { display:none; }
}
@media (max-width:768px) {
  .header-inner { min-height:68px; padding:10px 18px; }
  .hero-section { padding:52px 20px 36px; }
  .hero-title-row { flex-direction:column; align-items:flex-start; }
  .hero-title { font-size:clamp(2.75rem,14vw,4rem); }
  .hero-stats { width:100%; margin:4px 0 0; justify-content:center; }
  .controls-section { top:68px; padding:12px 18px; }
  .main-wrapper { padding:0 18px; margin-top:22px; }
  .boss-card-body { grid-template-columns:1fr; padding:16px; }
  .boss-portraits-wrap { max-width:260px; width:100%; margin:0 auto; }
}
@media (max-width:480px) {
  .brand-text h1 { font-size:.94rem; }
  .brand-subtitle { display:none; }
  
  
  .hero-title { font-size:2.75rem; }
  .boss-name { font-size:1.12rem; }
}
/* Cinematic MMORPG environment background */
body {
  background-color:#020708;
  background-image:
    linear-gradient(180deg,rgba(1,7,8,.48) 0%,rgba(1,7,8,.74) 42%,rgba(1,6,7,.94) 78%,#020506 100%),
    linear-gradient(90deg,rgba(1,6,7,.62),rgba(1,7,8,.12) 42%,rgba(1,6,7,.54)),
    url('../images/labyrinth-bg.jpg');
  background-size:cover,cover,cover;
  background-position:center top,center top,center top;
  background-repeat:no-repeat;
  background-attachment:fixed;
}
body::before {
  background:
    radial-gradient(700px 380px at 52% 16%,rgba(82,245,226,.09),transparent 70%),
    linear-gradient(180deg,transparent 0 640px,rgba(1,5,6,.76) 900px,#020506 1450px);
}
.hero-section {
  min-height:440px;
  justify-content:center;
  position:relative;
}
.hero-section::after {
  content:"";
  position:absolute;
  left:32px;
  bottom:42px;
  width:96px;
  height:1px;
  background:linear-gradient(90deg,var(--cyan),transparent);
  box-shadow:0 0 16px rgba(53,231,210,.35);
}
.boss-card,.quick-jump-aside {
  backdrop-filter:blur(18px) saturate(115%);
}
@media (max-width:768px) {
  body {
    background-position:center top,center top,center top;
    background-size:100% 650px,100% 650px,auto 650px;
    background-attachment:scroll;
  }
  .hero-section { min-height:390px; }
  .hero-section::after { left:20px; bottom:28px; }
  .boss-card { opacity:1; transform:none; }
}
