:root{
  --bg-dark:#0B0F12; --card-dark:#12161B; --txt-dark:#E9EEF4; --line:#1E242B; --accent:#2D79FF;
  --bg-light:#F7F9FB; --card-light:#FFFFFF; --txt-light:#0B0F12; --line-light:#E6ECF2;
}
html,body{height:100%;margin:0}
body{display:flex;flex-direction:column;background:var(--bg-dark);color:var(--txt-dark);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial}
body[data-theme="light"]{background:var(--bg-light);color:var(--txt-light)}
.app-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
body[data-theme="light"] .app-header{border-color:var(--line-light)}
.brand{display:flex;align-items:center;gap:10px}
.logo-circle{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fff 0,#cfd3d8 35%,#6f7a86 70%,#1a1c1f 100%);border:2px solid #fff}
.brand-text{font-weight:700}.brand-text span{color:var(--accent)}
nav{display:flex;gap:8px}
.nav-btn{border:1px solid var(--line);background:transparent;color:inherit;padding:8px 10px;border-radius:10px;cursor:pointer}
.nav-btn.active,.btn.primary{background:var(--accent);color:#fff;border-color:transparent}
.container{max-width:980px;margin:18px auto;padding:0 16px;flex:1;display:grid;gap:18px;width:100%}
.card{background:var(--card-dark);border:1px solid var(--line);border-radius:14px;padding:16px}
body[data-theme="light"] .card{background:var(--card-light);border-color:var(--line-light)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.field{display:flex;flex-direction:column;gap:6px}
.field input,.field select{padding:10px;border-radius:10px;border:1px solid var(--line);background:transparent;color:inherit}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.btn{border:1px solid var(--line);background:#151a21;color:var(--txt-dark);padding:10px 14px;border-radius:10px;font-weight:600;cursor:pointer}
.btn.ghost{background:transparent}
.results{margin-top:10px;border-top:1px dashed var(--line);padding-top:10px;display:grid;gap:8px}
.results .line{display:flex;justify-content:space-between}
.results .total{font-size:1.15rem;border-top:1px solid var(--line);padding-top:8px}
.hidden{display:none}
.muted{opacity:.7}
.subcard{border-top:1px dashed var(--line);padding-top:12px;margin-top:12px}
.icon-preview{width:72px;height:72px;object-fit:contain;margin-top:8px;border:1px dashed var(--line);border-radius:10px;background:rgba(255,255,255,0.02)}
.app-footer{margin-top:auto;text-align:center;padding:12px;border-top:1px solid var(--line)}
/* Light tweaks */
body[data-theme="light"] .btn{background:#fff;color:#0B0F12;border-color:var(--line-light)}
body[data-theme="light"] .icon-preview{border-color:var(--line-light);background:#fff}