/* Team Tracker - one stylesheet. Colors are tokens; layout uses logical
   properties so Hebrew (dir=rtl) mirrors without extra rules. */

:root{
  --bg:#f5efe6; --surface:#fffcf7; --surface-2:#f1e8db; --surface-3:#e8dccb;
  --ink:#2a1b12; --ink-2:#5e4a3c; --ink-3:#86725f; --line:#e4d7c5; --line-2:#cdbba4;
  --header:#3b2618; --header-ink:#f7ede1; --header-ink-2:#cfb9a4; --header-line:#5a3d2a;
  --accent:#b4552a; --accent-hover:#9a4621; --accent-ink:#fffaf4; --accent-soft:#f6e1d3;
  --focus:#c0682f;
  --s-todo-bg:#ece4d9; --s-todo-fg:#5a483b;
  --s-doing-bg:#dce7f4; --s-doing-fg:#1e4c80;
  --s-blocked-bg:#f7d9d2; --s-blocked-fg:#982a1a;
  --s-done-bg:#d9eedc; --s-done-fg:#24663a;
  --s-late-bg:#fae6bf; --s-late-fg:#7a4e00;
  --p-founder:#6f4a99; --p-ben:#24786a; --p-molly:#b6426a; --p-amit:#647a22; --p-all:#7a6555;
  --chip-ink:#ffffff;
  --scrim:rgba(30,18,10,.48);
  --shadow:0 1px 2px rgba(42,27,18,.06),0 6px 18px rgba(42,27,18,.07);
  --bar-bg:#e8dccb; --bar-fill:#2f7a45;
  --font-ui:"Figtree","Rubik",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-display:"Bricolage Grotesque","Rubik","Figtree",system-ui,sans-serif;
  --dir:1;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#17110d; --surface:#211913; --surface-2:#2a2019; --surface-3:#342820;
    --ink:#f3e9dd; --ink-2:#cdbba9; --ink-3:#a08c7a; --line:#3a2d23; --line-2:#514033;
    --header:#110b07; --header-ink:#f3e9dd; --header-ink-2:#b9a38f; --header-line:#33251b;
    --accent:#e07b45; --accent-hover:#ec8d58; --accent-ink:#1b110b; --accent-soft:#3d2618;
    --focus:#f0995f;
    --s-todo-bg:#342a22; --s-todo-fg:#d8c8b8;
    --s-doing-bg:#1d3049; --s-doing-fg:#a3c7f2;
    --s-blocked-bg:#4a1f19; --s-blocked-fg:#f4a99b;
    --s-done-bg:#1b3a25; --s-done-fg:#96d8a7;
    --s-late-bg:#43320f; --s-late-fg:#f0c46d;
    --p-founder:#a985d6; --p-ben:#4fb7a4; --p-molly:#e07a9e; --p-amit:#a3bb55; --p-all:#b39d8a;
    --chip-ink:#17110d;
    --scrim:rgba(0,0,0,.62);
    --shadow:0 1px 2px rgba(0,0,0,.3);
    --bar-bg:#342820; --bar-fill:#5fbf7a;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#17110d; --surface:#211913; --surface-2:#2a2019; --surface-3:#342820;
  --ink:#f3e9dd; --ink-2:#cdbba9; --ink-3:#a08c7a; --line:#3a2d23; --line-2:#514033;
  --header:#110b07; --header-ink:#f3e9dd; --header-ink-2:#b9a38f; --header-line:#33251b;
  --accent:#e07b45; --accent-hover:#ec8d58; --accent-ink:#1b110b; --accent-soft:#3d2618;
  --focus:#f0995f;
  --s-todo-bg:#342a22; --s-todo-fg:#d8c8b8;
  --s-doing-bg:#1d3049; --s-doing-fg:#a3c7f2;
  --s-blocked-bg:#4a1f19; --s-blocked-fg:#f4a99b;
  --s-done-bg:#1b3a25; --s-done-fg:#96d8a7;
  --s-late-bg:#43320f; --s-late-fg:#f0c46d;
  --p-founder:#a985d6; --p-ben:#4fb7a4; --p-molly:#e07a9e; --p-amit:#a3bb55; --p-all:#b39d8a;
  --chip-ink:#17110d;
  --scrim:rgba(0,0,0,.62);
  --shadow:0 1px 2px rgba(0,0,0,.3);
  --bar-bg:#342820; --bar-fill:#5fbf7a;
  color-scheme:dark;
}
:root[lang="he"]{
  --font-ui:"Rubik","Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-display:"Rubik","Bricolage Grotesque",system-ui,sans-serif;
}
:root[dir="rtl"]{--dir:-1}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-ui);font-size:16px;line-height:1.45;overflow-x:hidden}
body::before{content:"";position:fixed;inset-inline:0;top:0;height:env(safe-area-inset-top,0px);background:var(--header);z-index:40;pointer-events:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:6px}
[hidden]{display:none !important}
.num,.counters b,.badge,.count{font-variant-numeric:tabular-nums}
.vh{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.ltr{direction:ltr;unicode-bidi:isolate}
.stack{display:grid;gap:12px}
.selfstart{justify-self:start}

.wrap{max-width:1200px;margin-inline:auto;padding-left:max(16px, env(safe-area-inset-left, 0px));padding-right:max(16px, env(safe-area-inset-right, 0px))}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--header);color:var(--header-ink)}
.top-row{display:flex;align-items:center;gap:10px;padding-block:8px 4px}
.brand{flex:1;min-width:0;display:flex;align-items:center;gap:10px}
.brand-mark{flex:none;width:13px;height:21px;border-radius:50%;background:var(--accent);transform:rotate(calc(22deg * var(--dir)))}
.brand-text{min-width:0}
.brand-name{font-family:var(--font-display);font-weight:700;font-size:18px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
.brand-sub{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--header-ink-2);white-space:nowrap;overflow:hidden}
.brand-sub > span:first-child{overflow:hidden;text-overflow:ellipsis}
.mini-bar{flex:none;width:56px;height:4px;border-radius:2px;background:var(--header-line);overflow:hidden}
.mini-bar > i{display:block;height:100%;width:0;background:var(--accent)}
.who-btn{flex:none;min-height:44px;display:inline-flex;align-items:center;gap:8px;padding-block:0;padding-inline:8px 12px;background:transparent;color:var(--header-ink);border:1px solid var(--header-line);border-radius:999px;font-weight:600;font-size:14px;max-width:170px}
.who-btn .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who-btn:hover{border-color:var(--header-ink-2)}
.add-btn{flex:none;min-height:44px;padding-inline:14px;border-radius:999px;border:0;background:var(--accent);color:var(--accent-ink);font-weight:700;font-size:14px}
.add-btn:hover{background:var(--accent-hover)}
.add-btn .short{display:none}
.tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;min-height:44px;padding-inline:13px;background:none;border:0;border-bottom:3px solid transparent;color:var(--header-ink-2);font-weight:600;font-size:15px;white-space:nowrap}
.tab:hover{color:var(--header-ink)}
.tab[aria-current="page"]{color:var(--header-ink);border-bottom-color:var(--accent)}
@media (max-width:440px){
  .add-btn .long{display:none}.add-btn .short{display:inline}
  .who-btn{padding-inline:7px}.who-btn .nm{display:none}
  .mini-bar{display:none}
  .add-btn{padding-inline:12px}
}

.banner{background:var(--s-late-bg);color:var(--s-late-fg);font-size:14px;font-weight:600}
.banner-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding-block:6px}
.banner select{min-height:36px;padding-block:4px;width:auto;border-color:var(--s-late-fg)}

main.main{padding-block:20px 72px}
.view-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:16px}
h2{font-family:var(--font-display);font-weight:700;font-size:26px;line-height:1.15;margin:0;letter-spacing:-.01em}
h3{font-family:var(--font-display);font-weight:600;font-size:18px;margin:0}
:root[lang="he"] h2{letter-spacing:0}
.lede{color:var(--ink-2);margin:4px 0 0;font-size:15px}

.btn{min-height:44px;padding-inline:16px;border-radius:10px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.btn:hover{background:var(--surface-2)}
.btn-accent{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn-accent:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn-quiet{background:transparent;border-color:transparent;color:var(--ink-2)}
.btn-quiet:hover{background:var(--surface-2)}
.btn-danger{color:var(--s-blocked-fg);border-color:var(--s-blocked-bg);background:var(--surface)}
.btn-danger-solid{background:var(--s-blocked-fg);border-color:var(--s-blocked-fg);color:var(--surface)}
.btn-sm{padding-inline:12px;font-size:14px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-block{width:100%}

.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.muted{color:var(--ink-3)}
.small{font-size:13px}

/* chips, pills */
.chip{--c:var(--p-all);display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--c);color:var(--chip-ink);font-weight:700;font-size:13px;line-height:1}
.chip-lg{width:42px;height:42px;font-size:17px}
.chip-sm{width:22px;height:22px;font-size:11px}
.chip-all{font-size:10px;letter-spacing:-.02em}
.chip-lg.chip-all{font-size:13px}
.pill{display:inline-flex;align-items:center;height:22px;padding-inline:9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.pill-todo{background:var(--s-todo-bg);color:var(--s-todo-fg)}
.pill-doing{background:var(--s-doing-bg);color:var(--s-doing-fg)}
.pill-blocked{background:var(--s-blocked-bg);color:var(--s-blocked-fg)}
.pill-done{background:var(--s-done-bg);color:var(--s-done-fg)}
.pill-late{background:var(--s-late-bg);color:var(--s-late-fg)}
.badge{display:inline-flex;align-items:center;height:20px;padding-inline:6px;border-radius:5px;border:1px solid var(--line-2);color:var(--ink-2);font-size:11px;font-weight:700;white-space:nowrap}
.gate{display:inline-flex;align-items:center;gap:5px;color:var(--accent);font-weight:700;font-size:12px}
.gate::before{content:"";width:7px;height:7px;background:var(--accent);transform:rotate(45deg)}
.wait{color:var(--s-late-fg);font-size:12px;font-weight:600;overflow-wrap:anywhere}
.hi{color:var(--s-blocked-fg);font-weight:700;font-size:12px}
.tx-chip{display:inline-flex;align-items:center;gap:4px;height:20px;padding-inline:7px;border-radius:999px;border:1px dashed var(--line-2);color:var(--ink-3);font-size:11px;font-weight:600;white-space:nowrap;vertical-align:1px;margin-inline-start:6px}
.tx-chip.pending::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);animation:blink 1.2s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}

/* progress */
.bar{height:8px;background:var(--bar-bg);border-radius:4px;overflow:hidden}
.bar > i{display:block;height:100%;width:0;background:var(--bar-fill);border-radius:inherit;transition:width .3s}

/* task rows */
.tlist{list-style:none;margin:0;padding:0 6px 6px}
.trow{display:flex;align-items:flex-start;border-radius:10px}
.trow:hover{background:var(--surface-2)}
.tcheck{flex:none;width:44px;height:44px;display:grid;place-items:center;cursor:pointer}
.tcheck input{appearance:none;-webkit-appearance:none;width:22px;height:22px;margin:0;border:2px solid var(--line-2);border-radius:6px;background:var(--surface);display:grid;place-items:center;cursor:pointer}
.tcheck input:checked{background:var(--s-done-fg);border-color:var(--s-done-fg)}
.tcheck input:checked::after{content:"";width:6px;height:11px;border:solid var(--surface);border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg)}
.tcheck input:disabled{opacity:.5;cursor:not-allowed}
.tmain{flex:1;min-width:0;min-height:44px;text-align:start;background:none;border:0;padding-block:10px;padding-inline:2px 8px;color:inherit}
.ttitle{font-weight:500;overflow-wrap:anywhere}
.tline{display:block}
.is-done .ttitle{text-decoration:line-through;color:var(--ink-3)}
.tmeta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:5px;font-size:12px;color:var(--ink-3)}
.tlist-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);padding:12px 14px 2px;margin:0}
:root[lang="he"] .tlist-label{letter-spacing:0;font-size:13px}
.none{padding:6px 14px 12px;color:var(--ink-3);font-size:14px;margin:0}

/* week */
.cols{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
@media (min-width:1120px){.cols{grid-template-columns:repeat(4,minmax(0,1fr))}}
.col{min-width:0}
.col-head{display:flex;align-items:center;gap:10px;padding:14px 14px 10px}
.col-who{min-width:0}
.col-name{font-weight:700;font-size:17px;overflow-wrap:anywhere}
.col-role{font-size:13px;color:var(--ink-3)}
.counters{display:flex;gap:16px;padding:0 14px 10px;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink-2)}
.counters b{display:block;font-size:20px;color:var(--ink);font-weight:700;line-height:1.1}
.promise{margin:10px 14px 0;padding:8px 10px;border-radius:8px;background:var(--surface-2);font-size:13px;color:var(--ink-2)}
.promise b{color:var(--ink)}
.shared{margin-bottom:16px}
.shared .col-head{border-bottom:1px solid var(--line)}
.shared .tlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:0 8px}
.person-card{padding:14px 16px;margin-bottom:14px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.person-card .who{flex:1;min-width:160px}

/* segmented + filters */
.seg{display:flex;gap:4px;padding:4px;background:var(--surface-2);border-radius:12px;overflow-x:auto;margin-bottom:12px;max-width:100%}
.seg input,.chips input,.radios input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.seg label{flex:none;min-height:44px;display:inline-flex;align-items:center;gap:8px;padding-inline:8px 14px;border-radius:9px;cursor:pointer;white-space:nowrap;font-weight:600;color:var(--ink-2)}
.seg.plain label{padding-inline:14px}
.seg input:checked + label{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.seg input:focus-visible + label,.chips input:focus-visible + label,.radios input:focus-visible + label{outline:2px solid var(--focus);outline-offset:1px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.chips label{min-height:44px;display:inline-flex;align-items:center;padding-inline:14px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);cursor:pointer;font-weight:600;font-size:14px;color:var(--ink-2)}
.chips input:checked + label{background:var(--ink);border-color:var(--ink);color:var(--bg)}

/* phase sections */
.phase{margin-bottom:14px;overflow:hidden}
.phase-head{display:grid;grid-template-columns:auto 1fr auto;gap:4px 14px;align-items:start;width:100%;text-align:start;background:none;border:0;padding:16px;color:inherit}
.phase-head.static{grid-template-columns:auto 1fr}
.phase-num{font-family:var(--font-display);font-weight:700;font-size:30px;line-height:1;color:var(--accent);min-width:28px}
.phase-title{font-weight:700;font-size:18px;overflow-wrap:anywhere}
.phase-goal{color:var(--ink-2);font-size:14px;margin-top:2px}
.phase-stats{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin-top:10px;font-size:13px;color:var(--ink-2)}
.phase-stats .bar{flex:1 1 140px;max-width:260px}
.chev{width:10px;height:10px;border-inline-end:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(calc(45deg * var(--dir)));margin:8px 6px 0;transition:transform .2s}
[aria-expanded="true"] .chev{transform:rotate(calc(225deg * var(--dir)))}
.phase-now{display:inline-block;margin-inline-start:8px;padding-inline:8px;padding-block:1px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:700;vertical-align:2px}
.phase-body{border-top:1px solid var(--line);padding-bottom:6px}
.ws-title{font-size:13px;font-weight:700;color:var(--ink-2);padding:12px 14px 0;margin:0}
.phase-add{padding:4px 14px 10px}
.filters-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.filters-row .field{flex:1 1 150px;min-width:0}
.filters-row .field.grow{flex:2 1 220px}
.result-note{font-size:14px;color:var(--ink-2);margin:-6px 0 12px}

/* forms */
.field{display:grid;gap:6px;min-width:0}
.flabel{font-size:13px;font-weight:700;color:var(--ink-2)}
input[type=text],input[type=search],input[type=date],input[type=tel],input[type=email],input[type=password],select,textarea{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface);color:var(--ink)}
input[dir="ltr"]{text-align:start}
:root[dir="rtl"] input[dir="ltr"]{text-align:end}
textarea{resize:vertical;min-height:84px;line-height:1.45}
input::placeholder,textarea::placeholder{color:var(--ink-3)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.row2{grid-template-columns:1fr}}
.checks{display:flex;flex-wrap:wrap;gap:6px}
.checkpill{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding-inline:8px 12px;border:1px solid var(--line-2);border-radius:999px;cursor:pointer;font-size:14px;font-weight:600;background:var(--surface)}
.checkpill input{width:18px;height:18px;accent-color:var(--accent);margin:0}
.radios{display:flex;flex-wrap:wrap;gap:6px}
.radios label{min-height:44px;display:inline-flex;align-items:center;padding-inline:14px;border-radius:999px;border:1px solid var(--line-2);cursor:pointer;font-weight:700;font-size:14px;background:var(--surface);color:var(--ink-2)}
.radios input[value=todo]:checked + label{background:var(--s-todo-bg);color:var(--s-todo-fg);border-color:var(--s-todo-fg)}
.radios input[value=doing]:checked + label{background:var(--s-doing-bg);color:var(--s-doing-fg);border-color:var(--s-doing-fg)}
.radios input[value=blocked]:checked + label{background:var(--s-blocked-bg);color:var(--s-blocked-fg);border-color:var(--s-blocked-fg)}
.radios input[value=done]:checked + label{background:var(--s-done-bg);color:var(--s-done-fg);border-color:var(--s-done-fg)}
.hint{font-size:13px;color:var(--ink-3)}
.err{font-size:13px;color:var(--s-blocked-fg);font-weight:600}
.inline-btns{display:flex;flex-wrap:wrap;gap:6px}
.input-copy{display:flex;gap:6px}
.fs{border:0;margin:0;padding:0;display:grid;gap:6px;min-width:0}
.fs .seg{margin:0}

/* translation readout */
.tx-box{border:1px solid var(--line);border-inline-start:3px solid var(--accent);border-radius:10px;padding:10px 12px;background:var(--surface-2);display:grid;gap:8px}
.tx-head{display:flex;align-items:center;gap:8px;justify-content:space-between}
.tx-head .flabel{color:var(--ink-3)}
.tx-field .flabel{display:block;font-size:12px;color:var(--ink-3)}
.tx-text{white-space:pre-wrap;overflow-wrap:anywhere;margin:0}
.tx-toggle{min-height:36px;padding-inline:10px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);font-size:13px;font-weight:600;color:var(--ink-2)}
.tx-toggle[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* dialogs */
dialog{color:var(--ink)}
dialog::backdrop{background:var(--scrim)}
dialog.sheet{border:0;padding:0;margin:0;margin-inline-start:auto;width:min(600px,100%);max-width:100%;height:100%;height:100dvh;max-height:100%;max-height:100dvh;background:var(--surface);box-shadow:var(--shadow);overflow:hidden}
dialog.sheet[open]{animation:slidein .22s ease-out}
@keyframes slidein{from{transform:translateX(calc(24px * var(--dir)));opacity:.4}to{transform:none;opacity:1}}
.sheet-in{display:flex;flex-direction:column;height:100%}
.sheet-head{display:flex;align-items:center;gap:10px;padding-block:max(10px, env(safe-area-inset-top, 0px)) 10px;padding-inline:16px 12px;border-bottom:1px solid var(--line)}
.sheet-head .t{flex:1;min-width:0}
.sheet-title{font-size:20px;overflow-wrap:anywhere}
.sheet-sub{font-size:13px;color:var(--ink-3);overflow-wrap:anywhere}
.x-btn{flex:none;width:44px;height:44px;border-radius:10px;border:0;background:transparent;color:var(--ink-2);font-size:24px;line-height:1}
.x-btn:hover{background:var(--surface-2)}
.sheet-body{flex:1;overflow-y:auto;padding:16px;display:grid;gap:16px;align-content:start}
.sheet-foot{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;padding-block:12px max(12px, env(safe-area-inset-bottom, 0px));padding-inline:16px;border-top:1px solid var(--line);background:var(--surface)}
.sheet-foot .spacer{flex:1}
dialog.center{border:0;padding:0;border-radius:18px;width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);background:var(--surface);box-shadow:var(--shadow);overflow:auto}
.center-in{padding:20px;display:grid;gap:14px}
.dlg-head{display:flex;align-items:flex-start;gap:10px}
.dlg-head > :first-child{flex:1;min-width:0}
.me-head{display:flex;align-items:center;gap:12px}
.me-head .nm{font-weight:700;font-size:18px}
.me-head .em{font-size:13px;color:var(--ink-3);overflow-wrap:anywhere}
.section-box{border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:10px}
.section-box h3{font-size:16px}
.ulist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.uitem{display:flex;gap:10px;align-items:flex-start}
.uitem .ubody{min-width:0;flex:1}
.uhead{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.utext{overflow-wrap:anywhere;white-space:pre-wrap}
.utime{font-size:12px;color:var(--ink-3);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.linkish{background:none;border:0;padding:0;color:var(--accent);font-weight:600;text-align:start;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere;min-height:24px}
.dep{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.confirm{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px;border-radius:10px;background:var(--s-blocked-bg);color:var(--s-blocked-fg);font-weight:600;margin:0}

/* meeting */
.agenda{display:grid;gap:16px}
.agenda .card{padding:16px}
.step-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin-bottom:10px}
.step-n{font-family:var(--font-display);font-weight:700;color:var(--accent);font-size:20px}
.mtg-top{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-bottom:16px}
.mtg-top .mtg-date{width:200px}
.score{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.score-item{border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:8px;align-content:start}
.score-head{display:flex;gap:10px;align-items:center}
.score-head .nm{flex:1;font-weight:700}
.score-num{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}
.score-list{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:14px}
.score-list li{display:flex;gap:6px;align-items:flex-start;overflow-wrap:anywhere}
.mark{flex:none;width:16px;text-align:center;font-weight:700}
.mark.ok{color:var(--s-done-fg)}
.mark.no{color:var(--s-blocked-fg)}
.group{margin-bottom:10px}
.group-h{display:flex;align-items:center;gap:8px;font-weight:700;margin:6px 0 2px}
.group-h .end{margin-inline-start:auto}
.commit-col{border:1px solid var(--line);border-radius:12px;padding:10px 4px 6px;min-width:0}
.commit-col .group-h{padding-inline:10px}
.commit-item{display:flex;align-items:flex-start;gap:4px;cursor:pointer;border-radius:8px;padding-inline-end:8px}
.commit-item:hover{background:var(--surface-2)}
.commit-item .ct{padding-block:10px;min-width:0}
.save-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:flex-end}
.past-title{margin:12px 0 10px}
.past{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.past-head{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:8px 14px;background:none;border:0;text-align:start;color:inherit}
.past-head .t{flex:1;font-weight:700}
.past-body{padding:0 14px 14px;display:grid;gap:10px}
.pre{white-space:pre-wrap;overflow-wrap:anywhere;margin:0}

/* leads */
.lead-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.lead-tools .field{flex:1 1 200px}
.lead-tools .seg{margin:0}
.follow{margin-bottom:18px}
.follow-list{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));margin-top:8px}
.board{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.bcol{flex:0 0 264px;scroll-snap-align:start;background:var(--surface-2);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:120px}
.bcol-h{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:14px;padding:2px 4px 4px}
.lcard{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:grid;gap:6px}
.lcard-main{background:none;border:0;padding:0;text-align:start;color:inherit;min-height:44px;display:grid;gap:2px}
.lcard-main strong{overflow-wrap:anywhere}
.lmeta{font-size:13px;color:var(--ink-3);overflow-wrap:anywhere}
.lnext{font-size:14px;color:var(--ink-2);overflow-wrap:anywhere}
.lnext .badge,.lnext .pill{margin-inline-start:6px}
.lfoot{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.copyable{display:inline-flex;align-items:center;gap:4px;max-width:100%}
.copyable .ctext{user-select:all;-webkit-user-select:all;font-variant-numeric:tabular-nums;font-size:14px;overflow-wrap:anywhere}
.copy-btn{flex:none;min-height:36px;min-width:44px;padding-inline:10px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);font-size:13px;font-weight:600;color:var(--ink-2)}
.input-copy .copy-btn{min-height:44px}
.table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
table{border-collapse:collapse;width:100%;min-width:820px}
th,td{padding:8px 10px;text-align:start;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);background:var(--surface-2)}
:root[lang="he"] th{letter-spacing:0;font-size:13px}
tr:last-child td{border-bottom:0}
td select{min-width:130px}
.owner-inline{display:inline-flex;gap:6px;align-items:center}

/* activity */
.act{padding:6px 16px}
.act .uitem{padding:12px 0;border-bottom:1px solid var(--line)}
.act .uitem:last-child{border-bottom:0}

/* empty + status */
.empty{padding:28px 24px;display:grid;gap:12px;justify-items:start;max-width:560px}
.empty-art{width:44px;height:64px;border-radius:50%;background:var(--surface-3);transform:rotate(calc(22deg * var(--dir)));margin-bottom:4px;position:relative}
.empty-art::after{content:"";position:absolute;inset-inline-start:50%;top:14%;bottom:14%;width:2px;background:var(--line-2);transform:translateX(calc(-50% * var(--dir)))}
.empty h3{font-size:20px}
.empty p{margin:0;color:var(--ink-2)}

/* sign-in and other gate screens */
.gate{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding-block:max(24px, env(safe-area-inset-top, 0px)) 24px;padding-left:max(16px, env(safe-area-inset-left, 0px));padding-right:max(16px, env(safe-area-inset-right, 0px));background:var(--bg)}
.gate-card{width:min(420px,100%);padding:28px 24px;display:grid;gap:14px}
.gate-card h1{font-family:var(--font-display);font-size:26px;margin:0;line-height:1.2}
.gate-card p{margin:0}
.gate-mark{width:22px;height:34px;border-radius:50%;background:var(--accent);transform:rotate(calc(22deg * var(--dir)))}
.gate-form{display:grid;gap:12px}
.gate-msg{min-height:20px;font-size:14px;font-weight:600;color:var(--ink-2)}
.gate-msg.bad{color:var(--s-blocked-fg)}
.gate-msg.good{color:var(--s-done-fg)}
.gate-langs{display:flex;gap:6px;justify-content:flex-end}
.gate-langs button{min-height:36px;padding-inline:10px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);font-weight:600;font-size:13px;color:var(--ink-2)}
.gate-langs button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.bi{display:grid;gap:6px}
.bi + .bi{border-top:1px solid var(--line);padding-top:12px}

#toasts{position:fixed;left:50%;bottom:max(16px, env(safe-area-inset-bottom, 0px));transform:translateX(-50%);z-index:100;display:grid;gap:8px;width:min(440px, calc(100% - 32px));pointer-events:none}
.toast{pointer-events:auto;background:var(--ink);color:var(--bg);padding:12px 16px;border-radius:12px;font-weight:600;font-size:14px;box-shadow:var(--shadow);animation:pop .2s ease-out;text-align:start}
.toast.error{background:var(--s-blocked-fg);color:var(--surface)}
@keyframes pop{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}
