/* Arcade — core leftovers (CSS/styles.css).
 *
 * The colours in styles.css that have no --ds-* token with the identical
 * default value, so they could not be tokenised in place: the hero's
 * disassembly window (Cheat Engine's own greys), the violet and blurple
 * accents, the update request modal, the near-black home bands and the
 * privacy panels. Under data-theme="arcade" they follow the screen.
 * Nothing here applies to the default look.
 */

/* ---- hero: the disassembly window ---------------------------------------- */

html[data-theme="arcade"] .hero-assembler-window {
    color: var(--ds-text-1);
}

html[data-theme="arcade"] .hero-assembler-titlebar {
    background: var(--ds-bg-deep);
}

html[data-theme="arcade"] .hero-assembler-titlebar i {
    border-color: var(--ds-link);
    box-shadow: inset 2px 0 0 rgba(var(--ds-link-rgb), 0.4);
}

html[data-theme="arcade"] .hero-assembler-window-controls {
    color: var(--ds-text-2);
}

html[data-theme="arcade"] .hero-assembler-menu {
    border-bottom-color: var(--ds-border-1);
    background: var(--ds-surface-3);
    color: var(--ds-text-1);
}

html[data-theme="arcade"] .hero-assembler-location {
    border-bottom-color: var(--ds-border-1);
    background: var(--ds-hover);
    color: var(--ds-text-1);
}

html[data-theme="arcade"] .hero-assembler-columns {
    background: var(--ds-pressed);
    color: var(--ds-text-1);
}

html[data-theme="arcade"] .hero-assembler-columns span {
    border-right-color: var(--ds-border-1);
}

html[data-theme="arcade"] .hero-assembler-list {
    background: var(--ds-surface-2);
    scrollbar-color: var(--ds-border-2) var(--ds-surface-1);
}

html[data-theme="arcade"] .hero-assembler-list::-webkit-scrollbar-track {
    background: var(--ds-surface-1);
}

html[data-theme="arcade"] .hero-assembler-list::-webkit-scrollbar-thumb {
    border-color: var(--ds-surface-1);
    background: var(--ds-border-2);
}

html[data-theme="arcade"] .hero-assembler-row,
html[data-theme="arcade"] .hero-assembler-mnemonic,
html[data-theme="arcade"] .hero-assembler-comment {
    color: var(--ds-text-1);
}

/* ---- hero: memory field, watermark, cube readouts -------------------------- */

html[data-theme="arcade"] .hero-memory-field-aura {
    background:
        radial-gradient(circle at 52% 48%, rgba(var(--ds-link-rgb), 0.105), transparent 44%),
        radial-gradient(circle at 62% 58%, rgba(var(--ds-violet-rgb), 0.08), transparent 57%);
}

html[data-theme="arcade"] .hero-memory-glow {
    background:
        radial-gradient(ellipse at 62% 42%, rgba(var(--ds-link-rgb), 0.17), transparent 48%),
        radial-gradient(ellipse at 38% 58%, rgba(var(--ds-violet-rgb), 0.15), transparent 54%);
}

/* The home landing's own glow (.home-landing .hero-memory-glow) would lose to
 * the rule above; it already reads --home-cyan-rgb / --home-violet-rgb, which
 * follow the screen below, so it only has to win again. */
html[data-theme="arcade"] .home-landing .hero-memory-glow {
    background:
        radial-gradient(circle at 50% 46%, rgba(var(--home-cyan-rgb), 0.23), transparent 48%),
        radial-gradient(circle at 34% 30%, rgba(var(--home-violet-rgb), 0.14), transparent 38%);
}

html[data-theme="arcade"] .hero-cube-readout {
    background: rgba(var(--ds-bg-rgb), 0.78);
}

html[data-theme="arcade"] .hero-cube-readout strong {
    color: var(--ds-text-1);
}

html[data-theme="arcade"] .hero-cube-readout-write strong {
    color: var(--ds-success);
}

html[data-theme="arcade"] .hero-memory-status {
    background: rgba(var(--ds-bg-rgb), 0.78);
}

/* ---- code window --------------------------------------------------------------- */

html[data-theme="arcade"] .dot.red {
    background: var(--ds-danger);
}

html[data-theme="arcade"] .dot.yellow {
    background: var(--ds-warning);
}

html[data-theme="arcade"] .dot.green {
    background: var(--ds-success);
}

html[data-theme="arcade"] .code-comment {
    color: var(--ds-text-3);
}

html[data-theme="arcade"] .code-function {
    color: var(--ds-violet);
}

html[data-theme="arcade"] .code-number {
    color: var(--ds-success);
}

/* ---- error pages ----------------------------------------------------------------- */

html[data-theme="arcade"] .error-page {
    background:
        radial-gradient(800px 420px at 18% 8%, rgba(var(--ds-link-rgb), 0.08), transparent 62%),
        radial-gradient(720px 420px at 82% 18%, rgba(var(--ds-violet-rgb), 0.06), transparent 58%),
        var(--color-bg-primary);
}

/* ---- update request modal -------------------------------------------------------- */

html[data-theme="arcade"] .update-request-modal .modal-content {
    background:
        radial-gradient(circle at 100% 0, rgba(var(--ds-violet-rgb), 0.12), transparent 40%),
        var(--color-bg-secondary);
}

html[data-theme="arcade"] .update-request-summary-icon {
    color: var(--ds-violet);
    background: rgba(var(--ds-violet-rgb), 0.16);
}

html[data-theme="arcade"] .update-request-modal .form-control:focus {
    border-color: rgba(var(--ds-violet-rgb), 0.7);
    box-shadow: 0 0 0 0.2rem rgba(var(--ds-violet-rgb), 0.14);
}

html[data-theme="arcade"] .update-request-feedback.is-success {
    color: var(--ds-success);
    background: rgba(var(--ds-success-rgb), 0.12);
    border-color: rgba(var(--ds-success-rgb), 0.32);
}

html[data-theme="arcade"] .update-request-feedback.is-error {
    color: var(--ds-danger);
    background: rgba(var(--ds-danger-rgb), 0.12);
    border-color: rgba(var(--ds-danger-rgb), 0.32);
}

html[data-theme="arcade"] .update-request-feedback.is-info {
    color: var(--ds-link);
    background: rgba(var(--ds-link-rgb), 0.12);
    border-color: rgba(var(--ds-link-rgb), 0.3);
}

/* ---- home bands ------------------------------------------------------------------- */

html[data-theme="arcade"] .home-landing {
    --home-violet-rgb: var(--ds-violet-rgb);
    --home-pink-rgb: var(--ds-patreon-rgb);
    background: var(--ds-bg);
}

html[data-theme="arcade"] .home-scene-tables {
    background: var(--ds-bg);
}

html[data-theme="arcade"] .home-scene-tables .game-card {
    background: linear-gradient(160deg, color-mix(in srgb, var(--ds-surface-3) 94%, transparent), color-mix(in srgb, var(--ds-surface-1) 98%, transparent));
}

html[data-theme="arcade"] .home-updates-section {
    background: linear-gradient(180deg, var(--ds-bg) 0%, var(--ds-bg-inset) 100%);
}

html[data-theme="arcade"] .home-landing .creator-card {
    background: color-mix(in srgb, var(--ds-surface-2) 78%, transparent);
}

/* ---- privacy -------------------------------------------------------------------------- */

html[data-theme="arcade"] .privacy-hero {
    background:
        radial-gradient(720px 420px at 78% 12%, rgba(var(--ds-link-rgb), .09), transparent 68%),
        radial-gradient(620px 360px at 12% 62%, rgba(var(--ds-violet-rgb), .06), transparent 70%);
}

html[data-theme="arcade"] .privacy-summary {
    background: color-mix(in srgb, var(--ds-surface-1) 82%, transparent);
}

html[data-theme="arcade"] .privacy-nav {
    background: color-mix(in srgb, var(--ds-surface-1) 72%, transparent);
}

/* The update request summary icon (styles.css: a literal light blurple). */
html[data-theme="arcade"] .update-request-summary-icon i {
    color: var(--ds-violet);
}