:root{
  --bg:#f7f4ee; --card:#fffdf8; --ink:#1f2933; --muted:#667085; --line:#e8dfd1;
  --accent:#b86b2b; --accent2:#2f6f5e; --danger:#9b1c1c; --good:#237a4b; --warn:#9a6700;
  --shadow:0 12px 30px rgba(31,41,51,.08); --radius:20px;
}
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.45}
a{color:var(--accent2);text-decoration:none} a:hover{text-decoration:underline}
.site-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 26px;background:rgba(255,253,248,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.18rem;color:var(--ink)}.brand:hover{text-decoration:none}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:14px;background:var(--accent);color:white;box-shadow:var(--shadow)}
.nav{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.nav a{font-weight:650;color:var(--ink)}
.container{max-width:1180px;margin:0 auto;padding:28px}.site-footer{text-align:center;color:var(--muted);padding:28px;border-top:1px solid var(--line)}
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center}.hero h1{font-size:clamp(2.2rem,4vw,4rem);line-height:1.02;margin:0 0 14px}.hero p{font-size:1.12rem;color:var(--muted);max-width:720px}.tag{display:inline-flex;gap:8px;align-items:center;padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-weight:700;color:var(--accent2);margin-bottom:16px}
.grid{display:grid;gap:18px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}.card h2,.card h3{margin-top:0}.muted{color:var(--muted)}.big-number{font-size:2.25rem;font-weight:850;letter-spacing:-.04em}.unit{color:var(--muted);font-weight:700}.pill{display:inline-block;padding:6px 10px;border-radius:999px;background:#f0eadf;border:1px solid var(--line);font-weight:700;color:var(--muted)}
.btn,button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:14px;padding:11px 16px;background:var(--accent2);color:#fff;font-weight:800;cursor:pointer;box-shadow:var(--shadow)}.btn:hover,button:hover{text-decoration:none;filter:brightness(.96)}.btn.secondary,button.secondary{background:#ebe3d7;color:var(--ink)}.btn.danger,button.danger{background:var(--danger)}.btn.small{padding:8px 11px;border-radius:12px;font-size:.92rem}
form{display:grid;gap:14px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}label{display:grid;gap:6px;font-weight:750}input,select,textarea{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:inherit}textarea{min-height:100px}.help{font-size:.9rem;color:var(--muted);font-weight:500}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.right{text-align:right}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px;background:var(--card)}table{width:100%;border-collapse:collapse}th,td{padding:12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:#f4eddf;font-size:.88rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}tr:last-child td{border-bottom:0}
.flash{padding:12px 14px;margin-bottom:18px;border-radius:14px;border:1px solid var(--line);background:var(--card);font-weight:700}.flash.success{border-color:#b9e5ca;background:#ecfff4;color:var(--good)}.flash.error{border-color:#f2b8b5;background:#fff1f0;color:var(--danger)}.flash.info{border-color:#bfd7ff;background:#eff6ff;color:#204a87}.flash.warning{border-color:#ffd666;background:#fffbe6;color:var(--warn)}
.progress{height:16px;border-radius:999px;background:#ece3d8;overflow:hidden}.bar{height:100%;background:var(--accent2);width:0%}.bar.warn{background:var(--warn)}.bar.danger{background:var(--danger)}
.kv{display:grid;grid-template-columns:1fr auto;gap:8px}.kv div{padding:8px 0;border-bottom:1px dashed var(--line)}.kv div:nth-child(even){font-weight:800;text-align:right}.center{text-align:center}.section{margin-top:24px}.nowrap{white-space:nowrap}
@media(max-width:850px){.hero,.grid.two,.grid.three,.grid.four,.form-grid{grid-template-columns:1fr}.site-header{align-items:flex-start;flex-direction:column}.container{padding:18px}.nav{gap:10px}.card{padding:18px}}

/* Friendly profile calculation panel */
.friendly-kv div:nth-child(odd) {
  color: var(--muted);
}

.advanced-panel {
  margin-top: 1.25rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}

.advanced-panel summary {
  cursor: pointer;
  list-style: none;
  padding: 1rem 1.1rem;
  font-weight: 800;
  color: var(--ink);
  background: #f7faf7;
  border-bottom: 1px solid transparent;
}

.advanced-panel summary::-webkit-details-marker {
  display: none;
}

.advanced-panel summary::after {
  content: "+";
  float: right;
  font-size: 1.2rem;
  line-height: 1;
  color: var(--muted);
}

.advanced-panel[open] summary {
  border-bottom-color: var(--border);
}

.advanced-panel[open] summary::after {
  content: "−";
}

.advanced-panel > p,
.advanced-panel > .kv {
  margin-left: 1.1rem;
  margin-right: 1.1rem;
}

.advanced-panel > .kv {
  margin-bottom: 1.1rem;
}
