:root{
  --navy:#0f172a;--navy-2:#16233b;--teal:#0f766e;--teal-2:#14b8a6;--cyan:#0891b2;--gold:#d6a84b;
  --ink:#172033;--muted:#64748b;--bg:#f3f6fb;--panel:#ffffff;--line:#e2e8f0;--soft:#f8fafc;
  --success:#15803d;--danger:#b91c1c;--warning:#b45309;--radius:18px;--shadow:0 14px 35px rgba(15,23,42,.07);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)
}
*{box-sizing:border-box}html{min-height:100%}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink)}a{color:var(--teal);text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}
.app-shell{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,var(--navy) 0%,#111c30 58%,#0b1324 100%);color:#fff;padding:20px 16px 16px;display:flex;flex-direction:column;z-index:50;box-shadow:18px 0 40px rgba(15,23,42,.08)}
.brand-block{display:flex;align-items:center;gap:12px;padding:4px 8px 20px;border-bottom:1px solid rgba(255,255,255,.09);margin-bottom:18px}.brand-mark{width:48px;height:48px;border-radius:15px;background:linear-gradient(135deg,var(--teal-2),var(--cyan));display:grid;place-items:center;font-weight:900;letter-spacing:.04em;box-shadow:0 10px 24px rgba(20,184,166,.22);overflow:hidden;flex:none}.brand-mark img{width:100%;height:100%;object-fit:contain;background:#fff;padding:4px}.brand-text{min-width:0;display:flex;flex-direction:column}.brand-text strong{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-text small{font-size:11px;color:#a9b7cc;margin-top:3px}.sidebar-close{display:none;margin-left:auto;border:0;background:transparent;color:#cbd5e1;font-size:28px;line-height:1}
.nav{display:flex;flex-direction:column;gap:5px;overflow:auto;padding-right:3px}.nav-label{font-size:10px;letter-spacing:.14em;color:#718096;font-weight:800;padding:16px 12px 7px}.nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:12px;color:#cbd5e1;font-weight:650;font-size:14px;transition:.18s ease}.nav a:hover{background:rgba(255,255,255,.07);color:#fff;transform:translateX(2px)}.nav a.active{background:linear-gradient(90deg,rgba(20,184,166,.23),rgba(8,145,178,.10));color:#fff;box-shadow:inset 3px 0 0 var(--teal-2)}.nav-icon{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.07);font-size:13px;color:#dbeafe;flex:none}.nav a.active .nav-icon{background:rgba(20,184,166,.22);color:#a7f3d0}.sidebar-foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.08);padding:15px 10px 2px;color:#8fa1ba;font-size:11px;display:flex;align-items:center;gap:7px}.version-dot{width:7px;height:7px;border-radius:999px;background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.12)}
.workspace{min-width:0}.topbar{height:82px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(226,232,240,.9);display:flex;align-items:center;justify-content:space-between;padding:0 30px;position:sticky;top:0;z-index:30}.top-left{display:flex;align-items:center;gap:14px}.eyebrow{display:block;color:var(--teal);font-size:10px;font-weight:850;letter-spacing:.16em;margin-bottom:2px}.topbar h2{font-size:18px;margin:0;color:var(--navy)}.menu-btn{display:none;width:40px;height:40px;border-radius:11px;border:1px solid var(--line);background:#fff;color:var(--navy)}.user-menu{display:flex;align-items:center;gap:10px}.avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#dbeafe,#ccfbf1);color:var(--navy);font-weight:900}.user-copy{display:flex;flex-direction:column;min-width:120px}.user-copy strong{font-size:13px}.user-copy small{color:var(--muted);font-size:11px}.logout{margin-left:6px;border-left:1px solid var(--line);padding-left:16px;color:#475569;font-weight:700;font-size:13px}.logout:hover{color:var(--danger)}
.content{padding:30px;max-width:1600px;width:100%;margin:0 auto}.content>h1,.content>div>div>h1{font-size:30px;line-height:1.15;margin:0 0 8px;color:var(--navy);letter-spacing:-.03em}.muted{color:var(--muted)}p.muted{margin-top:4px}.grid{display:grid;gap:18px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.stats{grid-template-columns:repeat(4,minmax(0,1fr));margin:20px 0}.card{background:linear-gradient(180deg,#fff 0%,#fdfefe 100%);border:1px solid rgba(226,232,240,.9);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);margin-bottom:18px}.card h2{margin:0 0 15px;font-size:20px;color:var(--navy);letter-spacing:-.02em}.stats .card{position:relative;overflow:hidden;min-height:122px}.stats .card:after{content:"";position:absolute;right:-30px;top:-30px;width:105px;height:105px;border-radius:999px;background:linear-gradient(135deg,rgba(20,184,166,.10),rgba(8,145,178,.03))}.stats b{display:block;font-size:33px;line-height:1;color:var(--navy);margin-bottom:10px}.stats span{color:var(--muted);font-size:13px;font-weight:650}.row{display:flex;gap:10px;align-items:center}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.page-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:13px;color:#334155}input,select,textarea{width:100%;padding:11px 12px;border:1px solid #cbd5e1;border-radius:11px;background:#fff;color:var(--ink);outline:none;transition:.15s ease}input:focus,select:focus,textarea:focus{border-color:#5eead4;box-shadow:0 0 0 4px rgba(20,184,166,.10)}textarea{min-height:95px;resize:vertical}.form{display:grid;gap:16px}
button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;background:linear-gradient(135deg,var(--teal),#0b8b83);color:#fff;padding:10px 16px;border-radius:11px;text-decoration:none;font-weight:800;font-size:13px;box-shadow:0 7px 16px rgba(15,118,110,.15);transition:.16s ease}button:hover,.btn:hover{transform:translateY(-1px);filter:saturate(1.08)}.btn.secondary,.secondary{background:#eef2f7;color:#334155;box-shadow:none}.btn.outline{background:#fff;color:var(--teal);border:1px solid #99f6e4;box-shadow:none}.btn.gold{background:linear-gradient(135deg,#b98222,var(--gold));color:#fff}.small{padding:6px 10px;font-size:11px;border-radius:9px}
.search{display:flex;gap:9px;margin:16px 0}.search input{max-width:500px}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:0 8px 24px rgba(15,23,42,.035)}table{border-collapse:separate;border-spacing:0;width:100%}th,td{text-align:left;padding:12px 13px;border-bottom:1px solid #edf1f6;white-space:nowrap;font-size:13px}th{background:#f8fafc;color:#475569;font-size:11px;text-transform:uppercase;letter-spacing:.045em;font-weight:850;position:sticky;top:0}tr:last-child td{border-bottom:0}tbody tr:hover td{background:#fbfdfd}.badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:850;letter-spacing:.025em}.badge.ok{background:#dcfce7;color:#166534}.badge.neutral{background:#e2e8f0;color:#475569}.badge.warn{background:#fef3c7;color:#92400e}.badge.error{background:#fee2e2;color:#991b1b}
.alert{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;padding:12px 14px;border-radius:12px;margin:14px 0;font-size:13px}.alert.success{background:#ecfdf5;color:#166534;border-color:#bbf7d0}.alert.error{background:#fef2f2;color:#991b1b;border-color:#fecaca}.context-bar{display:flex;gap:10px;align-items:center;background:linear-gradient(90deg,#ecfeff,#ecfdf5);border:1px solid #c7f2ea;color:#0f5f5a;padding:11px 14px;border-radius:12px;margin:16px 0}.context-bar span{padding-left:10px;border-left:1px solid #b9e9df}.sticky-actions{position:sticky;bottom:14px;display:flex;gap:12px;align-items:center;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border:1px solid var(--line);padding:12px 14px;border-radius:14px;box-shadow:0 15px 35px rgba(15,23,42,.12);margin-top:8px}.kpi-line{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid #eef2f6}.kpi-line:last-child{border-bottom:0}.kpi-line strong{color:var(--navy)}code{background:#f1f5f9;color:#0f766e;padding:2px 6px;border-radius:6px;font-size:.92em}.help{font-size:12px;color:var(--muted);font-weight:500}.section-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}.section-head h1{margin:0 0 7px;font-size:30px;color:var(--navy)}
.file-drop{border:1.5px dashed #94a3b8;border-radius:16px;padding:25px;background:linear-gradient(135deg,#f8fafc,#f0fdfa);text-align:center;position:relative}.file-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}.file-drop .drop-icon{width:50px;height:50px;border-radius:15px;background:#ccfbf1;color:#0f766e;display:grid;place-items:center;font-size:24px;margin:0 auto 10px;font-weight:900}.file-drop strong{display:block;color:var(--navy);margin-bottom:4px}.file-drop small{display:block;color:var(--muted)}.file-name{margin-top:9px;color:var(--teal);font-weight:750;font-size:12px}.preview-scroll{max-height:520px;overflow:auto}.summary-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}.summary-item{background:#f8fafc;border:1px solid var(--line);border-radius:13px;padding:13px}.summary-item b{font-size:22px;color:var(--navy);display:block}.summary-item span{font-size:11px;color:var(--muted)}
.brand-preview{display:flex;align-items:center;gap:18px;padding:18px;border-radius:16px;background:linear-gradient(135deg,#0f172a,#18314d);color:#fff}.brand-preview img{width:72px;height:72px;border-radius:18px;object-fit:contain;background:#fff;padding:7px}.brand-preview .fallback{width:72px;height:72px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,var(--teal-2),var(--cyan));font-size:22px;font-weight:900}.brand-preview small{color:#aab9ce}.image-upload{border:1px solid var(--line);border-radius:15px;padding:16px;background:#fafcfe}.image-upload h3{margin:0 0 5px;font-size:15px;color:var(--navy)}
.update-box{border:1px solid #bae6fd;background:linear-gradient(135deg,#f0f9ff,#f0fdfa);border-radius:16px;padding:18px}.update-box h3{margin:0 0 6px;color:var(--navy)}.update-box .file-drop{background:white;margin:14px 0}.update-note{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:13px}.update-note div{background:rgba(255,255,255,.75);border:1px solid #dbeafe;border-radius:11px;padding:10px;font-size:11px;color:#475569}.update-note b{display:block;color:var(--navy);margin-bottom:3px}
.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;position:relative;overflow:hidden;background:linear-gradient(135deg,#0f172a 0%,#12314a 55%,#0f766e 120%)}.auth-bg{position:absolute;inset:0;background:radial-gradient(circle at 15% 20%,rgba(20,184,166,.22),transparent 27%),radial-gradient(circle at 86% 78%,rgba(214,168,75,.18),transparent 22%)}.auth-card{position:relative;width:min(430px,100%);background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.7);border-radius:24px;padding:30px;box-shadow:0 35px 80px rgba(2,8,23,.28)}.auth-logo{width:58px;height:58px;border-radius:17px;background:linear-gradient(135deg,var(--teal-2),var(--cyan));display:grid;place-items:center;color:#fff;font-weight:900;font-size:18px;margin-bottom:20px}.auth-card h1{margin:0;color:var(--navy);font-size:28px}.auth-card p{margin:7px 0 22px}.auth-card form{display:grid;gap:15px}.auth-card button{margin-top:4px;padding:12px 16px}.auth-foot{text-align:center;color:#94a3b8;font-size:11px;margin-top:18px}
.sidebar-overlay{display:none}
@media(max-width:1100px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.two{grid-template-columns:1fr}.summary-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:-300px;transition:left .22s ease;width:280px}.sidebar-open .sidebar{left:0}.sidebar-close{display:block}.sidebar-overlay{position:fixed;inset:0;background:rgba(2,6,23,.45);z-index:40}.sidebar-open .sidebar-overlay{display:block}.menu-btn{display:grid;place-items:center}.topbar{padding:0 16px}.user-copy{display:none}.logout{padding-left:10px}.content{padding:20px 16px}.section-head{flex-direction:column}.page-actions{width:100%}}
@media(max-width:600px){.stats,.summary-strip{grid-template-columns:1fr}.row{flex-wrap:wrap}.search{flex-wrap:wrap}.search input{max-width:none}.content>h1,.section-head h1{font-size:26px}.topbar{height:72px}.topbar h2{font-size:15px}.logout{font-size:12px}.update-note{grid-template-columns:1fr}.card{padding:17px;border-radius:15px}}
button:disabled,.btn.disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.15);transform:none!important}
