:root{color-scheme:light;--paper:#f1f3f5;--ink:#182e43;--green:#214f78;--orange:#ac441d;--red:#b1362e;--line:#cbd4dc;--muted:#546776;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-underline-offset:4px;overflow-wrap:anywhere}header,main,footer{max-width:1280px;margin:auto;padding:24px 40px}header{display:flex;justify-content:space-between;align-items:center;gap:25px;border-bottom:1px solid var(--line)}.brand{position:relative;padding-left:43px;font-size:19px;font-weight:850;letter-spacing:-.6px;text-decoration:none;line-height:1.2}.brand:before{content:"↗";position:absolute;left:0;top:0;width:32px;height:36px;display:grid;place-items:center;background:var(--ink);color:#fff;font:25px var(--mono);border-bottom:4px solid #f2814b}.brand span{display:block;font:9px/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase;margin-top:7px}nav{display:flex;gap:24px;font:11px/1.5 var(--mono)}nav a{text-decoration:none;border-bottom:1px solid transparent;padding:8px 0}nav a:hover{border-color:var(--orange)}h1,h2,h3{font-family:inherit;line-height:1.08;letter-spacing:-.04em}h1{font-size:clamp(42px,5vw,68px);font-weight:850;margin:14px 0 24px}h2{font-size:30px;font-weight:750}h3{font-size:23px;font-weight:750}.eyebrow{font:11px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--orange)}.intro{padding:28px 0 32px;max-width:800px}.intro>p:last-child{font-size:18px;max-width:650px}.workspace{display:grid;grid-template-columns:360px 1fr;background:white;border:1px solid var(--line);border-top:4px solid var(--ink);overflow:hidden}.controls{padding:26px;border-right:1px solid var(--line)}label,legend{font-weight:650;font-size:14px}select,button{font:inherit;max-width:100%;width:100%;border:1px solid #8e9eac;border-radius:0;padding:12px;margin-top:8px}select{background:white;color:var(--ink);font-size:14px}button{background:var(--ink);color:white;cursor:pointer;font-size:13px;font-weight:650;border:0}button:hover{background:var(--green)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #d55f2d;outline-offset:4px}fieldset{border:0;padding:0;margin:22px 0}.choice{display:flex;gap:9px;align-items:flex-start;margin:10px 0;font-weight:400;line-height:1.5}.choice input{accent-color:var(--green);margin:5px 0;flex-shrink:0}.choice small{display:block;color:var(--muted);font-size:12px}.swatch{height:10px;width:10px;display:inline-block;margin:0 6px 0 2px}.muted{color:var(--muted);font-size:13px}.small{font-size:12px}.drawing{padding:24px;min-width:0;background:#e8edf1}.drawing-head{display:flex;justify-content:space-between;font:11px/1.6 var(--mono);gap:12px}.north{font-size:18px}#map{width:100%;height:auto;display:block;margin:18px 0}.legend{display:flex;flex-wrap:wrap;gap:12px;font:10px/1.6 var(--mono)}.line{display:inline-block;width:17px;border-top:3px solid;margin-right:5px}.dark{color:#182e43}.red{color:var(--red)}#result{border-top:1px solid var(--line);margin-top:22px;padding-top:17px}#result h2{font-size:25px;margin:0 0 10px}#result p{font-size:14px;margin:8px 0}.status{font:10px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--green)}.status.partial{color:var(--red)}.notes{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin:50px 0}.notes p{font-size:14px}.catalogue{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-left:1px solid var(--line)}.card{background:white;border:1px solid var(--line);border-left:0;padding:20px;min-width:0}.card h3{font:700 23px var(--mono);letter-spacing:-1px;margin:15px 0 8px}.card p{font-size:12px;overflow-wrap:anywhere}.card a{font-size:12px}.card svg{width:100%;height:92px;display:block}.card .ean{font:10px var(--mono)}footer{font:10px/1.8 var(--mono);color:var(--muted);border-top:1px solid var(--line);margin-top:45px}.guide-entry{display:flex;align-items:center;gap:25px;text-decoration:none;border:1px solid var(--line);border-left:4px solid #c65428;padding:18px;margin-bottom:30px;background:white}.guide-entry svg{width:150px;flex-shrink:0}.guide-entry strong{font-size:23px;letter-spacing:-.04em}.guide-entry span span{display:block;font-size:13px;margin-top:7px}.guide-entry .guide-link{font:11px var(--mono);text-transform:uppercase;text-decoration:underline;color:var(--orange)}
@media(max-width:850px){header,main,footer{padding:20px}.workspace{grid-template-columns:1fr}.controls{border-right:0;border-bottom:1px solid var(--line)}.notes{gap:22px}.catalogue{grid-template-columns:1fr 1fr}nav{gap:13px}.brand{font-size:18px}}@media(max-width:540px){header{align-items:flex-start;gap:12px}.brand{padding-left:36px;font-size:17px}.brand:before{width:27px;height:32px}.brand span{font-size:8px}nav{flex-direction:column;gap:0;font-size:10px;flex-shrink:0}nav a{padding:3px 0}.intro{padding-top:15px}.intro>p:last-child{font-size:16px}.notes{grid-template-columns:1fr}.catalogue{grid-template-columns:1fr}.controls,.drawing{padding:18px}h1{font-size:40px}.guide-entry{gap:15px}.guide-entry svg{width:75px}.guide-entry strong{font-size:19px}.guide-entry span span{font-size:12px}}
