/* Yamete's public pages use one visual system; operational state colours remain semantic. */
:root {
    color-scheme: dark;
    --cafe-canvas: #05070b;
    --cafe-surface: #0b0d15;
    --cafe-surface-raised: #151725;
    --cafe-surface-soft: #1b1d2a;
    --cafe-primary: #711cff;
    --cafe-primary-hover: #812dff;
    --cafe-accent: #ae83ff;
    --cafe-accent-soft: #c7adff;
    --cafe-text: #f7f7fb;
    --cafe-text-muted: #c5c0d3;
    --cafe-text-subtle: #a7a1b8;
    --cafe-border: rgb(182 190 211 / 18%);
    --cafe-border-strong: rgb(174 131 255 / 55%);
    --cafe-line: rgb(182 190 211 / 22%);
    --cafe-success: #70b98a;
    --cafe-warning: #ffd167;
    --cafe-danger: #ff606c;
    --cafe-info: #ae83ff;
    --cafe-price: #28d3b4;
    --cafe-radius-card: 24px;
    --cafe-radius-control: 12px;
    --cafe-shadow-card: inset 0 1px 0 rgb(255 255 255 / 5%), 0 16px 42px rgb(0 0 0 / 16%);
    --cafe-shadow-primary: 0 8px 28px rgb(113 28 255 / 34%);
    --cafe-shadow-dialog: 0 24px 84px rgb(3 3 18 / 62%), 0 0 34px color-mix(in srgb, var(--cafe-primary) 13%, transparent);
    --cafe-motion-fast: 180ms ease;
}

/* The application shell is the frame around operator and public routes alike. */
.unified-shell,
.shell-frame,
.shell-drawer-container { background-color: var(--cafe-canvas); }

.unified-shell .vscode-sidebar.mud-drawer {
    border-color: var(--cafe-border);
    background: linear-gradient(180deg, var(--cafe-surface), var(--cafe-canvas) 70%);
}

.unified-shell .vscode-sidebar .mud-drawer-content,
.vscode-sidebar-footer { background-color: var(--cafe-surface); }

.shell-drawer-header,
.vscode-sidebar-footer { border-color: var(--cafe-border); }

/* The brand and active navigation labels need pale lavender against the near-black drawer; primary purple sinks too far. */
.unified-shell .shell-drawer-header .shell-brand { color: #d6c2ff; }

.unified-shell .vscode-sidebar .mud-nav-link.active,
.unified-shell .vscode-sidebar .mud-nav-link.mud-nav-link-active {
    border-left-color: var(--cafe-primary);
    color: var(--cafe-accent);
    background: linear-gradient(90deg, rgb(113 28 255 / 21%), rgb(113 28 255 / 5%));
}

.unified-shell .vscode-sidebar .mud-navmenu .mud-nav-link:is(.active, .mud-nav-link-active) {
    color: #f1eaff;
}

.shell-main .content {
    box-shadow:
        inset 30px 0 30px -30px rgb(0 0 0 / 24%),
        inset -30px 0 30px -30px rgb(0 0 0 / 24%);
}

/* MudBlazor is the default widget layer on many legacy routes; reset its old square gray controls here. */
.mud-navmenu .mud-nav-group > .mud-nav-link,
.mud-navmenu .mud-nav-link { border-radius: 10px; }

/* Active rows stay square so the highlight reads as part of the drawer, not a floating chip. */
.unified-shell .vscode-sidebar .mud-navmenu .mud-nav-link:is(.active, .mud-nav-link-active),
.unified-shell .vscode-sidebar .mud-navmenu .mud-nav-group > .mud-nav-link:is(.active, .mud-nav-link-active),
.unified-shell .vscode-sidebar .mud-navmenu .mud-nav-link:is(.active, .mud-nav-link-active)::before,
.unified-shell .vscode-sidebar .mud-navmenu .mud-nav-link:is(.active, .mud-nav-link-active)::after {
    border-radius: 0 !important;
}

.mud-button-root { border-radius: 12px; }
.mud-button-root.mud-button-filled-primary { background: var(--cafe-primary); color: var(--cafe-text); }
.mud-button-root.mud-button-filled-primary:hover { background: var(--cafe-primary-hover); }
.mud-button-root.mud-button-outlined { border-color: var(--cafe-border-strong); color: var(--cafe-accent-soft); }

.mud-input-control .mud-input-outlined-border { border-color: var(--cafe-border-strong) !important; }
.mud-input-control:hover .mud-input-outlined-border,
.mud-input-control.mud-input-focused .mud-input-outlined-border { border-color: var(--cafe-accent) !important; }

.mud-table,
.mud-datagrid,
.mud-data-grid {
    border: 1px solid var(--cafe-border);
    border-radius: 16px;
    background: var(--cafe-surface) !important;
}
.mud-table-head .mud-table-cell,
.mud-table-body .mud-table-cell { border-bottom: 1px solid var(--cafe-line); }
.mud-table-head .mud-table-cell {
    background: var(--cafe-surface-soft);
    color: var(--cafe-text-muted);
    font-size: 12px;
    letter-spacing: .06em;
}
.mud-table-body .mud-table-row:hover { background: color-mix(in srgb, var(--cafe-accent) 7%, transparent) !important; }
.mud-table-body .mud-table-row.bittensor-owned-miner-row { background: color-mix(in srgb, var(--cafe-primary) 14%, transparent) !important; }
.mud-table-body .mud-table-row.bittensor-owned-miner-row:hover { background: color-mix(in srgb, var(--cafe-primary) 23%, transparent) !important; }

.mud-dialog {
    border: 1px solid var(--cafe-border);
    border-radius: 18px;
    background: linear-gradient(145deg, var(--cafe-surface-raised), var(--cafe-surface));
    box-shadow: var(--cafe-shadow-dialog);
}
.mud-dialog-title { border-bottom: 1px solid var(--cafe-border); background: var(--cafe-surface-soft); }
.mud-dialog-actions { border-top: 1px solid var(--cafe-border); }
.mud-chip {
    border: 1px solid var(--cafe-border);
    border-radius: 999px;
    background: var(--cafe-surface-raised);
    color: var(--cafe-text-muted);
}

/* State badges read from domain classes; Mud palette defaults must not turn them blue or muddy the status. */
.tournament-count-badge { border-color: color-mix(in srgb, var(--cafe-accent) 48%, transparent); background: color-mix(in srgb, var(--cafe-primary) 18%, var(--cafe-surface-raised)); color: var(--cafe-accent-soft); font-weight: 800; }
.tournament-state-chip { border: 1px solid currentColor; background: color-mix(in srgb, currentColor 12%, var(--cafe-surface-raised)); font-weight: 800; }
.tournament-state-chip--open { color: var(--cafe-success); }
.tournament-state-chip--closed { color: var(--cafe-warning); }
.tournament-state-chip--active { color: var(--cafe-accent-soft); }
.tournament-state-chip--champion { color: var(--cafe-warning); }
.tournament-state-chip--cancelled { color: var(--cafe-danger); }
.tournament-state-chip--unknown { color: var(--cafe-text-muted); }
.tournament-artwork-badge { border: 1px solid currentColor; border-radius: 999px; background: color-mix(in srgb, currentColor 12%, var(--cafe-surface-raised)); font-weight: 800; }
.tournament-artwork-badge--updating { color: var(--cafe-accent-soft); }
.tournament-artwork-badge--warning { color: var(--cafe-warning); }

.mud-button-root:focus-visible,
.mud-icon-button:focus-visible { outline: 2px solid var(--cafe-accent-soft); outline-offset: 2px; }

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