:root{--bg: #f7f6f4;--surface: #ffffff;--surface-2: #f2f0ec;--border: rgba(20, 22, 26, .08);--border-strong: rgba(20, 22, 26, .14);--ink: #14161a;--ink-soft: #6b6f76;--ink-faint: #8b8f96;--brand: #ed1c24;--brand-strong: #b3151b;--success: #4caf6d;--success-tint: rgba(76, 175, 109, .12);--hero-bg: #14161a;--hero-fg: #ffffff;--hero-fg-soft: rgba(255, 255, 255, .65);--hero-pill-bg: var(--brand);--hero-pill-fg: #ffffff;--hero-accent: var(--brand);--font-display: "Readex Pro", system-ui, sans-serif;--font-body: "Readex Pro", system-ui, sans-serif;--font-mono: "IBM Plex Mono", monospace;--radius-lg: 22px;--radius-md: 16px;--radius-sm: 12px;--shadow: 0 20px 40px -20px rgba(20, 22, 26, .22);--nav-height: 72px;--sidebar-width: 248px}:root[data-theme=dark]{--bg: #0b0b0d;--surface: #16161a;--surface-2: #1d1d22;--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .14);--ink: #f5f5f7;--ink-soft: #8a8a94;--ink-faint: #6e727a;--brand: #ed1c24;--brand-strong: #ff5a5f;--success: #4caf6d;--success-tint: rgba(76, 175, 109, .15);--hero-bg: var(--brand);--hero-fg: #ffffff;--hero-fg-soft: rgba(255, 255, 255, .7);--hero-pill-bg: #0b0b0d;--hero-pill-fg: #ffffff;--hero-accent: #ffffff;--font-display: "Alexandria", system-ui, sans-serif;--font-body: "IBM Plex Sans Arabic", system-ui, sans-serif;--shadow: 0 24px 48px -20px rgba(0, 0, 0, .65)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;transition:background-color .2s ease,color .2s ease}#root{min-height:100vh}h1,h2,h3{font-family:var(--font-display)}a{color:var(--brand);text-decoration:none}a:hover{color:var(--brand-strong)}button{font-family:inherit}.mono{font-family:var(--font-mono)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 20px;border-radius:var(--radius-sm);border:none;font-family:var(--font-display);font-size:15px;font-weight:600;cursor:pointer;transition:opacity .15s ease,background-color .15s ease}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover:not(:disabled){background:var(--brand-strong)}.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--border-strong)}.btn-ghost:hover:not(:disabled){border-color:var(--ink-faint)}.btn-danger-ghost{background:transparent;color:var(--brand);border:1px solid color-mix(in srgb,var(--brand) 40%,transparent)}.btn-block{width:100%}.field{display:flex;flex-direction:column;gap:6px;text-align:right}.field label{font-size:13px;font-weight:500;color:var(--ink-faint)}.field input,.field select{height:52px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);padding:0 16px;font-size:15px;font-family:inherit;color:var(--ink);outline:none;text-align:right}.field input[dir=ltr]{text-align:right;direction:ltr}.field input:focus,.field select:focus{border-color:var(--brand)}.field input[type=date]{color-scheme:light}:root[data-theme=dark] .field input[type=date]{color-scheme:dark}.card{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);padding:20px}.row-between{display:flex;align-items:center;justify-content:space-between}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700;background:color-mix(in srgb,var(--pill-color) 16%,var(--surface));color:var(--pill-color)}.icon-btn{width:38px;height:38px;border-radius:50%;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink);cursor:pointer;flex-shrink:0}.icon-btn svg{width:17px;height:17px}.segmented{display:flex;background:var(--surface-2);border-radius:var(--radius-sm);padding:4px;gap:2px}.segmented button{flex:1;text-align:center;padding:10px 0;border-radius:10px;font-size:13px;font-weight:600;color:var(--ink-faint);background:none;border:none;cursor:pointer}.segmented button.active{background:var(--brand);color:#fff}.stat-tile{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;display:flex;flex-direction:column;gap:6px}.stat-tile .value{font-family:var(--font-display);font-weight:800;font-size:28px;color:var(--ink)}.stat-tile .label{font-size:12px;color:var(--ink-faint)}.app-shell{min-height:100vh;padding-bottom:calc(var(--nav-height) + 16px)}.app-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;height:60px;padding:0 16px;background:var(--bg);border-bottom:1px solid var(--border)}.app-header img{height:30px;border-radius:8px}.app-header .subscriber-name{font-family:var(--font-display);font-weight:700;font-size:15px}.app-header .spacer{margin-inline-start:auto}.app-main{padding:16px;max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:16px}.sidebar{display:none}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:10;display:flex;height:var(--nav-height);background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom)}.bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:11px;font-weight:600;color:var(--ink-faint)}.bottom-nav a.active{color:var(--brand)}.bottom-nav svg{width:21px;height:21px}@media (min-width: 900px){.app-shell{display:grid;grid-template-columns:var(--sidebar-width) 1fr;padding-bottom:0}.sidebar{grid-row:1 / span 2;display:flex;flex-direction:column;gap:4px;padding:24px 16px;background:var(--surface);border-left:1px solid var(--border);height:100vh;position:sticky;top:0}.sidebar-logo{display:flex;align-items:center;gap:10px;padding:0 8px 20px}.sidebar-logo img{height:34px;border-radius:9px}.sidebar-logo span{font-family:var(--font-display);font-weight:800;font-size:16px}.sidebar a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--radius-sm);font-weight:600;font-size:14px;color:var(--ink-faint)}.sidebar a.active{background:color-mix(in srgb,var(--brand) 12%,transparent);color:var(--brand)}.sidebar svg{width:20px;height:20px}.sidebar-footer{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:0 8px}.app-header,.bottom-nav{display:none}.app-main{max-width:640px;margin:0;padding:40px 32px}}
