:root {
  --character-primary: #c8ad56;
  --character-secondary: #efe4b2;
  --character-rgb: 200, 173, 86;
  --character-label: "CODE";
}

:root[data-code-character="tomori"] { --character-primary:#5a6fe0; --character-secondary:#97a4d2; --character-rgb:90,111,224; --character-label:"TOMORI / MYGO!!!!!"; }
:root[data-code-character="anon"] { --character-primary:#ff8ab6; --character-secondary:#ffc1d6; --character-rgb:255,138,182; --character-label:"ANON / MYGO!!!!!"; }
:root[data-code-character="rana"] { --character-primary:#8fbd3f; --character-secondary:#dcefa5; --character-rgb:143,189,63; --character-label:"RĀNA / MYGO!!!!!"; }
:root[data-code-character="soyo"] { --character-primary:#36a9de; --character-secondary:#a3dcf5; --character-rgb:54,169,222; --character-label:"SOYO / MYGO!!!!!"; }
:root[data-code-character="taki"] { --character-primary:#e84c4c; --character-secondary:#f4a0a0; --character-rgb:232,76,76; --character-label:"TAKI / MYGO!!!!!"; }
:root[data-code-character="sakiko"] { --character-primary:#6b4f8c; --character-secondary:#a38fbe; --character-rgb:107,79,140; --character-label:"OBLIVIONIS / AVE MUJICA"; }
:root[data-code-character="mutsumi"],
:root[data-code-character="mortis"] { --character-primary:#858598; --character-secondary:#eaeaf0; --character-rgb:133,133,152; --character-label:"MORTIS / AVE MUJICA"; }
:root[data-code-character="uika"] { --character-primary:#2a4068; --character-secondary:#5c7aa0; --character-rgb:42,64,104; --character-label:"DOLORIS / AVE MUJICA"; }
:root[data-code-character="umiri"] { --character-primary:#788b35; --character-secondary:#bdcc85; --character-rgb:120,139,53; --character-label:"TIMORIS / AVE MUJICA"; }
:root[data-code-character="nyamu"] { --character-primary:#c84b7e; --character-secondary:#e89bb6; --character-rgb:200,75,126; --character-label:"AMORIS / AVE MUJICA"; }

.live2d-stage,
.workspace-stage {
  --accent: var(--character-primary) !important;
  position: relative;
  isolation: isolate;
  transition: background-color .45s cubic-bezier(.16,1,.3,1), border-color .45s ease;
}

.live2d-canvas-root {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 76% 18%, rgba(var(--character-rgb), .17), transparent 31%),
    linear-gradient(132deg, rgba(var(--character-rgb), .055), transparent 48%),
    #f4f1e8;
}

.live2d-canvas-root::before {
  content: var(--character-label);
  position: absolute;
  z-index: 0;
  inset: 7% auto auto 4%;
  max-width: 64%;
  color: rgba(var(--character-rgb), .13);
  font: 800 clamp(34px, 7vw, 112px)/.82 "Arial Narrow", "Noto Sans JP", sans-serif;
  letter-spacing: -.055em;
  text-transform: uppercase;
  pointer-events: none;
}

.live2d-canvas-root::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background-image:
    linear-gradient(rgba(var(--character-rgb), .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--character-rgb), .08) 1px, transparent 1px);
  background-size: 25% 25%;
  mask-image: linear-gradient(to bottom, #000 0 64%, transparent 94%);
  pointer-events: none;
}

.live2d-host,
.live2d-loading-mask,
.live2d-error-card,
.live2d-runtime-status { position: relative; z-index: 1; }

.stage-hero-card { border-color: rgba(var(--character-rgb), .34) !important; }
.stage-hero-name,
.stage-hero-kicker,
.stage-hero-status { color: var(--character-primary) !important; }
.badge,
.chat-send-fab { background: var(--character-primary) !important; }
.chat-send-fab:focus-visible,
button:focus-visible,
textarea:focus-visible { outline: 3px solid var(--character-secondary) !important; outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .live2d-stage,
  .workspace-stage { transition: none; }
}
