/* Accord — light, restrained, tool-like */
:root{
  --bg:#F5F4F0; --surface:#FFFFFF; --surface2:#F0EEE9; --line:#E2DFD7; --line2:#CFCBC1;
  --ink:#1A1E27; --ink2:#454C5C; --muted:#737A8C;
  --accent:#1D4F91; --accent-soft:#E8EEF7; --rec:#C8412B; --rec-soft:#FBEAE6;
  --good:#1D7A58; --good-soft:#E6F3EE; --warn:#A8671A; --warn-soft:#FBF1E3; --bad:#B63A2B; --violet:#5B4596; --violet-soft:#EFEBF7;
  --r:8px; --shadow:0 1px 2px rgba(26,30,39,.06);
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
body{padding-top:env(safe-area-inset-top)}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
button{font:inherit}
input,textarea,select{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line2);border-radius:6px;padding:9px 11px;width:100%;min-height:42px}
textarea{min-height:auto}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
h1{font-size:24px;font-weight:600;margin:0 0 2px;letter-spacing:-.01em}
h2{font-size:13px;font-weight:600;margin:22px 0 8px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
h3{font-size:15px;font-weight:600;margin:0 0 4px}
.sub{color:var(--ink2);margin:0 0 18px}
.muted{color:var(--muted)}.small{font-size:13px}.mono{font-family:var(--mono);font-size:12.5px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.grow{flex:1;min-width:140px}.right{margin-left:auto}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--surface);border:1px solid var(--line2);color:var(--ink);border-radius:6px;padding:8px 14px;min-height:40px;cursor:pointer;white-space:nowrap;font-weight:500;box-shadow:var(--shadow)}
.btn:hover{background:var(--surface2)}
.btn.p{background:var(--accent);border-color:var(--accent);color:#fff}.btn.p:hover{filter:brightness(1.08)}
.btn.d{background:var(--rec);border-color:var(--rec);color:#fff}
.btn:disabled{opacity:.5;cursor:default}
.btn.s{padding:4px 10px;min-height:32px;font-size:13px;box-shadow:none}
.btn.ghost{background:none;border-color:transparent;color:var(--ink2);box-shadow:none}.btn.ghost:hover{background:var(--surface2)}

/* shell */
.shell{display:grid;grid-template-columns:220px 1fr;min-height:100vh}
.rail{background:var(--surface);border-right:1px solid var(--line);padding:18px 12px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.brand{font-weight:700;font-size:17px;display:flex;align-items:center;gap:9px;margin:0 8px 22px;color:var(--ink)}
.rail nav a{display:block;padding:7px 10px;border-radius:6px;color:var(--ink2);margin-bottom:1px}
.rail nav a:hover{background:var(--surface2);text-decoration:none}
.rail nav a.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.rail .foot{margin-top:auto}
.main{padding:26px 32px 60px;max-width:1120px;width:100%}

/* surfaces */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin-bottom:12px;box-shadow:var(--shadow)}
.pill{display:inline-block;font-size:11.5px;font-weight:500;padding:1px 8px;border-radius:4px;border:1px solid var(--line2);color:var(--ink2);background:var(--surface);white-space:nowrap}
.pill.live{background:var(--rec);border-color:var(--rec);color:#fff}
.pill.completed{background:var(--good-soft);border-color:#BFE0D2;color:var(--good)}
.pill.processing{background:var(--warn-soft);border-color:#EED3AE;color:var(--warn)}
.pill.planned{background:var(--accent-soft);border-color:#C8D6EC;color:var(--accent)}
.list{padding:0}.list a,.list .li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);color:var(--ink)}
.list a:last-child,.list .li:last-child{border:0}.list a:hover{background:#FAF9F6;text-decoration:none}
.item{padding:11px 0;border-bottom:1px solid var(--line)}.item:first-child{padding-top:2px}.item:last-child{border:0;padding-bottom:2px}

/* home */
.hero{display:flex;align-items:center;gap:22px;padding:20px 22px}
.rec{flex:none;width:112px;height:112px;border-radius:50%;background:var(--rec);color:#fff;font-weight:600;font-size:17px;border:0;cursor:pointer;box-shadow:0 0 0 6px var(--rec-soft)}
.rec:hover{filter:brightness(1.06)}
.rec.on{background:var(--surface);color:var(--rec);border:3px solid var(--rec);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(200,65,43,.35)}100%{box-shadow:0 0 0 18px rgba(200,65,43,0)}}
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:6px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;box-shadow:var(--shadow)}
.stat b{font-size:22px;font-weight:600;display:block;font-variant-numeric:tabular-nums}.stat span{font-size:12.5px;color:var(--muted)}
.focus{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.over{color:var(--bad)!important}

/* meeting */
.mhead{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:6px}
.mhead h1[contenteditable]:focus{outline:none;border-bottom:2px solid var(--accent)}
.live{display:grid;grid-template-columns:1fr 330px;gap:16px}
.feed{display:flex;flex-direction:column;gap:6px;max-height:70vh;overflow:auto;padding-right:2px}
.ev{display:grid;grid-template-columns:3px 1fr;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:9px 12px 9px 9px}
.ev .bar{border-radius:2px;background:var(--line2)}
.ev.decision .bar{background:var(--good)}.ev.action .bar{background:var(--violet)}.ev.risk .bar{background:var(--bad)}
.ev.contradiction{background:var(--warn-soft);border-color:#EED3AE}.ev.contradiction .bar,.ev.question .bar,.ev.parking .bar{background:var(--warn)}
.ev.inf .bar{background-image:repeating-linear-gradient(#fff 0 3px,transparent 3px 7px)}
.ev.segment{background:none;border-color:transparent;padding:3px 12px 3px 9px;box-shadow:none}
.ev .k{font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;margin-bottom:1px}.ev .k b{color:var(--ink);font-weight:600}
.ts{font-family:var(--mono);font-size:11.5px;color:var(--muted)}
.tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin:14px 0 14px;overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}
.tabs button{background:none;border:0;color:var(--ink2);padding:9px 12px;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;font-weight:500}
.tabs button.on{color:var(--accent);border-color:var(--accent)}
.sug{border-left:3px solid var(--accent);padding:8px 12px;margin:8px 0;background:var(--accent-soft);border-radius:0 6px 6px 0}.sug b{display:block;font-weight:600}
.level{height:5px;background:var(--surface2);border-radius:3px;overflow:hidden}.level i{display:block;height:100%;background:var(--good);transition:width .12s}
img.hl{max-width:100%;border-radius:6px;margin-top:6px;border:1px solid var(--line)}
pre{white-space:pre-wrap;font:inherit;margin:0}
.draft{background:var(--surface2);border:1px solid var(--line);border-radius:6px;padding:12px 14px;white-space:pre-wrap}

/* recording bar — fixed, large touch target */
.recbar{position:sticky;bottom:12px;z-index:6;display:flex;align-items:center;gap:12px;background:var(--ink);color:#fff;border-radius:10px;padding:10px 12px 10px 16px;margin:14px 0;box-shadow:0 6px 20px rgba(26,30,39,.18)}
.recbar .dot{width:10px;height:10px;border-radius:50%;background:#FF6B55;animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.25}}
.recbar .clock{font-family:var(--mono);font-size:18px;font-variant-numeric:tabular-nums}
.recbar .info{font-size:12.5px;color:#C9CED9;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recbar .stop{background:var(--rec);color:#fff;border:0;border-radius:8px;font-weight:600;font-size:16px;padding:0 22px;min-height:52px;cursor:pointer}
.recbar .level{background:#333A48;width:70px}
.tools{display:flex;gap:6px;flex-wrap:wrap;align-items:center}

/* misc */
.toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px;z-index:20;max-width:90vw;font-size:14px;box-shadow:0 6px 20px rgba(0,0,0,.18)}
.center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.center .panel{width:100%;max-width:380px;padding:26px}
.timer{font-family:var(--mono);font-size:15px;font-weight:600}
.help h3{margin-top:18px}.help p,.help li{color:var(--ink2)}.help ol,.help ul{padding-left:20px}
details.faq{border-bottom:1px solid var(--line);padding:10px 0}details.faq summary{cursor:pointer;font-weight:600;list-style:none}details.faq summary::before{content:"+ ";color:var(--accent)}details.faq[open] summary::before{content:"– "}details.faq p{margin:8px 0 0}
.kbd{font-family:var(--mono);font-size:12px;background:var(--surface2);border:1px solid var(--line);border-radius:4px;padding:1px 5px}
.mnav{display:none}
.mermaid{background:var(--surface)}

@media(max-width:900px){
  .shell{grid-template-columns:1fr}.rail{display:none}
  .main{padding:16px 14px 96px}
  .live{grid-template-columns:1fr}.feed{max-height:none}
  .stats{grid-template-columns:repeat(3,1fr)}.stats .stat:nth-child(n+4){display:none}
  .focus{grid-template-columns:1fr}
  .hero{flex-direction:column;text-align:center;padding:22px 16px}
  .rec{width:132px;height:132px;font-size:19px}
  .btn{min-height:44px}.btn.s{min-height:36px}
  h1{font-size:21px}
  .mnav{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));justify-content:space-around;z-index:8}
  .mnav a{color:var(--ink2);font-size:12.5px;padding:10px 12px;border-radius:6px;font-weight:500}
  .mnav a.on{color:var(--accent);background:var(--accent-soft)}
  .recbar{position:fixed;left:8px;right:8px;bottom:calc(64px + env(safe-area-inset-bottom));margin:0;border-radius:12px}
  .recbar .stop{min-height:56px;padding:0 26px;font-size:17px}
  .recbar .level{display:none}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* overflow guards */
html,body{overflow-x:hidden}
.shell>*,.main,.live>*,.focus>*,.grow,.mhead>*{min-width:0}
.ev>div,.item .grow{min-width:0;overflow-wrap:anywhere}
input[type=checkbox]{width:auto;min-height:auto;margin:0 4px 0 0;vertical-align:middle}
label.small{display:inline-flex;align-items:center}
@media(max-width:900px){.mhead>.row{width:100%}.mhead>.row .btn{flex:1}.tools .right{margin-left:0;width:100%}}

.recbar.paused{background:#7A4A0E}.recbar.paused .dot{background:#FFC46B;animation:none}.recbar.paused .info{color:#FFE7C2;white-space:normal}
.recbar .resume{background:#fff;color:#7A4A0E;border:0;border-radius:8px;font-weight:600;font-size:16px;padding:0 20px;min-height:52px;cursor:pointer}
@media(max-width:900px){.recbar .resume{min-height:56px}}

.main.recording{padding-bottom:110px}
@media(max-width:900px){.main.recording{padding-bottom:190px} body.recording .toast{bottom:calc(150px + env(safe-area-inset-bottom))}}
@media(max-width:900px){.recbar.paused .info{display:none}.recbar.paused .clock{flex:1}}

/* ---------- landing ---------- */
.lp{max-width:1140px;margin:0 auto;padding:0 28px}
.lp-top{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.lp-brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:18px;color:var(--ink)}.lp-brand:hover{text-decoration:none}
.lp-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;padding:56px 0 72px}
.lp-hero h1{font-size:48px;line-height:1.08;letter-spacing:-.025em;font-weight:600;margin:0 0 20px;max-width:17ch}
.lp-lede{font-size:18px;line-height:1.6;color:var(--ink2);margin:0 0 26px;max-width:52ch}
.lp-big{min-height:48px;padding:0 22px;font-size:16px}
.lp-note{color:var(--muted);font-size:14px;margin:16px 0 0}
.lp-demo{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 40px -18px rgba(26,30,39,.25);overflow:hidden}
.lp-demo-bar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);font-weight:600;font-size:14px}
.lp-demo-bar .ts{margin-left:auto;font-size:13px}
.lp-dot{width:9px;height:9px;border-radius:50%;background:var(--rec);animation:blink 1.2s infinite}
.lp-feed{height:440px;overflow:hidden;padding:14px 16px;display:flex;flex-direction:column;gap:8px;justify-content:flex-end;background:#FBFAF7}
.lp-seg,.lp-card{opacity:0;transform:translateY(6px);transition:opacity .45s ease,transform .45s ease}
.lp-seg.in,.lp-card.in{opacity:1;transform:none}
.lp-seg{font-size:14.5px;color:var(--ink2);padding:2px 2px}.lp-seg b{color:var(--ink);margin:0 4px 0 6px}
.lp-card{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--line2);border-radius:6px;padding:9px 12px;font-size:14.5px}
.lp-card.decision{border-left-color:var(--good)}.lp-card.action{border-left-color:var(--violet);border-left-style:dashed}
.lp-card.conflict{border-left-color:var(--warn);background:var(--warn-soft)}
.lp-k{font-size:12px;color:var(--muted);display:flex;gap:8px}.lp-k b{color:var(--ink)}
.lp-m{font-size:12.5px;color:var(--muted);margin-top:2px}.lp-card.conflict .lp-m{color:var(--warn);font-weight:500}
.lp-h{font-size:28px;font-weight:600;letter-spacing:-.015em;text-transform:none;color:var(--ink);margin:0 0 14px}
.lp-flow{padding:64px 0;border-top:1px solid var(--line)}
.lp-steps{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:s;position:relative}
.lp-steps li{padding:22px 24px 0 0;border-top:2px solid var(--line2);position:relative}
.lp-steps li::before{content:"";position:absolute;top:-7px;left:0;width:12px;height:12px;border-radius:50%;background:var(--bg);border:2px solid var(--accent)}
.lp-steps li:nth-child(2)::before{background:var(--rec);border-color:var(--rec)}
.lp-steps h3{font-size:17px;margin:0 0 6px}.lp-steps p{margin:0;color:var(--ink2);font-size:15px;line-height:1.6}
.lp-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;padding:64px 0;border-top:1px solid var(--line);align-items:start}
.lp-split p,.lp-split li{color:var(--ink2);font-size:16px;line-height:1.65}
.lp-split ul{padding-left:18px;margin:0}.lp-split li{margin-bottom:6px}
.lp-quote{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:20px 22px}
.lp-q{font-weight:600;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:12px}
.lp-a{color:var(--ink2);line-height:1.6}.lp-ev{display:block;font-family:var(--mono);font-size:12px;color:var(--muted);margin-top:8px}
.lp-form{display:flex;flex-direction:column;gap:10px;max-width:440px}.lp-form .btn{align-self:flex-start}
.lp-foot{display:flex;gap:14px;padding:26px 0 40px;border-top:1px solid var(--line);font-weight:600}
.lp-dlg{border:1px solid var(--line);border-radius:12px;padding:26px;width:min(360px,92vw);box-shadow:0 24px 60px rgba(26,30,39,.25);color:var(--ink)}
.lp-dlg::backdrop{background:rgba(26,30,39,.35)}
.lp-close{position:absolute;top:10px;right:10px;margin:0}
@media(max-width:900px){
  .lp{padding:0 18px}
  .lp-hero{grid-template-columns:1fr;gap:32px;padding:24px 0 48px}
  .lp-hero h1{font-size:36px}
  .lp-lede{font-size:16.5px}
  .lp-hero .row .btn{flex:1}
  .lp-feed{height:400px}
  .lp-steps{grid-template-columns:1fr;border-left:2px solid var(--line2);margin-left:6px}
  .lp-steps li{border-top:0;padding:0 0 26px 22px}
  .lp-steps li::before{top:2px;left:-8px}
  .lp-split{grid-template-columns:1fr;gap:36px;padding:48px 0}
  .lp-h{font-size:24px}
}
@media(max-width:900px){.panel .row>input.grow,.panel .row>input[type=number]{flex:1 1 100%}}
.credit{font-size:11.5px;line-height:1.5;color:var(--muted);margin-top:14px;padding:0 10px}
.lp-foot{flex-wrap:wrap;justify-content:space-between;align-items:baseline;font-weight:400}
.lp-credit{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
@media(max-width:900px){.lp-credit{flex-direction:column;gap:2px}}