:root{
  color-scheme:dark;
  --bg:#090e13; --panel:#111a21; --panel2:#17232b; --field:#0b151b; --line:#2a3740; --line2:#3b4b54;
  --muted:#a8b9bf; --soft:#c9d6d2; --white:#f4f6f2; --accent:#c7f36b; --accent-ink:#142015; --accent2:#96c8af;
  --warning:#ffd48d; --warn-bg:#b9945f13; --warn-line:#897258; --danger:#f7aea6;
  --radius:21px; --shadow:0 20px 60px rgba(0,0,0,.22);
  --display:"Space Grotesk","DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --body:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(ellipse 58% 27% at 65% 0%,rgba(130,183,112,.10),transparent 68%),var(--bg);color:var(--white);font-family:var(--body);line-height:1.55;font-size:16px;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit}
button{cursor:pointer}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{max-width:780px;margin:auto;padding-inline:20px}
.topbar{border-bottom:1px solid #24303880;position:sticky;top:0;z-index:20;background:#090e13ef;backdrop-filter:blur(16px)}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;min-height:68px;gap:16px}
.brand{display:flex;gap:11px;align-items:center;font-weight:800;letter-spacing:-.04em;font-family:var(--display);font-size:17px;color:var(--white);text-decoration:none}
.logo{width:37px;height:37px;background:var(--accent);color:var(--accent-ink);border-radius:12px;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:14px;transform:rotate(-7deg);letter-spacing:-.04em;white-space:nowrap}
.logo sup{font-size:9px}
.brand small{display:block;font-size:10px;color:#aac0b3;letter-spacing:.14em;font-weight:700;font-family:var(--body)}
.ghost{background:transparent;border:1px solid var(--line);color:#dce7e2;border-radius:11px;padding:9px 12px;font-size:13px;font-weight:700}
.ghost:hover{background:#213037}
.quiz{padding-block:48px 24px;min-height:60vh}
.progress{height:6px;background:#22313a;border-radius:9px;overflow:hidden;margin-bottom:10px}
.progress div{height:100%;width:0;background:var(--accent);border-radius:9px;transition:width .3s}
.stepcount{font-size:12px;color:var(--muted);font-weight:700;letter-spacing:.08em;margin:0 0 26px}
.step{display:none}
.step.active{display:block}
@media (prefers-reduced-motion:no-preference){.step.active{animation:rise .25s ease}@keyframes rise{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}}
.eyebrow{font-size:12px;color:var(--accent);font-weight:800;letter-spacing:.18em;text-transform:uppercase;margin:0}
h1{font-family:var(--display);font-size:clamp(36px,7vw,62px);letter-spacing:-.05em;line-height:1.02;margin:14px 0 18px;font-weight:700;text-wrap:balance}
h1 em{font-style:normal;color:var(--accent)}
h2{font-family:var(--display);font-size:clamp(24px,4.4vw,32px);letter-spacing:-.035em;line-height:1.12;margin:0 0 10px;text-wrap:balance}
.lede{color:var(--muted);font-size:17px;margin:0 0 26px;max-width:620px}
.micro{font-size:12px;color:#98abb0;margin-top:14px}
.button{border:0;padding:14px 20px;border-radius:12px;background:var(--accent);color:var(--accent-ink);font-size:15px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:9px}
.button:hover{filter:brightness(1.07)}
.button:disabled{opacity:.6;cursor:wait}
.button.big{padding:17px 28px;font-size:17px}
.button.full{grid-column:1/-1;margin-top:6px}
.button.secondary{color:var(--white);border:1px solid #52645b;background:transparent}
.link{background:none;border:0;color:var(--muted);font-weight:700;padding:8px 0;font-size:14px}
.link:hover{color:var(--white)}
.nav{margin-top:22px}
.opts{display:grid;gap:10px}
.opts.two{grid-template-columns:1fr 1fr}
.opt{text-align:left;background:#131f26;border:1px solid #314148;border-radius:15px;padding:18px 18px;color:var(--white);display:flex;flex-direction:column;gap:4px;transition:border-color .15s,background .15s}
.opt:hover{border-color:#819989;background:#16252d}
.opt b{font-size:16px;line-height:1.3}
.opt span{font-size:13px;color:#b3c3c4}
.opt[aria-checked="true"]{border-color:var(--accent);background:#c7f31c12}
.sachefields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field.full{grid-column:1/-1}
.field label{font-size:13px;font-weight:700;color:#d3dfe0}
.field input,.field select{color:var(--white);width:100%;min-width:0;background:var(--field);border:1px solid var(--line2);outline:none;border-radius:11px;padding:12px 13px;min-height:47px}
.field input:focus,.field select:focus{border-color:var(--accent)}
input[type=number]{font-variant-numeric:tabular-nums}
.sachefields .full{grid-column:1/-1}
.check{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--soft);cursor:pointer}
.check input{accent-color:var(--accent);width:18px;height:18px;margin:2px 0 0;flex-shrink:0}
.formerr{grid-column:1/-1;margin:0;color:var(--danger);font-size:14px;font-weight:700}
.field input.bad{border-color:var(--danger)}
#result{padding-bottom:20px}
.verdict{margin-top:40px;border:1px solid #557252;border-radius:var(--radius);padding:28px;background:linear-gradient(160deg,#1a2b2a,#111d21 55%,#101820);box-shadow:var(--shadow)}
.verdict.warn{border-color:var(--warn-line);background:linear-gradient(160deg,#2a2519,#16191a 60%)}
.verdict.warn .eyebrow{color:var(--warning)}
.verdict h2{font-size:clamp(30px,5.6vw,44px);margin:12px 0 14px;letter-spacing:-.045em;line-height:1.05}
.verdict p{color:var(--soft);margin:0 0 12px}
.verdict ul{color:var(--soft);padding-left:20px;margin:0 0 12px}
.verdict li{margin-bottom:6px}
.v-note{font-size:12px!important;color:#98abb0!important;border-top:1px solid #ffffff1f;padding-top:14px;margin-top:18px!important}
.block{margin-top:44px}
.kicker{display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.14em;font-weight:800;text-transform:uppercase;color:#9ab9ab;margin:0 0 10px}
.dot{width:8px;height:8px;background:var(--accent);border-radius:50%}
.body{color:var(--soft);margin:0 0 14px}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}
.stat{border:1px solid #456153;background:#152624;border-radius:14px;padding:16px;min-width:0}
.stat small{display:block;color:#afc4bd;font-size:12px}
.stat b{display:block;font-family:var(--display);font-size:28px;margin:8px 0 4px;line-height:1.05;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.stat b i{font-style:normal;font-size:13px;color:#b4c4ba;letter-spacing:0}
.stat span{font-size:12px;color:var(--muted)}
.stat.hi{border-color:#a58d67;background:#2a2519}
.stat.hi b{color:var(--warning)}
.bars{display:flex;flex-direction:column;gap:8px;margin:6px 0 18px}
.bar{display:grid;grid-template-columns:150px 1fr 74px;gap:10px;align-items:center;font-size:12px;color:var(--muted)}
.bar .tr{height:12px;background:#1a272e;border-radius:6px;overflow:hidden}
.bar .tr div{height:100%;border-radius:6px;background:var(--accent2)}
.bar.br .tr div{background:var(--warning)}
.bar.sa .tr div{background:#5f747c}
.bar .vl{text-align:right;font-variant-numeric:tabular-nums;color:var(--soft);font-weight:700}
.callout{border:1px solid #435549;border-radius:14px;background:#bded6d0b;color:#c9dccf;padding:15px 16px;font-size:14px;margin-top:8px}
.callout strong{color:var(--accent)}
.callout.warn{background:var(--warn-bg);border-color:var(--warn-line);color:#f0d5ab}
.callout.warn strong{color:var(--warning)}
.cmpbar{display:grid;grid-template-columns:1fr;gap:12px;margin:6px 0 14px;max-width:420px}
.foods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.food{background:#121e25;border:1px solid #2e3f46;border-radius:15px;padding:16px;min-width:0;display:flex;flex-direction:column;gap:8px}
.food .top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.food .nm{font-weight:800;font-size:15px}
.food .por{font-size:12px;color:var(--muted)}
.food .na{font-family:var(--display);font-size:22px;color:var(--accent);white-space:nowrap;letter-spacing:-.03em}
.food .na small{font-size:11px;color:var(--muted);font-family:var(--body)}
.food .eq{font-size:13px;color:var(--soft);border-top:1px solid #304149;padding-top:9px}
.food .eq b{color:var(--white)}
.month{margin-top:16px;border:1px solid #a58d67;background:#2a2519;border-radius:16px;padding:20px}
.month .big{font-family:var(--display);font-size:clamp(24px,4.6vw,34px);letter-spacing:-.04em;line-height:1.1;margin:4px 0 10px;color:var(--white)}
.month .big em{font-style:normal;color:var(--warning)}
.month p{margin:0 0 8px;color:#f0d5ab}
.month .punch{font-weight:800;color:var(--white);margin:12px 0 0}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--muted);margin:4px 0 12px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.lg-food{background:var(--accent2)}.lg-prod{background:#5f747c}.lg-mine{background:var(--accent)}
.rank{display:flex;flex-direction:column;gap:9px}
.rk{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr) 78px;gap:10px;align-items:center;font-size:13px}
.rk .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--soft)}
.rk .tr{height:12px;border-radius:6px;background:#1a272e;overflow:hidden}
.rk .tr div{height:100%;border-radius:6px;background:#5f747c;min-width:3px}
.rk.food .tr div{background:var(--accent2)}
.rk.mine .tr div{background:var(--accent)}
.rk.mine .nm{color:var(--accent);font-weight:800}
.rk .vl{text-align:right;font-variant-numeric:tabular-nums;font-weight:700}
.myths{display:flex;flex-direction:column;gap:8px}
.myths details{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.myths summary{cursor:pointer;font-weight:800;font-size:15px}
.myths p{margin:10px 0 0;font-size:14px;color:#b1c4c5}
.myths a{font-size:12px}
.share{display:flex;gap:10px;flex-wrap:wrap}
.foot{margin-top:56px;padding:28px 0 48px;border-top:1px solid var(--line)}
.disclaimer{border:1px solid var(--warn-line);background:var(--warn-bg);color:#f0d5ab;border-radius:14px;padding:16px;font-size:14px}
.disclaimer strong{color:var(--warning)}
.foot h3{font-family:var(--display);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#9ab9ab;margin:26px 0 10px}
.srcs{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;font-size:13px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--accent);color:var(--accent-ink);font-weight:800;padding:10px 18px;border-radius:100px;z-index:50}
@media (max-width:620px){
  .quiz{padding-top:30px}
  .opts.two,.sachefields,.foods,.srcs{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
  .bar{grid-template-columns:110px 1fr 62px}
  .rk{grid-template-columns:minmax(0,120px) minmax(0,1fr) 66px;font-size:12px}
  .verdict{padding:22px}
  .brand>span:last-child{font-size:15px}
}