*{box-sizing:border-box}body{margin:0;background:#eceeed;color:#24362f;font-family:Arial,Helvetica,sans-serif;font-size:16px}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer}header{height:78px;background:#fafbf9;border-bottom:1px solid #d9dfd9;display:flex;align-items:center;justify-content:space-between;padding:0 32px}.brand{display:flex;align-items:center;gap:15px;font-size:15px;letter-spacing:.13em}.brand b{color:#a1aba5;font-weight:400;margin:0 9px}.mark{border:1px solid #24362f;width:31px;height:31px;display:grid;place-items:center;font-family:Georgia,serif;font-size:23px}.revision{font-size:14px;color:#6b766f}.revision span{padding:5px 8px;border:1px solid #d6dcd6;margin-left:10px;border-radius:4px}main{display:grid;grid-template-columns:minmax(0,1fr) 294px;height:calc(100dvh - 78px);min-height:680px}#stage{position:relative;min-width:0;overflow:hidden;background:#e9edea}.caption{position:absolute;top:30px;left:32px;z-index:2;pointer-events:none}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.13em;color:#7b857e;margin:0 0 12px}h1{font-family:Georgia,serif;font-size:30px;font-weight:400;letter-spacing:-.025em;margin:0}#canvas,#canvas canvas{width:100%;height:100%;display:block}#canvas{position:absolute;inset:0}.stage-footer{position:absolute;bottom:22px;left:26px;right:24px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:#68766d}.stage-footer button{background:#fafbf9e8;border:1px solid #d3dbd3;border-radius:5px;padding:9px 13px;font-size:13px;color:#33483b}.stage-footer span{background:#f7faf5b8;padding:7px;border-radius:4px}aside{background:#fafbf9;padding:22px 22px;overflow:auto;border-left:1px solid #d9dfd9}.tabs{display:flex;background:#e9eeea;border-radius:6px;padding:3px;margin-bottom:32px}.tabs button{border:0;background:none;color:#65746a;font-size:13px;padding:10px 8px;flex:1;border-radius:4px}.tabs .selected{background:white;color:#253e2d;box-shadow:0 1px 4px #24362f0d}h2{font-family:Georgia,serif;font-size:23px;font-weight:400;line-height:1.2;margin:0 0 20px}nav{display:grid;gap:5px}nav button{display:flex;align-items:center;text-align:left;border:0;background:none;padding:12px 10px;color:#46584c;font-size:14px;border-radius:5px}nav button span{font-size:11px;color:#8e9b91;width:28px}nav button b{margin-left:auto;font-size:15px;font-weight:400;opacity:0}nav button:hover{background:#edf1ed}nav button.active{background:#dde8de;color:#24492e}nav button.active b{opacity:1}.toggles{margin-top:25px;padding-top:17px;border-top:1px solid #e0e5df;display:grid;gap:16px}.toggles label{display:flex;justify-content:space-between;align-items:center;font-size:14px}.toggles input{appearance:none;width:30px;height:17px;margin:0;border-radius:20px;background:#d6ddd6;position:relative;cursor:pointer;transition:background .2s}.toggles input:after{content:'';position:absolute;width:13px;height:13px;border-radius:50%;background:white;top:2px;left:2px;transition:left .2s}.toggles input:checked{background:#456b4c}.toggles input:checked:after{left:15px}.spec{border-top:1px solid #e0e5df;margin-top:25px;padding-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.spec strong{display:block;font-size:19px;font-weight:400}.spec span{font-size:11px;color:#7a877e;display:block;margin-top:6px}.note{font-size:12px;line-height:1.65;color:#879187;margin-top:24px}.download{display:block;font-size:13px;color:#406348;text-decoration:none;margin-top:20px}#loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:16px 22px;background:#fffffff0;border-radius:6px;font-size:14px;color:#526a59}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #365b42;outline-offset:4px}#render-panel{position:fixed;inset:78px 0 0;background:#e9edea;z-index:5;padding:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}#render-panel[hidden]{display:none}#render-panel img{max-width:100%;max-height:calc(100% - 64px);object-fit:contain;box-shadow:0 8px 35px #20302812}#render-panel button{background:#fafbf9;border:1px solid #cdd7ce;border-radius:5px;color:#35563e;font-size:14px;padding:10px 14px;margin:0 4px}@media(max-width:760px){header{height:64px;padding:0 18px}.brand{font-size:12px}.revision{display:none}main{display:flex;flex-direction:column;height:auto;min-height:0}#stage{height:65dvh;min-height:410px}aside{padding:20px;border-left:0;border-top:1px solid #d9dfd9}.caption{left:20px;top:23px}h1{font-size:25px}.stage-footer{left:13px;bottom:15px;right:13px}.stage-footer span{max-width:200px;font-size:11px}nav{grid-template-columns:1fr 1fr}.toggles{grid-template-columns:1fr 1fr;gap:16px 25px}.tabs{margin-bottom:24px}#render-panel{inset:64px 0 0;padding:10px}.note{max-width:460px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}