.packs-head{display:flex;flex-direction:column;gap:.375rem}.packs-title{display:flex;align-items:center;flex-wrap:wrap;gap:.25rem .625rem}.packs-title h1{font-size:var(--step-3)}@media(min-width:48rem){.packs-title h1{font-size:2.25rem}}.packs-subtitle{color:var(--text-muted);max-width:46ch}.packs-summary{font-size:.8125rem;color:var(--text-faint);font-variant-numeric:tabular-nums}.packs-tools{display:flex;flex-direction:column;gap:.625rem;position:sticky;top:var(--topbar-height);z-index:5;padding-block:.75rem;background:var(--ground)}.packs-tools-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem .75rem}.packs-hint{font-size:.75rem;color:var(--text-faint);font-variant-numeric:tabular-nums;min-height:1.2em}.packs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,20rem),1fr));gap:.75rem}.packs-grid[aria-busy=true]{opacity:.55;transition:opacity .12s;pointer-events:none}.pack{position:relative;display:flex;flex-direction:column;gap:.375rem;padding:.875rem 1rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);transition:border-color .12s;content-visibility:auto;contain-intrinsic-size:auto 10rem}.pack:hover{border-color:var(--line-strong)}.pack:focus-within{box-shadow:var(--focus)}.pack-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:.125rem .5rem}.pack-name{font-family:var(--font-display);font-weight:700;font-size:var(--step-1);letter-spacing:-.01em;color:var(--text);text-decoration:none;overflow-wrap:anywhere}.pack-name:after{content:"";position:absolute;inset:0;border-radius:inherit}.pack:hover .pack-name{color:var(--accent)}.pack-name:focus-visible{outline:none;box-shadow:none}.pack-fav{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:flex-end;gap:.25rem;flex-shrink:0;margin-inline-start:auto;min-width:3.25rem;height:1.75rem;font-size:.75rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-faint)}.pack-count{flex-shrink:0;font-size:.75rem;font-weight:600;color:var(--text-muted);font-variant-numeric:tabular-nums;white-space:nowrap}.pack-desc{font-size:.8125rem;color:var(--text-muted);line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}.pack-preview{display:flex;align-items:center;gap:.5rem;margin-top:auto;padding-top:.5rem;min-height:3.25rem}.pack-preview img{width:44px;height:44px;object-fit:contain;border-radius:8px;background:conic-gradient(from 90deg at 50% 50%,var(--surface-sunken) 25%,transparent 0 50%,var(--surface-sunken) 0 75%,transparent 0) 0 0 / 12px 12px}.pack-more{font-size:.75rem;font-weight:600;color:var(--text-faint);font-variant-numeric:tabular-nums}.paginator{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.375rem;padding-top:.5rem}.page-btn{display:grid;place-items:center;min-width:2.25rem;height:2.25rem;padding-inline:.5rem;font:inherit;font-size:.8125rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-muted);background:var(--surface);border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:color .12s,border-color .12s,background .12s}.page-btn:hover:not(:disabled){color:var(--text);border-color:var(--line-strong)}.page-btn:disabled{opacity:.4;cursor:not-allowed}.page-btn[aria-current=page]{color:var(--accent-ink);background:var(--accent);border-color:var(--accent);cursor:default}.packs-loading,.packs-empty{display:flex;flex-direction:column;align-items:center;gap:.625rem;padding:3rem 1rem;text-align:center;color:var(--text-muted)}.packs-loading{justify-content:center;min-height:100vh}.packs-empty h2{font-size:var(--step-2);color:var(--text)}.packs-retry{margin-top:.625rem}
