:root{color-scheme:dark;font-family:Segoe UI,Arial,sans-serif;color:#e8edee;background:#101619;font-synthesis:none;--muted:#91a0a6;--line:#303b40;--accent:#f2be61}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:#232d32;color:inherit;border-radius:7px;padding:11px 15px}button:hover{background:#344047}button:disabled{opacity:.45;cursor:wait}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}header{height:80px;border-bottom:1px solid var(--line);padding:0 4vw;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;letter-spacing:.08em;font-weight:700}.mark{display:grid;place-items:center;width:32px;height:32px;border:2px solid var(--accent);color:var(--accent);border-radius:3px;transform:rotate(-6deg)}.muted{color:var(--muted);font-size:14px;font-weight:400;letter-spacing:0}.local{color:var(--muted);font-size:13px}.local i{display:inline-block;width:6px;height:6px;background:#8dc5a7;border-radius:50%;margin-right:7px}main{max-width:1600px;margin:30px auto;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:28px;padding:0 4vw}.workspace{min-width:0}.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.eyebrow{font:12px monospace;letter-spacing:.15em;color:var(--accent)}h1{font-size:26px;font-weight:500;margin:6px 0 0}h2{font-size:16px;font-weight:500;margin:0}.quiet{background:transparent;font-size:14px}.stage{position:relative;width:100%;aspect-ratio:1.16;overflow:hidden;border:1px solid var(--line);border-radius:10px;background-color:#1a2429;background-image:linear-gradient(#a9c3d208 1px,transparent 1px),linear-gradient(90deg,#a9c3d208 1px,transparent 1px);background-size:32px 32px}.stage canvas,.stage svg{position:absolute;width:100%;height:100%;object-fit:contain}.stage svg{pointer-events:none}.stage-label{position:absolute;top:22px;left:24px;font:12px monospace;letter-spacing:.12em;color:#82969e}.stage-label b{color:var(--accent);padding-left:8px}#loadStatus{position:absolute;left:24px;bottom:20px;font-size:13px;color:var(--muted)}.stage-bottom{display:flex;justify-content:space-between;margin:12px 0 22px;color:var(--muted);font:12px monospace}.actionbar{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.primary{background:var(--accent);border-color:var(--accent);color:#22201a;font-weight:650;min-width:180px;display:flex;align-items:center;justify-content:space-between;gap:16px}.primary:hover{background:#ffd488}kbd{font:10px monospace;letter-spacing:.04em;border:1px solid #76623e66;border-radius:3px;padding:3px;color:#5c4b31}.check{display:flex;gap:8px;align-items:center;font-size:14px}input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px}aside{border:1px solid var(--line);border-radius:10px;background:#182025;align-self:start;overflow:hidden}.panel{padding:22px;border-bottom:1px solid var(--line)}.panel:last-child{border:0}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.section-title>span{font:12px monospace;color:var(--muted)}.control{display:flex;justify-content:space-between;font-size:14px;margin-top:23px;margin-bottom:12px}.control:first-of-type{margin-top:0}output{color:var(--accent);font:13px monospace}input[type=range]{width:100%;accent-color:var(--accent);margin:0;cursor:ew-resize}.range-ends{display:flex;justify-content:space-between;font:11px monospace;color:var(--muted);margin-top:5px}.layer{display:flex;align-items:center;gap:10px;margin:0 -8px;padding:8px;border-radius:5px;font-size:14px}.layer:hover{background:#263137}.layer img{width:36px;height:30px;object-fit:contain;background:#39444a;border-radius:3px}.layer .layer-name{flex:1}.layer small{display:block;color:var(--muted);font:11px monospace;margin-top:3px}.layer input{margin:0}.export>label{font-size:14px;color:var(--muted)}select{width:100%;padding:9px;background:#10191e;border:1px solid var(--line);border-radius:5px;margin:10px 0 14px;color:inherit}.export button{display:flex;width:100%;justify-content:space-between;margin-top:8px;font-size:14px}.export p{font-size:12px;line-height:1.6;color:var(--muted);margin-bottom:0}#notice{font-size:12px;color:var(--accent);margin-top:8px}footer{display:flex;justify-content:space-between;max-width:1600px;margin:28px auto;padding:0 4vw 24px;color:var(--muted);font-size:12px}@media(min-width:1400px){main{grid-template-columns:minmax(0,1fr) 340px}.stage{aspect-ratio:1.25}}@media(max-width:850px){main{grid-template-columns:1fr;margin-top:22px}.stage{aspect-ratio:1}aside{display:grid;grid-template-columns:1fr 1fr}.panel.export{grid-column:1/-1}.brand .muted{display:none}.stage-bottom{font-size:11px;gap:12px}.actionbar{gap:16px}footer span{display:none}}@media(max-width:480px){aside{display:block}.local{font-size:11px}.stage-bottom{flex-direction:column;gap:8px}.actionbar{gap:14px}.primary{width:100%}}