:root{
  --bg:#f5f7fb;
  --bg-soft:#eef3fb;
  --card:#ffffff;
  --line:#dbe3f0;
  --text:#162033;
  --muted:#66738a;
  --primary:#4f46e5;
  --primary-soft:#eef0ff;
  --secondary:#0ea5e9;
  --success:#169455;
  --danger:#dc2626;
  --shadow:0 18px 40px rgba(22,32,51,.08);
  --radius:22px;
}
*{box-sizing:border-box} html,body{margin:0;padding:0;font-family:Inter,system-ui,Segoe UI,Roboto,sans-serif;color:var(--text);background:linear-gradient(180deg,#f8fbff 0%,#f3f6fb 100%);min-height:100%}
a{color:inherit;text-decoration:none} h1,h2,h3,h4,p{margin:0} body{min-height:100vh}
.card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius)}
.app-shell{display:grid;grid-template-columns:290px 1fr;min-height:100vh;gap:24px;padding:24px}
.sidebar{padding:24px;position:sticky;top:24px;height:calc(100vh - 48px)}
.brand-block{display:flex;gap:14px;align-items:center;margin-bottom:28px}.brand-logo{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,var(--primary),var(--secondary));display:grid;place-items:center;color:#fff;font-weight:800}.brand-block h1{font-size:1.05rem}.brand-block p{font-size:.86rem;color:var(--muted);margin-top:4px}
.nav-menu{display:flex;flex-direction:column;gap:8px}.nav-menu a{padding:13px 16px;border-radius:16px;color:var(--text);font-weight:600}.nav-menu a:hover{background:var(--bg-soft);color:var(--primary)}
.main-content{display:flex;flex-direction:column;gap:18px}.topbar{padding:18px 22px;display:flex;justify-content:space-between;align-items:center}.topbar h2{font-size:1.45rem}.topbar small{color:var(--muted)}
.pill,.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:var(--primary-soft);border:1px solid #d9ddff;font-size:.85rem;color:var(--primary);font-weight:700}.badge{margin-bottom:12px}
.alert,.auth-alert{padding:14px 16px;border-radius:16px}.success{background:#edf9f2;border:1px solid #bfe8cf;color:#145a37}.danger{background:#fff1f1;border:1px solid #f4c2c2;color:#8f1f1f}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat-card{padding:22px}.stat-card span{display:block;color:var(--muted);margin-bottom:12px}.stat-card strong{font-size:2rem}
.grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:18px}.align-start{align-items:start}.maxw-1100{max-width:1100px}
.panel{padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.panel-head h3{font-size:1.05rem}.subtle{color:var(--muted);font-size:.9rem;font-weight:600}
.table-wrap{overflow:auto}.table-wrap table{width:100%;border-collapse:collapse}.table-wrap th,.table-wrap td{padding:12px 10px;border-bottom:1px solid #edf1f7;text-align:left;font-size:.95rem}.table-wrap th{color:#4d5970;font-weight:700;background:#fbfcff;position:sticky;top:0}.table-wrap td{color:var(--text)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid.two-col{grid-template-columns:1fr 1fr}.field{display:flex;flex-direction:column;gap:8px}.field.full{grid-column:1/-1}.field label{font-size:.92rem;color:#405069;font-weight:700}.field input,.field select,.field textarea{width:100%;border:none;border-radius:16px;padding:14px 14px;background:#f8faff;color:var(--text);outline:none;border:1px solid #dbe3f0}.field textarea{min-height:110px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#a5b4fc;box-shadow:0 0 0 4px rgba(79,70,229,.08)}
.checkbox-field label{display:flex;align-items:center;gap:10px;font-weight:600}.checkbox-field input{width:auto}
.btn{border:none;padding:14px 18px;border-radius:16px;font-weight:800;cursor:pointer}.btn.primary{background:linear-gradient(135deg,var(--primary),#6d5ef4);color:#fff}.btn.secondary{background:#eef3fb;color:var(--text);border:1px solid #dbe3f0}.btn.full{width:100%}.row-actions{display:flex;gap:10px}
.result-box{display:flex;flex-direction:column;gap:12px}.result-line{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px dashed #dbe3f0}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}.price-grid>div{background:#f7f9ff;padding:16px;border-radius:18px;border:1px solid #e4e9f5}.price-grid small{color:var(--muted)}.price-grid h4{margin-top:6px;font-size:1.35rem}
.muted{color:var(--muted);line-height:1.6}.note{padding-top:10px}.sticky-result{position:sticky;top:24px}
.auth-body{display:grid;place-items:center;padding:32px;min-height:100vh}.auth-card{width:min(100%,1100px);padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:24px}.install-card{width:min(100%,1200px)}.large-card{max-width:980px}.auth-hero{padding:18px;display:flex;flex-direction:column;justify-content:center;gap:12px}.auth-hero h2{font-size:2.3rem;line-height:1.08}.auth-hero p{color:var(--muted);line-height:1.7}.auth-form{align-content:center}
.search-results{display:none;margin-top:8px;border:1px solid #dbe3f0;border-radius:16px;background:#fff;overflow:hidden}.search-results.active{display:block}.search-item{padding:12px 14px;border-bottom:1px solid #edf1f7;cursor:pointer}.search-item:last-child{border-bottom:none}.search-item:hover{background:#f7f9ff}.search-item strong{display:block}.search-item span{display:block;color:var(--muted);margin-top:2px}.search-item b{display:block;margin-top:4px;color:var(--primary)}
.mini-list{display:flex;flex-direction:column;gap:10px;margin-top:14px}.mini-list div{padding:12px;border-radius:16px;background:#f7f9ff;border:1px solid #e4e9f5}.mini-list span{display:block;color:var(--muted);margin:4px 0}.mini-list b{color:var(--primary)}
hr{border:none;border-top:1px solid #edf1f7;margin:2px 0 4px}
@media (max-width:1100px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.stats-grid,.grid-2,.auth-card{grid-template-columns:1fr}.sticky-result{position:relative;top:0}}
@media (max-width:720px){.app-shell{padding:14px;gap:14px}.form-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:1fr 1fr}.topbar{flex-direction:column;align-items:flex-start;gap:10px}.price-grid{grid-template-columns:1fr}.row-actions{flex-direction:column}.auth-hero h2{font-size:1.8rem}}
