:root{--bg: #f6f5f1;--panel: #ffffff;--ink: #1f2430;--muted: #6b7280;--line: #e4e2db;--accent: #2563eb;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg)}body{display:grid;grid-template-columns:320px 1fr;height:100vh}#panel{background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;padding:20px 18px 40px}#panel{display:flex;flex-direction:column}#controls{flex:1}#about{margin-top:28px;padding-top:12px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);line-height:1.6}#about a{color:inherit;text-decoration:none;border-bottom:1px solid var(--line)}#about a:hover{color:var(--accent);border-color:var(--accent)}#panel header h1{font-size:20px;margin:0 0 4px}.faq-link{display:block;margin:0 0 18px;font:inherit;font-size:12px;font-weight:600;color:var(--accent);background:none;border:none;cursor:pointer;padding:0}.faq-link:hover{text-decoration:underline}#faq{border:none;border-radius:14px;padding:0;width:min(720px,92vw);max-height:90vh;box-shadow:0 20px 60px #00000040;color:var(--ink)}#faq::backdrop{background:#1f243073}#faq article{padding:22px 26px 28px;font-size:14px;line-height:1.5}#faq article>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}#faq h2{margin:0;font-size:18px}#faq p{margin:6px 0}#faq .close{font:inherit;font-size:24px;line-height:1;background:none;border:none;cursor:pointer;color:var(--muted);padding:0 4px}#faq .close:hover{color:var(--ink)}#faq details{border-top:1px solid var(--line);padding:10px 0}#faq summary{cursor:pointer;font-weight:600;font-size:15px;list-style:none;display:flex;justify-content:space-between;gap:12px}#faq summary::-webkit-details-marker{display:none}#faq summary:after{content:"+";color:var(--muted);font-weight:400}#faq details[open] summary:after{content:"−"}#faq details>div{padding:4px 0 6px}#faq figure{margin:8px 0}#faq figcaption{font-size:12px;color:var(--muted);margin-top:4px;line-height:1.45}#faq .figures{display:grid;grid-template-columns:1fr 1fr;gap:16px}#faq .figure{display:block;width:100%;height:auto;background:var(--bg);border-radius:8px}#faq .pinwheel{display:grid;grid-template-columns:220px 1fr;gap:16px;align-items:center}@media(max-width:600px){#faq .figures,#faq .pinwheel{grid-template-columns:1fr}}#panel header p{margin:0 0 6px;font-size:12px;color:var(--muted);line-height:1.4}fieldset{border:none;border-top:1px solid var(--line);margin:0;padding:12px 0 8px}legend{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:0 0 6px}.control{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center;margin:6px 0;font-size:13px}.control label{grid-column:1}.control .value{grid-column:2;font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px;min-width:60px;text-align:right}.control input[type=range]{grid-column:1 / span 2;width:100%;accent-color:var(--accent)}.control select,.control input[type=color],.control input[type=checkbox]{grid-column:2}.control select{font:inherit;font-size:12px;padding:2px 4px}.control input[type=color]{width:48px;height:24px;padding:0;border:1px solid var(--line);background:none}.control .hint{grid-column:1 / span 2;font-size:11px;color:var(--muted);margin-top:-2px}.presets{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:4px}.presets button{font:inherit;font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:var(--bg);cursor:pointer}.presets button:hover{border-color:var(--accent);color:var(--accent)}.share{width:100%;font:inherit;font-size:14px;font-weight:600;padding:10px 14px;border-radius:10px;border:none;background:var(--accent);color:#fff;cursor:pointer;transition:background .15s,transform .05s}.share:hover{background:#1d4fd7}.share:active{transform:scale(.98)}#stage{display:grid;grid-template-rows:1fr auto;min-width:0;height:100vh}#viewport{position:relative;min-height:0;overflow:hidden}#viewport canvas{display:block;width:100%!important;height:100%!important}#specs{border-top:1px solid var(--line);background:var(--panel);padding:14px 20px 18px;max-height:38vh;overflow:auto;font-size:13px}#specs h2{font-size:12px;margin:0 0 10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.totals{display:flex;flex-wrap:wrap;gap:8px 22px;margin-bottom:12px}.totals div{display:flex;flex-direction:column}.totals b{font-size:16px;font-variant-numeric:tabular-nums}.totals span{font-size:11px;color:var(--muted)}table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}th,td{text-align:right;padding:4px 8px;border-bottom:1px solid var(--line);white-space:nowrap}th:first-child,td:first-child{text-align:left}th{font-size:11px;color:var(--muted);font-weight:600}td .swatch{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:middle}@media(max-width:800px){body{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:auto}#panel{border-right:none;border-bottom:1px solid var(--line);max-height:45vh}#stage{height:auto;min-height:100vh}#viewport{height:55vh}}