:root{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;color:#172d3c;background:#eef2f5;font-size:16px}*{box-sizing:border-box}body{margin:0}header{padding:22px 4vw;display:flex;justify-content:space-between;align-items:center;background:#132939;color:white}.brand{display:flex;align-items:center;gap:14px}.mark{font-size:36px;color:#e9b764}h1{font-size:23px;line-height:1.2;margin:0;font-weight:650}header p{margin:5px 0 0;color:#b8c9d4;font-size:14px}.badge{border:1px solid #496170;border-radius:20px;padding:7px 13px;font-size:13px}main{max-width:1540px;margin:auto;padding:26px 4vw;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px}.workspace,aside{min-width:0}.workspace{background:white;border:1px solid #d7e0e6;border-radius:14px;overflow:hidden;align-self:start}.toolbar{display:flex;align-items:center;justify-content:space-between;padding:16px;gap:8px;flex-wrap:wrap}.uploads{display:flex;gap:8px;flex-wrap:wrap}button{font:inherit;font-size:14px;line-height:1.3;border:1px solid #c9d5de;background:white;color:#172d3c;border-radius:8px;padding:11px 14px;cursor:pointer;min-height:44px}button:hover:not(:disabled){background:#eaf1f5}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #d09c38;outline-offset:3px}button:disabled{opacity:.45;cursor:default}.primary{background:#183e55;border-color:#183e55;color:white}.primary:hover:not(:disabled){background:#245b7a}.quiet{border:0;color:#476575}#stage{background:#dae2e8;min-height:480px;display:flex;align-items:center;justify-content:center;padding:20px;position:relative}#empty{max-width:420px;text-align:center;padding:35px 10px}#empty h2{font-size:26px;line-height:1.3;margin:18px 0}#empty p{line-height:1.6;color:#526a7a}.empty-icon{font-size:68px;color:#718c9f}#scene{max-width:100%;max-height:70vh;width:auto;height:auto;border-radius:4px;display:block;touch-action:none;box-shadow:0 6px 35px #213e5020}#scene[hidden],#empty[hidden]{display:none}.stage-footer{padding:12px 16px;display:flex;gap:14px;align-items:center;justify-content:space-between}#status{font-size:14px;line-height:1.5;margin:0}.adjust{padding:0 16px;display:flex;gap:7px;flex-wrap:wrap}.adjust button{font-size:13px;padding:9px 11px}.adjust button[aria-pressed=true]{background:#e4eff6;border-color:#7198b0}#hint{padding:0 16px 14px}.small{font-size:13px;color:#677d8b;line-height:1.5}.control{background:white;border:1px solid #d7e0e6;border-radius:12px;padding:18px;margin-bottom:14px}.section-title{display:flex;align-items:center;gap:10px;margin-bottom:16px}.section-title h2{font-size:16px;margin:0}.step{font-size:12px;color:#58788b;border:1px solid #d6e1e8;border-radius:5px;padding:5px}.panes{display:flex;gap:7px;flex-wrap:wrap}.panes button.active{background:#183e55;color:white;border-color:#183e55}.muted{font-size:14px;color:#718491;margin:0}.fabrics{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fabric{padding:0;overflow:hidden;text-align:left;border:2px solid transparent;background:#f3f6f8}.fabric.active{border-color:#183e55}.swatch{display:block;height:60px;background-size:100% auto;background-position:top}.fabric-label{display:block;padding:9px;font-size:13px}.fabric-label strong{display:block;font-size:14px;margin-bottom:2px}a{color:#285f7c;font-size:14px;text-underline-offset:3px}#source{display:inline-block;margin-top:15px}.range-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}output{font-weight:700;color:#183e55}input[type=range]{width:100%;height:30px;accent-color:#183e55}.range-ends{display:flex;justify-content:space-between;font-size:13px;color:#748794}.presets{display:flex;gap:6px;margin-top:15px}.presets button{flex:1;padding:8px 5px;font-size:13px}.full{width:100%;font-size:16px}footer{text-align:center;color:#748794;font-size:13px;padding:10px 20px 24px}footer a{font-size:13px}@media(max-width:900px){main{grid-template-columns:1fr;padding:14px;gap:16px}aside{display:grid;grid-template-columns:1fr 1fr;gap:14px}.control{margin:0}aside>.full,aside>.small{grid-column:1/-1}.control:first-child{grid-column:1/-1}#stage{min-height:340px;padding:12px}}@media(max-width:540px){header{padding:16px}h1{font-size:20px}.badge{display:none}.toolbar{padding:12px}#stage{min-height:300px}#empty h2{font-size:23px}.stage-footer{align-items:flex-start}.stage-footer button{font-size:13px;white-space:nowrap}aside{display:block}.control{margin-bottom:12px}#scene{max-height:65vh}.adjust{padding:0 12px}.adjust button{flex-grow:1}.toolbar .uploads{width:100%}.uploads button{flex:1}.small{font-size:13px}}
