*{box-sizing:border-box}body{margin:0;background:#f4f4ee;color:#283d30;font:15px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}header{max-width:1400px;margin:auto;padding:23px 30px 19px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:.16em;color:#66815e;margin:0 0 9px}h1{font-size:27px;font-weight:550;letter-spacing:-.035em;margin:0 0 7px}.intro{font-size:14px;margin:0;color:#677560}main{max-width:1400px;margin:auto;padding:0 22px 22px}button{border:1px solid #d0d8ca;background:#fff9;color:#30482d;border-radius:7px;padding:10px 13px;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap}button:hover{background:#e5eddf}button[aria-pressed=true]{background:#385e2f;color:white;border-color:#385e2f}button:focus-visible,input:focus-visible{outline:3px solid #ba8a34;outline-offset:3px}.modes,.views{display:flex;gap:5px;flex-wrap:wrap}.toolbar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 7px 12px}#stage{position:relative;height:clamp(420px,59vh,720px);background:radial-gradient(ellipse at 48% 43%,#fffffa,#e5eadd);border-radius:12px;overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}#labels{position:absolute;inset:0;pointer-events:none}.dimension{position:absolute;transform:translate(-50%,-50%);color:#30512b;font-size:12px;font-weight:600;white-space:nowrap;padding:4px 7px;background:#fbfcf2eb;border-radius:5px}.dimension.screw{color:#78581d;background:#fff6dfeF}.stage-note{position:absolute;left:16px;top:13px;color:#5c7052;font-size:12px;line-height:1.4;max-width:82%}.gesture{position:absolute;left:16px;bottom:13px;font-size:11px;color:#74806a}.options{display:flex;gap:24px;flex-wrap:wrap;align-items:center;margin:15px 8px}.options label{font-size:13px;display:flex;align-items:center;gap:7px;min-height:28px}.options input{accent-color:#4f743e;width:16px;height:16px}.explanation{margin:0 8px 19px;font-size:14px;line-height:1.6;max-width:900px}.specs{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:0 8px}.specs div{display:flex;flex-direction:column;gap:6px}.specs span{color:#75816b;font-size:12px}.specs strong{font-weight:550;font-size:16px}footer{margin:18px 8px 0;display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:11px;line-height:1.5;color:#7a846f}footer p{margin:0}a{color:#3d642e}#loading{position:absolute;inset:0;display:grid;place-items:center;color:#647b57;font-size:14px}#loading[hidden]{display:none}@media(max-width:700px){header{padding:20px 16px 17px}h1{font-size:23px}.intro{font-size:13px;line-height:1.5}main{padding:0 8px 22px}.toolbar{margin:0 3px 10px}.toolbar button{padding:10px 11px;font-size:12px}#stage{height:465px;min-height:400px}.views button{padding:8px 12px}.stage-note{font-size:11px;left:11px;max-width:92%}.dimension{font-size:11px;padding:3px 5px}.options{gap:10px 20px;margin:10px 7px}.options label{min-height:32px;font-size:12px}.explanation{font-size:13px;margin:0 7px 17px}.specs{grid-template-columns:1fr 1fr;gap:16px 10px}.specs strong{font-size:15px}.gesture{left:11px}footer{font-size:10px}}
.print-guide{margin:26px 8px 0;padding:22px;background:#fffdf5;border:1px solid #dce3d3;border-radius:12px}.print-guide h2{font-size:18px;font-weight:550;margin:0 0 10px;letter-spacing:-.02em}.print-guide h2:not(:first-child){margin-top:28px}.print-guide p{font-size:14px;line-height:1.65;max-width:850px;margin:0 0 15px}.download-row{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}.download{display:inline-block;padding:12px 16px;border:1px solid #b6c5aa;border-radius:8px;text-decoration:none;font-size:13px;background:#f4f6ec}.download.primary{background:#385e2f;color:#fff;border-color:#385e2f}.print-guide .print-note{font-size:12px;color:#6c795f;margin-top:16px}@media(max-width:700px){.print-guide{padding:18px 14px;margin:24px 3px 0}.print-guide p{font-size:13px}.print-guide h2{font-size:17px}.download{font-size:12px;padding:12px}.download-row{gap:10px}.download-row>a:not(.download){font-size:12px}}
.hand-row{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin:0 7px 14px}.hands{display:flex;gap:5px}.hand-row p{font-size:12px;color:#64785d;margin:0}@media(max-width:700px){.hand-row{margin:0 3px 12px;gap:8px}.hand-row p{font-size:11px;width:100%}.hands button{padding:9px 18px;font-size:12px}}