/* Honkai Impact 3rd — crimson Honkai energy, holo-cyan tech, hex lattices */
:root {
  --bg: #0b0710;
  --bg-2: #1a0c1c;
  --surface: rgba(30, 16, 34, .7);
  --surface-2: rgba(48, 26, 52, .72);
  --surface-solid: #1a0f1d;
  --border: rgba(255, 110, 160, .14);
  --border-strong: rgba(255, 110, 160, .3);
  --text: #fbeef4;
  --text-2: #cdb3c2;
  --text-3: #93798a;
  --accent: #ff4f8b;
  --accent-2: #6fe7ff;
  --accent-ink: #1a0510;
  --glow: rgba(255, 79, 139, .42);
  --font-display: "Orbitron", "Outfit", sans-serif;
  --display-weight: 800;
  --display-transform: uppercase;
  --display-spacing: .04em;
  --radius: 8px;
  --radius-lg: 12px;
}
.theme-hi3 .fx-gradient {
  background:
    radial-gradient(50% 45% at 90% 5%, rgba(255, 79, 139, .26), transparent 70%),
    radial-gradient(40% 40% at 5% 20%, rgba(111, 231, 255, .12), transparent 70%),
    radial-gradient(80% 60% at 50% 115%, rgba(150, 20, 70, .35), transparent 70%),
    linear-gradient(180deg, #1c0b1d, #0b0710 60%);
}
.theme-hi3 .fx-overlay {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='98' viewBox='0 0 56 98'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zm0 32L0 82V66' fill='none' stroke='%23ff4f8b' stroke-opacity='.07' stroke-width='1'/%3E%3C/svg%3E"),
    radial-gradient(120% 90% at 50% 30%, transparent 55%, rgba(0,0,0,.6));
}
.theme-hi3 .panel, .theme-hi3 .tool-card, .theme-hi3 .team-card, .theme-hi3 .news-card, .theme-hi3 .build-card, .theme-hi3 .char-card, .theme-hi3 .filters {
  clip-path: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px);
}
.theme-hi3 .panel { background: linear-gradient(160deg, rgba(60, 20, 50, .6), rgba(20, 10, 24, .75)); box-shadow: inset 0 1px 0 rgba(255,79,139,.25); }
.theme-hi3 .btn { border-radius: 4px; text-transform: uppercase; letter-spacing: .1em; font-size: .82rem; font-weight: 700; clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%); padding-inline: 1.5rem; }
.theme-hi3 .btn-primary { --btn-bg: linear-gradient(100deg, #ff4f8b, #ff7a59); --btn-fg: #fff; }
.theme-hi3 .kicker { color: var(--accent-2); font-family: var(--font-display); font-size: .7rem; }
.theme-hi3 .kicker::before { background: var(--accent-2); box-shadow: 0 0 10px var(--accent-2); }
.theme-hi3 .section-title, .theme-hi3 .page-title { font-size: clamp(1.6rem, 3.4vw, 2.5rem); }
.theme-hi3 .hero-name, .theme-hi3 .char-name { font-size: clamp(2.2rem, 6vw, 4.8rem); line-height: 1.05; text-shadow: 0 0 40px rgba(255,79,139,.45); }
.theme-hi3 .char-card-name { font-family: var(--font-display); text-transform: uppercase; font-size: .88rem; letter-spacing: .04em; line-height: 1.25; }
.theme-hi3 .char-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; z-index: 2; background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.theme-hi3 .sticky-tabs a { font-family: var(--font-display); text-transform: uppercase; font-size: .78rem; letter-spacing: .1em; }
.theme-hi3 .subnav-links a.is-active::after { background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.theme-hi3 .chip { border-radius: 3px; }
.theme-hi3 .panel-title { font-family: var(--font-display); text-transform: uppercase; font-size: .95rem; letter-spacing: .08em; }
.theme-hi3 .hero-thumb { border-radius: 6px; }