/* Crown Neo — editorial 3D redesign layer */
:root {
  --crown-ink: #0b090d;
  --crown-ink-2: #151018;
  --crown-paper: #fff9f3;
  --crown-coral: #ff7654;
  --crown-coral-soft: #ff9a7e;
  --crown-violet: #8d64ff;
  --crown-lime: #c9ff5d;
  --crown-cyan: #63e6ff;
  --crown-pink: #ff77c8;
  --crown-gold: #f7c86c;
  --crown-line: rgba(255, 255, 255, .12);
  --crown-ease: cubic-bezier(.22, 1, .36, 1);
}

html { background: var(--crown-ink); }
body {
  background: var(--crown-ink);
  font-family: 'Inter', sans-serif;
  letter-spacing: -.01em;
}

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

::selection { color: #120d0e; background: var(--crown-coral-soft); }

.hidden { display: none !important; }
.eyebrow, .section-kicker, .breadcrumb, .nav-label {
  font-weight: 800 !important;
  letter-spacing: .16em !important;
}

.eyebrow-dot, .status-dot, .secure-pill i, .secure i {
  background: currentColor !important;
  box-shadow: 0 0 18px currentColor !important;
}

.brand-mark img, .workspace-icon img, .core-orb img, .brand-image img, .vault-orb img {
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, .35));
}

/* Shared interactive language */
.primary-button, .primary {
  position: relative;
  overflow: hidden;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--crown-coral) !important;
  color: #170d0a !important;
  box-shadow: 0 18px 42px rgba(255, 118, 84, .24) !important;
  font-weight: 800 !important;
  letter-spacing: -.01em;
  transition: transform .22s var(--crown-ease), box-shadow .22s, background .22s !important;
}

.primary-button:hover, .primary:hover {
  transform: translateY(-3px) scale(1.015);
  background: #ff8b6d !important;
  box-shadow: 0 24px 56px rgba(255, 118, 84, .32) !important;
}

.secondary-button, .icon-button, .mini-button, .warning-button, .danger-button, .text-button,
button, a { transition-timing-function: var(--crown-ease) !important; }

input, select, textarea, .input-shell, .search-shell, .input {
  border-radius: 14px !important;
}

/* ADMIN LOGIN — cinematic crown campaign */
body[data-page='admin-login'] .visual-layer {
  background: var(--crown-ink);
}

body[data-page='admin-login'] .aurora,
body[data-page='admin-login'] .grid-bg,
body[data-page='admin-login'] .spotlight { opacity: 0 !important; }

.login-shell {
  min-height: 100svh;
  grid-template-columns: minmax(0, 1.45fr) minmax(390px, .72fr) !important;
  background: var(--crown-ink);
}

.login-showcase {
  isolation: isolate;
  min-height: 100svh;
  padding: clamp(28px, 4vw, 68px) !important;
  border-right: 0 !important;
  background-image:
    linear-gradient(90deg, rgba(9, 6, 10, .34), rgba(9, 6, 10, .02) 50%, rgba(9, 6, 10, .3)),
    linear-gradient(0deg, rgba(9, 6, 10, .84), transparent 48%),
    url('/assets/crown-hero-8k.webp') !important;
  background-size: cover !important;
  background-position: center !important;
}

.login-showcase::before {
  content: 'CROWN';
  position: absolute;
  left: clamp(24px, 4vw, 70px);
  top: 13%;
  z-index: -1;
  color: rgba(255, 255, 255, .11);
  font: 400 clamp(110px, 20vw, 340px)/.8 'Anton', sans-serif;
  letter-spacing: -.055em;
  white-space: nowrap;
}

.showcase-brand { position: relative; z-index: 2; }
.showcase-brand strong, .sidebar-brand strong, .mobile-brand strong {
  font-family: 'Anton', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.showcase-brand .brand-mark {
  width: 54px !important;
  height: 54px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  background: rgba(10, 7, 12, .45) !important;
  backdrop-filter: blur(18px);
}

.showcase-copy { max-width: 740px !important; margin-top: auto !important; margin-bottom: 4vh !important; }
.showcase-copy .eyebrow { color: var(--crown-coral-soft) !important; }
.showcase-copy h1 {
  max-width: 780px;
  margin: 20px 0 24px !important;
  color: #fff !important;
  font: 400 clamp(60px, 8.2vw, 138px)/.84 'Anton', sans-serif !important;
  letter-spacing: -.045em !important;
  text-transform: uppercase;
  text-wrap: balance;
}

.showcase-copy h1 span {
  color: var(--crown-coral) !important;
  background: none !important;
  -webkit-text-fill-color: initial !important;
}

.showcase-copy > p { max-width: 570px !important; color: rgba(255,255,255,.72) !important; font-size: 16px !important; }
.showcase-orbit { display: none !important; }
.showcase-points {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1px !important;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.14);
  backdrop-filter: blur(22px);
}
.showcase-points > div { min-height: 90px; padding: 18px !important; background: rgba(10,7,12,.62); border: 0 !important; }
.showcase-points > div > span { color: var(--crown-coral) !important; font-family: 'Anton', sans-serif; font-size: 18px !important; }

.login-panel {
  position: relative;
  padding: clamp(24px, 4vw, 64px) !important;
  background: linear-gradient(160deg, var(--crown-coral-soft), var(--crown-coral) 58%, #d65039) !important;
}
.login-panel::before {
  content: 'ACCESS';
  position: absolute;
  right: -22px;
  top: 25px;
  color: rgba(35, 13, 8, .09);
  font: 400 92px/1 'Anton', sans-serif;
  writing-mode: vertical-rl;
}
.login-card {
  width: min(460px, 100%) !important;
  padding: clamp(26px, 3vw, 44px) !important;
  border: 1px solid rgba(255,255,255,.17) !important;
  border-radius: 28px !important;
  background: rgba(16, 11, 15, .92) !important;
  box-shadow: 0 40px 100px rgba(60, 15, 7, .32) !important;
  backdrop-filter: blur(30px);
}
.login-heading h2 { font: 400 42px/1.04 'Anton', sans-serif !important; letter-spacing: -.025em; text-transform: uppercase; }
.login-heading .eyebrow, .login-topline .secure-pill { color: var(--crown-coral-soft) !important; }
.login-form .input-shell { background: #201920 !important; border-color: rgba(255,255,255,.12) !important; }
.login-form .input-shell:focus-within { border-color: var(--crown-coral) !important; box-shadow: 0 0 0 4px rgba(255,118,84,.13) !important; }
.login-button { min-height: 56px; }

/* ADMIN APPLICATION SHELL */
body[data-page='admin-app'] {
  --page-accent: var(--crown-coral);
  --page-soft: #ffb29d;
  background: #0d0b0f;
}
body[data-page='admin-app'][data-section='products'] { --page-accent: var(--crown-lime); --page-soft: #e5ffad; }
body[data-page='admin-app'][data-section='developer'] { --page-accent: var(--crown-cyan); --page-soft: #b9f4ff; }
body[data-page='admin-app'][data-section='obfuscator'] { --page-accent: var(--crown-pink); --page-soft: #ffb7df; }

body[data-page='admin-app'] .app-shell { background: #0d0b0f !important; }
body[data-page='admin-app'] .visual-layer {
  opacity: .7;
  background:
    radial-gradient(circle at 75% 10%, color-mix(in srgb, var(--page-accent) 14%, transparent), transparent 27%),
    #0d0b0f;
  transition: background .6s var(--crown-ease);
}
body[data-page='admin-app'] .aurora { opacity: .06 !important; background: var(--page-accent) !important; }

.sidebar {
  width: 272px !important;
  padding: 24px 18px !important;
  border-right: 1px solid rgba(255,255,255,.09) !important;
  background: rgba(10, 8, 11, .86) !important;
  backdrop-filter: blur(32px) saturate(120%);
}
.sidebar-head { padding: 0 6px 20px !important; }
.sidebar-brand .brand-mark, .workspace-icon {
  border-radius: 14px !important;
  background: #1d1620 !important;
  border: 1px solid rgba(255,255,255,.1) !important;
}
.workspace-card {
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 17px !important;
  background: linear-gradient(130deg, rgba(255,255,255,.07), rgba(255,255,255,.02)) !important;
}
.workspace-card > span { color: #170d0a !important; background: var(--crown-gold) !important; }
.nav-label { margin-left: 13px !important; }
.nav-item {
  margin: 4px 0;
  min-height: 48px;
  border-radius: 13px !important;
  border: 1px solid transparent !important;
}
.nav-item:hover { background: rgba(255,255,255,.045) !important; }
.nav-item.active {
  color: #110d0c !important;
  background: var(--page-accent) !important;
  box-shadow: 0 12px 30px color-mix(in srgb, var(--page-accent) 18%, transparent) !important;
}
.nav-item.active .nav-icon, .nav-item.active kbd { color: #110d0c !important; }
.sidebar-tip { border-radius: 17px !important; background: rgba(255,255,255,.035) !important; }
.customer-portal-button { border-radius: 999px !important; }

.content { margin-left: 272px !important; }
.topbar {
  height: 92px !important;
  padding: 0 clamp(22px, 3.5vw, 58px) !important;
  border-color: rgba(255,255,255,.09) !important;
  background: rgba(13,11,15,.78) !important;
  backdrop-filter: blur(28px);
}
.topbar h2 { font: 400 24px/1 'Anton', sans-serif !important; text-transform: uppercase; letter-spacing: .01em; }
.breadcrumb b, .breadcrumbCurrent, #breadcrumbCurrent { color: var(--page-accent) !important; }
.view-stack { padding: clamp(22px, 3vw, 52px) !important; animation: pageReveal .55s var(--crown-ease) both; }
@keyframes pageReveal { from { opacity: 0; transform: translateY(18px); } }

.panel, .stat-card, .product-card {
  border-color: rgba(255,255,255,.1) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035), 0 24px 70px rgba(0,0,0,.16);
  backdrop-filter: blur(22px);
}
.panel, .stat-card { border-radius: 20px !important; }
.section-kicker, .count-badge { color: var(--page-accent) !important; }

/* Licenses — coral command center */
.hero-panel {
  min-height: 340px !important;
  padding: clamp(28px, 5vw, 74px) !important;
  border: 0 !important;
  border-radius: 28px !important;
  color: #190d09 !important;
  background:
    linear-gradient(90deg, rgba(255,145,112,.98) 0%, rgba(255,118,84,.94) 48%, rgba(255,118,84,.26) 72%),
    url('/assets/crown-hero-8k.webp') right 38% center / cover no-repeat !important;
  box-shadow: 0 30px 90px rgba(255,118,84,.14) !important;
  overflow: hidden;
}
.hero-panel::after {
  content: 'LICENSES';
  position: absolute;
  right: 2%; bottom: -6%;
  font: 400 clamp(80px, 13vw, 190px)/.8 'Anton', sans-serif;
  color: rgba(30, 10, 7, .09);
  pointer-events: none;
}
.hero-panel .eyebrow, .hero-panel p { color: rgba(25,13,9,.7) !important; }
.hero-panel h1 { color: #190d09 !important; font: 400 clamp(52px, 6.5vw, 100px)/.9 'Anton', sans-serif !important; text-transform: uppercase; letter-spacing: -.04em; }
.hero-panel .secondary-button { color: #190d09 !important; border-color: rgba(25,13,9,.25) !important; }
.hero-panel .primary-button { background: #140d0d !important; color: #fff !important; box-shadow: none !important; }
.health-widget { background: rgba(17,9,9,.88) !important; color: #fff !important; border: 1px solid rgba(255,255,255,.12) !important; }
.health-ring { background: conic-gradient(var(--crown-coral) var(--health), rgba(255,255,255,.1) 0) !important; }
.stat-card { overflow: hidden; }
.stat-card::after { content: ''; position: absolute; inset: auto 0 0; height: 3px; background: var(--page-accent); opacity: .7; }
.stat-value strong { font-family: 'Anton', sans-serif !important; font-weight: 400 !important; font-size: 42px !important; }
.table-panel { border-radius: 26px !important; }
thead th { color: rgba(255,255,255,.46) !important; }
tbody tr:hover { background: rgba(255,118,84,.06) !important; }
.customer-avatar { background: var(--crown-coral) !important; color: #180d09 !important; }
.usage-track i, .performance-fill { background: var(--page-accent) !important; }

/* Products — acid catalog */
.products-hero {
  position: relative;
  min-height: 310px;
  padding: clamp(30px, 5vw, 74px) !important;
  border-radius: 28px !important;
  color: #0d1106;
  background: var(--crown-lime) !important;
  overflow: hidden;
}
.products-hero::after {
  content: 'PRODUCTS';
  position: absolute;
  right: -1%; bottom: -17%;
  color: rgba(13,17,6,.1);
  font: 400 clamp(110px, 18vw, 250px)/1 'Anton', sans-serif;
}
.products-hero > div { position: relative; z-index: 1; max-width: 760px; }
.products-hero h3 { max-width: 720px; font: 400 clamp(56px, 7vw, 110px)/.88 'Anton', sans-serif !important; text-transform: uppercase; letter-spacing: -.045em; }
.products-hero p { color: rgba(13,17,6,.66) !important; }
.products-hero .primary-button { z-index: 2; background: #11120e !important; color: #fff !important; }
.products-panel { margin-top: 24px; }
.product-grid { gap: 16px !important; }
.product-card { min-height: 255px; border-radius: 22px !important; }
.product-card:hover { transform: translateY(-7px) rotate(-.5deg) !important; border-color: rgba(201,255,93,.45) !important; }
.product-glyph { color: #101309 !important; background: var(--crown-lime) !important; }
.product-code { color: var(--crown-lime) !important; }

/* Developer wiki — electric blueprint */
.wiki-hero {
  position: relative;
  min-height: 330px;
  padding: clamp(30px, 5vw, 72px) !important;
  border-radius: 28px !important;
  color: #051419;
  background-color: var(--crown-cyan) !important;
  background-image: linear-gradient(rgba(5,20,25,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(5,20,25,.08) 1px, transparent 1px) !important;
  background-size: 30px 30px !important;
  overflow: hidden;
}
.wiki-hero::after { content: '</>'; position: absolute; right: 4%; bottom: -24%; font: 400 240px/1 'Anton', sans-serif; color: rgba(5,20,25,.1); }
.wiki-hero > div:first-child { position: relative; z-index: 1; }
.wiki-hero h3 { max-width: 790px; color: #051419 !important; font: 400 clamp(50px, 6.5vw, 100px)/.9 'Anton', sans-serif !important; text-transform: uppercase; letter-spacing: -.04em; }
.wiki-hero p, .wiki-hero .eyebrow { color: rgba(5,20,25,.68) !important; }
.wiki-endpoint-card { position: relative; z-index: 2; background: #081216 !important; border: 1px solid rgba(255,255,255,.12) !important; }
.wiki-layout { align-items: start; }
.wiki-toc { top: 116px !important; }
.wiki-toc a:hover { color: var(--crown-cyan) !important; transform: translateX(5px); }
.wiki-section { border-radius: 24px !important; }
.wiki-section-head > span { color: #071317 !important; background: var(--crown-cyan) !important; font-family: 'Anton', sans-serif !important; font-size: 18px !important; }
.code-card { border-color: rgba(99,230,255,.16) !important; background: #070c10 !important; }
.code-head { background: #10191f !important; }
.code-head button, .wiki-section code { color: var(--crown-cyan) !important; }

/* Obfuscator — hot pink private lab */
.obfuscator-hero {
  position: relative;
  min-height: 320px;
  padding: clamp(30px, 5vw, 72px) !important;
  border-radius: 28px !important;
  color: #1a0712;
  background: radial-gradient(circle at 78% 50%, rgba(255,255,255,.34), transparent 22%), var(--crown-pink) !important;
  overflow: hidden;
}
.obfuscator-hero::after { content: 'ENCRYPT'; position: absolute; right: -2%; bottom: -13%; color: rgba(26,7,18,.09); font: 400 clamp(105px,17vw,240px)/1 'Anton', sans-serif; }
.obfuscator-hero > div { position: relative; z-index: 2; }
.obfuscator-hero h3 { color: #1a0712 !important; font: 400 clamp(52px, 6.5vw, 100px)/.9 'Anton', sans-serif !important; text-transform: uppercase; letter-spacing: -.04em; }
.obfuscator-hero p, .obfuscator-hero .eyebrow { color: rgba(26,7,18,.68) !important; }
.obfuscator-status { position: relative; z-index: 2; background: #160d14 !important; border-color: rgba(255,255,255,.14) !important; }
.jar-dropzone { border: 1px dashed rgba(255,119,200,.42) !important; border-radius: 22px !important; background: rgba(255,119,200,.035) !important; }
.jar-dropzone:hover, .jar-dropzone.dragging { border-color: var(--crown-pink) !important; background: rgba(255,119,200,.08) !important; }
.jar-drop-icon, .jar-dropzone b { color: var(--crown-pink) !important; }
.preset-card { border-radius: 17px !important; }
.preset-card.selected { border-color: var(--crown-pink) !important; background: rgba(255,119,200,.08) !important; }
.obfuscate-submit { background: var(--crown-pink) !important; }

/* Modals and command palette */
.modal::backdrop { background: rgba(5,4,6,.78) !important; backdrop-filter: blur(12px); }
.modal-card, .command-box, .confirm-card {
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 26px !important;
  background: #171218 !important;
  box-shadow: 0 45px 120px rgba(0,0,0,.58) !important;
}
.modal-head h3, .confirm-card h3 { font: 400 34px/1 'Anton', sans-serif !important; text-transform: uppercase; }
.toast { border-radius: 16px !important; background: #171218 !important; }

/* CUSTOMER AUTH — gallery-like split scene */
body[data-page='customer-auth'] { background: var(--crown-ink) !important; }
body[data-page='customer-auth'] .ambient { opacity: 0 !important; }
.auth-layout {
  min-height: 100svh !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(400px, .65fr) !important;
  background: var(--crown-ink) !important;
}
.auth-story {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  padding: clamp(28px,4vw,66px) !important;
  border: 0 !important;
  background:
    linear-gradient(0deg, rgba(8,6,9,.88), transparent 57%),
    linear-gradient(90deg, rgba(8,6,9,.12), rgba(8,6,9,.06)),
    url('/assets/crown-hero-8k.webp') center / cover no-repeat !important;
}
.auth-story::after { content: 'YOUR KEYS'; position: absolute; z-index: -1; left: 4vw; top: 16%; color: rgba(255,255,255,.1); font: 400 clamp(90px,15vw,240px)/.84 'Anton', sans-serif; letter-spacing: -.05em; }
.auth-story .brand { position: relative; z-index: 2; }
.auth-story .brand strong { font-family: 'Anton', sans-serif !important; font-weight: 400 !important; text-transform: uppercase; letter-spacing: .03em; }
.auth-story .brand-image { background: rgba(10,7,12,.5) !important; backdrop-filter: blur(18px); }
.story-copy { margin: auto 0 4vh !important; max-width: 760px !important; }
.story-copy h1 { color: #fff !important; font: 400 clamp(62px,8vw,132px)/.84 'Anton', sans-serif !important; letter-spacing: -.045em !important; text-transform: uppercase; }
.story-copy h1 em { color: var(--crown-coral) !important; background: none !important; -webkit-text-fill-color: initial !important; }
.story-copy > p:last-child { color: rgba(255,255,255,.7) !important; }
.feature-row { gap: 1px !important; border: 1px solid rgba(255,255,255,.15); border-radius: 18px; overflow: hidden; background: rgba(255,255,255,.13); }
.feature-row article { border: 0 !important; border-radius: 0 !important; background: rgba(10,7,12,.7) !important; backdrop-filter: blur(18px); }
.feature-row span { color: var(--crown-coral) !important; }
.auth-panel { position: relative; padding: clamp(22px,3vw,50px) !important; background: linear-gradient(155deg, #ff9b7f, var(--crown-coral)) !important; }
.auth-panel::before { content: 'PORTAL'; position: absolute; right: -10px; bottom: 20px; color: rgba(34,11,7,.08); writing-mode: vertical-rl; font: 400 90px/1 'Anton', sans-serif; }
.auth-card {
  position: relative;
  width: min(500px,100%) !important;
  max-height: calc(100svh - 44px);
  overflow: auto;
  padding: clamp(24px,3vw,38px) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 28px !important;
  background: rgba(16,11,15,.94) !important;
  box-shadow: 0 38px 100px rgba(73,19,9,.32) !important;
}
.tabs button.active { color: var(--crown-coral-soft) !important; }
.tabs > span { background: var(--crown-coral) !important; }
.oauth { border-radius: 14px !important; }
.oauth:hover { border-color: rgba(255,118,84,.48) !important; }
.auth-form h2 { font: 400 34px/1 'Anton', sans-serif !important; text-transform: uppercase; }
.auth-form .input { background: #201920 !important; }
.auth-form .input:focus-within { border-color: var(--crown-coral) !important; box-shadow: 0 0 0 4px rgba(255,118,84,.12) !important; }

/* CUSTOMER PORTAL — warm vault */
body[data-page='customer-portal'] { background: #0d0b0f !important; }
body[data-page='customer-portal'] .ambient { opacity: .6; }
body[data-page='customer-portal'] .ambient > i:first-child { background: var(--crown-coral) !important; }
.portal { grid-template-columns: 270px 1fr !important; background: #0d0b0f !important; }
.portal aside {
  width: 270px;
  padding: 28px 22px !important;
  border: 0 !important;
  background: var(--crown-coral) !important;
  color: #1a0c08 !important;
}
.portal aside .brand { color: #1a0c08 !important; }
.portal aside .brand small { color: rgba(26,12,8,.58) !important; }
.portal aside .brand-image { background: #181014 !important; border-color: rgba(255,255,255,.22) !important; }
.portal nav button { color: #fff !important; border: 0 !important; background: #181014 !important; border-radius: 999px !important; }
.account-card { border: 1px solid rgba(26,12,8,.18) !important; background: rgba(255,255,255,.2) !important; }
.account-card > div { color: #fff !important; background: #181014 !important; }
.account-card small { color: rgba(26,12,8,.6) !important; }
.logout { color: rgba(26,12,8,.72) !important; font-weight: 700; }
.portal-content { padding: 0 clamp(22px,4vw,64px) 64px !important; }
.portal-content .topbar { margin: 0 !important; padding: 0 !important; background: transparent !important; }
.welcome { min-height: 320px !important; }
.welcome h1 { font: 400 clamp(52px,6vw,92px)/.9 'Anton', sans-serif !important; text-transform: uppercase; letter-spacing: -.04em; }
.welcome h1 span { color: var(--crown-coral) !important; background: none !important; -webkit-text-fill-color: initial !important; }
.vault-orb { border-color: rgba(255,118,84,.22) !important; background: radial-gradient(circle, rgba(255,118,84,.22), transparent 66%) !important; }
.stats article { border-radius: 18px !important; border-color: rgba(255,255,255,.1) !important; background: rgba(255,255,255,.035) !important; }
.stats strong { font-family: 'Anton', sans-serif !important; font-weight: 400 !important; font-size: 30px !important; }
.license-section { border-radius: 26px !important; }
.license-card { border-radius: 20px !important; }
.license-card:hover { border-color: rgba(255,118,84,.45) !important; transform: translateY(-5px) !important; }
.product-badge > span { color: #190d09 !important; background: var(--crown-coral) !important; }
.usage-bar i { background: linear-gradient(90deg, var(--crown-coral), var(--crown-gold)) !important; }

/* Light mode remains functional while preserving the identity. */
[data-theme='light'] body[data-page='admin-app'] { background: #f6efe9 !important; color: #181114; }
[data-theme='light'] body[data-page='admin-app'] .app-shell { background: #f6efe9 !important; }
[data-theme='light'] body[data-page='admin-app'] .content { color: #181114; }
[data-theme='light'] body[data-page='admin-app'] .topbar { background: rgba(246,239,233,.82) !important; }
[data-theme='light'] body[data-page='admin-app'] .panel,
[data-theme='light'] body[data-page='admin-app'] .stat-card,
[data-theme='light'] body[data-page='admin-app'] .product-card { background: rgba(255,255,255,.72) !important; border-color: rgba(24,17,20,.1) !important; }

@media (max-width: 1100px) {
  .login-shell, .auth-layout { grid-template-columns: 1fr !important; }
  .login-showcase, .auth-story { min-height: 60svh; }
  .login-panel, .auth-panel { min-height: 40svh; }
  .login-card, .auth-card { margin: 0 auto; }
  .content { margin-left: 0 !important; }
  .sidebar { width: 284px !important; }
  .portal { grid-template-columns: 1fr !important; }
  .portal aside { position: relative !important; width: 100%; height: auto !important; }
  .portal-content { padding-top: 0 !important; }
}

@media (max-width: 760px) {
  .login-showcase, .auth-story { display: flex !important; min-height: 52svh; padding: 24px !important; }
  .showcase-copy, .story-copy { margin-top: auto !important; }
  .showcase-copy h1, .story-copy h1 { font-size: clamp(50px, 16vw, 82px) !important; }
  .showcase-copy > p, .story-copy > p:last-child, .showcase-points, .feature-row { display: none !important; }
  .login-panel, .auth-panel { padding: 18px !important; }
  .login-card, .auth-card { padding: 24px !important; max-height: none; }
  .view-stack { padding: 18px !important; }
  .hero-panel, .products-hero, .wiki-hero, .obfuscator-hero { min-height: 320px !important; padding: 28px !important; }
  .hero-panel h1, .products-hero h3, .wiki-hero h3, .obfuscator-hero h3 { font-size: clamp(46px, 14vw, 72px) !important; }
  .hero-panel { background: linear-gradient(90deg, rgba(255,145,112,.95), rgba(255,118,84,.82)), url('/assets/crown-hero-8k.webp') center/cover !important; }
  .health-widget { display: none !important; }
  .topbar { height: 76px !important; padding: 0 18px !important; }
  .portal-content { padding: 0 18px 38px !important; }
  .welcome { min-height: 230px !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}