:root{
  font-family:Inter,system-ui,sans-serif;
  --bg:#fbf2ee;
  --paper:#fff8f4;
  --line:#ecd8d2;
  --ink:#382326;
  --muted:#715e61;
  --rose:#a05d6d;
  --rose-dark:#7a4050;
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#fff9f5 0,#f6eae4 100%);color:var(--ink)}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit}
.shell{max-width:1320px;margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:10;background:rgba(255,249,245,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 0}
.brand{display:flex;align-items:center;gap:12px;font-weight:800}
.mark{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#f3dbe0;color:var(--rose-dark)}
nav{display:flex;gap:16px;flex-wrap:wrap;color:var(--muted)}
main{padding:28px 0 40px}
.hero{display:grid;gap:16px;max-width:760px}
.eyebrow{display:inline-flex;width:max-content;padding:8px 12px;border-radius:999px;background:#f3dbe0;color:var(--rose-dark);font-size:13px;font-weight:800}
h1,h2{margin:0}
h1{font-family:Georgia,serif;font-size:clamp(42px,5vw,74px);line-height:.98}
.lede,.card p,.note{color:var(--muted)}
.workspace{display:grid;grid-template-columns:.95fr 1.05fr;gap:22px;padding-top:24px}
.panel,.result,.card,.table-shell{background:rgba(255,248,244,.94);border:1px solid var(--line);border-radius:22px;padding:22px}
.fields{display:grid;gap:14px}
.fields label{display:grid;gap:8px;font-weight:700}
.fields select{padding:14px;border-radius:14px;border:1px solid var(--line);background:#fff}
.actions{padding-top:12px}
.primary{padding:12px 16px;border-radius:999px;border:1px solid var(--rose);background:var(--rose);color:#fff8f4;font-weight:700;cursor:pointer}
.rings{display:grid;grid-template-columns:1fr .8fr 1fr;gap:16px;align-items:center}
.ring{display:grid;place-items:center;aspect-ratio:1;border-radius:50%;border:1px solid var(--line);background:radial-gradient(circle at center,#fff 0,#f3dfd9 70%,#ead2ca 100%);padding:18px;text-align:center}
.ring.center{background:radial-gradient(circle at center,#fff 0,#ecd4db 70%,#ddb7c0 100%)}
.ring span{font-size:13px;color:var(--muted);margin-bottom:8px}
.ring strong{font-size:34px;color:var(--rose-dark)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:24px}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px;border-bottom:1px solid #eaded8}
th{font-size:13px;color:var(--muted)}
footer{border-top:1px solid var(--line);color:var(--muted)}
.footer{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:22px 0}
@media(max-width:1100px){.workspace,.grid,.rings{grid-template-columns:1fr}}