:root{color-scheme:dark;--bg:#111211;--ink:#eeeee9;--muted:#92958d;--line:#353832}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:13px Arial,sans-serif}main{max-width:1440px;margin:auto;padding:30px 48px 22px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.wordmark{font:26px Georgia,serif;letter-spacing:5px;text-decoration:none}.wordmark span{display:block;font:9px monospace;letter-spacing:2.6px;margin-top:8px}.edition{font:12px/1.5 monospace;color:var(--muted);margin-left:auto;margin-right:44px}a{color:inherit}button{font:11px monospace;color:var(--ink);background:transparent;border:1px solid var(--line);padding:12px 15px;cursor:pointer}button:hover{background:#252823}button:focus-visible,a:focus-visible,canvas:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid white;outline-offset:5px}.stage{position:relative;background:#000;border:1px solid #494c43;overflow:hidden;width:100%;aspect-ratio:800/440;min-height:330px}canvas{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;touch-action:none;cursor:crosshair}.scene-top,.scene-bottom{position:absolute;left:22px;right:22px;display:flex;justify-content:space-between;pointer-events:none;font:9px monospace;letter-spacing:2px;color:#a6aaa1}.scene-top{top:20px}.scene-bottom{bottom:18px}.controls{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr auto;gap:28px;align-items:center;padding:27px 0;border-bottom:1px solid var(--line)}.transport{display:flex;gap:16px;align-items:center}.transport button{width:43px;height:43px;font-size:18px;padding:0}h1{font:18px Georgia,serif;margin:0 0 6px}.transport p{font:10px monospace;margin:0;color:var(--muted)}label{font:10px monospace;display:block;color:var(--muted)}output{float:right;color:var(--ink)}input{display:block;width:100%;height:16px;accent-color:#eee;margin:12px 0 0;cursor:pointer}#pattern{height:43px}#pattern[aria-pressed=true]{color:#111;background:#eee}#pattern span{margin-left:16px}footer{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font:10px monospace;gap:20px}footer p{font:italic 14px Georgia,serif}footer div{display:flex;align-items:center;gap:15px}footer button{border:0;padding:10px 0;color:var(--muted)}footer a{text-decoration:none}details{color:var(--muted);font:11px/1.7 monospace;max-width:750px}summary{cursor:pointer}details p{padding:5px 0 15px}#error{position:absolute;inset:40% 15% auto;background:#111;padding:25px;line-height:1.6}body:fullscreen main{max-width:none}.stage:fullscreen{max-height:none}@media(max-width:850px){main{padding:22px}.controls{grid-template-columns:1fr 1fr;gap:25px}.transport{grid-column:1/-1}.stage{min-height:0;max-height:none;aspect-ratio:800/650}.edition{display:none}header{margin-bottom:20px}.scene-top,.scene-bottom{left:12px;right:12px;letter-spacing:1px;font-size:8px}.scene-top span:last-child{display:none}footer{align-items:flex-start;flex-direction:column;gap:0}footer div{flex-wrap:wrap;gap:10px}#fullscreen span{display:none}h1{font-size:20px}#pattern{align-self:end}.wordmark{font-size:22px}details{margin-top:12px}}