:root{
  --bg:#f6f8fb; --card:#fff; --text:#0f172a; --muted:#6b7280; --accent:#0b5ea8;
  --o2:#2d8f28; --he:#b8860b; --n2:#8a9099;
  --radius:12px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial;background:var(--bg);color:var(--text);}
.app-header{display:flex;align-items:center;gap:12px;padding:10px 14px;background:#fff;box-shadow:0 2px 10px rgba(2,6,23,.06);position:sticky;top:0;z-index:10}
.brand{font-size:18px;color:var(--accent);margin:0}
.hamburger{display:none;background:transparent;border:1px solid #e7eef7;border-radius:8px;padding:6px 10px;cursor:pointer}
.nav ul{display:flex;gap:8px;list-style:none;margin:0;padding:0}
.nav .navitem{padding:8px 10px;border:0;border-radius:8px;background:#eef5ff;color:#0b5ea8;cursor:pointer}
.nav .navitem[aria-current="page"]{background:var(--accent);color:#fff}
.app-main{max-width:1200px;margin:18px auto;padding:0 14px;display:grid;gap:14px}
.panel{background:var(--card);border-radius:var(--radius);padding:16px;box-shadow:0 6px 18px rgba(2,6,23,.06)}
.app-footer{text-align:center;color:var(--muted);padding:20px}
.row{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.col{flex:1}
.input{padding:8px;border:1px solid #e6edf3;border-radius:8px;width:100%}
.button{background:var(--accent);color:#fff;border:0;border-radius:8px;padding:8px 12px;cursor:pointer}
.button.ghost{background:transparent;color:var(--accent);border:1px solid rgba(11,94,168,.25)}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th,.table td{padding:8px;border-bottom:1px solid #eef2f7;text-align:left}
.card{background:#fff;border-radius:var(--radius);padding:12px;box-shadow:0 4px 12px rgba(2,6,23,.05)}
.meta{font-size:13px;color:var(--muted)}
.stack{height:12px;background:#e5eef7;border-radius:999px;overflow:hidden;display:flex}
.stack>div{height:100%}
legend, label.small{font-size:13px;color:var(--muted)}
input[type=range]{width:100%}

@media (max-width:900px){
  .hamburger{display:inline-block}
  .nav{position:fixed;inset:56px auto auto 0;width:70%;max-width:300px;background:#fff;box-shadow:0 10px 30px rgba(2,6,23,.15);transform:translateX(-105%);transition:.2s;padding:14px;border-radius:0 14px 14px 0}
  .nav.open{transform:none}
  .nav ul{flex-direction:column}
}
.panel[hidden]{display:none !important}