:root{--bg: #f4f2ec;--panel: #ffffff;--ink: #1a1a1a;--ink-dim: #6b6f7d;--accent: #ff4f1f;--accent-ink: #2a0f08;--teal: #1f9d94;--line: #ddd8c9;--grid-a: #eae6d9;--grid-b: #ddd8c6;--danger: #c0392b;--font-display: "Press Start 2P", monospace;--font-body: "IBM Plex Sans", -apple-system, "Segoe UI", sans-serif;--font-brand: "Bricolage Grotesque", "IBM Plex Sans", sans-serif}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #14151a;--panel: #1c1e26;--ink: #eef0f5;--ink-dim: #9096ab;--accent: #ff6a3f;--accent-ink: #1a0805;--teal: #4ad0c9;--line: #2c2f3a;--grid-a: #23252f;--grid-b: #1a1c24}}:root[data-theme=dark]{--bg: #14151a;--panel: #1c1e26;--ink: #eef0f5;--ink-dim: #9096ab;--accent: #ff6a3f;--accent-ink: #1a0805;--teal: #4ad0c9;--line: #2c2f3a;--grid-a: #23252f;--grid-b: #1a1c24}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:14.5px}button,input,select{font-family:inherit;font-size:inherit;color:inherit}.pxbtn{border:2px solid var(--ink);background:var(--panel);color:var(--ink);padding:7px 12px;cursor:pointer;box-shadow:3px 3px 0 var(--line);transition:transform .05s,box-shadow .05s}.pxbtn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--line)}.pxbtn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--line)}.pxbtn[data-active=true]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent-ink)}.pxbtn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:3px 3px 0 var(--line)}.pxbtn.sm{padding:5px 8px;font-size:12px}.pxbtn.teal{border-color:var(--teal)}.pxbtn.teal[data-active=true]{background:var(--teal);color:#06201d;border-color:var(--teal)}.masthead{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 20px;border-bottom:3px solid var(--ink);background:var(--panel)}.wordmark{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-brand);font-weight:800;font-size:20px;letter-spacing:-.02em}.wordmark i{width:26px;height:26px;border-radius:7px;background:var(--accent);display:inline-grid;place-items:center;color:#fff;font-style:normal;font-weight:800;font-size:13px;transform:rotate(-6deg);flex:none}.masthead-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.masthead-controls label{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-dim);margin-right:4px}select.pxbtn{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:22px}.workspace{display:grid;grid-template-columns:220px minmax(0,1fr) 260px;gap:18px;padding:20px;align-items:start}@media (max-width: 980px){.workspace{grid-template-columns:1fr}}.daily-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 20px;background:var(--panel);border-bottom:2px solid var(--line)}.daily-banner-text{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.daily-label{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-dim)}.daily-prompt{font-weight:600}.daily-streak{font-size:12px;color:var(--accent)}.gallery{padding:8px 20px 32px;max-width:1160px;margin:0 auto}.gallery h2{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-dim);margin:0 0 12px}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}.gallery-item{display:block;border:2px solid var(--line);background:var(--panel);padding:6px;text-decoration:none}.gallery-item:hover{border-color:var(--accent)}.gallery-item img{display:block;width:100%;aspect-ratio:1;object-fit:contain;image-rendering:pixelated;background:var(--grid-a)}.panel{background:var(--panel);border:2px solid var(--ink);padding:14px}.panel h2{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-dim);margin:0 0 10px}.panel+.panel{margin-top:16px}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:14px}#palette{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}#palette button{aspect-ratio:1;border:2px solid var(--line);padding:0;cursor:pointer}#palette button[data-active=true]{border-color:var(--ink);outline:2px solid var(--accent);outline-offset:1px}.custom-color-row{display:flex;align-items:center;gap:8px;margin-top:10px}.custom-color-row input[type=color]{width:32px;height:32px;border:2px solid var(--ink);padding:0;background:none;cursor:pointer}.canvas-column{display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0}#canvas-wrap{border:3px solid var(--ink);image-rendering:pixelated;cursor:crosshair;touch-action:none;background:var(--grid-a);max-width:100%}#canvas-wrap canvas{display:block;max-width:100%;height:auto}.frame-strip{display:flex;gap:6px;align-items:center;flex-wrap:wrap;width:100%;justify-content:center}.frame-thumb{width:44px;height:44px;border:2px solid var(--line);cursor:pointer;position:relative;background:var(--grid-a);image-rendering:pixelated}.frame-thumb canvas{width:100%;height:100%;display:block;image-rendering:pixelated}.frame-thumb[data-active=true]{border-color:var(--accent);outline:2px solid var(--accent);outline-offset:1px}.playbar{display:flex;align-items:center;gap:8px}.playbar input[type=range]{width:90px}.side-panel{display:flex;flex-direction:column}textarea.caption-input,input.caption-input{width:100%;border:2px solid var(--line);background:var(--bg);color:var(--ink);padding:8px;margin-bottom:8px;resize:none}.export-row{display:flex;gap:8px;flex-wrap:wrap}.hint{font-size:12px;color:var(--ink-dim);line-height:1.5;margin-top:8px}.status-line{font-size:12px;color:var(--teal);min-height:16px;margin-top:8px}.zoom-row,.delay-row{display:flex;align-items:center;gap:6px;margin-bottom:10px}.zoom-row label,.delay-row label{font-size:11px;text-transform:uppercase;color:var(--ink-dim)}.delay-row input[type=number]{width:64px;border:2px solid var(--line);background:var(--bg);color:var(--ink);padding:5px}.file-drop{border:2px dashed var(--line);padding:14px;text-align:center;font-size:12px;color:var(--ink-dim);cursor:pointer;margin-bottom:12px}.file-drop:hover{border-color:var(--accent);color:var(--ink)}.file-drop input{display:none}.avatar-heading{color:var(--accent)}.avatar-drop{border:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);font-weight:600}.avatar-drop:hover{background:color-mix(in srgb,var(--accent) 14%,transparent)}.mirror-note{font-size:11px;color:var(--teal);margin-top:4px}