:root{color-scheme:dark;--bg:#111827;--panel:#1f2937;--text:#f9fafb;--muted:#9ca3af;--border:#374151;--accent:#818cf8;--primary:#4f46e5} :root[data-theme=light]{color-scheme:light;--bg:#f3f4f6;--panel:#fff;--text:#111827;--muted:#596579;--border:#d1d5db;--accent:#4f46e5;--primary:#4f46e5}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,sans-serif}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:9px;padding:10px 14px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}a{color:var(--accent);text-decoration:none}header{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px max(18px,calc((100vw - 1320px)/2))}header nav{display:flex;gap:18px}header nav a{color:var(--muted)}.brand{font-size:19px;font-weight:800;white-space:nowrap;color:var(--text)}.brand:first-letter{color:var(--accent)}main{max-width:1320px;margin:auto;padding:20px}h1,h2,h3,p{margin:0 0 10px}h1{font-size:clamp(28px,5vw,52px);line-height:1.08}h2{font-size:23px}small,.eyebrow{color:var(--accent);font-weight:800;letter-spacing:.11em}.hero{position:relative;overflow:hidden;border-radius:18px;min-height:350px;display:flex;align-items:end;background:#24264b;color:white;padding:32px;background-position:center;background-size:cover}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#111827f5,#11182799 55%,#11182722),linear-gradient(0deg,#111827c9,transparent)}.hero-inner{position:relative;max-width:620px}.hero p{color:#e5e7eb}.hero-controls{display:flex;gap:8px;margin-top:20px}.hero-controls button{background:#111827c9;color:white;border-color:#ffffff55}.primary{background:var(--primary)!important;color:white!important;border:0;font-weight:700}.panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:20px;margin:28px 0}.sectionhead{display:flex;justify-content:space-between;align-items:center;margin:20px 0 12px}.sectionhead span,.meta{color:var(--muted);font-size:13px}.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin-bottom:18px}.filters label{display:flex;flex:1 1 120px;flex-direction:column;gap:5px;font-size:13px;color:var(--muted)}input,select{min-width:0;width:100%;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:11px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:14px}.shelf{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(155px,190px);gap:14px;overflow:auto;padding:2px 2px 12px;scroll-snap-type:x mandatory}.card{position:relative;background:var(--panel);border:1px solid var(--border);border-radius:12px;overflow:hidden;scroll-snap-align:start}.card-open{border:0;padding:0;border-radius:0;background:transparent;width:100%;text-align:left;display:block}.art{height:175px;width:100%;object-fit:cover;background:#30345b;display:block}.cardtext{padding:12px;min-height:84px}.cardtext strong{display:block;line-height:1.25;margin-bottom:6px}.fav{position:absolute;right:7px;top:7px;background:#111827d9;color:white;border:0;padding:7px 10px;font-size:19px}.fav[aria-pressed=true]{color:#fbbf24}dialog{width:min(850px,96vw);max-height:90dvh;border:1px solid var(--border);border-radius:16px;background:var(--bg);color:var(--text);padding:0;overflow:auto}dialog::backdrop{background:#000b}#close{position:sticky;top:10px;float:right;margin:10px;z-index:2}.detailhero{min-height:260px;background-size:cover;background-position:center;display:flex;align-items:end;padding:24px;position:relative;color:white}.detailhero:before{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#111827f5,#11182733)}.detailhero>div{position:relative}.detailbody{padding:24px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.tabs button[aria-selected=true]{background:var(--primary);color:white}.detailbody li{margin:8px 0}.notice{color:var(--muted);font-size:13px}footer{text-align:center;color:var(--muted);padding:40px 12px}#discover,#library,#night{scroll-margin-top:90px}@media(max-width:600px){header{padding:10px 12px;flex-wrap:wrap;gap:8px}header nav{order:3;width:100%;justify-content:space-around;font-size:13px}.brand{font-size:17px}main{padding:12px}.hero{min-height:320px;padding:20px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.shelf{grid-auto-columns:145px}.art{height:145px}.panel{padding:14px}.detailbody{padding:16px}.filters label{flex-basis:100px}.cardtext{padding:9px}}
