:root{--color-bg:#fff;--color-surface:#f0f0f0;--color-surface-hover:#e6e6e6;--color-text:#2f3033;--color-muted:#969799;--color-divider:#2f303329;--color-grid:#f0f0f0;--color-primary:#000;--color-on-primary:#fff;--color-popover:#fff;--shadow-popover:0 0 0 .5px #2f303314, 0 8px 24px #2f303314, 0 2px 4px #2f30330a;--checker:repeating-conic-gradient(#e6e6e6 0% 25%, #fff 0% 50%) 0 0 / 8px 8px;--color-primary-hover:#2f3033;--color-swatch-ring:#00000014;--color-thumb:#fff;--color-thumb-text:var(--color-text);--ui-icon-filter:none;--radius-pill:100px;--radius-tile:12px;--radius-panel:20px;--page-x:80px;--page-bottom:24px;--tablet-side:240px;--content-top:85px;--column-gap:24px;--side-width:200px;--tile:90px;--tile-gap:16px;color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,sans-serif;font-size:12px;line-height:20px}:root[data-theme=dark]{--color-bg:#000;--color-surface:#242424;--color-surface-hover:#2e2e2e;--color-text:#ececec;--color-muted:#8b8c8f;--color-divider:#ffffff24;--color-grid:#232323;--color-primary:#fff;--color-on-primary:#000;--color-primary-hover:#dcdcdc;--color-popover:#1c1c1c;--shadow-popover:0 0 0 .5px #ffffff1a, 0 8px 24px #00000080, 0 2px 4px #0000004d;--checker:repeating-conic-gradient(#3a3a3a 0% 25%, #242424 0% 50%) 0 0 / 8px 8px;--color-swatch-ring:#ffffff29;--color-thumb:#5b5b5b;--color-thumb-text:#fff;--ui-icon-filter:invert(1)}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}.theme-wipe{pointer-events:none;z-index:100;view-transition-name:theme-wipe;width:100%;height:100%;position:fixed;inset:0}::view-transition-old(root){mix-blend-mode:normal;animation:none}::view-transition-new(root){mix-blend-mode:normal;animation:none}::view-transition-old(theme-wipe){mix-blend-mode:normal;animation:none}::view-transition-new(theme-wipe){mix-blend-mode:normal;animation:none}::view-transition-old(theme-wipe){display:none}::view-transition-new(root){--wipe-band:120px;-webkit-mask-image:linear-gradient(to right, #000 calc(50% - var(--wipe-band)), transparent calc(50% + var(--wipe-band)));-webkit-mask-image:linear-gradient(to right, #000 calc(50% - var(--wipe-band)), transparent calc(50% + var(--wipe-band)));mask-image:linear-gradient(to right, #000 calc(50% - var(--wipe-band)), transparent calc(50% + var(--wipe-band)));-webkit-mask-size:calc(200% + 2 * var(--wipe-band)) 100%;-webkit-mask-size:calc(200% + 2 * var(--wipe-band)) 100%;mask-size:calc(200% + 2 * var(--wipe-band)) 100%;-webkit-mask-position:100% 0;mask-position:100% 0;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.theme-toggle{view-transition-name:theme-toggle}::view-transition-group(theme-toggle){animation:none}::view-transition-new(theme-toggle){animation:none}::view-transition-old(theme-toggle){display:none}.dither-cursor{pointer-events:none;z-index:0;width:100%;height:100%;position:fixed;inset:0}.header,.layout{z-index:1;position:relative}.header{z-index:2;height:var(--content-top);padding:12px var(--page-x) 0;justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.nav{align-items:center;gap:30px;height:32px;display:flex}.nav a{isolation:isolate;color:var(--color-text);white-space:nowrap;font-size:14px;font-weight:500;line-height:20px;text-decoration:none;position:relative}.nav a:before{content:"";z-index:-1;border-radius:var(--radius-pill);background:var(--color-surface);opacity:0;transition:opacity .15s;position:absolute;inset:-4px -12px}.nav a:hover:before,.nav a:focus-visible:before{opacity:1}.nav a:focus-visible{outline:none}.nav a[aria-current=page]{text-underline-offset:4px;text-decoration:underline}.page{z-index:1;max-width:560px;padding:0 var(--page-x) 64px;font-size:14px;line-height:22px;position:relative}.page h1{margin:0 0 16px;font-size:24px;font-weight:500;line-height:32px}.page p{color:var(--color-text);margin:0 0 12px}.page a{color:var(--color-text);text-underline-offset:3px}.logo{width:132px;height:32px;color:var(--color-primary);text-decoration:none;display:block;position:relative}.logo-mark{display:block;position:absolute;top:9px;left:2px}.logo-text{letter-spacing:-.2px;white-space:nowrap;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:20px;font-weight:500;line-height:20px;position:absolute;top:6px;left:26px}.layout{grid-template-columns:var(--side-width) minmax(0, 1fr) var(--side-width);gap:var(--column-gap);padding:0 var(--page-x);display:grid}.shell{flex-direction:column;height:100dvh;display:flex;overflow:hidden}.shell .header{flex-shrink:0}.shell .layout{flex:1;min-height:0}.sidebar,.detail{min-height:0;padding-bottom:var(--page-bottom);scrollbar-width:none;flex-direction:column;display:flex;overflow-y:auto}.sidebar{overflow:visible}main{flex-direction:column;min-height:0;display:flex}.search{flex-shrink:0}.results{overscroll-behavior:contain;min-height:0;padding:12px 4px var(--page-bottom);flex:1;margin:0 -4px;overflow-y:auto}.sidebar::-webkit-scrollbar{display:none}.detail::-webkit-scrollbar{display:none}.footer{flex-direction:column;flex-shrink:0;align-self:flex-start;align-items:flex-start;margin-top:auto;padding-top:24px;display:flex}.footer p{white-space:nowrap;margin:0}.footer-version{color:var(--color-muted)}.footer a{color:inherit;text-underline-offset:2px}.footer a:hover{color:var(--color-muted)}.controls{border-bottom:1px solid var(--color-divider);flex-direction:column;flex-shrink:0;gap:12px;padding-bottom:16px;display:flex}.control-row{align-items:center;gap:8px;display:flex}.control-label{width:48px;color:var(--color-muted);flex-shrink:0}.categories{overscroll-behavior:contain;scrollbar-width:none;flex-direction:column;flex:0 auto;gap:4px;min-height:0;margin:0;padding:16px 0 0;list-style:none;display:flex;overflow-y:auto}.categories::-webkit-scrollbar{display:none}.categories li{flex-shrink:0}.category{width:100%;color:var(--color-muted);text-align:left;background:0 0;border:0;justify-content:space-between;padding:0;display:flex}.category:hover{color:var(--color-text)}.category[aria-pressed=true]{color:var(--color-text);font-weight:500}.segmented{border-radius:var(--radius-pill);background:var(--color-surface);height:28px;padding:2px;display:flex}.segmented button{border-radius:var(--radius-pill);white-space:nowrap;background:0 0;border:0;min-width:40px;height:24px;padding:2px 12px}.segmented{position:relative}.segmented button{z-index:1;position:relative}.segmented button[aria-checked=true]{color:var(--color-thumb-text);font-weight:500}.segmented-thumb{border-radius:var(--radius-pill);background:var(--color-thumb);pointer-events:none;height:24px;position:absolute;top:2px;left:2px}.segmented-thumb.is-animated{transition:transform .2s cubic-bezier(.45,0,.55,1),width .2s cubic-bezier(.45,0,.55,1)}@media (prefers-reduced-motion:reduce){.segmented-thumb.is-animated{transition:none}}.pill{border-radius:var(--radius-pill);background:var(--color-surface);white-space:nowrap;align-items:center;gap:4px;height:24px;padding:2px 4px 2px 12px;display:inline-flex}.color-pill{gap:8px}.color-pill input[type=text]{width:60px;color:var(--color-muted);letter-spacing:-.154px;background:0 0;border:0;outline:none;padding:0}.color-pill input[type=text]:focus{color:var(--color-text)}.swatch{background:var(--checker);width:16px;height:16px;box-shadow:inset 0 0 0 1px var(--color-swatch-ring);border:0;border-radius:1000px;padding:0;position:relative;overflow:hidden}.swatch span{border-radius:inherit;position:absolute;inset:0}.color-field{position:relative}.popover{z-index:20;background:var(--color-popover);box-shadow:var(--shadow-popover);border-radius:12px;position:absolute}.color-popover{flex-direction:column;gap:12px;width:240px;padding:12px;display:flex;top:calc(100% + 8px);left:-56px}.picker-sv{aspect-ratio:1;cursor:crosshair;touch-action:none;border-radius:8px;position:relative}.picker-thumb{background:var(--thumb);pointer-events:none;border:3px solid #fff;border-radius:50%;width:16px;height:16px;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .5px #0003,0 1px 3px #00000040}.picker-row{align-items:center;gap:8px;display:flex}.picker-eyedropper{border-radius:var(--radius-pill);width:28px;height:28px;color:var(--color-text);background:0 0;border:0;flex-shrink:0;place-items:center;padding:0;display:grid}.picker-eyedropper:hover{background:var(--color-surface)}.picker-sliders{flex-direction:column;flex:1;gap:8px;display:flex}.picker-slider{border-radius:var(--radius-pill);cursor:pointer;touch-action:none;height:12px;margin:0 6px;position:relative}.picker-slider:before{content:"";border-radius:inherit;background:inherit;z-index:-1;position:absolute;inset:0 -6px}.picker-slider{isolation:isolate}.picker-inputs{gap:4px;display:flex}.picker-fields{border-radius:var(--radius-pill);background:var(--color-surface);flex:1;min-width:0;height:28px;display:flex;overflow:hidden}.picker-field{flex:1;align-items:center;min-width:0;padding:0 6px;display:flex}.picker-field+.picker-field{border-left:1px solid var(--color-bg)}.picker-field:first-child{padding-left:10px}.picker-field:last-child{flex:0 0 48px;padding-right:8px}.picker-field-hex{flex:auto}.picker-field input{letter-spacing:-.154px;background:0 0;border:0;outline:none;width:100%;min-width:0;padding:0}.picker-suffix{color:var(--color-muted)}.dropdown{flex-shrink:0;position:relative}.dropdown-trigger{border-radius:var(--radius-pill);background:var(--color-surface);color:var(--color-text);white-space:nowrap;border:0;align-items:center;gap:4px;padding:2px 4px 2px 12px;font-weight:500;display:inline-flex}.dropdown-pill .dropdown-trigger{height:24px}.dropdown-pill .dropdown-trigger:hover,.dropdown-trigger[aria-expanded=true]{background:var(--color-surface-hover)}.dropdown-outline .dropdown-trigger{background:var(--color-bg);height:28px;box-shadow:inset 0 0 0 1px var(--color-surface);gap:2px;padding-left:10px}.dropdown-outline .dropdown-trigger:hover,.dropdown-outline .dropdown-trigger[aria-expanded=true]{background:var(--color-surface)}.dropdown-trigger img{width:16px;height:16px;display:block}.dropdown-menu{min-width:100%;max-height:280px;color:var(--color-text);outline:none;margin:0;padding:4px;font-weight:400;list-style:none;left:0;overflow-y:auto}.dropdown-menu-bottom{top:calc(100% + 4px)}.dropdown-menu-top{bottom:calc(100% + 4px)}.dropdown-menu-end{left:auto;right:0}.dropdown-menu li{white-space:nowrap;cursor:pointer;border-radius:8px;padding:4px 12px 4px 28px;position:relative}.dropdown-menu li.is-active{background:var(--color-surface)}.dropdown-menu li[aria-selected=true]{font-weight:500}.dropdown-menu li[aria-selected=true]:before{content:"";border-bottom:1.5px solid;border-left:1.5px solid;width:8px;height:4px;position:absolute;top:50%;left:10px;transform:translateY(-70%)rotate(-45deg)}.search{border-radius:var(--radius-pill);background:var(--color-surface);align-items:center;gap:4px;height:28px;padding:2px 6px;display:flex}.search img{flex-shrink:0;width:16px;height:16px}.search input{letter-spacing:-.154px;background:0 0;border:0;outline:none;flex:1;min-width:0;height:24px;padding:0}.search input::placeholder{color:var(--color-muted)}.search input::-webkit-search-cancel-button{appearance:none;display:none}.search input::-webkit-search-decoration{appearance:none;display:none}.search-clear{color:var(--color-muted);background:0 0;border:0;padding:0 6px}.search-clear:hover{color:var(--color-text)}.grid{grid-template-columns:repeat(auto-fill, minmax(var(--tile), 1fr));gap:var(--tile-gap);display:grid}.tile{aspect-ratio:1;border:1px solid var(--color-surface);border-radius:var(--radius-tile);background:var(--color-bg);place-items:center;padding:0;transition:background-color .12s;display:grid}@property --grid-reveal{syntax:"<length>";inherits:false;initial-value:0}.tile{position:relative}.tile:before{content:"";border-radius:inherit;pointer-events:none;background-image:linear-gradient(to right, var(--tile-grid,var(--color-grid)) .5px, transparent .5px), linear-gradient(to bottom, var(--tile-grid,var(--color-grid)) .5px, transparent .5px);-webkit-mask-image:radial-gradient(circle at var(--gx,50%) var(--gy,50%), #000 var(--grid-reveal), transparent calc(var(--grid-reveal) + 16px));-webkit-mask-image:radial-gradient(circle at var(--gx,50%) var(--gy,50%), #000 var(--grid-reveal), transparent calc(var(--grid-reveal) + 16px));mask-image:radial-gradient(circle at var(--gx,50%) var(--gy,50%), #000 var(--grid-reveal), transparent calc(var(--grid-reveal) + 16px));--grid-reveal:0px;background-position:calc(50% + 2px) calc(50% + 2px);background-size:4px 4px;transition:--grid-reveal .25s ease-in;position:absolute;inset:0}.tile:hover:before{--grid-reveal:160px;transition:--grid-reveal .5s cubic-bezier(.22,1,.36,1)}.tile[aria-selected=true]{--tile-grid:var(--color-surface-hover)}.tile[aria-selected=true]:before{--grid-reveal:320px}.tile svg{position:relative}@media (prefers-reduced-motion:reduce){.tile:before,.tile:hover:before{transition:none}}.tile svg,.preview svg{transform:translate(var(--px,0px), var(--py,0px));transition:transform .25s cubic-bezier(.22,1,.36,1)}@media (prefers-reduced-motion:reduce){.tile svg,.preview svg{transition:none;transform:none}}.tile[aria-selected=true]{border-color:var(--color-surface);background:var(--color-surface)}.empty{color:var(--color-muted);text-align:center;margin-top:48px}.preview{background-color:var(--color-bg);background-image:linear-gradient(to right, var(--color-grid) .5px, transparent .5px), linear-gradient(to bottom, var(--color-grid) .5px, transparent .5px);aspect-ratio:1;border:1px solid var(--color-surface);border-radius:var(--radius-panel);background-position:calc(50% + 2px) calc(50% + 2px);background-size:4px 4px;place-items:center;width:100%;display:grid;overflow:hidden}.detail-title{flex-direction:column;gap:2px;margin-top:16px;display:flex}.detail-title h2{margin:0;font-size:12px;font-weight:500;line-height:20px}.detail-title p{color:var(--color-muted);letter-spacing:-.154px;margin:0}.tags{flex-wrap:wrap;gap:4px;margin-top:16px;display:flex}.tag{border-radius:var(--radius-pill);background:var(--color-surface);height:24px;color:var(--color-muted);white-space:nowrap;border:0;padding:2px 12px;font-weight:500}.tag:hover{color:var(--color-text)}.export{flex-direction:column;gap:8px;margin-top:auto;padding-top:24px;display:flex}.export-size{color:var(--color-muted);justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.export-row{gap:8px;display:flex}.btn{border-radius:var(--radius-pill);background:var(--color-surface);white-space:nowrap;border:0;flex:1;height:32px;padding:6px 12px;font-weight:500}.btn:hover{background:var(--color-surface-hover)}.btn-primary{background:var(--color-primary);color:var(--color-on-primary)}.btn-primary:hover{background:var(--color-primary-hover)}.header-actions{align-items:center;gap:16px;height:32px;display:flex}.nav-burger{display:none;position:relative}.theme-toggle{isolation:isolate;width:24px;height:24px;color:var(--color-text);background:0 0;border:0;place-items:center;padding:0;display:grid;position:relative}.theme-toggle svg{display:block}.theme-toggle:before{content:"";z-index:-1;border-radius:var(--radius-pill);background:var(--color-surface);opacity:0;transition:opacity .15s;position:absolute;inset:-4px}.theme-toggle:hover:before,.theme-toggle:focus-visible:before{opacity:1}.theme-toggle:focus-visible{outline:none}.logo-mark,.search img,.dropdown-trigger img{filter:var(--ui-icon-filter)}.burger{border-radius:var(--radius-pill);width:32px;height:32px;color:var(--color-text);background:0 0;border:0;place-items:center;padding:0;display:grid}.burger:hover,.burger[aria-expanded=true]{background:var(--color-surface)}.nav-menu{flex-direction:column;min-width:180px;padding:4px;display:flex;top:calc(100% + 4px);right:0}.nav-menu a{color:var(--color-text);white-space:nowrap;border-radius:8px;padding:6px 12px;font-size:14px;font-weight:500;line-height:20px;text-decoration:none}.nav-menu a:hover,.nav-menu a:focus-visible{background:var(--color-surface);outline:none}.nav-menu a[aria-current=page]{text-underline-offset:4px;text-decoration:underline}.layout-tablet{grid-template-columns:var(--tablet-side) minmax(0, 1fr)}.layout-tablet .sidebar{overflow-y:auto}.layout-tablet .controls{border-bottom:0;padding-bottom:0}.layout-tablet .control-label{width:56px}.detail-compact{flex-shrink:0;margin-top:auto;padding:24px 0 0;overflow:visible}.detail-compact .detail-title{margin-top:0}.detail-compact .export{margin-top:0;padding-top:16px}.layout-tablet .footer{margin-top:0;padding-top:24px}@media (width<=1100px){:root{--page-x:32px}.nav{display:none}.nav-burger{display:block}.header-actions{gap:12px}}@media (width<=700px){:root{--page-x:16px}.header{height:auto;padding-bottom:16px}}.layout-mobile{flex-direction:column;gap:0;padding:0;display:flex}.layout-mobile .sidebar{height:auto;padding:0 var(--page-x);z-index:3;flex-shrink:0;overflow:visible}.layout-mobile .controls{padding-bottom:16px}.layout-mobile .control-label{width:56px}.layout-mobile main{overscroll-behavior:contain;min-height:0;padding:16px var(--page-x) var(--page-bottom);flex:1;overflow-y:auto}.layout-mobile .results{flex:none;padding-bottom:0;overflow:visible}.layout-mobile main>.footer{margin-top:0;padding-top:32px}.detail-sheet{margin:0 var(--page-x);padding:16px 0 var(--page-bottom);border-top:1px solid var(--color-divider);background:var(--color-bg);flex-shrink:0;animation:.22s cubic-bezier(.22,1,.36,1) sheet-in;position:relative}.detail-sheet .detail-title{padding-right:44px}.layout-tablet .sidebar{overflow-x:hidden}.detail-sheet .footer{margin-top:0;padding-top:24px}.detail-close{border:1px solid var(--color-surface);background:var(--color-bg);width:32px;height:32px;color:var(--color-text);border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:12px;right:0}.detail-close:hover{background:var(--color-surface)}@keyframes sheet-in{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.detail-sheet{animation:none}}