:root{--room: #e4e6dd;--room-deep: #dadcd1;--paper: #fbfaf5;--ink: #20261f;--ink-soft: #5a6156;--line: #c6cabb;--oxblood: #7c2d26;--oxblood-deep: #63221c;--brass: #a8813b;--ledge: #6e5a41;--case: #e9eae0;--font-display: "Fraunces", Georgia, serif;--font-body: "Source Serif 4", Georgia, serif;--font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--room);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.5}button{font:inherit;cursor:pointer}input,select{font:inherit}:focus-visible{outline:2px solid var(--oxblood);outline-offset:2px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.page{max-width:1080px;margin:0 auto;padding:40px 28px 64px}.masthead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:28px}.wordmark{font-family:var(--font-display);font-optical-sizing:auto;font-size:clamp(44px,7vw,68px);font-weight:700;letter-spacing:-.02em;line-height:.95;margin:0}.tagline{margin:6px 0 0 3px;font-family:var(--font-mono);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-soft)}.stats{margin:0;font-family:var(--font-mono);font-size:13px;color:var(--ink-soft)}.shelf-case{background:var(--case);border:1px solid var(--line);border-radius:8px;box-shadow:inset 0 10px 24px #20261f12;overflow:hidden}.shelf-row{display:flex;align-items:flex-end;gap:3px;min-height:216px;padding:24px 28px 0;overflow-x:auto}.shelf-empty{align-self:center;margin:0 auto;font-style:italic;color:var(--ink-soft)}.ledge{height:12px;background:var(--ledge);box-shadow:inset 0 3px #0000002e}.spine{flex:none;position:relative;display:flex;align-items:flex-start;justify-content:center;padding:12px 0 10px;border:none;border-radius:3px 3px 0 0;background-image:linear-gradient(90deg,#ffffff29,#fff0 30%,#00000024);box-shadow:inset 0 -26px 0 -22px #00000038,inset 0 30px 0 -26px #ffffff1f;transition:transform .16s ease;animation:rise .42s cubic-bezier(.2,.7,.3,1) backwards}.spine:hover{transform:translateY(-6px)}.spine.selected{box-shadow:0 0 0 2px var(--case),0 0 0 4px var(--oxblood)}.spine.leaning{transform:rotate(-8deg);transform-origin:bottom left;margin-left:4px;margin-right:14px;z-index:1}.spine.leaning:hover{transform:rotate(-8deg) translateY(-4px)}.spine-title{writing-mode:vertical-rl;font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.04em;color:#f4f1e6;text-shadow:0 1px 1px rgba(0,0,0,.35);max-height:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pile{flex:none;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:3px;margin-left:22px;padding-bottom:0}.pile-book{height:16px;border:none;border-radius:2px;background-image:linear-gradient(180deg,#fff3,#00000029);transition:transform .16s ease;animation:rise .42s cubic-bezier(.2,.7,.3,1) backwards}.pile-book:hover{transform:translateY(-3px)!important}.pile-book.selected{box-shadow:0 0 0 2px var(--case),0 0 0 4px var(--oxblood)}@keyframes rise{0%{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:26px 0 18px}.tabs{display:flex;gap:4px;flex-wrap:wrap}.tab{border:1px solid transparent;border-radius:999px;background:none;padding:6px 14px;font-family:var(--font-mono);font-size:13px;color:var(--ink-soft)}.tab:hover{color:var(--ink)}.tab.active{background:var(--paper);border-color:var(--line);color:var(--ink)}.tab-count{opacity:.55;margin-left:2px}.toolbar-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.search{border:1px solid var(--line);border-radius:999px;background:var(--paper);padding:8px 16px;font-family:var(--font-mono);font-size:13px;color:var(--ink);width:220px}.search::placeholder{color:var(--ink-soft)}.btn{border-radius:999px;padding:8px 18px;font-family:var(--font-mono);font-size:13px;font-weight:500;transition:background-color .14s ease,color .14s ease}.btn.solid{border:1px solid var(--oxblood);background:var(--oxblood);color:var(--paper)}.btn.solid:hover{background:var(--oxblood-deep);border-color:var(--oxblood-deep)}.btn.ghost{border:1px solid var(--line);background:var(--paper);color:var(--ink)}.btn.ghost:hover{border-color:var(--ink-soft)}.add-form{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:20px;margin-bottom:22px}.add-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field.span-2{grid-column:span 2}.field label,.field-label{font-family:var(--font-mono);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft)}.field input,.field select{border:1px solid var(--line);border-radius:6px;background:#fff;padding:9px 12px;font-size:15px;color:var(--ink)}.swatches{display:flex;gap:8px;flex-wrap:wrap;padding-top:2px}.swatch{width:26px;height:26px;border:2px solid transparent;border-radius:50%;padding:0}.swatch.selected{border-color:var(--ink);box-shadow:0 0 0 2px var(--paper) inset}.add-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid-empty{padding:44px 0;text-align:center;font-style:italic;color:var(--ink-soft)}.card{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:16px 18px 18px;display:flex;flex-direction:column;transition:border-color .16s ease,box-shadow .16s ease}.card.selected{border-color:var(--oxblood);box-shadow:0 0 0 1px var(--oxblood)}.card-rule{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:12px}.card-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft)}.dot{width:10px;height:10px;border-radius:2px;display:inline-block}.remove{border:none;background:none;color:var(--ink-soft);font-size:13px;line-height:1;padding:4px 6px;border-radius:4px}.remove:hover{color:var(--oxblood)}.card-title{margin:0;font-family:var(--font-body);font-size:21px;font-weight:600;line-height:1.25}.card-author{margin:4px 0 0;font-style:italic;color:var(--ink-soft)}.card-zone{margin-top:14px}.progress-track{height:6px;border-radius:999px;background:var(--room-deep);overflow:hidden}.progress-fill{height:100%;border-radius:999px;transition:width .2s ease}.progress-row{display:flex;align-items:center;gap:12px;margin-top:10px}.progress-row input[type=range]{flex:1;accent-color:var(--oxblood);min-width:0}.progress-count{font-family:var(--font-mono);font-size:12px;color:var(--ink-soft);white-space:nowrap}.card-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.stars{display:flex;gap:2px}.star{border:none;background:none;font-size:20px;line-height:1;padding:2px;color:var(--line);transition:color .12s ease,transform .12s ease}.star:hover{transform:translateY(-1px)}.star.filled{color:var(--brass)}.finished-on{margin:8px 0 0;font-family:var(--font-mono);font-size:12px;color:var(--ink-soft)}.colophon{margin-top:44px;text-align:center;font-family:var(--font-mono);font-size:12px;color:var(--ink-soft)}@media (max-width: 900px){.grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.page{padding:28px 16px 48px}.grid,.add-grid{grid-template-columns:1fr}.field.span-2{grid-column:span 1}.toolbar-right{width:100%}.search{flex:1}}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.spine,.pile-book{animation:none}.spine,.pile-book,.btn,.star,.card,.progress-fill{transition:none}.spine:hover,.pile-book:hover,.star:hover{transform:none}.spine.leaning:hover{transform:rotate(-8deg)}}