@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Share+Tech+Mono&family=Inter:wght@300;400;500;600&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

:root{
  --bg:#1A1A14;--bg2:#22221a;--surface:rgba(255,255,255,.04);--surface2:rgba(0,0,0,.35);
  --border:rgba(255,255,255,.09);--border-acc:rgba(196,169,106,.28);
  --text:#F0EBE0;--text-muted:#7A7A60;--text-faint:#4a4a38;
  --accent:#C4A96A;--accent-dark:#9e8044;--btn:#2E4A1E;--btn-h:#3d6028;--btn-b:#4A6741;
  --success:#4a9e4a;--danger:#cc5555;--warn:#c49a30;
  --sidebar-w:280px;--r:10px;--r-sm:6px;--tr:.22s ease;
  --shadow:0 4px 24px rgba(0,0,0,.45);--shadow-sm:0 2px 8px rgba(0,0,0,.25);
  --grad-home:radial-gradient(ellipse at 60% 18%, #243318 0%, #1A1A14 68%);
}
[data-theme="light"]{
  --bg:#F2F0EC;--bg2:#E8E5DF;--surface:rgba(0,0,0,.04);--surface2:rgba(255,255,255,.82);
  --border:rgba(0,0,0,.1);--border-acc:rgba(0,0,0,.18);
  --text:#111111;--text-muted:#555550;--text-faint:#bcb7ad;
  --accent:#1a1a1a;--accent-dark:#333;--btn:#111;--btn-h:#333;--btn-b:#111;
  --success:#2a7a2a;--danger:#aa2222;--warn:#8a6a00;
  --shadow:0 4px 24px rgba(0,0,0,.12);--shadow-sm:0 2px 8px rgba(0,0,0,.08);
  --grad-home:radial-gradient(ellipse at 60% 18%, #ffffff 0%, #F2F0EC 68%);
}

body{min-height:100vh;background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;line-height:1.55;overflow:hidden}
body.modal-open{overflow:hidden}
a{color:inherit}
button,input{font:inherit}

#shell{display:flex;min-height:100vh;background:var(--grad-home)}
#sidebar{
  width:var(--sidebar-w);min-width:var(--sidebar-w);height:100vh;background:var(--bg2);
  border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;
  transition:transform var(--tr)
}
#sidebar.collapsed{transform:translateX(-100%);position:fixed;left:0;top:0;z-index:50}
.sidebar-header{padding:1rem;border-bottom:1px solid var(--border)}
.sidebar-kicker{font-family:'Rajdhani',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.sidebar-title{font-family:'Rajdhani',sans-serif;font-size:1.65rem;font-weight:700;margin-top:.2rem}
.sidebar-sub{font-size:.82rem;color:var(--text-muted);margin-top:.25rem}
.sidebar-search{padding:1rem;border-bottom:1px solid var(--border)}
.sidebar-search input{
  width:100%;background:var(--surface2);border:1px solid var(--border);color:var(--text);
  padding:.72rem .85rem;border-radius:var(--r-sm);outline:none
}
.sidebar-search input:focus{border-color:var(--accent)}
.sidebar-stats{display:flex;justify-content:space-between;font-family:'Share Tech Mono',monospace;font-size:.72rem;color:var(--text-muted);margin-top:.7rem}
.sidebar-list{flex:1;overflow-y:auto;padding:.5rem}
.sidebar-list::-webkit-scrollbar{width:4px}
.sidebar-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}
.topic-item{
  padding:.72rem .8rem;border:1px solid transparent;border-radius:var(--r-sm);cursor:pointer;
  margin-bottom:.35rem;background:transparent;transition:all var(--tr)
}
.topic-item:hover,.topic-item.active{background:var(--surface);border-color:var(--border-acc)}
.topic-item.hidden{display:none}
.topic-item .item-top{display:flex;justify-content:space-between;gap:.5rem;align-items:center}
.topic-item .item-num{font-family:'Share Tech Mono',monospace;font-size:.7rem;color:var(--text-muted)}
.topic-item .item-tag{font-size:.62rem;padding:.12rem .45rem;border-radius:999px;background:rgba(196,169,106,.12);color:var(--accent);text-transform:uppercase;letter-spacing:.08em}
.topic-item .item-title{margin-top:.35rem;font-size:.8rem;line-height:1.45;color:var(--text)}
.topic-item .item-meta{margin-top:.3rem;font-size:.68rem;color:var(--text-muted)}

#main{flex:1;display:flex;flex-direction:column;height:100vh;min-width:0}
#topbar{
  display:flex;align-items:center;gap:.75rem;padding:.85rem 1.1rem;border-bottom:1px solid var(--border);
  background:var(--bg2);flex-shrink:0
}
#hamburger,#theme-toggle,.ghost-link{
  background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--tr)
}
#hamburger{width:36px;height:36px}
#theme-toggle{padding:.4rem .65rem;font-size:1rem}
.ghost-link{padding:.4rem .75rem;text-decoration:none}
#hamburger:hover,#theme-toggle:hover,.ghost-link:hover{border-color:var(--accent)}
.top-meta{display:flex;gap:1rem;flex:1;align-items:center}
.meta-block{display:flex;flex-direction:column}
.meta-label{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);font-family:'Rajdhani',sans-serif}
.meta-value{font-family:'Share Tech Mono',monospace;color:var(--accent);font-size:.92rem}

#cards-container{flex:1;overflow-y:auto;scroll-snap-type:y mandatory}
#cards-container::-webkit-scrollbar{width:0}
.topic-card{
  min-height:100%;scroll-snap-align:start;scroll-snap-stop:always;padding:1.5rem 1.25rem 1.25rem;
  border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:1rem
}
@media(min-width:1024px){.topic-card{padding:2rem 3rem 1.5rem}}
.card-kicker{font-family:'Share Tech Mono',monospace;font-size:.74rem;letter-spacing:.1em;color:var(--accent)}
.card-title{font-family:'Rajdhani',sans-serif;font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.15}
.card-preview{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:1rem 1.1rem;box-shadow:var(--shadow-sm)
}
.status-row{display:flex;gap:.55rem;flex-wrap:wrap;align-items:center;margin-bottom:.7rem}
.status-badge,.tag-chip{
  font-size:.68rem;padding:.22rem .55rem;border-radius:999px;letter-spacing:.08em;text-transform:uppercase
}
.status-badge.ungrounded{background:rgba(150,150,150,.14);color:var(--text-muted)}
.status-badge.ready,.status-badge.generated,.status-badge.refreshed{background:rgba(74,158,74,.14);color:var(--success)}
.status-badge.loading{background:rgba(196,154,48,.14);color:var(--warn)}
.status-badge.failed{background:rgba(204,85,85,.14);color:var(--danger)}
.tag-chip{background:rgba(196,169,106,.12);color:var(--accent)}
.preview-text{color:var(--text-muted);font-size:.95rem}
.lead-grid{display:grid;grid-template-columns:1fr;gap:.65rem;margin-top:.9rem}
.lead-pill{padding:.75rem .85rem;border-radius:var(--r-sm);background:var(--surface2);border:1px solid var(--border)}
.lead-pill strong{display:block;font-family:'Rajdhani',sans-serif;color:var(--accent);letter-spacing:.06em}
.card-actions{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:.9rem}
.action-btn{
  background:var(--btn);border:1px solid var(--btn-b);color:#fff;padding:.65rem 1rem;border-radius:var(--r-sm);
  text-transform:uppercase;letter-spacing:.08em;font-family:'Rajdhani',sans-serif;font-weight:700;cursor:pointer
}
.action-btn.secondary{background:transparent;color:var(--text);border-color:var(--border)}
.action-btn:hover{background:var(--btn-h)}
.action-btn.secondary:hover{border-color:var(--accent);background:var(--surface)}

.detail-section{margin-bottom:1rem}
.detail-section:last-child{margin-bottom:0}
.detail-label{font-family:'Rajdhani',sans-serif;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}
.detail-body{font-size:.96rem;color:var(--text);line-height:1.65}
.brief-article-title{
  font-family:'Rajdhani',sans-serif;
  font-size:clamp(1.2rem,2vw,1.75rem);
  line-height:1.15;
  font-weight:700;
  margin:0 0 .95rem;
  max-width:34ch
}
.section-gap{margin-top:.7rem}
.spaced-list{margin-top:.6rem}
.detail-list{list-style:none;display:flex;flex-direction:column;gap:.55rem}
.detail-list li{padding-left:1rem;position:relative}
.detail-list li::before{content:"•";position:absolute;left:0;color:var(--accent)}
.lead-section{padding:.9rem;border:1px solid var(--border);border-radius:var(--r-sm);margin-bottom:.9rem;background:var(--surface)}
.lead-section h3{font-family:'Rajdhani',sans-serif;font-size:1.15rem;margin-bottom:.55rem}
.source-list{list-style:none;display:flex;flex-direction:column;gap:.65rem}
.source-list a{text-decoration:none;color:var(--text)}
.source-list a:hover{color:var(--accent)}
.source-domain{display:block;font-family:'Share Tech Mono',monospace;font-size:.7rem;color:var(--text-muted);margin-top:.18rem}
.related-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.85rem}
.related-chip{
  background:transparent;border:1px solid var(--border);color:var(--text-muted);padding:.35rem .7rem;border-radius:999px;cursor:pointer
}
.related-chip:hover{border-color:var(--accent);color:var(--accent)}
.empty-state{padding:1.5rem;color:var(--text-muted);text-align:center}

.brief-modal{
  position:fixed;inset:0;display:none;align-items:stretch;justify-content:center;z-index:200;
  background:rgba(8,8,6,.72);backdrop-filter:blur(10px)
}
.brief-modal.visible{display:flex}
.brief-modal-shell{
  width:100vw;height:100vh;background:linear-gradient(180deg,var(--bg2) 0%, var(--bg) 100%);
  display:flex;flex-direction:column
}
.brief-modal-topbar{
  display:flex;justify-content:flex-end;align-items:center;gap:.55rem;padding:.7rem .9rem;border-bottom:1px solid var(--border)
}
.brief-modal-actions{display:flex;gap:.7rem;align-items:center}
.brief-modal-btn{
  width:38px;height:38px;background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:999px;
  cursor:pointer;transition:all var(--tr);display:flex;align-items:center;justify-content:center;font-size:1rem;line-height:1
}
.brief-modal-btn:hover{border-color:var(--accent);transform:translateY(-1px)}
.brief-close-btn{background:var(--surface2);color:var(--text)}
.brief-modal-body{
  flex:1;overflow:auto;padding:.95rem 1rem 1.5rem;max-width:860px;width:100%;margin:0 auto
}
.brief-modal-body::-webkit-scrollbar{width:7px}
.brief-modal-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:8px}

.sidebar-filters {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding: 0.5rem 0;
  margin-top: 0.5rem;
  scrollbar-width: none;
}
.sidebar-filters::-webkit-scrollbar {
  display: none;
}
.filter-chip {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 0.3rem 0.6rem;
  font-size: 0.75rem;
  color: var(--text-muted);
  cursor: pointer;
  white-space: nowrap;
  transition: all var(--tr);
}
.filter-chip:hover {
  border-color: var(--text-muted);
  color: var(--text);
}
.filter-chip.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

@media(min-width:1024px){
  .brief-modal-topbar{padding:.75rem 1.2rem}
  .brief-modal-body{padding:1rem 1.2rem 1.9rem}
}

@media(max-width:768px){
  #sidebar{position:fixed;z-index:60}
  #shell{display:block}
  #main{height:100vh}
  .top-meta{gap:.5rem}
  .meta-block:last-child{display:none}
  .brief-modal-topbar{padding:.6rem .7rem}
  .brief-modal-actions{gap:.45rem}
  .brief-modal-btn{width:36px;height:36px;font-size:.95rem}
  .brief-modal-body{padding:.8rem .85rem 1.25rem}
  .brief-article-title{font-size:1.15rem;margin-bottom:.8rem}
}