@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600&family=Outfit:wght@600;700&display=swap";:root{color-scheme:light dark;--ink: #1a1f2e;--paper: #e8eef8;--blur: 16px;--accent: #331199;--glass: color-mix(in oklab, white 72%, transparent);--glass-border: color-mix(in oklab, white 55%, #94a3b8);--accent-soft: color-mix(in oklab, #4f6ef7 18%, transparent);--glow: color-mix(in oklab, #4f6ef7 35%, transparent);--tag: color-mix(in oklab, #4f6ef7 12%, white);--muted: color-mix(in oklab, var(--ink) 55%, transparent);font-family:Manrope,system-ui,sans-serif;color:var(--ink);background:radial-gradient(1200px 600px at 10% -10%,color-mix(in oklab,#a8c0ff 45%,transparent),transparent 60%),radial-gradient(900px 500px at 100% 0%,color-mix(in oklab,#c4b5fd 35%,transparent),transparent 55%),var(--paper)}:root[data-theme=dark]{color-scheme:dark;--ink: #e8eef8;--paper: #0b1020;--accent: #4466ee;--glass: color-mix(in oklab, #1a2238 72%, transparent);--glass-border: color-mix(in oklab, white 14%, transparent);--accent-soft: color-mix(in oklab, #aa99ee 22%, transparent);--glow: color-mix(in oklab, #aa99ee 40%, transparent);--tag: color-mix(in oklab, #aa99ee 18%, #1a2238);--muted: color-mix(in oklab, var(--ink) 60%, transparent);background:radial-gradient(1200px 600px at 10% -10%,color-mix(in oklab,#331199 40%,transparent),transparent 60%),radial-gradient(900px 500px at 100% 0%,color-mix(in oklab,#5500aa 30%,transparent),transparent 55%),var(--paper)}*{box-sizing:border-box}body{margin:0;min-height:100dvh}button,input{font:inherit}button{cursor:pointer}.masthead,nav,.results,.favs,.site-foot{width:min(1180px,calc(100% - 2rem));margin-inline:auto}.toolbar{position:fixed;top:1rem;right:1rem;z-index:40;display:flex;gap:.5rem}.toolbar .theme,.toolbar .github{box-sizing:border-box;width:2.75rem;height:2.75rem;display:grid;place-items:center;line-height:0;color:var(--ink);background:transparent;border:none;-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));box-shadow:0 8px 24px color-mix(in oklab,black 8%,transparent);transition:border-color .2s,box-shadow .2s;text-decoration:none}:is(.toolbar .theme,.toolbar .github):hover{box-shadow:0 8px 28px var(--glow)}:is(.toolbar .theme,.toolbar .github) svg{width:1.45rem;height:1.45rem;display:block}.masthead{padding:4.5rem 0 1.5rem;display:grid;gap:1rem}.masthead .brand{display:inline-flex;align-items:center;gap:.25em;max-width:18ch;color:var(--ink);font:700 clamp(1.85rem,5.5vw,3.4rem)/1.05 Outfit,sans-serif;letter-spacing:-.04em;text-decoration:none;text-wrap:balance}.masthead .brand .mark{width:.85em;height:.85em;flex:none;line-height:0}.masthead .brand .mark svg{display:block;width:100%;height:100%}.masthead p{max-width:42ch;font-size:1.05rem;line-height:1.55;margin:0;color:var(--muted)}.masthead label{margin-top:.5rem}.masthead input{width:min(100%,38rem);color:var(--ink);background:var(--glass);border:4px solid var(--glass-border);border-radius:16px;padding:1rem 1.25rem;outline-offset:-20px;-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));box-shadow:0 8px 24px color-mix(in oklab,black 6%,transparent);transition:border-color .2s}.masthead input:focus-visible{outline:4px solid var(--glow);outline-offset:4px}.masthead input::placeholder{color:var(--muted)}.masthead input:hover,.masthead input:focus{border-color:var(--accent)}nav{position:sticky;top:0;z-index:30;display:flex;flex-wrap:nowrap;gap:.5rem;padding-block:.85rem;margin-block:.25rem 1rem;overflow-x:auto;scrollbar-width:none;cursor:grab;background:color-mix(in oklab,var(--paper) 78%,transparent);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));-webkit-mask-image:linear-gradient(90deg,transparent,#000 1.25rem,#000 calc(100% - 1.25rem),transparent);mask-image:linear-gradient(90deg,transparent,#000 1.25rem,#000 calc(100% - 1.25rem),transparent)}nav:active{cursor:grabbing}nav::-webkit-scrollbar{display:none}nav[data-edge=none]{-webkit-mask-image:none;mask-image:none}nav[data-edge=start]{-webkit-mask-image:linear-gradient(90deg,#000,#000 calc(100% - 1.25rem),transparent);mask-image:linear-gradient(90deg,#000,#000 calc(100% - 1.25rem),transparent)}nav[data-edge=end]{-webkit-mask-image:linear-gradient(90deg,transparent,#000 1.25rem,#000);mask-image:linear-gradient(90deg,transparent,#000 1.25rem,#000)}nav button{flex:0 0 auto;color:var(--ink);background:var(--glass);border:2px solid var(--glass-border);border-radius:16px;text-transform:capitalize;padding:.5rem .9rem;-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));transition:background .2s,border-color .2s,color .2s,box-shadow .2s}nav button:hover,nav button:focus-visible{border-color:var(--accent);box-shadow:0 1px 16px var(--accent);outline:none}nav .active{color:#fff;font-weight:700;background:var(--accent);border-color:var(--accent);box-shadow:2px 3px 18px var(--accent)}.results{padding-bottom:1.5rem}.site-foot{padding-block:1.5rem 2.5rem;margin:0 auto;color:var(--muted);font-size:.85rem;text-align:center}.site-foot a{color:var(--accent);text-underline-offset:.2em}.site-foot a:hover{color:var(--ink)}.favs{display:grid;gap:.85rem;padding:1rem;margin-block:.25rem 1rem;border-radius:1.5rem;background:color-mix(in oklab,var(--accent) 10%,var(--glass));border:2px solid color-mix(in oklab,var(--accent) 40%,var(--glass-border));box-shadow:0 12px 36px color-mix(in oklab,var(--accent) 18%,transparent)}.favs[hidden]{display:none}.favs h2{margin:0;display:flex;align-items:center;gap:.45rem;font:700 1.05rem Outfit,sans-serif;color:var(--glow);letter-spacing:.02em}.favs h2 svg{font-size:1.1rem;flex:none}.favs .grid{padding-bottom:0}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));gap:1rem}.card{position:relative;padding:.75rem;background:var(--glass);border-radius:1.25rem;border:4px solid var(--glass-border);overflow:clip;-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));box-shadow:0 10px 30px color-mix(in oklab,black 8%,transparent);-webkit-user-select:none;user-select:none;cursor:pointer;-webkit-user-drag:none;transition:transform .2s,box-shadow .2s,border-color .2s,background .2s}.card:hover,.card:focus-within{transform:translateY(-4px);border-color:color-mix(in oklab,var(--accent) 55%,var(--glass-border));box-shadow:0 18px 40px var(--glow)}:is(.card:hover,.card:focus-within) .host{font-size:1rem;opacity:1;transform:translateY(0)}.card.favorited{border-color:color-mix(in oklab,var(--accent) 70%,var(--glass-border));background:color-mix(in oklab,var(--accent) 12%,var(--glass));box-shadow:0 12px 32px color-mix(in oklab,var(--accent) 22%,transparent)}.card .fav{position:absolute;top:.85rem;right:.85rem;z-index:2;width:2.25rem;height:2.25rem;display:grid;place-items:center;color:var(--accent);background:transparent;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:2px solid transparent;border-radius:999px;font-size:1.24rem;line-height:0;box-shadow:0 6px 18px color-mix(in oklab,black 14%,transparent);transition:background .2s,box-shadow .2s,transform .15s}.card .fav svg{display:block;transition:transform .2s ease}.card .fav:hover,.card .fav:focus-visible{background:var(--accent);box-shadow:0 8px 22px var(--glow);outline:none;transform:scale(1.12)}:is(.card .fav:hover,.card .fav:focus-visible) svg{transform:rotate(-12deg) scale(1.08)}.card .fav[aria-pressed=true]{color:#000;background:var(--accent);box-shadow:0 8px 22px var(--glow)}.card .preview{position:relative;height:15rem;display:grid;place-items:center;color:var(--ink);background:var(--accent-soft);font:600 1rem Outfit,sans-serif;text-decoration:none;overflow:clip;border-radius:.85rem;-webkit-user-drag:none}.card .preview img{width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;pointer-events:none}.card .host{position:absolute;inset-inline:.75rem;bottom:.75rem;z-index:1;width:max-content;max-width:calc(100% - 1.5rem);padding:.35rem .65rem;border-radius:999px;color:var(--ink);background:var(--glass);border:2px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));font:500 .72rem Manrope,sans-serif;opacity:0;transform:translateY(.35rem);transition:opacity .2s,transform .2s;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.card section{padding:.85rem .25rem .25rem}.card header{display:flex;align-items:center;gap:.65rem}.card header img{width:1.5rem;height:1.5rem;object-fit:contain}.card header h2{margin:0;font:700 1.25rem Outfit,sans-serif}.card p{min-height:3.8em;line-height:1.45;font-size:.82rem;color:var(--muted)}.card footer{display:flex;flex-wrap:wrap;gap:.35rem}.card footer button{color:var(--ink);border:2px solid var(--glass-border);background:var(--tag);border-radius:999px;padding:.25rem .55rem;font-size:.68rem;transition:background .2s,border-color .2s,color .2s}.card footer button:hover,.card footer button:focus-visible{color:#fff;background:var(--accent);border-color:var(--accent);outline:none}.empty{grid-column:1 / -1;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
