/* Sprint 24: Product-wide visual browsing system */
:root{
  --surface:#ffffff;
  --surface-soft:#f7f7fb;
  --surface-tint:#f2f0fb;
  --ink:#222331;
  --muted:#777b8d;
  --line:rgba(72,65,104,.12);
  --shadow:0 18px 50px rgba(51,45,82,.10);
  --shadow-soft:0 8px 24px rgba(51,45,82,.08);
  --violet:#6d5bd0;
  --violet-deep:#4e4588;
  --coral:#e8756f;
  --amber:#e7aa3b;
  --blue:#4f83d1;
}

/* Every route becomes a visual canvas rather than a report */
main{background:
  radial-gradient(circle at 84% 4%,rgba(109,91,208,.08),transparent 28rem),
  radial-gradient(circle at 14% 30%,rgba(79,131,209,.055),transparent 26rem),
  #fafafe;}
.view{padding-bottom:5rem;}
.view>.list-header,.view>header{margin-bottom:1.5rem;}
.list-header{align-items:flex-end;gap:1rem;}
.list-header h2{font-size:clamp(2rem,4vw,3.6rem);line-height:.96;letter-spacing:-.045em;max-width:14ch;}
.list-header .filters{margin-left:auto;}

/* Softer, more magazine-like controls */
.filters,.newsos-toolbar,.import-actions,.capture-actions,.modal-actions,.connector-actions{
  background:rgba(255,255,255,.78);backdrop-filter:blur(18px);border:1px solid var(--line);
  border-radius:20px;padding:.55rem;box-shadow:var(--shadow-soft);
}
.filters input,.filters select,.newsos-toolbar input,.newsos-toolbar select{
  border:0!important;background:transparent!important;box-shadow:none!important;min-height:2.75rem;
}
button,.primary,.secondary,.file-button{border-radius:999px!important;}
.primary{background:linear-gradient(135deg,var(--violet),var(--violet-deep))!important;box-shadow:0 8px 20px rgba(88,74,159,.22)!important;}
.secondary{background:#fff!important;border:1px solid var(--line)!important;}

/* Shared content cards */
.card,.executive-card,.object-card,.route-card,.timeline-item,.relationship-row,.evidence-item,.state-item,.session-row,.open-loop,.import-row{
  border:1px solid var(--line)!important;border-radius:24px!important;background:rgba(255,255,255,.92)!important;
  box-shadow:var(--shadow-soft)!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.card:hover,.object-card:hover,.route-card:hover,.timeline-item:hover,.open-loop:hover{
  transform:translateY(-2px);box-shadow:var(--shadow)!important;border-color:rgba(109,91,208,.22)!important;
}

/* Library: cover-like tiles instead of database rows */
.objects-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))!important;gap:1rem!important;}
.object-card{min-height:220px!important;padding:1.3rem!important;position:relative;overflow:hidden;display:flex!important;flex-direction:column!important;cursor:pointer;}
.object-card:before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:linear-gradient(90deg,var(--violet),var(--blue));}
.object-card h2{font-size:1.25rem;line-height:1.12;margin:.9rem 0 .65rem;}
.object-card .preview{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;}
.object-card footer{margin-top:auto;padding-top:1rem;border-top:1px solid var(--line);}
.object-list,.recent-objects{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.8rem;}
.object-row{border:1px solid var(--line);border-radius:18px;padding:1rem;background:#fff;box-shadow:var(--shadow-soft);}

/* Arena library becomes visual shelves */
.arena-grid,.arena-browser-grid{gap:1rem!important;}
.arena-card{min-height:150px;border-radius:24px!important;padding:1.25rem!important;box-shadow:var(--shadow-soft)!important;overflow:hidden;position:relative;}
.arena-card:after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-35px;bottom:-55px;background:currentColor;opacity:.07;}
.arena-card strong{font-size:1.05rem;line-height:1.2;}
.knowledge-hub{border:0!important;background:linear-gradient(135deg,#fff,#f2f0fb)!important;box-shadow:var(--shadow)!important;border-radius:28px!important;}
.knowledge-results{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;}

/* Timeline reads like a memory stream */
.timeline{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem!important;}
.timeline-item{padding:1.2rem!important;display:grid!important;grid-template-columns:auto 1fr!important;gap:1rem!important;min-height:150px;}
.timeline-item time{grid-column:2;display:flex!important;gap:.5rem;align-items:center;margin-top:auto;}
.timeline-rail{width:44px;height:44px;border-radius:15px;background:var(--surface-tint);display:grid;place-items:center;}
.timeline-content strong{font-size:1.05rem;line-height:1.3;}
.timeline-item:before,.timeline-item:after{display:none!important;}

/* Focus sessions as large action cards */
.sessions-list{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:1rem!important;}
.session-row,.session-card{padding:1.35rem!important;min-height:180px;}
.session-row h2,.session-card h2{font-size:1.35rem;}

/* Open loops and priorities become a board */
.open-loops,.priority-list,.intelligence-feed{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem!important;}
.open-loop,.priority-item,.intelligence-item{border:1px solid var(--line)!important;border-radius:22px!important;background:#fff!important;box-shadow:var(--shadow-soft)!important;padding:1.15rem!important;min-height:130px;}
.priority-item{display:grid!important;grid-template-columns:auto 1fr!important;align-items:start!important;text-align:left!important;}
.priority-score,.signal-score{display:none!important;}
.priority-rank{width:38px;height:38px;border-radius:13px;background:var(--surface-tint);display:grid;place-items:center;font-weight:800;color:var(--violet-deep);}
.open-loop-main{align-items:flex-start!important;text-align:left;}

/* Routing is a visual approval board */
.routing-list{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem!important;}
.route-card{padding:1.35rem!important;display:flex!important;flex-direction:column!important;min-height:230px;}
.route-actions{margin-top:auto!important;padding-top:1rem!important;border-top:1px solid var(--line);}
.routing-counts{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;}
.routing-count{border-radius:22px!important;background:linear-gradient(145deg,#fff,var(--surface-tint))!important;box-shadow:var(--shadow-soft);padding:1.2rem!important;}
.routing-count strong{font-size:2rem;}

/* System/backup becomes task cards */
#data{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;}
#data>.list-header,#data>.import-card{grid-column:1/-1;}
.data-card{display:flex!important;flex-direction:column!important;align-items:flex-start!important;min-height:220px;padding:1.5rem!important;background:linear-gradient(150deg,#fff,#f7f5ff)!important;}
.data-card button,.data-card .file-button{margin-top:auto;}
.import-card{padding:1.5rem!important;}
.import-fields,.indexer-grid,.evidence-composer,.state-composer{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;gap:1rem!important;}
.import-history{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;}

/* Modal knowledge graph sections become distinct visual zones */
.modal{border-radius:30px!important;padding:1.5rem!important;}
.relationship-panel,.evidence-panel,.states-panel{border:0!important;border-radius:24px!important;padding:1.25rem!important;background:var(--surface-soft)!important;margin-top:1rem;}
.relationship-list,.evidence-list,.states-list{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem;}

/* Dashboard uses editorial blocks */
.dashboard-grid{grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:1rem!important;}
.dashboard-grid>*{grid-column:span 6;}
.dashboard-grid>*.full,.dashboard-grid>.timeline-card{grid-column:1/-1;}
.executive-grid{display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:1rem!important;}
.executive-grid>.feature-card{grid-column:span 4;}
.executive-grid>.metric-card{grid-column:span 2;}
.executive-card{min-height:150px;padding:1.15rem!important;}
.quick-capture-card{background:linear-gradient(135deg,#fff,#f3f0ff)!important;}

/* Tables are visually converted into cards when they remain */
table{display:block;width:100%;border:0!important;}
thead{display:none!important;}
tbody{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;}
tr{display:block;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow-soft);padding:1rem;}
td{display:flex!important;justify-content:space-between;gap:1rem;border:0!important;padding:.4rem 0!important;}
td:before{content:attr(data-label);font-weight:700;color:var(--muted);}

/* Mobile keeps horizontal browsing instead of crushing everything into rows */
@media(max-width:980px){
  #data{grid-template-columns:1fr;}
  #data>*{grid-column:1!important;}
  .dashboard-grid>*{grid-column:1/-1;}
  .executive-grid>.feature-card{grid-column:1/-1;}
  .executive-grid>.metric-card{grid-column:span 6;}
  .timeline,.routing-list,.objects-grid,.sessions-list{grid-template-columns:1fr!important;}
}
@media(max-width:640px){
  .list-header{align-items:flex-start;}
  .list-header .filters{width:100%;margin-left:0;overflow-x:auto;display:flex;flex-wrap:nowrap;}
  .executive-grid>.metric-card{grid-column:1/-1;}
  .open-loops,.priority-list,.intelligence-feed{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.5rem;}
  .open-loop,.priority-item,.intelligence-item{min-width:82vw;scroll-snap-align:start;}
  .routing-counts{grid-template-columns:1fr;}
}