:root{--ink:#0b0d12;--shelf:#151923;--paper:#f3f0ea;--mint:#b39aff;--amber:#f1b35b;--slate:#9aa3b2;--line:#2b3040;--surface:#11141c}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;background:var(--ink);color:var(--paper);font:16px/1.5 "IBM Plex Sans","Segoe UI Variable","Segoe UI",sans-serif;padding-bottom:100px;overflow-x:hidden}
header{padding:42px max(5vw,28px);border-bottom:1px solid #24465e;text-align:center}
header p,small{color:var(--mint);letter-spacing:.12em;font-size:.72rem}
h1,h2,h3,h4{font-family:"Manrope","IBM Plex Sans","Segoe UI Variable","Segoe UI",sans-serif}
h1{font-size:clamp(2rem,5vw,4.8rem);margin:.1em 0;text-wrap:balance;letter-spacing:-.035em}
input{width:min(650px,100%);padding:14px;background:var(--surface);border:1px solid var(--line);color:var(--paper);border-radius:8px}
main{display:block;padding:28px max(5vw,28px)}
#cards{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:14px}
.search-row{display:flex;align-items:center;gap:18px;max-width:900px;margin:0 auto}
.search-row input{flex:1}
#count{color:var(--slate);white-space:nowrap;font-variant-numeric:tabular-nums}
.categories{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;max-width:1100px;margin:18px auto 0}
.category-chip{border:1px solid var(--line);background:var(--surface);color:var(--paper);padding:7px 11px;border-radius:999px;cursor:pointer}
.category-chip:hover,.category-chip:focus-visible,.category-chip.active{border-color:var(--mint);background:#242038;color:var(--mint)}
.card{background:var(--shelf);padding:20px;border-top:3px solid var(--mint);min-height:210px;height:286px;border-radius:10px;content-visibility:auto;box-shadow:0 12px 32px #0004;display:flex;flex-direction:column;overflow:hidden}
.card.review{border-top-color:var(--amber)}
.card h2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.9em;padding-bottom:.18em}
.card-notes{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;max-height:7.2em;color:#c2d0d7;flex:1}
.card-notes p{margin:.25em 0}
.load-error{max-width:620px;margin:24px auto;padding:18px;border:1px solid var(--amber);color:var(--paper);text-align:center}
h2{font-size:1.2rem;margin:.55em 0;text-wrap:balance}
a{color:var(--paper)}
.actions,.drawer-actions{display:flex;gap:10px;align-items:center;margin:18px 0;flex-wrap:wrap}
.actions button,.drawer-actions button{border:1px solid var(--mint);background:transparent;color:var(--paper);padding:8px 10px;border-radius:6px;cursor:pointer}
footer{display:flex;justify-content:space-between;color:var(--slate);font-size:.82rem;gap:10px;margin-top:auto} footer span{max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} footer span:first-child{color:var(--amber)}
.dock{position:fixed;z-index:5;bottom:12px;left:50%;transform:translateX(-50%);display:flex;align-items:flex-end;gap:10px;padding:8px;border:1px solid #324452;border-radius:18px;background:#10202bcf;backdrop-filter:blur(12px);box-shadow:0 10px 30px #0008;touch-action:manipulation}
.dock-item{position:relative;display:grid;place-items:center;gap:2px;min-width:82px;height:58px;border:1px solid #3a4e5a;border-radius:12px;background:#0e1b25;color:var(--paper);cursor:pointer;transition:transform .18s ease,background .18s ease}
.dock-item svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.dock-item.active{background:#242038;border-color:var(--mint);color:var(--mint)}
.dock-glyph{font-size:1.1rem;line-height:1;color:var(--mint)}
.dock-item:hover,.dock-item:focus{transform:translateY(-8px) scale(1.12);background:#23485a}
.dock-item:focus-visible,.drawer-close:focus-visible,.actions button:focus-visible,.drawer-actions button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.dock-item.active{border-color:var(--mint);color:var(--mint)}
.dock-item small{display:block;color:var(--paper);font-size:.7rem;line-height:1.1;letter-spacing:0;white-space:nowrap}
.drawer{position:fixed;z-index:10;top:0;right:0;width:min(820px,100vw);height:100vh;padding:34px 28px;background:#11141cf5;border-left:1px solid var(--line);transform:translateX(100%);transition:transform .25s ease;overflow:auto;overscroll-behavior:contain;backdrop-filter:blur(14px)}
.drawer.open{transform:translateX(0)}
.drawer-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}.drawer-content>small,.drawer-content>h2,.drawer-content>p,.drawer-content>.drawer-actions{grid-column:1/-1}.drawer-content>.drawer-section:last-child{grid-column:2}.drawer-content>.drawer-section:has(.carousel-assets){grid-column:1/-1}
.drawer-close{position:absolute;right:18px;top:14px;border:0;background:transparent;color:var(--paper);font-size:2rem;cursor:pointer}
.drawer h2{font-size:1.7rem;margin-top:10px}
.transcript-search{display:grid;gap:8px;color:var(--slate);font-size:.85rem}
.transcript-search input{width:100%}
.draft-section{border:1px solid #8b6cf6;border-radius:12px;padding:14px;background:#171326}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.draft-badge{color:#d9c9ff;border:1px solid #8b6cf6;border-radius:999px;padding:3px 8px;font-size:.75rem}
.draft-transcript{max-height:360px;overflow:auto}
.transcript{white-space:pre-wrap;overflow-wrap:anywhere;font:16px/1.65 "IBM Plex Sans","Segoe UI Variable","Segoe UI",sans-serif;color:var(--paper);margin-top:18px}
.transcript mark{background:var(--amber);color:var(--ink);border-radius:2px;padding:0 2px}
.drawer-section{border-top:1px solid #31546a;margin-top:24px;padding-top:18px}
.drawer-section h3{margin:0 0 10px;color:var(--mint);font-size:1rem}
.carousel-assets{display:grid;gap:18px}
.carousel-slide{margin:0}
.carousel-slide img{display:block;width:100%;height:auto;max-height:360px;object-fit:contain;background:#0b1620;border-radius:8px}
.carousel-slide figcaption{margin-top:8px;color:var(--slate);font-size:1rem}
.source-label{color:var(--slate);font-size:.85rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.card .details{border-color:#86b8ca}.card .details:hover,.drawer-actions button:hover,.actions button:hover{background:#23485a}
@media(max-width:700px){.search-row{align-items:stretch;flex-direction:column}.search-row input{width:100%}.dock{max-width:calc(100vw - 24px);overflow-x:auto}.dock-item{min-width:76px;height:54px}.drawer{width:100%;padding:60px 20px 120px}.drawer-content{display:block}.drawer-content>.drawer-section:last-child{margin-top:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.dock-item:hover,.dock-item:focus{transform:none}}
