:root{
  color-scheme:dark;
  --bg:#0b0d12;
  --bg-elev:#0e1118;
  --panel:#11151d;
  --panel-2:#161b25;
  --line:#252b37;
  --line-strong:#343b4a;
  --text:#f3f5f7;
  --muted:#9aa3b2;
  --soft:#6f7888;
  --accent:#8d7cff;
  --accent-2:#6e5cf1;
  --accent-soft:rgba(141,124,255,.12);
  --good:#64d8a1;
  --warn:#f0b86b;
  --danger:#ff7c8a;
  --shadow:0 28px 80px rgba(0,0,0,.28);
  --glass:rgba(11,13,18,.82);
}
html[data-theme="light"]{
  color-scheme:light;
  --bg:#f6f7fa;
  --bg-elev:#ffffff;
  --panel:#ffffff;
  --panel-2:#f1f3f7;
  --line:#dde2ea;
  --line-strong:#ccd3df;
  --text:#151820;
  --muted:#667085;
  --soft:#8892a3;
  --accent:#7564ed;
  --accent-2:#604ed8;
  --accent-soft:rgba(117,100,237,.10);
  --good:#268a63;
  --warn:#a86d19;
  --danger:#c94255;
  --shadow:0 24px 65px rgba(39,47,67,.12);
  --glass:rgba(246,247,250,.88);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:14px/1.5 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  transition:background .2s,color .2s;
}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
button:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{
  outline:3px solid rgba(141,124,255,.34);
  outline-offset:2px;
}
[hidden]{display:none!important}
.site-shell{min-height:100vh}
.global-header{
  position:sticky;
  top:0;
  z-index:90;
  min-height:72px;
  padding:10px clamp(16px,4vw,56px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-bottom:1px solid var(--line);
  background:var(--glass);
  backdrop-filter:blur(16px);
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  color:inherit;
  text-decoration:none;
  min-width:max-content;
}
.brand img{width:36px;height:36px}
.brand div{display:grid}
.brand strong{
  font-family:Montserrat,sans-serif;
  font-weight:500;
  letter-spacing:.18em;
  font-size:14px;
}
.brand span{font-size:10px;color:var(--muted);letter-spacing:.1em}
.global-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.segmented{
  display:flex;
  gap:3px;
  padding:3px;
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:999px;
}
.segmented button{
  border:0;
  background:transparent;
  color:var(--muted);
  border-radius:999px;
  padding:7px 10px;
  font-size:11px;
  min-width:34px;
}
.segmented button.active{background:var(--accent);color:#fff}
.header-action{
  border:1px solid var(--line);
  background:var(--panel);
  color:var(--text);
  border-radius:999px;
  padding:9px 12px;
  font-size:11px;
}
.header-action:hover{border-color:var(--accent)}
.intro{
  min-height:calc(100vh - 72px);
  padding:clamp(76px,9vw,128px) clamp(20px,6vw,90px);
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(360px,.75fr);
  gap:68px;
  align-items:center;
  background:radial-gradient(circle at 14% 18%,var(--accent-soft),transparent 28rem);
}
.eyebrow{
  font-size:10px;
  letter-spacing:.16em;
  font-weight:700;
  color:var(--accent);
  text-transform:uppercase;
}
.intro h1,.experience-head h2,.concept h2{
  font-family:Montserrat,sans-serif;
  font-weight:400;
  letter-spacing:-.035em;
  line-height:1.04;
}
.intro h1{
  font-size:clamp(48px,6.4vw,88px);
  max-width:980px;
  margin:18px 0 24px;
}
.intro-copy>p{
  max-width:780px;
  font-size:18px;
  line-height:1.7;
  color:var(--muted);
}
.intro-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.primary,.secondary,.ghost{
  border-radius:11px;
  padding:12px 16px;
  border:1px solid var(--line);
  transition:.18s;
}
.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700}
.primary:hover{background:var(--accent-2);transform:translateY(-1px)}
.secondary{background:var(--panel);color:var(--text)}
.secondary:hover,.ghost:hover{border-color:var(--line-strong)}
.ghost{background:transparent;color:var(--muted)}
.small{padding:9px 12px;font-size:12px}
.intro-meta{display:flex;gap:16px;flex-wrap:wrap;margin-top:26px;color:var(--soft);font-size:10px;letter-spacing:.1em}
.intro-principles{display:grid;gap:10px}
.intro-principles article{
  padding:20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--panel);
  display:grid;
  grid-template-columns:36px 1fr;
  gap:2px 10px;
  box-shadow:0 8px 30px rgba(0,0,0,.04);
}
.intro-principles b{grid-row:1/3;color:var(--accent);font-size:11px}
.intro-principles strong{font-size:14px}
.intro-principles span{font-size:11px;color:var(--muted)}
.experience{padding:110px clamp(16px,4vw,56px)}
.experience-head{
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:flex-end;
  max-width:1500px;
  margin:0 auto 28px;
}
.experience-head h2{font-size:clamp(34px,4vw,56px);margin:10px 0 0;max-width:900px}
.experience-status{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--good)}
.os-shell{
  position:relative;
  max-width:1500px;
  min-height:780px;
  margin:0 auto;
  display:grid;
  grid-template-columns:245px minmax(0,1fr);
  border:1px solid var(--line);
  background:var(--bg-elev);
  border-radius:24px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.os-sidebar{
  padding:22px 16px;
  border-right:1px solid var(--line);
  background:var(--panel);
  display:flex;
  flex-direction:column;
  gap:14px;
}
.tenant-brand{display:flex;align-items:center;gap:11px}
.tenant-mark{
  width:40px;height:40px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--accent),#b89fff);color:#fff;font-weight:800;
}
.tenant-brand>div:last-child{display:grid}
.tenant-brand strong{letter-spacing:.08em}
.tenant-brand span,.os-sidebar>small{font-size:10px;color:var(--muted)}
.os-sidebar>small{margin-left:51px;margin-top:-8px}
.os-sidebar nav{display:grid;gap:4px;margin-top:8px}
.nav-group{display:grid;gap:4px;margin-top:12px}
.nav-group em{font-style:normal;font-size:10px;letter-spacing:.12em;color:var(--soft);padding:0 10px 5px}
.os-sidebar nav button{
  border:0;background:transparent;color:var(--muted);display:flex;align-items:center;gap:9px;
  padding:10px 11px;border-radius:9px;text-align:left;
}
.os-sidebar nav button span{width:18px;text-align:center;color:var(--soft)}
.os-sidebar nav button b{font-weight:600;font-size:11px}
.os-sidebar nav button:hover,.os-sidebar nav button.active{background:var(--accent-soft);color:var(--text)}
.os-sidebar nav button.active span{color:var(--accent)}
.sidebar-foot{
  margin-top:auto;padding-top:16px;border-top:1px solid var(--line);display:grid;gap:3px
}
.sidebar-foot strong{font-size:12px}
.sidebar-foot small{color:var(--muted);font-size:10px}
.tiny-label{font-size:10px;letter-spacing:.1em;color:var(--soft)}
.os-main{min-width:0;background:var(--bg-elev)}
.os-topbar{
  padding:20px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;
  gap:18px;align-items:center;
}
.breadcrumb{font-size:10px;color:var(--muted)}
.os-topbar h3{font-size:25px;letter-spacing:-.03em;margin:5px 0 0}
.top-context{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.top-context span{
  border:1px solid var(--line);border-radius:999px;padding:7px 9px;font-size:10px;
  color:var(--muted);background:var(--panel)
}
.top-context b{color:var(--text);margin-right:5px}
.workspace{padding:22px;min-height:690px}
.grid{display:grid;gap:12px}
.grid.metrics{grid-template-columns:repeat(4,1fr)}
.metric,.card{border:1px solid var(--line);background:var(--panel);border-radius:15px}
.metric{padding:16px;display:grid;gap:4px}
.metric span,.field span,.source-card span,.ledger-row span,.decision-row span{font-size:10px;color:var(--muted)}
.metric strong{font-size:25px}
.metric small{font-size:10px;color:var(--soft)}
.workspace-grid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(290px,.7fr);
  gap:12px;
  margin-top:12px;
}
.card{padding:18px}
.card h4{margin:3px 0 15px;font-size:17px}
.card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.card-head small{font-size:10px;color:var(--muted)}
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:collapse;min-width:650px}
.table th,.table td{text-align:left;padding:12px 10px;border-top:1px solid var(--line);font-size:11px;vertical-align:top}
.table th{font-size:10px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.table tr:first-child th{border-top:0}
.table tbody tr{cursor:pointer}
.table tbody tr:hover{background:var(--accent-soft)}
.table small{color:var(--muted)}
.pill{display:inline-flex;padding:6px 8px;border-radius:999px;font-size:10px;border:1px solid var(--line);white-space:nowrap}
.pill.warn{color:var(--warn);background:rgba(240,184,107,.08)}
.pill.good{color:var(--good);background:rgba(100,216,161,.08)}
.pill.neutral{color:var(--muted);background:var(--panel-2)}
.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.field{
  padding:13px;border:1px solid var(--line);background:var(--panel-2);border-radius:11px;
  display:grid;gap:5px;min-width:0
}
.field strong{font-size:11px;overflow-wrap:anywhere}
.field select{
  width:100%;border:1px solid transparent;background:transparent;color:var(--text);font-weight:700;
  padding:4px 0;outline:0;border-radius:6px
}
.field select:focus{border-color:var(--accent)}
.field select option{background:var(--panel);color:var(--text)}
.field.changed,.field.proposed{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.actions-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.inline-btn{
  border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:9px;
  padding:9px 11px;font-size:10px
}
.inline-btn:hover{border-color:var(--accent)}
.inline-btn.primary-action{background:var(--accent);color:#fff;border-color:var(--accent)}
.source-grid{display:grid;gap:8px}
.source-card{
  display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:12px;border:1px solid var(--line);
  background:var(--panel-2);border-radius:11px
}
.source-card strong{font-size:12px}
.source-card b{font-size:12px}
.source-card small{grid-column:1/-1;color:var(--soft);font-size:10px}
.source-card .category{font-size:10px;color:var(--accent);font-weight:700;letter-spacing:.08em}
.delta{color:var(--warn)}
.context-gap{
  padding:13px;border:1px dashed var(--line-strong);border-radius:12px;background:var(--accent-soft);
  display:grid;gap:6px
}
.context-gap strong{font-size:12px}
.context-gap p{font-size:10px;color:var(--muted);margin:0}
.notice{
  padding:12px 13px;border:1px solid var(--line);background:var(--panel-2);border-radius:11px;
  color:var(--muted);font-size:10px;line-height:1.55
}
.proposal-card{
  margin-top:14px;padding:14px;border:1px solid rgba(141,124,255,.35);
  background:var(--accent-soft);border-radius:12px
}
.proposal-card h5{margin:0 0 8px;font-size:12px}
.proposal-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.proposal-grid div{padding:10px;border:1px solid var(--line);background:var(--panel);border-radius:9px;display:grid;gap:4px}
.proposal-grid span{font-size:10px;color:var(--muted)}
.proposal-grid strong{font-size:11px}
.ledger{display:grid;gap:8px}
.ledger-row{
  display:grid;
  grid-template-columns:1.1fr 1fr 1.2fr 1fr auto;
  gap:10px;align-items:center;padding:12px;border:1px solid var(--line);
  border-radius:11px;background:var(--panel-2)
}
.ledger-row strong{font-size:10px}
.ledger-row small{font-size:10px;color:var(--soft)}
.ledger-meta{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;padding-top:8px;border-top:1px solid var(--line)}
.ledger-meta span{font-size:10px;color:var(--soft)}
.decision-list{display:grid;gap:8px}
.decision-row{
  display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:10px;align-items:center;
  padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--panel-2)
}
.decision-row strong{font-size:10px}
.recon-summary{display:grid;gap:10px;margin-top:12px}
.recon-map{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.recon-map div{padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--panel-2);display:grid;gap:4px}
.recon-map span{font-size:10px;color:var(--muted)}
.recon-map strong{font-size:11px}
.intelligence-fab{
  position:absolute;z-index:25;right:22px;bottom:22px;width:58px;height:58px;border:0;border-radius:18px;
  background:var(--panel);box-shadow:0 18px 40px rgba(52,19,216,.3);display:grid;place-items:center;
  border:1px solid rgba(141,124,255,.28);transition:.18s
}
.intelligence-fab img{width:39px;height:39px}
.intelligence-fab:hover{transform:translateY(-2px)}
.fab-pulse{
  position:absolute;right:5px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--warn);
  box-shadow:0 0 0 6px rgba(240,184,107,.12);animation:pulse 1.8s infinite
}
@keyframes pulse{50%{box-shadow:0 0 0 10px rgba(240,184,107,0)}}
.intelligence-panel{
  position:absolute;z-index:30;right:18px;bottom:18px;width:min(440px,calc(100% - 36px));
  height:min(690px,calc(100% - 36px));border:1px solid var(--line-strong);border-radius:20px;
  background:var(--bg-elev);box-shadow:0 24px 80px rgba(0,0,0,.34);overflow:hidden;
  display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto auto
}
.intelligence-panel>header{
  padding:14px 15px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;
  align-items:center;gap:10px;background:var(--panel)
}
.intelligence-brand{display:flex;gap:10px;align-items:center}
.intelligence-brand img{width:32px;height:32px}
.intelligence-brand div{display:grid}
.intelligence-brand strong{font-size:12px}
.intelligence-brand span{font-size:10px;color:var(--muted)}
.panel-actions{display:flex;gap:4px}
.panel-actions button{
  border:0;background:transparent;color:var(--muted);font-size:18px;width:30px;height:30px;border-radius:7px
}
.panel-actions button:hover{background:var(--panel-2);color:var(--text)}
.context-strip{
  padding:10px 13px;border-bottom:1px solid var(--line);display:flex;gap:6px;flex-wrap:wrap;background:var(--panel)
}
.context-strip span{
  font-size:10px;padding:5px 7px;border:1px solid var(--line);border-radius:999px;color:var(--muted)
}
.messages{padding:15px;overflow:auto;display:flex;flex-direction:column;gap:10px}
.message{
  max-width:90%;border:1px solid var(--line);border-radius:14px;padding:11px 12px;
  font-size:11px;line-height:1.55;white-space:pre-wrap
}
.message.assistant{align-self:flex-start;background:var(--panel)}
.message.user{align-self:flex-end;background:var(--accent-soft);border-color:rgba(141,124,255,.22)}
.message.system{align-self:center;background:transparent;border-style:dashed;color:var(--muted);max-width:100%;font-size:10px}
.message strong{font-size:11px}
.choice-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.choice{
  border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:999px;
  padding:7px 9px;font-size:10px
}
.choice:hover{border-color:var(--accent);color:var(--accent)}
.suggestions{padding:0 13px 10px;display:flex;gap:6px;flex-wrap:wrap}
.suggestions button{
  border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:999px;
  padding:7px 9px;font-size:10px
}
.suggestions button:hover{border-color:var(--accent);color:var(--text)}
.composer{
  padding:10px 12px 12px;border-top:1px solid var(--line);display:grid;
  grid-template-columns:minmax(0,1fr) 40px;gap:8px;background:var(--panel)
}
.composer textarea{
  resize:none;border:1px solid var(--line);border-radius:11px;background:var(--bg-elev);color:var(--text);
  padding:10px 11px;outline:0;min-height:44px
}
.send{border:0;border-radius:11px;background:var(--accent);color:#fff;font-weight:800}
.intelligence-panel footer{
  padding:9px 12px;border-top:1px solid var(--line);font-size:10px;color:var(--soft);background:var(--panel)
}
.tour-overlay{
  position:absolute;inset:0;z-index:45;background:rgba(4,6,11,.60);pointer-events:none
}
.tour-card{
  position:absolute;width:min(360px,calc(100% - 28px));padding:16px;border:1px solid var(--line-strong);
  border-radius:16px;background:var(--bg-elev);box-shadow:var(--shadow);pointer-events:auto
}
.tour-card h4{font-size:15px;margin:7px 0}
.tour-card p{font-size:11px;color:var(--muted);margin:0;line-height:1.55}
.tour-step{font-size:10px;letter-spacing:.1em;color:var(--accent)}
.tour-actions{display:flex;justify-content:space-between;gap:8px;margin-top:14px}
.tour-target{position:relative;z-index:46!important;box-shadow:0 0 0 4px rgba(141,124,255,.32),0 0 0 9999px rgba(4,6,11,.05)!important}
.toast{
  position:absolute;z-index:60;left:50%;bottom:26px;transform:translateX(-50%);
  padding:10px 14px;border-radius:999px;border:1px solid var(--line-strong);background:var(--panel);
  color:var(--text);font-size:11px;box-shadow:var(--shadow)
}
.mobile-nav{display:none}
.concept{
  max-width:1500px;margin:0 auto;padding:100px clamp(20px,6vw,90px) 120px;
  display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:50px;align-items:start
}
.concept h2{font-size:clamp(34px,4vw,56px);margin:12px 0}
.concept-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.concept-grid article{
  padding:18px;border:1px solid var(--line);border-radius:15px;background:var(--panel);display:grid;gap:7px
}
.concept-grid span{font-size:10px;color:var(--accent);letter-spacing:.08em}
.concept-grid strong{font-size:12px;font-weight:600;color:var(--text)}
@media(max-width:1100px){
  .intro{grid-template-columns:1fr;gap:38px}
  .intro-principles{grid-template-columns:repeat(2,1fr)}
  .grid.metrics{grid-template-columns:repeat(2,1fr)}
  .workspace-grid{grid-template-columns:1fr}
  .concept{grid-template-columns:1fr}
  .recon-map{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  body{padding-bottom:76px}
  .global-header{align-items:flex-start}
  .brand span{display:none}
  .global-actions{gap:6px}
  .header-action{padding:8px 10px}
  .intro{min-height:auto;padding:74px 18px 72px}
  .intro h1{font-size:clamp(40px,13vw,58px)}
  .intro-copy>p{font-size:15px}
  .intro-principles{grid-template-columns:1fr}
  .experience{padding:78px 12px 30px}
  .experience-head{align-items:flex-start;flex-direction:column;padding:0 4px}
  .os-shell{grid-template-columns:1fr;min-height:760px;border-radius:18px;overflow:visible}
  .os-sidebar{display:none}
  .os-topbar{padding:16px;align-items:flex-start;flex-direction:column}
  .top-context{justify-content:flex-start}
  .workspace{padding:12px 12px 86px;min-height:650px}
  .grid.metrics{grid-template-columns:1fr 1fr}
  .details-grid{grid-template-columns:1fr 1fr}
  .ledger-row,.decision-row{grid-template-columns:1fr}
  .ledger-meta{grid-column:1}
  .proposal-grid{grid-template-columns:1fr}
  .recon-map{grid-template-columns:1fr 1fr}
  .mobile-nav{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    position:absolute;
    z-index:24;
    left:0;right:0;bottom:0;
    border-top:1px solid var(--line);
    background:var(--glass);
    backdrop-filter:blur(14px);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom));
  }
  .mobile-nav button{
    border:0;background:transparent;color:var(--muted);display:grid;place-items:center;gap:3px;
    padding:5px 2px;border-radius:9px
  }
  .mobile-nav button span{font-size:16px}
  .mobile-nav button b{font-size:10px;font-weight:600}
  .mobile-nav button.active{color:var(--accent);background:var(--accent-soft)}
  .intelligence-fab{right:14px;bottom:78px}
  .intelligence-panel{
    position:absolute;
    left:8px;right:8px;bottom:70px;
    width:auto;height:min(670px,calc(100% - 82px));border-radius:16px
  }
  .toast{bottom:82px}
  .concept{padding:78px 18px 100px}
  .concept-grid{grid-template-columns:1fr}
}
@media(max-width:470px){
  .global-header{padding:9px 10px}
  .brand img{width:32px;height:32px}
  .brand strong{font-size:12px}
  .segmented button{padding:6px 8px;min-width:30px}
  .header-action{font-size:10px}
  .grid.metrics{grid-template-columns:1fr}
  .details-grid{grid-template-columns:1fr}
  .recon-map{grid-template-columns:1fr}
  .top-context span{font-size:10px}
  .mobile-nav button b{font-size:9px}
  .intelligence-panel{left:6px;right:6px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
