@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#243930;background:#f3f4ee;font-size:13px}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,select{border:1px solid #ccd2c6;background:#fffdf8;color:#304437;border-radius:6px;padding:9px 12px;cursor:pointer}button:hover{background:#e4eadb}button.active{background:#294c3e;color:white}header{height:76px;border-bottom:1px solid #d8ddcf;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#fafbf5;gap:15px}.brand{font:800 32px Manrope,sans-serif;letter-spacing:-2px;text-decoration:none;color:#274936}.brand span{font:600 10px 'DM Sans';letter-spacing:2px;margin-left:12px}.edition,.eyebrow{font-size:10px;letter-spacing:1.7px;color:#758271}header button{margin-left:5px}header button:last-child{background:#294c3e;color:white}main{display:grid;grid-template-columns:300px 1fr}aside{padding:30px 22px;border-right:1px solid #d8ddcf;background:#fafbf5;height:calc(100vh - 76px);overflow:auto}h1{font:500 32px/1.14 Manrope,sans-serif;letter-spacing:-1.3px;margin:14px 0}.intro{color:#7a8477;margin-bottom:25px}.preset{display:flex;gap:6px;margin-bottom:20px}.preset select{width:180px}details{border-top:1px solid #d5dbce;padding:16px 0}summary{cursor:pointer;font-weight:600;font-size:13px}summary::marker{color:#8d9d83}.field{margin-top:14px}.field-top{display:flex;justify-content:space-between;align-items:center}.field-top label{font-size:12px;color:#6b7768}.field input[type=number]{width:70px;background:#eff2e7;border:1px solid #d5ddcb;border-radius:4px;text-align:right;padding:5px;color:#314b3e}.field input[type=range]{width:100%;accent-color:#476f56;height:3px;margin-top:12px}.small{font-size:11px;line-height:1.6;color:#85907e}.workspace{min-width:0}nav{height:62px;display:flex;gap:6px;align-items:center;padding:0 24px;border-bottom:1px solid #d8ddcf}nav button{background:transparent;border:0}#stage{height:610px;position:relative;background:radial-gradient(ellipse at 55% 44%,#f8f9f2,#e7ecdF);overflow:hidden}.stage-title{position:absolute;top:22px;left:25px;right:25px;display:flex;justify-content:space-between;z-index:2;font-size:11px;color:#71816f}#hash{font-family:monospace}#canvas{height:100%;width:100%}canvas{display:block}.viewbar{position:absolute;top:56px;left:24px;display:flex;gap:3px}.viewbar button{font-size:11px;padding:6px 9px;background:#fafbf2cc}.toggles{position:absolute;bottom:66px;left:24px;display:flex;gap:15px;font-size:11px}.toggles input{accent-color:#446d53}.legend{position:absolute;bottom:19px;left:24px;display:flex;gap:17px;font-size:10px;color:#6c7965}.legend b{color:#395e49}footer{padding:16px 25px;border-top:1px solid #d2dbcb;display:flex;justify-content:space-between;font-size:10px;color:#7b8974;gap:15px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#6d955a;margin-right:6px}footer b{margin-left:12px;color:#8a6036}.results{padding:28px 25px;display:grid;grid-template-columns:230px 1fr;gap:20px}h2{font:500 22px/1.3 Manrope}#checks{display:grid;grid-template-columns:1fr 1fr;gap:8px}.check{padding:10px 12px;background:#fafbf5;border:1px solid #dbe1d1;border-radius:5px;font-size:11px}.check b{display:block;margin-bottom:4px}.check.fail b{color:#9a6139}.check.pass b{color:#467253}.check span{color:#7c8777;line-height:1.5}#drawing{position:absolute;inset:80px 15px 110px}svg{width:100%;height:100%}#engineering{position:absolute;inset:55px 25px 20px;overflow:auto;background:#f6f8ef;padding:20px;line-height:1.65}#engineering h3{margin-top:22px}#engineering a{color:#426b4f}.label3d{background:#f7f9ecdd;color:#3b503b;padding:4px;font-size:11px}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#294c3e;color:white;padding:12px 22px;border-radius:8px;display:none;z-index:20}@media(max-width:900px){.edition{display:none}main{grid-template-columns:250px 1fr}aside{padding:22px 15px}.results{display:block}.legend{flex-direction:column;gap:3px}.toggles{flex-wrap:wrap}nav{padding:6px;gap:0}nav button{font-size:10px;padding:8px}#checks{grid-template-columns:1fr}}@media(max-width:650px){header{padding:10px;height:auto;flex-wrap:wrap}main{display:flex;flex-direction:column}aside{height:300px;order:2;border-top:1px solid #ccd3c3}.workspace{order:1}#stage{height:560px}footer{font-size:9px}.results{padding:20px}header button{font-size:10px}}

.alignment{position:absolute;top:94px;left:24px;right:20px;font-size:11px;color:#926039;background:#fafbf2dd;padding:8px 10px;border-radius:4px;pointer-events:none}nav{gap:2px;padding:0 15px}nav button{font-size:11px;padding:9px}.workspace #stage{height:650px}#drawing{top:135px}#engineering{z-index:5}#stage:has(#engineering:not([hidden])) .alignment{display:none}

.scale-summary{position:absolute;top:128px;left:24px;right:20px;z-index:2;font-size:11px;color:#466058;pointer-events:none}#scaleDrawing{position:absolute;inset:165px 15px 70px}#drawing{top:170px}.human-preset{display:block;margin:20px 0 14px;font-size:11px;color:#64735f}.human-preset select{display:block;width:100%;margin-top:7px}.toggles{flex-wrap:wrap;max-width:90%;gap:10px}.legend{font-size:9px}nav button{padding:8px 6px;font-size:10px}.workspace #stage{height:720px}#stage:has(#engineering:not([hidden])) .scale-summary{display:none}#stage:has(#scaleDrawing:not([hidden])) .toggles{display:none}

#stage:has(#scaleDrawing:not([hidden])){height:1050px}#scaleDrawing{inset:170px 15px 55px}

.packlink{font-size:11px;color:#294c3e;text-decoration:none;border:1px solid #9aac96;border-radius:5px;padding:8px;white-space:nowrap}
