:root{--bg:#e9eef7;--bg-tint-accent:#c0481c1a;--bg-tint-navy:#2234661f;--surface:#ffffffad;--surface-strong:#ffffffdb;--surface-solid:#fff;--surface-muted:#16213a0a;--hairline:#ffffffc7;--divider:#16213a1a;--divider-strong:#16213a2e;--text:#16213a;--text-muted:#5b6b86;--text-faint:#66758f;--accent:#c0481c;--accent-hover:#a83c14;--accent-soft:#c0481c1a;--accent-ring:#c0481c40;--accent-foreground:#fff;--success:#1b7f4b;--success-bg:#1b7f4b1f;--warning:#9a6700;--warning-bg:#9a67001f;--danger:#b42318;--danger-bg:#b423181a;--neutral:#5b6b86;--neutral-bg:#16213a12;--sidebar-from:#16213a;--sidebar-to:#0b1428;--sidebar-text:#c8d3e6;--sidebar-text-muted:#8e9bb5;--sidebar-hairline:#ffffff14;--sidebar-active:#ffffff1a;--sidebar-hover:#ffffff0f;--font-sans:"Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;--text-xs:12px;--text-sm:13px;--text-md:14px;--text-lg:16px;--text-xl:20px;--text-2xl:28px;--text-3xl:36px;--weight-regular:400;--weight-medium:500;--weight-bold:700;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--page-padding:var(--space-8);--section-gap:28px;--card-padding:22px;--field-gap:14px;--control-height:36px;--control-height-sm:30px;--sidebar-width:256px;--radius-control:10px;--radius-card:16px;--radius-panel:22px;--radius-pill:999px;--glass-blur:blur(20px) saturate(160%);--shadow-glass:inset 0 1px 0 #ffffffe6, 0 1px 2px #16213a0d, 0 16px 40px -18px #16213a38;--shadow-glass-hover:inset 0 1px 0 #ffffffe6, 0 2px 4px #16213a0f, 0 22px 48px -18px #16213a47;--shadow-navy:0 24px 60px -24px #0b142899;--ease:cubic-bezier(.2, .8, .2, 1);--t-micro:.14s;--t-move:.22s;color:var(--text);font-family:var(--font-sans);font-size:var(--text-md);line-height:1.5;font-weight:var(--weight-regular);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-text:var(--text);--color-text-secondary:var(--text-muted);--color-text-tertiary:var(--text-faint);--color-border:var(--divider);--color-accent:var(--accent);--color-panel:var(--surface-solid);--color-panel-muted:var(--surface-muted);--color-danger:var(--danger);--color-success:var(--success);--font-size-helper:var(--text-xs);--font-size-label:var(--text-sm);--font-weight-medium:var(--weight-medium);--font-weight-semibold:var(--weight-bold);--radius-md:var(--radius-control);--space-field-gap:var(--field-gap)}*{box-sizing:border-box}html{background:var(--bg)}body{background:radial-gradient(900px 600px at -10% -10%, var(--bg-tint-accent), transparent 60%), radial-gradient(1000px 700px at 110% 110%, var(--bg-tint-navy), transparent 60%), var(--bg);background-attachment:fixed;min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:var(--accent);text-underline-offset:2px;text-decoration-thickness:1px}code{font-family:var(--font-mono);font-size:.92em}#app{min-height:100vh}::selection{background:var(--accent-soft)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.auth-form,.section-card,.metric-card,.admin-user-card,.plan-card{background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--shadow-glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}.brand-logo{align-items:center;gap:var(--space-3);text-decoration:none;display:flex}.brand-mark{filter:drop-shadow(0 6px 14px #0b142859);flex-shrink:0}.brand-wordmark{line-height:1.1;display:grid}.brand-name{font-size:var(--text-xl);font-weight:var(--weight-bold);letter-spacing:-.02em;color:var(--text)}.brand-arabic{font-size:var(--text-sm);color:var(--text-muted);letter-spacing:.02em}.brand-logo-dark .brand-name{color:#fff}.brand-logo-dark .brand-arabic{color:var(--sidebar-text-muted)}.page-loader,.auth-layout{min-height:100vh;padding:var(--page-padding);place-items:center;display:grid}.page-loader{color:var(--text-muted)}.auth-panel{gap:var(--space-4);grid-template-columns:1.1fr 1fr;align-items:stretch;width:min(920px,100%);display:grid}.auth-copy{padding:var(--space-8);border-radius:var(--radius-panel);background:linear-gradient(160deg, var(--sidebar-from), var(--sidebar-to));color:var(--sidebar-text);box-shadow:var(--shadow-navy);justify-content:center;gap:var(--space-4);flex-direction:column;display:flex;position:relative;overflow:hidden}.auth-copy:after{content:"";aspect-ratio:1;pointer-events:none;background:radial-gradient(circle,#c0481c59,#0000 65%);border-radius:50%;width:70%;position:absolute;inset:auto -30% -40% auto}.brand-kicker,.eyebrow,.plan-slug,.nav-section-label{font-size:var(--text-xs);font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);display:inline-block}.auth-copy .brand-kicker{color:var(--sidebar-text-muted)}.auth-copy h1,.page-header h2{font-size:var(--text-2xl);font-weight:var(--weight-bold);letter-spacing:-.02em;color:var(--text);margin:0;line-height:1.15}.auth-copy h1{color:#fff;margin-top:var(--space-2)}.auth-copy p,.page-header p,.section-head p{font-size:var(--text-sm);color:var(--text-muted);margin:0}.auth-copy p{color:var(--sidebar-text-muted);font-size:var(--text-md);max-width:34ch}.auth-form{padding:var(--space-8);border-radius:var(--radius-panel);gap:var(--field-gap);align-content:center;display:grid}.auth-form label,.stack-form label{color:var(--text);font-weight:var(--weight-medium);font-size:var(--text-sm);gap:6px;display:grid}input,textarea,select{border-radius:var(--radius-control);border:1px solid var(--divider-strong);background:var(--surface-solid);width:100%;padding:0 var(--space-3);height:var(--control-height);color:var(--text);font-size:var(--text-md);font-weight:var(--weight-regular);transition:border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease)}textarea{resize:vertical;height:auto;padding:10px var(--space-3);min-height:88px;line-height:1.5}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-ring);outline:none}input::placeholder,textarea::placeholder{color:var(--text-faint)}input[type=color]{height:var(--control-height);cursor:pointer;width:56px;padding:3px}.field-help,.field-hint{margin:var(--space-1) 0 0;font-size:var(--text-xs);font-weight:var(--weight-regular);color:var(--text-muted)}.field-error{margin:var(--space-1) 0 0;font-size:var(--text-xs);color:var(--danger)}.primary-button,.ghost-button{border-radius:var(--radius-control);height:var(--control-height);padding:0 var(--space-4);font-size:var(--text-sm);font-weight:var(--weight-medium);white-space:nowrap;transition:background var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease), transform var(--t-micro) var(--ease), opacity var(--t-micro) var(--ease);border:1px solid #0000;justify-content:center;align-items:center;gap:6px;display:inline-flex}.primary-button{background:var(--accent);color:var(--accent-foreground);box-shadow:0 8px 18px -10px #c0481cb3}.primary-button:hover{background:var(--accent-hover)}.primary-button:active{box-shadow:none;transform:translateY(1px)}.ghost-button{background:var(--surface-strong);color:var(--text);border-color:var(--divider-strong)}.ghost-button:hover{background:var(--surface-solid);border-color:var(--text-faint)}.ghost-button.danger{color:var(--danger);border-color:#b423184d}.ghost-button.danger:hover{background:var(--danger);border-color:var(--danger);color:#fff}.primary-button:disabled,.ghost-button:disabled{opacity:.5;cursor:default;box-shadow:none;transform:none}.icon-button{width:var(--control-height-sm);height:var(--control-height-sm);border-radius:var(--radius-control);border:1px solid var(--divider-strong);background:var(--surface-strong);color:var(--text-muted);font-size:var(--text-sm);justify-content:center;align-items:center;padding:0;display:inline-flex}.icon-button:hover{background:var(--surface-solid);color:var(--text)}.auth-footnote{font-size:var(--text-sm);color:var(--text-muted);margin:0}.shell{grid-template-columns:var(--sidebar-width) minmax(0, 1fr);gap:var(--space-4);min-height:100vh;padding:var(--space-4);display:grid}.sidebar{top:var(--space-4);height:calc(100vh - var(--space-8));padding:var(--space-4);border-radius:var(--radius-panel);background:linear-gradient(170deg, var(--sidebar-from), var(--sidebar-to));box-shadow:var(--shadow-navy), inset 0 1px 0 #ffffff14;color:var(--sidebar-text);gap:var(--space-6);grid-template-rows:auto 1fr auto;display:grid;position:sticky;overflow:hidden}.sidebar-brand{padding:var(--space-2) var(--space-1) 0}.sidebar-nav{padding:0 var(--space-1);align-content:start;gap:2px;display:grid;overflow-y:auto}.nav-link{border-radius:var(--radius-control);height:38px;padding:0 var(--space-3);color:var(--sidebar-text);font-size:var(--text-sm);font-weight:var(--weight-medium);transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);background:0 0;align-items:center;text-decoration:none;display:flex;position:relative}.nav-link:hover{background:var(--sidebar-hover);color:#fff}.nav-link.active{background:var(--sidebar-active);color:#fff}.nav-link.active:before{content:"";border-radius:var(--radius-pill);background:var(--accent);width:3px;position:absolute;top:10px;bottom:10px;left:0}.nav-section-label{margin:var(--space-4) 0 var(--space-1);padding:0 var(--space-3);color:var(--sidebar-text-muted);font-size:11px}.sidebar-footer{gap:var(--space-2);border-top:1px solid var(--sidebar-hairline);padding-top:var(--space-4);display:grid}.identity-card{padding:var(--space-3);border-radius:var(--radius-control);border:1px solid var(--sidebar-hairline);font-size:var(--text-xs);background:#ffffff0f;gap:2px;min-width:0;display:grid}.identity-card strong{color:#fff;font-size:var(--text-sm);font-weight:var(--weight-medium);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.identity-card span,.identity-card small{color:var(--sidebar-text-muted);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.identity-card small{text-transform:capitalize}.sidebar .ghost-button{border-color:var(--sidebar-hairline);color:var(--sidebar-text);background:#ffffff0f}.sidebar .ghost-button:hover{color:#fff;background:#ffffff1f}.content{padding:var(--space-4) var(--space-4) var(--space-12);min-width:0}.page-stack{gap:var(--section-gap);display:grid}.page-header{justify-content:space-between;align-items:flex-end;gap:var(--space-4);padding:var(--space-2) 0 0;display:flex}.page-header p{font-size:var(--text-md);margin-top:6px}.metrics-grid,.cards-grid{gap:var(--space-4);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.metric-card{border-radius:var(--radius-card);padding:var(--card-padding);gap:var(--space-1);display:grid}.metric-card span{font-size:var(--text-xs);font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.metric-card strong{font-size:var(--text-3xl);font-weight:var(--weight-bold);letter-spacing:-.03em;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.05}.metric-card small{font-size:var(--text-xs);color:var(--text-faint)}.two-column-grid{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.section-card{border-radius:var(--radius-card);padding:var(--card-padding);gap:var(--field-gap);display:grid}.section-head{gap:var(--space-1);display:grid}.section-head h3,.plan-card h3{font-size:var(--text-lg);font-weight:var(--weight-bold);letter-spacing:-.01em;color:var(--text);margin:0}.detail-list{gap:0;margin:0;display:grid}.detail-list div{justify-content:space-between;gap:var(--space-3);border-bottom:1px solid var(--divider);font-size:var(--text-md);padding:9px 0;display:flex}.detail-list div:last-child{border-bottom:none}.detail-list dt{color:var(--text-muted)}.detail-list dd{color:var(--text);font-weight:var(--weight-medium);text-align:right;font-variant-numeric:tabular-nums;margin:0}.bullet-list{font-size:var(--text-sm);color:var(--text-muted);gap:var(--space-1);margin:0;padding-left:18px;display:grid}.form-grid{gap:var(--field-gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.stack-form{gap:var(--field-gap);display:grid}.inline-actions{gap:var(--space-2);flex-wrap:wrap;align-items:center;display:flex}.status-banner{border-radius:var(--radius-control);font-size:var(--text-sm);font-weight:var(--weight-medium);border:1px solid #0000;padding:10px 14px}.status-banner.success{background:var(--success-bg);color:var(--success);border-color:#1b7f4b40}.status-banner.error{background:var(--danger-bg);color:var(--danger);border-color:#b4231840}.status-banner.neutral{background:var(--neutral-bg);color:var(--neutral);border-color:var(--divider)}.badge{border-radius:var(--radius-pill);height:22px;font-size:11px;font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;align-items:center;gap:6px;padding:0 9px;line-height:1;display:inline-flex}.badge-dot{background:currentColor;border-radius:50%;flex-shrink:0;width:6px;height:6px}.badge-success{background:var(--success-bg);color:var(--success)}.badge-danger{background:var(--danger-bg);color:var(--danger)}.badge-warning{background:var(--warning-bg);color:var(--warning)}.badge-neutral{background:var(--neutral-bg);color:var(--neutral)}.badge-accent{background:var(--accent-soft);color:var(--accent)}.badge-stack{flex-wrap:wrap;gap:6px;display:flex}.tab-bar{border-radius:var(--radius-control);background:var(--surface-muted);flex-wrap:wrap;gap:2px;width:fit-content;max-width:100%;padding:3px;display:inline-flex}.tab-button{height:32px;color:var(--text-muted);font-size:var(--text-sm);font-weight:var(--weight-medium);transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);background:0 0;border:none;border-radius:8px;padding:0 14px}.tab-button:hover{color:var(--text)}.tab-button.active{background:var(--surface-solid);color:var(--text);box-shadow:0 1px 2px #16213a14}.data-table{border-radius:var(--radius-control);background:var(--surface-strong);border:1px solid var(--divider);gap:0;display:grid;overflow:hidden}.table-row{gap:var(--space-3);font-size:var(--text-sm);border-bottom:1px solid var(--divider);transition:background var(--t-micro) var(--ease);background:0 0;grid-template-columns:1fr 140px 2fr;align-items:center;padding:10px 14px;display:grid}.table-row:last-child{border-bottom:none}.table-row:not(.table-head):hover{background:var(--surface-solid)}.table-head{font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);background:var(--surface-muted);font-size:11px;position:sticky;top:0}.empty-state{justify-items:center;gap:var(--space-1);padding:var(--space-8) var(--space-3);text-align:center;color:var(--text-muted);border:1px dashed var(--divider-strong);border-radius:var(--radius-control);display:grid}.empty-state strong{font-size:var(--text-md);color:var(--text);font-weight:var(--weight-medium)}.empty-state span{font-size:var(--text-sm)}.qr-box{gap:var(--space-2);padding:var(--space-3) 14px;border-radius:var(--radius-control);background:var(--sidebar-to);color:var(--sidebar-text);font-size:var(--text-xs);display:grid}.qr-box code{white-space:pre-wrap;word-break:break-word;font-family:var(--font-mono);font-size:var(--text-xs);color:#fff;line-height:1.6}.qr-box img{border-radius:var(--radius-control);padding:var(--space-2);background:#fff;justify-self:start}.plan-card{border-radius:var(--radius-card);padding:var(--card-padding);gap:var(--space-2);transition:transform var(--t-move) var(--ease), box-shadow var(--t-move) var(--ease);display:grid}.plan-card:hover{box-shadow:var(--shadow-glass-hover);transform:translateY(-1px)}.plan-card.current{outline:2px solid var(--accent);outline-offset:-2px}.plan-card p{font-size:var(--text-sm);color:var(--text-muted);margin:0}.admin-user-list{gap:var(--space-2);display:grid}.admin-user-card{border-radius:var(--radius-card);padding:var(--space-4) 18px;justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.admin-user-card p,.admin-user-card small{font-size:var(--text-sm);color:var(--text-muted);margin:0}.admin-actions{gap:var(--space-2);align-items:center;display:flex}.choice-group{gap:var(--space-2);border:none;margin:0;padding:0;display:grid}.choice-group legend{color:var(--text);font-weight:var(--weight-medium);font-size:var(--text-sm);margin-bottom:6px;padding:0}.choice-option{gap:var(--space-3);padding:var(--space-3) 14px;border:1px solid var(--divider-strong);border-radius:var(--radius-control);background:var(--surface-strong);cursor:pointer;transition:border-color var(--t-micro) var(--ease), background var(--t-micro) var(--ease);grid-template-columns:auto 1fr;align-items:start;font-weight:var(--weight-regular)!important;display:grid!important}.choice-option:hover{background:var(--surface-solid)}.choice-option.selected{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);background:var(--surface-solid)}.choice-option input[type=radio]{width:auto;height:auto;accent-color:var(--accent);margin-top:3px}.choice-option span{gap:2px;display:grid}.choice-option small{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--weight-regular)}.choice-details{gap:var(--field-gap);padding:var(--space-3);border:1px dashed var(--divider-strong);border-radius:var(--radius-control);background:var(--surface-muted);display:grid}@media (width<=1100px){.shell,.auth-panel,.two-column-grid,.metrics-grid,.cards-grid,.form-grid{grid-template-columns:1fr}.shell{padding:var(--space-3);gap:var(--space-3);grid-template-rows:auto 1fr}.sidebar{grid-template-rows:auto auto auto;height:auto;position:static}.sidebar-nav{gap:var(--space-1);flex-wrap:wrap;display:flex}.nav-link{height:34px}.nav-section-label{width:100%;margin:var(--space-2) 0 0}.metrics-grid,.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=720px){:root{--page-padding:var(--space-4);--card-padding:var(--space-4);--section-gap:var(--space-6)}.content{padding:var(--space-2) 0 var(--space-8)}.auth-copy,.auth-form{padding:var(--space-6)}.page-header{flex-direction:column;align-items:start}.page-header h2,.auth-copy h1{font-size:24px}.metrics-grid,.cards-grid{grid-template-columns:1fr}.data-table{overflow-x:auto}.table-row{grid-template-columns:minmax(140px,1fr) minmax(100px,auto) minmax(160px,2fr);min-width:420px}.admin-user-card{flex-direction:column;align-items:stretch}}@media (prefers-reduced-motion:reduce){*{transition-duration:0s!important}}
