:root{color:#18201c;font-synthesis:none;letter-spacing:0;background:#f6f2ea;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}.app-shell{grid-template-columns:260px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{background:#faf8f2;border-right:1px solid #ddd7cc;padding:28px 22px}.brand{align-items:center;gap:14px;display:flex}.brand-mark{width:54px;height:54px}.brand-kicker{color:#7a4b35;text-transform:uppercase;margin:0;font-size:.8rem;font-weight:700}h1,h2,h3,p{margin:0}h1{font-size:1.55rem}.stat{background:#fff;border:1px solid #ddd7cc;border-radius:8px;margin-top:32px;padding:16px}.stat span{color:#245642;font-size:2rem;font-weight:800;display:block}.stat p{color:#6b655d}.content{padding:30px;overflow:hidden}.toolbar,.filters,.spell-card-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.toolbar h2{font-size:clamp(1.6rem,2vw,2.2rem)}.toolbar p,.spell-card-header p,.empty{color:#6b655d}.refresh-button{color:#245642;cursor:pointer;background:#fff;border:1px solid #d1c9bc;border-radius:8px;min-width:86px;min-height:38px;font-weight:700}.refresh-button:disabled{cursor:default;opacity:.55}.filters{justify-content:flex-start;margin:22px 0}.filters input{color:#18201c;background:#fff;border:1px solid #d1c9bc;border-radius:8px;width:min(360px,100%);min-height:38px;padding:0 12px}.error{color:#9c2d1f;margin-bottom:16px}.spell-list{gap:12px;max-height:calc(100vh - 150px);padding-right:6px;display:grid;overflow:auto}.spell-card{background:#fff;border:1px solid #ddd7cc;border-radius:8px;padding:18px}.spell-card.is-selected{border-color:#4f9cff;box-shadow:0 0 0 3px #4f9cff29}.spell-card h3{font-size:1.05rem}.spell-card-header span{color:#245642;text-overflow:ellipsis;white-space:nowrap;border:1px solid #d4e3d8;border-radius:999px;max-width:220px;padding:4px 10px;font-size:.8rem;font-weight:700;overflow:hidden}.star-count{color:#245642;align-items:center;gap:5px;margin-top:12px;font-size:.9rem;font-weight:700;display:inline-flex}.tags{flex-wrap:wrap;gap:6px;margin-top:14px;display:flex}.tags span{color:#7a4b35;background:#f1e7db;border-radius:999px;padding:4px 9px;font-size:.78rem;font-weight:700}.empty{text-align:center;padding:42px 0}@media (width<=760px){.app-shell{grid-template-columns:1fr}.sidebar{border-bottom:1px solid #ddd7cc;border-right:0}.content{padding:22px}.toolbar,.filters{flex-direction:column;align-items:stretch}.spell-list{max-height:none}}