/* NEON RUINS — design tokens */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;900&family=IBM+Plex+Sans:wght@400;500;600;700&family=Share+Tech+Mono&display=swap');

:root {
    /* Surfaces */
    --bg: #07090c;
    --bg-elevated: #0a0e14;
    --panel: #0d1218;
    --panel-alt: #111820;
    --panel-hover: #15202c;
    --glass: rgba(13, 18, 24, 0.88);

    /* Neon palette */
    --primary: #00e5ff;
    --primary-dim: rgba(0, 229, 255, 0.55);
    --primary-glow: rgba(0, 229, 255, 0.35);
    --accent: #b8ff00;
    --accent-dim: rgba(184, 255, 0, 0.5);
    --positive: #39ff14;
    --positive-glow: rgba(57, 255, 20, 0.3);
    --danger: #ff2d55;
    --danger-glow: rgba(255, 45, 85, 0.35);
    --negative: var(--danger);
    --warn: #ffb020;
    --warn-glow: rgba(255, 176, 32, 0.3);
    --muted: #7a8794;
    --text: #e6edf3;
    --text-dim: #a8b3bf;

    /* Lines / chrome */
    --border: rgba(0, 229, 255, 0.18);
    --border-strong: rgba(0, 229, 255, 0.4);
    --border-danger: rgba(255, 45, 85, 0.45);
    --border-accent: rgba(184, 255, 0, 0.4);
    --scanline: rgba(0, 229, 255, 0.03);
    --grid: rgba(0, 229, 255, 0.04);

    /* Type */
    --font-display: 'Orbitron', 'Segoe UI', system-ui, sans-serif;
    --font-body: 'IBM Plex Sans', 'Segoe UI', system-ui, sans-serif;
    --font-mono: 'Share Tech Mono', ui-monospace, monospace;

    /* Layout */
    --radius: 2px;
    --radius-md: 4px;
    --touch-min: 44px;
    --header-h: 56px;
    --summary-h: 64px;
    --bottom-nav-h: 58px;
    --chart-dock-h: 38vh;
    --rail-w: 52px;
    --flyout-w: min(380px, 40vw);
    --z-header: 100;
    --z-nav: 200;
    --z-flyout: 300;
    --z-overlay: 400;
    --z-modal: 500;

    /* Motion */
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --dur-fast: 140ms;
    --dur: 220ms;
    --dur-slow: 360ms;

    /* Shadows */
    --shadow-panel: 0 0 0 1px var(--border), 0 8px 32px rgba(0, 0, 0, 0.55);
    --shadow-neon: 0 0 12px var(--primary-glow);
    --shadow-accent: 0 0 14px var(--positive-glow);
}