/* Base + tokens + reusable primitives (screens, ak- buttons, modals) */
        /* Akashi Design System Variables (from Figma specs) */
        :root {
            /* Text */
            --texto-escuro: #243A44;
            --texto-claro: #81959E;
            /* Borders / Grays */
            --cinza-1: #DFDFDF;
            --cinza-2: #E6EAEC;
            /* Backgrounds */
            --background: #EEF2F5;
            --branco: #FFFFFF;
            /* Brand - Blues */
            --amarelo: #FFB423;
            --amarelo-escuro: #E6A11B;
            --azul-1: #4695E1;
            --azul-2: #1A4E80;
            --azul-3: #0A3661;
            --azul-4: #4695E1;
            --link: #1573FF;
            /* Actions */
            --vermelho: #E95050;
            --vermelho-escuro: #D13715;
            --botoes: #25D580;
            --verde: #0DB162;
            --salmao: #FF9293;
            /* Transparent */
            --transparente-amarelo: rgba(255,180,35,0.15);
            --transparente-vermelho: rgba(233,80,80,0.2);
            --transparente-verde: rgba(0,212,110,0.2);
            --transparente-azul: rgba(70,149,225,0.5);
            --transparente-petroleo: rgba(0,179,218,0.15);
            --transparente-roxo: rgba(161,144,255,0.15);
            --transparente-rosa: rgba(206,129,242,0.15);
            --detalhe-linha-selecionada: rgba(70,149,225,0.5);
            /* Secondary */
            --petroleo: #00B3DA;
            --azul-claro: #7AB2F4;
            --roxo: #A190FF;
            --rosa: #C06BE8;
            --rosa-forte: #EF60A4;
            --laranja: #FFB28A;
            /* Toast */
            --toast-sucesso: #0DB162;
            --toast-info: #358BDD;
            --toast-alerta: #E6A11B;
            --toast-erro: #D13715;
            /* Aliases */
            --bg: var(--background);
            --white: var(--branco);
            --border: var(--cinza-2);
            --border-light: #EEF2F5;
            --border-dark: var(--cinza-1);
            --text: var(--texto-escuro);
            --text-dark: #243A44;
            --text-sub: var(--texto-claro);
            --text-muted: #81959E;
            --text-gray: #81959E;
            --text-mid: #81959E;
            --text-light-gray: #81959E;
            --text-desc: #81959E;
            --primary: var(--azul-1);
            --primary-dark: var(--azul-2);
            --cyan: #00B3DA;
            --cyan-33: rgba(0,179,218,0.15);
            --cyan-20: rgba(0,179,218,0.15);
            --purple: #A190FF;
            --purple-c0: #C06BE8;
            --purple-c0-33: rgba(206,129,242,0.15);
            --star-active: #FFB423;
            --star-inactive: #D0D5DD;
            /* Elevation */
            --shadow-card: 0px 16px 32px -4px rgba(145,158,171,0.24);
            --shadow-dropdown: 0px 8px 16px -4px rgba(145,158,171,0.24);
            --shadow-modal: 0px 16px 32px -4px rgba(145,158,171,0.24);
            --shadow-sm: 0 1px 3px rgba(36,58,68,0.08);
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            font-family: 'Inter', -apple-system, sans-serif;
            background: var(--bg);
            color: var(--text);
            height: 100vh;
            overflow: hidden;
            font-size: 14px;
            line-height: 1.5;
        }
        .material-symbols-rounded { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

        /* ── Screens ── */
        .screen { display: none; height: 100vh; flex-direction: column; }
        .screen.active { display: flex; }