:root{--radius:12px }[data-theme=dark]{--bg:#0c1410;--panel:#0f1f18;--muted:#a3b7a7;--text:#eaf5ee;--accent:#22c55e;--accent2:#10b981;--border:#1a2b22;--chip:#12281f;--chip-active:#1a3a2e;--success:#4ade80;--danger:#ef4444;--bg-gradients: radial-gradient(1000px 480px at 20% -10%, rgba(34,197,94,.1) 0, transparent 60%), radial-gradient(900px 540px at 90% -20%, rgba(16,185,129,.1) 0, transparent 60%)}[data-theme=light]{--bg:#f4fbf7;--panel:#ffffff;--muted:#5b6b61;--text:#0b1b14;--accent:#22c55e;--accent2:#10b981;--border:#dbe7df;--chip:#eaf4ee;--chip-active:#d7efe1;--success:#16a34a;--danger:#b91c1c;--bg-gradients: radial-gradient(1000px 480px at 20% -10%, rgba(34,197,94,.2) 0, transparent 60%), radial-gradient(900px 540px at 90% -20%, rgba(16,185,129,.18) 0, transparent 60%)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg-gradients),var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,Noto Sans,Apple Color Emoji,Segoe UI Emoji}a{color:inherit;text-decoration:none}.container{max-width:1100px;margin:0 auto;padding:0 20px}.container.narrow{max-width:640px}.navbar{position:sticky;top:0;-webkit-backdrop-filter:saturate(120%) blur(10px);backdrop-filter:saturate(120%) blur(10px);background:color-mix(in hsl,var(--bg) 80%,transparent);border-bottom:1px solid var(--border);z-index:10}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px}.logo{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.2px}.logo-icon{display:inline-flex;width:28px;height:28px;align-items:center;justify-content:center;color:var(--text)}.nav-actions{display:flex;gap:10px}.menu-toggle{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--border);background:transparent;color:var(--text);border-radius:10px;cursor:pointer}.btn{border:1px solid var(--border);background:transparent;color:var(--text);padding:8px 14px;border-radius:10px;cursor:pointer;transition:all .2s}.btn:hover{transform:translateY(-1px);border-color:var(--chip-active)}.btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#05130b;border:none}.btn.ghost{background:transparent}.btn:disabled{opacity:.6;cursor:not-allowed}.footer{margin-top:40px;border-top:1px solid var(--border)}.footer .footer-inner{display:flex;justify-content:space-between;align-items:center;height:60px;font-size:14px;color:var(--muted)}.footer-actions{display:flex;align-items:center;gap:10px}.sep{opacity:.5;margin:0 8px}.hero{text-align:center;padding:40px 0 20px}.muted{color:var(--muted)}.muted-danger{color:color-mix(in srgb,var(--danger) 80%,white 20%)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.searchbar{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--panel);border:1px solid var(--border);border-radius:12px;max-width:700px;margin:12px auto 10px}.searchbar input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:16px}.searchbar .clear{border:none;background:transparent;color:var(--muted);font-size:18px;cursor:pointer}.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.chip{background:var(--chip);border:1px solid var(--border);padding:6px 10px;border-radius:999px;color:#cbd5ff;cursor:pointer}.chip.active{background:var(--chip-active);border-color:var(--chip-active)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding:20px 0}.card{position:relative;background:linear-gradient(170deg,#ffffff08,#ffffff03);border:1px solid var(--border);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px;box-shadow:0 10px 30px #0000001f;transition:transform .2s}.card.has-copy{padding-bottom:56px}.card:hover{transform:translateY(-2px)}.card .type{font-size:12px;color:color-mix(in srgb,var(--accent) 80%,white 20%);background:color-mix(in srgb,var(--accent) 18%,transparent);padding:4px 8px;border-radius:999px;border:1px solid var(--border)}.card .title{margin:0}.card .body{white-space:pre-wrap;background:color-mix(in srgb,var(--bg) 70%,white 30%);border:1px dashed var(--border);padding:10px;border-radius:10px;max-height:180px;overflow:auto}.card-top{display:flex;justify-content:space-between;align-items:center}.vote{display:flex;align-items:center;gap:6px;background:color-mix(in srgb,var(--accent) 15%,transparent);border:1px solid var(--border);border-radius:999px;color:color-mix(in srgb,var(--accent) 85%,white 15%);padding:4px 8px;cursor:pointer;transition:transform .15s,background .15s}.vote:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--accent) 18%,transparent)}.vote.active{background:color-mix(in srgb,var(--accent2) 22%,transparent)}.vote.active:hover{background:color-mix(in srgb,var(--accent2) 26%,transparent)}.thumb{display:inline-flex;align-items:center;filter:none;color:inherit}.thumb.animate{animation:thumb-pop .24s ease-out}.tag-list{display:flex;flex-wrap:wrap;gap:6px}.tag{background:color-mix(in srgb,var(--accent) 16%,transparent);border:1px solid var(--border);border-radius:999px;padding:4px 8px;color:color-mix(in srgb,var(--accent) 85%,white 10%)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#080c1c99;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;animation:fade .15s ease-out;z-index:10000;overflow-y:auto;padding:20px}.modal{width:min(720px,92vw);max-height:90vh;overflow-y:auto;background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px;animation:pop .15s ease-out}.field{display:flex;flex-direction:column;gap:6px;margin:10px 0}.field input,.field textarea,.select select{background:color-mix(in srgb,var(--bg) 80%,white 20%);border:1px solid var(--border);border-radius:10px;padding:10px;color:var(--text)}.select{position:relative}.select:after{content:"▾";position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--muted)}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}.tag-input{display:flex;align-items:center;flex-wrap:wrap;gap:6px;min-height:42px;background:color-mix(in srgb,var(--bg) 80%,white 20%);border:1px solid var(--border);border-radius:10px;padding:8px}.tag-input .chip{display:inline-flex;align-items:center;gap:6px}.tag-input input{flex:1;min-width:120px;background:transparent;border:none;outline:none;color:var(--text)}.tag-input .x{background:transparent;border:none;color:var(--muted);cursor:pointer}.row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.card .row strong.muted{color:var(--muted);font-weight:700}.form{display:flex;flex-direction:column;gap:12px}.link{background:none;border:none;color:#c7d2fe;cursor:pointer}.switch{margin-top:10px}.loading{padding:30px;text-align:center;color:color-mix(in srgb,var(--accent) 80%,white 20%)}.empty{text-align:center;color:var(--muted);padding:30px}.skeleton{position:relative;overflow:hidden;background:color-mix(in srgb,var(--bg) 70%,white 30%);border:1px dashed var(--border)}.skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);transform:translate(-100%);animation:shimmer 1.2s infinite}.skeleton-title{margin:4px 0 6px}@keyframes shimmer{to{transform:translate(100%)}}.fade-grid{position:relative}.fade-grid .grid{transition:opacity .22s ease}.fade-grid .grid.real{position:relative;opacity:0}.fade-grid.ready .grid.real{opacity:1}.fade-grid.ready .grid[aria-hidden]{opacity:0}.theme-toggle{display:inline-flex;align-items:center;gap:0}.theme-toggle.icon-only{width:36px;height:36px;justify-content:center;border-radius:999px;border:1px solid var(--border)}.theme-toggle .icon{display:inline-flex}.copy-btn{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:999px;border:1px solid var(--border);background:color-mix(in srgb,var(--accent) 12%,transparent);color:color-mix(in srgb,var(--accent) 85%,white 15%);cursor:pointer;transition:transform .15s,background .15s}.copy-btn:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--accent) 18%,transparent)}.author-link{position:absolute;left:12px;bottom:14px;font-size:12px;color:var(--muted);max-width:calc(100% - 64px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.author-link:hover{text-decoration:underline;color:color-mix(in srgb,var(--accent) 85%,white 15%)}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes pop{0%{transform:translateY(8px);opacity:.7}to{transform:none;opacity:1}}@keyframes thumb-pop{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-1px) scale(1.08)}to{transform:translateY(0) scale(1)}}.profile .profile-header{display:flex;align-items:center;gap:12px;margin:20px 0}.profile .profile-name{margin:0}.stats-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:10px 0 20px}.stat{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:10px}.stat-label{font-size:12px;color:var(--muted)}.stat-value{font-size:18px;font-weight:700}.kpi{margin-top:2px;color:var(--muted);font-size:12px}.app{min-height:100vh;display:flex;flex-direction:column}.app>main{flex:1 0 auto}.footer{flex-shrink:0}.mobile-menu-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#080c1c;-webkit-backdrop-filter:none;backdrop-filter:none;display:flex;justify-content:flex-end;z-index:9999}.mobile-menu{position:relative;width:100%;height:100%;max-width:none;background:var(--panel);border-left:1px solid var(--border);padding:16px;display:flex;flex-direction:column;gap:12px;transform:translate(100%);animation:menu-in .22s ease forwards}.mobile-menu.closing{animation:menu-out .22s ease forwards}.mobile-menu-backdrop.closing{animation:fade-out .22s ease forwards}.menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.menu-list{display:flex;flex-direction:column;gap:10px}.mobile-close{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--border);background:transparent;color:var(--text);border-radius:10px;cursor:pointer}@keyframes menu-in{to{transform:translate(0)}}@keyframes menu-out{to{transform:translate(100%)}}@keyframes fade-out{to{opacity:0}}.display-name-row{align-items:flex-start}.display-name-controls{display:flex;align-items:center;gap:8px;min-width:0;flex:1}.display-name-controls input{min-width:0}@media (max-width: 640px){.nav-actions{display:none}.menu-toggle{display:inline-flex}.hero{padding:28px 0 12px}.grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.footer .footer-inner{height:56px}.display-name-row{flex-direction:column;align-items:stretch}.display-name-controls{width:100%}}
