:root{--bg-deep: #06060a;--bg-panel: #0e0e14;--bg-elevated: #14141c;--grid-line: rgba(124, 92, 255, .06);--text: #e6e4ec;--text-muted: #8a8799;--accent: #a78bfa;--accent-dim: #6d28d9;--accent-glow: rgba(167, 139, 250, .22);--mint: #5eead4;--danger: #f87171;--pixel: 4px;--font-display: "Silkscreen", system-ui, sans-serif;--font-body: "IBM Plex Mono", ui-monospace, monospace}*,*:before,*:after{box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased}body{margin:0;min-height:100vh;font-family:var(--font-body);font-size:.8125rem;font-weight:400;line-height:1.55;color:var(--text);background-color:var(--bg-deep);background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:8px 8px;background-position:center top}#root{min-height:100vh}.shell{max-width:56rem;margin:0 auto;padding:clamp(1rem,3vw,2rem);min-height:100vh;display:flex;flex-direction:column;gap:1.25rem}.shell:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse 80% 50% at 50% -20%,var(--accent-glow),transparent 55%);z-index:0}.shell>*{position:relative;z-index:1}.pixel-frame{background:var(--bg-panel);border:2px solid #2a2838;box-shadow:0 0 0 1px #0a090f,4px 4px #050508,inset 0 1px #ffffff0a}.pixel-frame--inset{box-shadow:inset 2px 2px #050508,inset -2px -2px #ffffff08;background:var(--bg-elevated)}.top{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.125rem}.brand{display:flex;flex-direction:column;gap:.35rem}.brand-mark{display:flex;align-items:center;gap:.65rem}.brand-pixels{display:grid;grid-template-columns:repeat(3,var(--pixel));grid-template-rows:repeat(3,var(--pixel));gap:2px;width:calc(3 * var(--pixel) + 4px);height:calc(3 * var(--pixel) + 4px)}.brand-pixels span{display:block;width:var(--pixel);height:var(--pixel);background:var(--accent);box-shadow:0 0 8px var(--accent-glow)}.brand-pixels span:nth-child(2),.brand-pixels span:nth-child(4),.brand-pixels span:nth-child(6),.brand-pixels span:nth-child(8){background:var(--mint);box-shadow:0 0 6px #5eead459}.brand-pixels span:nth-child(5){background:#fbbf24;box-shadow:0 0 8px #fbbf2459}.title{margin:0;font-family:var(--font-display);font-size:clamp(1.15rem,2.5vw,1.5rem);font-weight:700;letter-spacing:.02em;line-height:1.2;color:var(--text);text-shadow:2px 2px 0 #050508}.subhead{margin:0;max-width:22rem;color:var(--text-muted);font-size:.75rem;letter-spacing:.02em}.actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.5rem}.wallet-chip{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;font-size:.7rem;font-weight:500;color:var(--mint);background:#5eead414;border:1px solid rgba(94,234,212,.25);font-variant-numeric:tabular-nums}.wallet-chip:before{content:"";width:6px;height:6px;background:var(--mint);box-shadow:0 0 0 1px #050508}button{font-family:var(--font-display);font-size:.65rem;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;border:none;padding:.55rem .9rem;color:var(--text);background:linear-gradient(180deg,#5b21b6,#4c1d95);border:2px solid #7c3aed;box-shadow:2px 2px #1e1038,inset 0 1px #ffffff1f;transition:transform .05s ease,box-shadow .05s ease}button:hover:not(:disabled){filter:brightness(1.08)}button:active:not(:disabled){transform:translate(1px,1px);box-shadow:1px 1px #1e1038}button:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.3)}button.btn-ghost{background:var(--bg-elevated);border-color:#3f3d52;color:var(--text-muted);box-shadow:2px 2px #050508}button.btn-ghost:hover:not(:disabled){color:var(--text);border-color:var(--accent-dim)}button.btn-primary{background:linear-gradient(180deg,#6d28d9,#5b21b6);border-color:var(--accent)}button.btn-block{width:100%;margin-top:.25rem}.toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem}.toolbar-left{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}.price-tag{font-family:var(--font-display);font-size:.65rem;color:var(--accent);letter-spacing:.04em;padding:.35rem .55rem;background:#a78bfa1a;border:1px solid rgba(167,139,250,.28)}.pick{display:inline-flex;align-items:center;gap:.6rem;font-size:.7rem;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em}.pick span.label{font-family:var(--font-display);font-size:.6rem}.swatch-wrap{position:relative;width:2.25rem;height:2.25rem;padding:2px;background:#0a090f;border:2px solid #3f3d52;box-shadow:inset 2px 2px #050508}.pick input[type=color]{position:absolute;top:2px;right:2px;bottom:2px;left:2px;width:calc(100% - 4px);height:calc(100% - 4px);border:none;padding:0;cursor:pointer;background:none}.pick input[type=color]::-webkit-color-swatch-wrapper{padding:0}.pick input[type=color]::-webkit-color-swatch{border:none;image-rendering:pixelated}.status{min-height:1.25rem;font-size:.75rem}.status .err{margin:0;color:var(--danger);padding:.4rem .65rem;background:#f8717114;border-left:3px solid var(--danger)}.status .pending{margin:0;color:var(--mint);font-weight:500;animation:pulse-soft 1.2s ease-in-out infinite}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.55}}.canvas-wrap{flex:1;display:flex;flex-direction:column;align-items:center;padding:1rem 1rem 1.25rem;gap:.75rem}.canvas-hint{margin:0;font-size:.7rem;color:var(--text-muted);text-align:center;max-width:28rem}.grid{display:inline-block;line-height:0;image-rendering:pixelated;image-rendering:crisp-edges;border:3px solid #2a2838;box-shadow:0 0 0 1px #050508,6px 6px #030306,0 0 40px #7c3aed1f}.row{display:flex}.px{--cell: clamp(11px, 2.1vw, 16px);width:var(--cell);height:var(--cell);margin:0;padding:0;border:none;border-right:1px solid rgba(0,0,0,.35);border-bottom:1px solid rgba(0,0,0,.35);cursor:crosshair;image-rendering:pixelated;transition:filter .08s ease}.px:hover:not(:disabled){filter:brightness(1.18) saturate(1.05);z-index:1;outline:1px solid rgba(255,255,255,.35);outline-offset:-1px}.px:disabled{cursor:wait;opacity:.92}.row .px:last-child{border-right:none}.grid .row:last-child .px{border-bottom:none}.foot{margin-top:auto;padding:.65rem 1rem;text-align:center;font-size:.65rem;color:var(--text-muted);letter-spacing:.04em}.foot strong{color:var(--text-muted);font-weight:600}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:1rem;background:#030306d1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{width:100%;max-width:26rem;max-height:min(90vh,32rem);overflow-y:auto;padding:1.25rem 1.35rem;background:var(--bg-panel);border:3px solid #3f3d52;box-shadow:0 0 0 1px #050508,8px 8px #030306,0 0 60px #7c3aed26}.modal h2{margin:0 0 1rem;font-family:var(--font-display);font-size:1rem;font-weight:700;letter-spacing:.04em;color:var(--text);text-shadow:2px 2px 0 #050508}.modal ol{margin:0 0 1rem;padding-left:1.1rem;color:var(--text-muted);font-size:.78rem;line-height:1.65}.modal ol li{margin-bottom:.5rem}.modal ol strong{color:var(--accent);font-weight:600}.modal .mono{margin:0 0 .85rem;padding:.65rem .75rem;font-size:.62rem;line-height:1.5;word-break:break-all;color:var(--text-muted);background:var(--bg-deep);border:1px solid #2a2838;font-family:var(--font-body)}.modal .fine{margin:0 0 1rem;font-size:.72rem;line-height:1.55;color:var(--text-muted)}@media(max-width:520px){.top{flex-direction:column}.actions{width:100%;justify-content:stretch}.actions button{flex:1;min-width:0}}
