@import url('https://fonts.googleapis.com/css2?family=Silkscreen&family=IBM+Plex+Mono:wght@400;500&display=swap');
*{box-sizing:border-box}body{margin:0;background:#080d15;color:#e4ebdf;font:12px/1.8 'IBM Plex Mono',monospace}header,main,footer{max-width:1380px;margin:auto;padding:25px 4%}header{display:flex;justify-content:space-between;border-bottom:1px solid #263c48;font-size:10px}a{color:#a3d9c8;text-decoration:none}.eyebrow{font-size:9px;letter-spacing:1.5px;color:#8bbaad}h1,h2{font-family:Silkscreen,monospace;font-weight:400;line-height:1.3}h1{font-size:clamp(27px,4vw,46px);margin:14px 0}h2{font-size:24px}p{color:#94a9b4;max-width:730px}.intro{margin:6px 0 30px}.studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:35px;align-items:start}.preview{position:sticky;top:20px}.frame{position:relative;border:1px solid #33505b;background:#101c28}.frame canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.frame-top{position:absolute;inset:17px 18px auto;display:flex;justify-content:space-between;color:#b3c9c4;font-size:8px;pointer-events:none}.preview-bottom{display:flex;gap:8px;align-items:center;margin:18px 0;flex-wrap:wrap}.avatar-row{display:flex;gap:10px;align-items:center;margin-right:auto}.avatar-row canvas{width:48px;height:48px;border-radius:50%;image-rendering:pixelated}.avatar-row #avatar32{width:32px;height:32px}.avatar-row span{font-size:7px;color:#88a4ae}.exports{display:flex;gap:8px;flex-wrap:wrap}.exports #png{background:#acd9bd;color:#112521}.small{font-size:9px;color:#7e9aa7;line-height:1.8}button{background:#10212b;border:1px solid #36535e;color:#bfddd1;font:9px 'IBM Plex Mono',monospace;padding:11px 12px;cursor:pointer}button:hover{border-color:#b0e7ce}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #f1c88a;outline-offset:3px}button:disabled{opacity:.4;cursor:default}button[aria-pressed=true]{background:#b0e6cf;color:#11231e}.editor{border:1px solid #2d424d;padding:22px;background:#0b151f}.editor-top{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:15px}.slot{border-top:1px solid #233945;padding:14px 0}.slot-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px;font-size:9px;letter-spacing:1px}.lock{font-size:8px;padding:6px 9px}.choices{display:flex;gap:6px;flex-wrap:wrap}.choices button{font-size:8px;padding:9px 10px}.choices button:disabled{opacity:.35}.build-panel{margin-top:23px;border-top:1px solid #2a434d;padding-top:18px}.build-panel label{font-size:9px;color:#b4d3c6}.code-row{display:flex;gap:8px;margin:10px 0}.code-row input{min-width:0;width:100%;background:#080f18;color:#c3edd8;border:1px solid #34505a;padding:12px;font:12px 'IBM Plex Mono',monospace}.share-actions{display:flex;gap:8px;flex-wrap:wrap}#status{font-size:10px;color:#afdec7;min-height:38px;margin-bottom:0}#status.error{color:#ffd0a0}.lineup{margin-top:65px;border-top:1px solid #29404c;padding-top:28px}.lineup-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.lineup-heading h2{margin:10px 0}.lineup>p{font-size:10px}.lineup-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:25px}.lineup-card{padding:0;text-align:left;overflow:hidden;position:relative}.lineup-card canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.lineup-card span{display:block;padding:9px 10px;font-size:8px;color:#a1bbb9}.lineup-card[aria-current=true]{border-color:#d0f4c7;box-shadow:0 0 0 1px #d0f4c7}footer{font-size:9px;color:#728e9b;border-top:1px solid #263b48;margin-top:40px}@media(max-width:950px){.studio{grid-template-columns:1fr;gap:24px}.preview{position:static;max-width:620px;width:100%;margin:auto}.lineup-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:500px){header{font-size:8px}.editor{padding:15px}.lineup-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.lineup-heading{align-items:start}h2{font-size:19px}.preview-bottom>button{font-size:8px;padding:9px}.avatar-row span{display:none}}

.history-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.history-actions button{font-size:8px;padding:9px}.favourite-item .lineup-card{width:100%}.remove-favourite{width:100%;font-size:8px;margin-top:5px;padding:6px}.favourites:has(.lineup-grid:empty){padding-bottom:0}

.preset-panel{padding:12px 0 20px}.preset-panel .share-actions{margin-top:10px}.preset-panel button{font-size:8px}.choices button[data-slot=palette]::before{content:"";display:inline-block;width:8px;height:8px;background:var(--swatch,#a1dbc3);margin-right:6px}.choices button[data-choice=acid]{--swatch:#a9dc58}.choices button[data-choice=glacier]{--swatch:#92d5dd}.choices button[data-choice=rose]{--swatch:#e8a1b2}.choices button[data-choice=obsidian]{--swatch:#777995}.choices button[data-choice=bone]{--swatch:#fff1cd}.choices button[data-choice=violet]{--swatch:#baaac6}.choices button[data-choice=ember]{--swatch:#ecad7d}
.voxel-button{border:1px solid #5f8c8c;background:#112a32;color:#b9edda;font-size:9px;padding:10px 12px}