:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:system-ui,sans-serif}body{color:#1a1a1a;background:#fff;margin:0}.viewport{border:1px solid #d0d5dd;border-radius:4px;width:100%;height:24rem;margin-top:1rem;overflow:hidden}.viewport canvas{display:block}main{max-width:64rem;margin:3rem auto;padding:0 1rem}.slots{grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem;margin-top:1rem;display:grid}.slot{border:1px solid #d0d5dd;border-radius:4px;flex-direction:column;gap:.5rem;min-width:0;padding:.75rem;display:flex}.slot-header{align-items:center;gap:.5rem;display:flex}.slot-header h2{flex:1;margin:0;font-size:1rem}.swatch{border:1px solid #1a1a1a33;border-radius:2px;flex:none;width:.9rem;height:.9rem}.tag{color:#555;border:1px solid #d0d5dd;border-radius:999px;padding:0 .5rem;font-size:.75rem}.slot .hint{color:#666;margin:0;font-size:.85rem}.slot input[type=file]{max-width:100%}.slot-info{overflow-wrap:anywhere;font-size:.85rem}.slot-info p{margin:0}.slot-info ul{margin:0;padding-left:1.1rem}.slot-actions{justify-content:space-between;align-items:center;margin-top:auto;font-size:.9rem;display:flex}.status-ok{color:#1a7f37}.status-error{color:#b42318}.status-warning{color:#b54708}footer{color:#666;margin-top:2rem;font-size:.85rem}
