:root{--color-bg:#f4f3f1;--color-bg-alt:#e8e6e3;--color-surface:#fdfdfc;--color-text:#29241f;--color-text-muted:#746b63;--color-border:#d6d3cd;--color-accent:#486a2f;--color-accent-hover:#395822;--color-accent-soft:#486a2f1f;--color-danger:#a63830;--font-heading:ui-sans-serif, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-body:ui-sans-serif, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--text-sm:clamp(.8rem, .78rem + .1vw, .85rem);--text-base:clamp(.95rem, .92rem + .15vw, 1rem);--text-lg:clamp(1.1rem, 1.05rem + .3vw, 1.3rem);--text-hero:clamp(1.8rem, 1.5rem + 1.5vw, 2.6rem);--space-xs:.375rem;--space-sm:.625rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:clamp(1.75rem, 1.5rem + 1.2vw, 3rem);--space-page-x:clamp(1rem, 1vw + .75rem, 2rem);--radius-sm:3px;--radius-md:6px;--duration-fast:.12s;--duration-normal:.22s;--ease-out-expo:cubic-bezier(.16, 1, .3, 1)}@media (prefers-color-scheme:dark){:root{--color-bg:#16181d;--color-bg-alt:#1f2228;--color-surface:#22242b;--color-text:#edece8;--color-text-muted:#9fa3ad;--color-border:#393e46;--color-accent:#86c559;--color-accent-hover:#a0d879;--color-accent-soft:#86c55929;--color-danger:#dd685f}}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:var(--text-base);-webkit-font-smoothing:antialiased;line-height:1.5}h1,h2,h3{font-family:var(--font-heading);margin:0}p{margin:0}button{cursor:pointer;font-family:inherit}input,select{font-family:inherit;font-size:var(--text-base);color:var(--color-text)}.field-label{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);margin-bottom:var(--space-xs);font-weight:700;display:block}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:var(--radius-sm)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.site-header{border-bottom:1px solid var(--color-border);background:var(--color-surface)}.site-header-inner{max-width:1440px;padding:var(--space-lg) var(--space-page-x);margin:0 auto}.site-title{font-size:var(--text-hero);letter-spacing:.02em;text-transform:uppercase;font-weight:800}.site-subtitle{margin-top:var(--space-xs);color:var(--color-text-muted);font-size:var(--text-base)}.layout{max-width:1440px;padding:var(--space-md) var(--space-page-x);gap:var(--space-md);grid-template-columns:1fr;margin:0 auto;display:grid}.filters-toggle{align-items:center;gap:var(--space-xs);width:max-content;min-height:2.75rem;padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);transition:border-color var(--duration-fast) var(--ease-out-expo), background var(--duration-fast) var(--ease-out-expo), color var(--duration-fast) var(--ease-out-expo);font-weight:600;display:inline-flex}@media (hover:hover){.filters-toggle:hover{border-color:var(--color-accent)}}.filters-toggle[aria-expanded=true]{background:var(--color-accent-soft);border-color:var(--color-accent);color:var(--color-accent)}.control-rail{gap:var(--space-lg);background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);max-height:calc(100vh - (var(--space-md) * 2));flex-direction:column;display:none;overflow-y:auto}.control-rail.open{animation:rail-in var(--duration-normal) var(--ease-out-expo);display:flex}@keyframes rail-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.main-content{min-width:0}.site-footer{max-width:1440px;padding:var(--space-lg) var(--space-page-x) var(--space-xl);color:var(--color-text-muted);font-size:var(--text-sm);margin:0 auto}@media (width>=768px){.layout{grid-template-columns:240px 1fr;align-items:start}.filters-toggle{display:none}.control-rail{top:var(--space-md);display:flex;position:sticky}}@media (width>=1024px){.layout{gap:var(--space-lg);grid-template-columns:280px 1fr}}.search-input{width:100%;padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out-expo)}@media (hover:hover){.search-input:hover{border-color:color-mix(in srgb, var(--color-accent) 40%, var(--color-border))}}.search-input::placeholder{color:var(--color-text-muted)}.color-picker-wheel{margin-bottom:var(--space-md);justify-content:center;display:flex}.color-picker-row{gap:var(--space-xs);align-items:center;display:flex}.color-picker-hex-input{min-width:0;min-height:2.75rem;padding:var(--space-sm);font-family:var(--font-mono);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);flex:1}.color-picker-clear{min-height:2.75rem;padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:var(--text-sm);transition:border-color var(--duration-fast) var(--ease-out-expo), color var(--duration-fast) var(--ease-out-expo);background:0 0}@media (hover:hover){.color-picker-clear:hover{border-color:var(--color-danger);color:var(--color-danger)}}.color-picker-presets{gap:var(--space-xs);margin-top:var(--space-sm);display:flex}.color-chip{background:var(--chip-color);border:2px solid var(--color-surface);width:1.75rem;height:1.75rem;box-shadow:0 0 0 1px var(--color-border);transition:transform var(--duration-fast) var(--ease-out-expo), box-shadow var(--duration-fast) var(--ease-out-expo);border-radius:999px}@media (hover:hover){.color-chip:hover{box-shadow:0 0 0 2px var(--color-accent);transform:scale(1.12)}}@media (pointer:coarse){.color-chip{width:2.25rem;height:2.25rem}}.filter-heading{margin-bottom:var(--space-sm)}.filter-checkboxes{gap:var(--space-sm);flex-direction:column;display:flex}.filter-checkbox{align-items:center;gap:var(--space-sm);min-height:1.75rem;font-size:var(--text-sm);cursor:pointer;display:flex}.filter-checkbox input{width:1.1rem;height:1.1rem;accent-color:var(--color-accent);cursor:pointer;flex-shrink:0}.shape-select{width:100%;min-height:2.75rem;padding:var(--space-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-top:var(--space-xs)}@media (pointer:coarse){.filter-checkbox{min-height:2.75rem}.filter-checkbox input{width:1.35rem;height:1.35rem}}.result-count{color:var(--color-text-muted);font-family:var(--font-mono);font-size:var(--text-sm);margin-bottom:var(--space-sm)}.block-grid{gap:var(--space-sm);grid-template-columns:repeat(auto-fill,minmax(132px,1fr));display:grid}.empty-state{align-items:center;gap:var(--space-md);padding:var(--space-xl) var(--space-md);color:var(--color-text-muted);text-align:center;flex-direction:column;display:flex}.empty-state[hidden]{display:none}.empty-state-clear{padding:var(--space-sm) var(--space-lg);border:1px solid var(--color-accent);border-radius:var(--radius-md);color:var(--color-accent);transition:background var(--duration-fast) var(--ease-out-expo);background:0 0;font-weight:600}@media (hover:hover){.empty-state-clear:hover{background:var(--color-accent-soft)}}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:transform var(--duration-fast) var(--ease-out-expo), border-color var(--duration-fast) var(--ease-out-expo);flex-direction:column;display:flex;overflow:hidden}@media (hover:hover){.card:hover{border-color:color-mix(in srgb, var(--swatch) 55%, var(--color-border));transform:translateY(-2px)}.card:hover .card-cube{transform:translateY(-3px)scale(1.04)}}.card-icon-wrap{aspect-ratio:1;background:color-mix(in srgb, var(--swatch) 10%, var(--color-bg-alt));justify-content:center;align-items:center;padding:12%;display:flex}.card-cube{filter:drop-shadow(0 2px 3px #0003);width:100%;height:100%;transition:transform var(--duration-fast) var(--ease-out-expo)}.card-body{padding:var(--space-sm);gap:var(--space-xs);flex-direction:column;display:flex}.card-name{font-size:var(--text-sm);font-weight:700;line-height:1.25}.card-meta{font-family:var(--font-mono);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.02em;font-size:.7rem}.card-badges{flex-wrap:wrap;gap:4px;margin-top:2px;display:flex}.card-badge{font-family:var(--font-mono);background:var(--color-accent-soft);color:var(--color-accent);text-transform:uppercase;letter-spacing:.02em;border-radius:999px;padding:2px 6px;font-size:.65rem}