*{box-sizing:border-box}body{margin:0;color:#27231f;font:16px/1.55 system-ui;background:#fff}header,main{max-width:1180px;margin:auto;padding:20px 5vw}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ddd}a{color:inherit}header a:first-child{font:36px Georgia;text-decoration:none}small{font:11px system-ui;letter-spacing:.2em}main{display:grid;grid-template-columns:1fr 1fr;gap:5vw}figure{margin:0;background:#eee4d7;align-self:start}figure img,canvas{display:block;width:100%;height:auto} [hidden]{display:none!important}h1,h2{font-family:Georgia;font-weight:400;margin:.15em 0}h1{font-size:clamp(46px,7vw,84px)}h2{font-size:28px}fieldset{margin:20px 0;padding:0;border:none}legend{font-weight:650;margin-bottom:8px}label{cursor:pointer}#colors{display:flex;gap:8px;flex-wrap:wrap}#colors button{width:37px;height:37px;border-radius:50%;border:1px solid #aaa;cursor:pointer}#colors button[aria-pressed=true]{outline:2px solid #222;outline-offset:2px}#add{background:#222;color:white;padding:15px 24px;border:0;font:inherit;cursor:pointer}details{margin:24px 0} @media(max-width:700px){main{display:block}figure{max-width:330px;margin:0 auto 22px}}

.heights label{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 14px;border:1px solid #c9c1b9;border-radius:6px;margin-bottom:8px}
.heights label:has(input:checked){background:#f6efe9;border-color:#70492f}
.heights input{accent-color:#70492f;margin:0}
.heights strong{margin-left:auto;white-space:nowrap}
form+h2{margin-top:28px}