:root{color-scheme:light;--bg:#f7f5ee;--ink:#21211d;--muted:#605e54;--line:#e1ded3;--yellow:#ffd34c;--paper:#fffefa}
*{box-sizing:border-box} [hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,sans-serif}
.shell{width:min(1180px,calc(100% - 80px));margin:auto}
header,footer{display:flex;justify-content:space-between;align-items:center;gap:16px}
header{height:82px;border-bottom:1px solid var(--line)}
a{color:inherit}.brand{display:block}.brand img{display:block;width:76px;height:auto;border-radius:8px}
.edition,.kicker,.meta,.mini{font-size:11px;font-weight:800;letter-spacing:.14em}.edition{color:var(--muted)}
main{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(36px,7vw,100px);align-items:start;padding:40px 0 46px}
.intro{padding-top:16px}.kicker{display:flex;align-items:center;gap:9px}.kicker span{width:9px;height:9px;border-radius:50%;background:#ba8000}
h1,h2{font-family:Georgia,serif;font-weight:500;line-height:.99;letter-spacing:-.058em}
h1{font-size:clamp(38px,4.5vw,64px);margin:14px 0 12px}h1 em{font-weight:400;background:linear-gradient(transparent 76%,#ffe08b 76%,#ffe08b 94%,transparent 94%);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.intro p{max-width:345px;color:var(--muted);font-size:17px}.facts{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}.facts span{border:1px solid var(--line);padding:5px 10px;border-radius:99px;font-size:12px;font-weight:600}
.honey{width:190px;height:112px;overflow:hidden;margin-top:31px;color:#aa7800;opacity:.55}
.card{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:clamp(20px,3.2vw,39px);box-shadow:0 14px 45px #3225100c}.meta{display:flex;justify-content:space-between;gap:10px;color:var(--muted)}
progress{appearance:none;display:block;margin:12px 0 27px;width:100%;height:6px;border:0;border-radius:10px;overflow:hidden;background:#eeece4;accent-color:#d49400}progress::-webkit-progress-bar{background:#eeece4}progress::-webkit-progress-value{background:#d49400;border-radius:10px}progress::-moz-progress-bar{background:#d49400;border-radius:10px}
fieldset{border:0;padding:0;margin:0;min-width:0}legend{padding:0;font-weight:750;font-size:clamp(24px,2.5vw,33px);line-height:1.12;letter-spacing:-.04em}#hint{font-size:14px;color:var(--muted);margin:9px 0 17px}
#choices{display:grid;gap:8px}.option{display:flex;align-items:center;gap:12px;min-height:49px;padding:10px 13px;border:1px solid var(--line);border-radius:10px;cursor:pointer;font-size:14px}.option:hover,.option:has(input:checked){background:#fff5d5;border-color:#a77200}.option input{margin:0;width:17px;height:17px;flex-shrink:0;accent-color:#8a5f00}
.nav{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:21px}.nav #next{margin-left:auto}
button,a{touch-action:manipulation}button{cursor:pointer;font:inherit}.primary,.secondary,.plain{min-height:44px;font-weight:750;font-size:14px}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;text-align:center;padding:10px 17px;border-radius:9px;text-decoration:none;color:var(--ink)}.primary{background:var(--yellow);border:1px solid var(--yellow)}.primary:hover{background:#ffc527}.secondary{border:1px solid #958d78}.secondary:hover{background:#fff5d5}.plain{border:0;background:none;color:var(--muted);padding:0 5px}.plain:hover{text-decoration:underline}:focus-visible{outline:3px solid #7f5600;outline-offset:3px}
#error{color:#8d280b;font-size:14px;margin:12px 0 0}
h2{font-size:clamp(36px,4vw,56px);margin:18px 0 23px}.tip{border-left:3px solid #c28b00;background:#fff5d5;border-radius:0 10px 10px 0;padding:14px 16px;margin-bottom:23px}.tip p{margin:6px 0 0}h3{margin:5px 0 0;font-size:21px}#description{margin:7px 0 18px;color:var(--muted)}.contact{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
footer{border-top:1px solid var(--line);padding:18px 0;color:var(--muted);font-size:12px;flex-wrap:wrap}footer div{display:flex;gap:14px}
@media(max-width:850px){
  .shell{width:min(640px,calc(100% - 28px))}
  header{height:58px}.brand img{width:50px}
  main{grid-template-columns:1fr;gap:14px;padding:12px 0 28px}
  .intro{padding-top:0}
  h1{font-size:clamp(29px,6vw,44px);line-height:1.05;margin:6px 0 7px}
  .intro p{max-width:440px;font-size:15px;line-height:1.35;margin:0}
  .honey{display:none}
  .facts{margin-top:9px;gap:5px}.facts span{padding:3px 8px}
  .card{padding:14px 16px;border-radius:18px}
  progress{margin:8px 0 12px}
  #hint{margin:5px 0 10px}
  #choices{gap:6px}.option{min-height:44px;padding:8px 12px}
}
