/* Product theme layer */
:root { --ink:#182a25; --muted:#6f817a; --line:#dfe9e3; --paper:#f3f7f3; --card:#ffffff; --green:#176b54; --green-dark:#0f4d3c; --mint:#d9eee4; --amber:#a86b18; --red:#b84e43; --shadow:0 16px 40px rgba(20,55,43,.09); }
body { background:linear-gradient(135deg,#f4f8f5 0%,#eef5f0 52%,#f8f2e8 100%); color:var(--ink); font-family:"Trebuchet MS","Segoe UI",sans-serif; letter-spacing:.01em; }
.app-shell { min-height:100vh; grid-template-columns:260px 1fr; }
.sidebar { background:linear-gradient(165deg,#123e32 0%,#1a5946 100%); padding:30px 22px; box-shadow:12px 0 35px rgba(17,61,48,.12); }
.sidebar .brand-mark { margin:0 8px 52px; }
.sidebar .brand-mark > span { border-radius:10px; box-shadow:0 8px 18px rgba(0,0,0,.16); }
.nav-link { padding:13px 14px; border-radius:10px; font-weight:700; }
.nav-link.active { background:#e4f3eb; color:var(--green-dark); box-shadow:0 7px 18px rgba(0,0,0,.08); }
.nav-link.active:hover { color:var(--green-dark); background:#e4f3eb; }
.sidebar-footer { padding:20px 10px 0; }
.topbar { height:86px; padding:0 6%; box-shadow:0 1px 0 rgba(20,55,43,.04); }
.topbar h2 { font-size:19px; font-weight:800; }
.main { max-width:1240px; padding:48px 6%; }
.welcome { margin-bottom:34px; }
.welcome h1 { font-family:Georgia,"Times New Roman",serif; font-size:42px; font-weight:500; letter-spacing:-1.8px; }
.eyebrow { letter-spacing:2px; }
.stat-grid { gap:18px; margin-bottom:38px; }
.stat { border-radius:14px; padding:24px; box-shadow:var(--shadow); transition:transform .2s,box-shadow .2s; }
.stat:hover { transform:translateY(-2px); box-shadow:0 20px 44px rgba(20,55,43,.13); }
.stat-value { font-size:31px; }
.panel { border:1px solid rgba(210,225,217,.9); border-radius:14px; box-shadow:var(--shadow); }
.panel-header { padding:21px 24px; background:rgba(250,252,250,.8); }
.panel-header h2 { font-size:18px; font-weight:800; }
th { padding:14px 24px; background:#f5f9f6; font-size:10px; }
td { padding:18px 24px; }
tbody tr:hover { background:#fbfdfb; }
.button { border-radius:8px; box-shadow:0 4px 9px rgba(20,55,43,.08); letter-spacing:.01em; }
.button.primary { background:var(--green); }
.button.secondary { border:1px solid #cce2d7; }
.button.danger { background:var(--red); }
.form-grid { padding:26px 24px; gap:0 22px; }
.form-actions { padding:0 24px 24px; }
input, select { border-radius:8px; min-height:45px; }
label { margin-top:21px; }
.alert { border:1px solid transparent; box-shadow:0 5px 14px rgba(20,55,43,.05); }
.notice { border:1px solid #eadbbd; box-shadow:var(--shadow); }
.badge { letter-spacing:.4px; }
.progress { height:7px; }
.payment-form { gap:7px; flex-wrap:wrap; }
.payment-form input, .payment-form select { min-height:36px; }
.auth-page { background:radial-gradient(circle at 10% 10%,#d7eee4 0,transparent 32%),radial-gradient(circle at 90% 90%,#f2dfbd 0,transparent 30%),#f3f7f3; }
.auth-shell { width:min(470px,100%); }
.auth-card { border-radius:20px; padding:40px; box-shadow:0 24px 70px rgba(20,55,43,.13); }
.auth-card h1 { font-family:Georgia,"Times New Roman",serif; font-weight:500; }
.brand-mark > span { border-radius:10px; }
.payment-summary { gap:12px; }
.billing-box { box-shadow:0 7px 18px rgba(20,55,43,.06); }
.section-gap { margin-top:34px; }
@media (max-width:820px) { .app-shell { grid-template-columns:1fr; }.sidebar { box-shadow:none; }.main { padding:34px 18px; }.welcome h1 { font-size:34px; }.topbar { padding:0 18px; }.panel-header { padding:18px; }.form-grid { padding:20px 18px; }.form-actions { padding:0 18px 18px; } }
@media (max-width:520px) { .auth-card { padding:28px 22px; }.user-menu > span:not(.avatar), .logout { display:none; }.welcome h1 { font-size:30px; }.stat { padding:19px; }.button { padding:11px 13px; } }