:root{--paper: #f7f1e6;--paper-2: #efe6d4;--ink: #241c15;--ink-soft: #5b4f41;--accent: #8a5a2b;--accent-2: #b5793f;--line: #e0d4bd;--ok: #3f6f4a;--serif: "Iowan Old Style", "Palatino Linotype", "Georgia", "Times New Roman", serif;--sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}.app{min-height:100dvh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--paper) 85%,white);position:sticky;top:0;z-index:10;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.brand{font-family:var(--serif);font-size:1.3rem;font-weight:700;letter-spacing:.02em;color:var(--ink);text-decoration:none}nav{display:flex;align-items:center;gap:.75rem}.badge{font-size:.75rem;padding:.2rem .6rem;border-radius:999px;background:var(--paper-2);color:var(--ink-soft);border:1px solid var(--line)}.badge--pro{background:color-mix(in srgb,var(--ok) 18%,var(--paper));color:var(--ok)}main{flex:1}button,.btn{font-family:var(--sans);font-size:.95rem;cursor:pointer;border:none;border-radius:10px;padding:.7rem 1.1rem;background:var(--accent);color:#fff;transition:background .15s}button:hover,.btn:hover{background:var(--accent-2)}button:disabled{opacity:.5;cursor:default}.btn--ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}.link{background:none;color:var(--ink-soft);padding:.3rem;font-size:.85rem}.link:hover{background:none;color:var(--accent)}input,select{font-family:var(--sans);font-size:1rem;padding:.7rem .9rem;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}.container{max-width:1040px;margin:0 auto;padding:1.5rem 1.25rem 4rem}.hero{text-align:center;padding:2rem 1rem 1rem}.hero h1{font-family:var(--serif);font-size:clamp(1.8rem,5vw,2.6rem);margin:.3rem 0}.hero p{color:var(--ink-soft);max-width:36rem;margin:.4rem auto}.filters{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin:1.25rem 0}.chip{font-size:.85rem;padding:.45rem .85rem;border-radius:999px;background:var(--paper-2);color:var(--ink-soft);border:1px solid var(--line);cursor:pointer}.chip--on{background:var(--accent);color:#fff;border-color:var(--accent)}.grid{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.card{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:transform .12s,box-shadow .12s}.card:hover{transform:translateY(-3px);box-shadow:0 8px 22px #3c28141f}.card .cover{aspect-ratio:2 / 3;background:var(--paper-2) center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:var(--ink-soft)}.card .cover span{font-family:var(--serif);font-size:.9rem;padding:.5rem;text-align:center}.card .meta{padding:.6rem .7rem}.card .title{font-family:var(--serif);font-weight:600;font-size:.98rem;line-height:1.2}.card .author{color:var(--ink-soft);font-size:.82rem;margin-top:.2rem}.panel{max-width:28rem;margin:2rem auto;background:#fff;border:1px solid var(--line);border-radius:16px;padding:1.75rem;text-align:center}.panel h2{font-family:var(--serif);margin-top:0}.stack{display:flex;flex-direction:column;gap:.75rem}.muted{color:var(--ink-soft);font-size:.9rem}.devlink{font-size:.78rem;word-break:break-all;background:var(--paper-2);padding:.6rem;border-radius:8px}