:root{--bg: #f0f0e8;--bg-card: #f0f0e8;--black: #111111;--white: #ffffff;--green: #b9ff66;--green-dark: #9de049;--border: #d0d0c8;--text: #111111;--text-muted: #777770;--radius: 16px;--overlay-light: rgba(0, 0, 0, .05);--overlay-lighter: rgba(0, 0, 0, .04);--status-done: #1a8f6e;--status-todo: #c4a035;--status-partial: #2d7abf;font-family:Space Grotesk,system-ui,-apple-system,sans-serif;line-height:1.4;color:var(--text);background-color:var(--bg);color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #0e0e14;--bg-card: #13131c;--black: #f0f0f0;--white: #1a1a26;--green: #b9ff66;--green-dark: #9de049;--border: #2a2a3a;--text: #e4e4ec;--text-muted: #7a7a90;--overlay-light: rgba(255, 255, 255, .06);--overlay-lighter: rgba(255, 255, 255, .04);--status-done: #34d399;--status-todo: #fbbf24;--status-partial: #60a5fa}}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;background:var(--bg)}#app{width:100%;max-width:1280px;margin:0 auto}.topnav{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;border-bottom:1px solid var(--border)}.topnav-logo{font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.topnav-stats{display:flex;gap:1.5rem;align-items:center}.topnav-stat{font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}.topnav-stat strong{color:var(--text);font-weight:700}.topnav-progress-ring{width:48px;height:48px;position:relative}.topnav-progress-ring svg{transform:rotate(-90deg)}.topnav-progress-ring .ring-bg{fill:none;stroke:var(--border);stroke-width:3}.topnav-progress-ring .ring-fill{fill:none;stroke:var(--green);stroke-width:3;stroke-linecap:round;transition:stroke-dashoffset .6s ease}.topnav-progress-ring .ring-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700}.hero{padding:3rem 2rem 2rem;border-bottom:1px solid var(--border);transition:padding .3s ease,opacity .3s ease}.hero-compact{padding:1rem 2rem .75rem}.hero-compact .hero-title{font-size:clamp(1.2rem,3vw,2rem);line-height:1}.hero-compact .hero-sub{margin-top:.4rem;font-size:.75rem}.hero-title{font-size:clamp(2.5rem,6vw,5rem);font-weight:700;text-transform:uppercase;line-height:.95;letter-spacing:-.03em;-webkit-user-select:none;user-select:none}.hero-title .highlight{color:var(--green-dark)}.hero-sub{margin-top:1rem;font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em}.controls{display:flex;align-items:center;gap:.75rem;padding:.75rem 2rem;border-bottom:1px solid var(--border);flex-wrap:wrap}.search-input{flex:0 0 220px;padding:.55rem .9rem;background:var(--white);border:1px solid var(--border);border-radius:100px;color:var(--text);font-family:inherit;font-size:.82rem;outline:none;transition:border-color .2s}.search-input:focus{border-color:var(--green)}.search-input::placeholder{color:var(--text-muted)}.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;border-radius:10px;border:1px solid var(--border);background:var(--white);color:var(--text-muted);font-family:inherit;font-size:.78rem;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.chip-dot{width:8px;height:8px;border-radius:50%;background:var(--chip-color, var(--text));flex-shrink:0;transition:transform .2s,box-shadow .2s}.chip-label{line-height:1}.chip-count{font-size:.65rem;font-weight:600;color:var(--text-muted);background:var(--overlay-light);padding:.1rem .4rem;border-radius:6px;line-height:1.2;transition:all .2s}.chip:hover{border-color:color-mix(in srgb,var(--chip-color, var(--text)) 40%,var(--border));background:color-mix(in srgb,var(--chip-color, var(--text)) 6%,var(--bg));color:var(--text)}.chip:hover .chip-dot{transform:scale(1.25);box-shadow:0 0 0 3px color-mix(in srgb,var(--chip-color, var(--text)) 20%,transparent)}.chip.active{background:color-mix(in srgb,var(--chip-color, var(--text)) 12%,var(--bg));border-color:color-mix(in srgb,var(--chip-color, var(--text)) 50%,transparent);color:var(--text)}.chip.active .chip-dot{transform:scale(1.3);box-shadow:0 0 0 3px color-mix(in srgb,var(--chip-color, var(--text)) 25%,transparent)}.chip.active .chip-count{background:color-mix(in srgb,var(--chip-color, var(--text)) 15%,transparent);color:color-mix(in srgb,var(--chip-color, var(--text)) 80%,var(--text))}.controls-sep{width:1px;height:28px;background:var(--border);margin:0 .15rem}.pill{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem .8rem;border-radius:10px;border:1px solid var(--border);background:var(--white);color:var(--text-muted);font-family:inherit;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;transition:all .2s;white-space:nowrap}.pill:hover{background:var(--overlay-lighter);color:var(--text);border-color:var(--text-muted)}.pill.active{background:var(--text);border-color:var(--text);color:var(--bg)}.pill.status-done.active{background:var(--status-done);border-color:var(--status-done);color:#fff}.pill.status-todo.active{background:var(--text);border-color:var(--text);color:var(--bg)}.pill.status-partial.active{background:var(--status-partial);border-color:var(--status-partial);color:#fff}.results-bar{display:flex;align-items:center;gap:1.5rem;padding:.5rem 2rem;font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--border);flex-wrap:wrap}.cat-progress-bar{display:flex;gap:1.25rem;align-items:center;flex-wrap:wrap}.cat-progress{display:flex;align-items:center;gap:.4rem}.cat-progress-label{font-size:.68rem;font-weight:600;white-space:nowrap}.cat-progress-track{width:60px;height:4px;background:var(--border);border-radius:2px;overflow:hidden}.cat-progress-fill{height:100%;border-radius:2px;transition:width .4s ease}.cat-progress-text{font-size:.65rem;font-weight:700;color:var(--text-muted)}.bento{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--border)}@keyframes card-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.card{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:1.25rem 1.4rem;padding-left:calc(1.4rem + 4px);position:relative;display:flex;flex-direction:column;gap:.6rem;transition:background .2s;cursor:default;background:color-mix(in srgb,var(--cat-color) 5%,var(--bg-card));overflow:hidden;animation:card-in .3s ease both}.card:after{content:attr(data-icon);position:absolute;right:-.15rem;bottom:-.4rem;font-size:5rem;line-height:1;opacity:.07;pointer-events:none;transition:opacity .25s,transform .25s;transform:rotate(-12deg)}.card:hover:after{opacity:.12;transform:rotate(-8deg) scale(1.05)}.card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px}.card.status-done:before{background:var(--status-done)}.card.status-todo:before{background:var(--status-todo)}.card.status-partial:before{background:var(--status-partial)}.card:hover{background:color-mix(in srgb,var(--cat-color) 10%,var(--bg-card))}.card-top{display:flex;justify-content:space-between;align-items:center}.card-id{font-size:.65rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em}.card-text{font-size:1.05rem;font-weight:500;line-height:1.45;letter-spacing:-.01em;color:var(--text)}.card.status-done .card-text{color:var(--text-muted)}.card-link{display:inline-flex;align-items:center;justify-content:center;width:1.2rem;height:1.2rem;font-size:.7rem;text-decoration:none;color:var(--text-muted);background:var(--overlay-light);border-radius:4px;vertical-align:middle;margin-left:.3rem;transition:all .2s}.card-link:hover{color:var(--black);background:var(--green)}.card-bottom{display:flex;align-items:center}.card-cat{font-size:.65rem;font-weight:600;padding:.15rem .5rem;border-radius:100px;background:color-mix(in srgb,var(--cat-color) 12%,transparent);color:color-mix(in srgb,var(--cat-color) 70%,var(--text));text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}.card-badge{font-size:.6rem;font-weight:700;padding:.2rem .55rem;border-radius:100px;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.card-badge.done{background:color-mix(in srgb,var(--status-done) 15%,transparent);color:var(--status-done)}.card-badge.todo{background:color-mix(in srgb,var(--status-todo) 15%,transparent);color:var(--status-todo)}.card-badge.partial{background:color-mix(in srgb,var(--status-partial) 15%,transparent);color:var(--status-partial)}.share-btn{margin-left:auto;padding:.25rem .6rem;border-radius:6px;border:1px solid var(--border);background:var(--white);color:var(--text-muted);font-family:inherit;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;transition:all .2s;white-space:nowrap}.share-btn:hover{border-color:var(--green);color:var(--text)}.empty{grid-column:1 / -1;text-align:center;padding:4rem 2rem;color:var(--text-muted);font-size:.9rem;text-transform:uppercase;letter-spacing:.08em}@media(max-width:900px){.bento{grid-template-columns:repeat(2,1fr)}.hero-title{font-size:2.2rem}}@media(max-width:600px){.bento{grid-template-columns:1fr}.topnav{padding:.75rem 1rem;flex-wrap:wrap;gap:.5rem}.topnav-stats{gap:.75rem}.topnav-stat{font-size:.7rem}.hero{padding:2rem 1rem 1.5rem}.hero-compact{padding:.75rem 1rem .5rem}.controls{padding:.75rem 1rem}.results-bar{padding:.5rem 1rem}.search-input{flex:1 1 100%}.controls-sep{display:none}}