:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#212622;background:#fafbf8;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,select{cursor:pointer}button{color:inherit}button:focus-visible,select:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid #71a984;outline-offset:4px}header{height:76px;border-bottom:1px solid #e3e6df;padding:0 40px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:17px;font-weight:650;text-decoration:none;color:inherit}.brand em{font-family:Georgia,serif;font-size:24px}.brand span{margin:0 18px;color:#b7c0b7;font-weight:400}.badge,.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:650;color:#738072}main{display:grid;grid-template-columns:minmax(0,1fr) 355px;max-width:1600px;margin:auto;min-height:calc(100svh - 76px)}.workspace{position:relative;display:flex;flex-direction:column;min-height:720px;padding:25px 34px 20px;background-color:#fff;background-image:linear-gradient(45deg,#f6f7f4 25%,transparent 25%),linear-gradient(-45deg,#f6f7f4 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f6f7f4 75%),linear-gradient(-45deg,transparent 75%,#f6f7f4 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}.stage-top{display:flex;justify-content:space-between;color:#7e877d;font-size:11px;gap:16px}.stage-top i{display:inline-block;width:7px;height:7px;background:#7c9f79;border-radius:50%;margin-right:7px}#stage{position:relative;flex:1;min-height:560px;touch-action:pan-y;overflow:hidden}#stage canvas{position:absolute;inset:0;display:block;width:100%;height:100%}.stage-bottom{display:flex;gap:25px;align-items:center;justify-content:center}.stage-bottom button{border:1px solid #e1e6dd;border-radius:50%;background:#ffffffc9;width:34px;height:34px}.stage-bottom span{font-size:13px;font-weight:600;min-width:114px;text-align:center}.stage-bottom small{font-size:11px;font-weight:400;color:#8a9388;margin-left:12px}.hint{text-align:center;font-size:11px;color:#90988d;margin:14px 0 0}aside{padding:32px 26px;border-left:1px solid #e3e6df;background:#fafbf8}.intro h1{font-size:31px;letter-spacing:-1.2px;margin:13px 0 10px;font-weight:550}.intro p{font-size:13px;line-height:1.7;color:#7a8377;margin:0 0 24px}.control-section{border-top:1px solid #e1e5dc;padding:20px 0}h2{font-size:12px;font-weight:650;margin:0 0 12px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.row h2{margin:0}.row>label,.row>span{font-size:12px;color:#778171}.segments{display:flex;background:#eef0e9;padding:3px;border-radius:8px;gap:2px}.segments button{border:0;background:transparent;border-radius:6px;font-size:11px;padding:8px 10px;flex:1;white-space:nowrap}.segments button[aria-pressed=true]{background:white;box-shadow:0 1px 4px #1e35211a;color:#283a24}.control-section>.row{margin-top:14px}.control-section>.row:first-child{margin-top:0}.text-button{border:0;background:none;color:#7c8776;font-size:11px;padding:0}#orbit{height:110px;background:#f0f2eb;margin:14px 0 18px;border-radius:10px;position:relative;display:grid;place-items:center;cursor:grab;touch-action:none;user-select:none}#orbit:active{cursor:grabbing}.orbit-ring{position:absolute;width:116px;height:70px;border:1px solid #cdd6c7;border-radius:50%;transform:rotate(-20deg)}.mini-phone{height:66px;width:31px;background:#354333;border:3px solid #b7c3b0;border-radius:7px;display:grid;place-items:center;color:#dce6d5;font:italic 23px Georgia;box-shadow:5px 7px 12px #47584025}#orbit span{position:absolute;bottom:9px;right:10px;font-size:9px;color:#819077}.angle{display:grid;grid-template-columns:32px 1fr 54px;gap:12px;align-items:center;margin:12px 0;font-size:11px;color:#7c8676}.angle input[type=range]{width:100%;accent-color:#647d54;height:3px}.angle input[type=number]{width:54px;border:1px solid #e0e5d9;background:white;border-radius:5px;padding:5px;text-align:right;color:#4b5844;font-size:11px}.presets{display:flex;gap:6px;margin-top:16px}.presets button{flex:1;font-size:11px;padding:7px 0;border:1px solid #dfe5d7;background:transparent;border-radius:6px}.presets button:hover{background:#eaf0e3}select{border:1px solid #dfe5d7;border-radius:6px;background:white;padding:6px;font-size:11px}.export p{font-size:10px;color:#8a9483;margin:15px 0}#download{width:100%;border:0;background:#344c2d;color:white;border-radius:8px;font-size:12px;font-weight:550;padding:14px}#download:hover{background:#48633f}#download:disabled{opacity:.5;cursor:wait}#status{font-size:10px;line-height:1.5;color:#73816a;min-height:28px;padding-top:9px}footer{font-size:9px;color:#a0a997;text-align:center;margin-top:4px}@media(min-width:1450px){aside{padding:38px 30px}}@media(max-width:760px){header{height:62px;padding:0 18px}.brand{font-size:13px}.brand em{font-size:20px}.brand span{margin:0 8px}.badge{display:none}main{grid-template-columns:1fr}.workspace{min-height:610px;padding:20px 16px}#stage{min-height:480px;height:480px}aside{border-left:0;border-top:1px solid #e3e6df;padding:28px}.intro p br{display:none}.intro h1{font-size:26px}#orbit{height:130px}}