/* activities.ai: tokens come straight from the approved screens */
:root{
  --bg:#FAFAF7; --panel:#FFFFFF; --ink:#16181D; --mute:#5B6168; --line:#E3E2DB; --border:#D5D4CC;
  --seg:#EFEEE8; --teal:#0B6B63; --teal-soft:#E6F2EF; --teal-bar:#D3E8E4; --indigo-soft:#E9EAFB; --indigo:#3730A3;
  --danger:#B42318; --call:#1F2937;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45;min-height:100vh;
  padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)}
button{font-family:inherit;cursor:pointer;color:inherit}
input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
a{color:var(--teal)}
:focus-visible{outline:3px solid #7CC4BB;outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none!important}

/* shells */
.col{max-width:430px;margin:0 auto;min-height:100vh;padding:20px 24px calc(28px + env(safe-area-inset-bottom,0));display:flex;flex-direction:column;gap:20px}
.bar{display:flex;align-items:center;justify-content:space-between;gap:8px}
.brand{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:700;letter-spacing:-.01em;text-decoration:none;color:var(--ink)}
.mark{width:28px;height:28px;border-radius:8px;background:var(--teal);display:flex;align-items:center;justify-content:center;flex:none}
.link-btn{min-height:44px;padding:0 4px;border:0;background:transparent;font-size:15px;font-weight:600;color:var(--teal);text-decoration:none;display:inline-flex;align-items:center}
.icon-btn{width:44px;height:44px;border:0;background:transparent;display:flex;align-items:center;justify-content:center;border-radius:22px;margin-left:-10px}
h1{font-size:38px;line-height:1.1;font-weight:700;letter-spacing:-.03em}
h1.md{font-size:28px;letter-spacing:-.02em}
.sub{color:var(--mute);font-size:17px;line-height:1.5}
.lab{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.field{display:flex;flex-direction:column;gap:8px}
.input{height:56px;border-radius:14px;border:2px solid var(--border);background:#fff;padding:0 16px;font-size:18px;width:100%}
.input:focus{border-color:var(--teal);outline:none}
.input.sm{height:48px;font-size:15px;border-width:1px;border-radius:24px;padding:0 18px}
.input.sm:focus{border-width:1px;border-color:var(--teal)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;text-decoration:none;color:var(--ink);min-height:44px;padding:0 16px;border-radius:22px;border:1px solid var(--border);background:#fff;font-size:14px;font-weight:500}
.chip.on{background:var(--teal);border-color:var(--teal);color:#fff}
.chip.ghost{border-color:var(--teal);background:var(--teal-soft);color:var(--teal);font-weight:600}
.btn{height:56px;border-radius:28px;border:0;background:var(--teal);color:#fff;font-size:17px;font-weight:600;padding:0 28px;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.btn.block{width:100%}
.btn.sm{height:44px;font-size:14px;padding:0 20px;border-radius:22px}
.btn.line{background:#fff;color:var(--teal);border:1px solid var(--teal)}
.btn.plain{background:#fff;color:var(--ink);border:1px solid var(--border)}
.btn.danger{background:var(--danger)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.hint{font-size:13px;color:var(--mute);text-align:center}
.grow{flex:1}
.stack{display:flex;flex-direction:column;gap:10px}
.center-y{flex:1;display:flex;flex-direction:column;justify-content:center;gap:28px}
.seg{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--seg)}
.seg button{flex:1;min-height:44px;padding:0 16px;border-radius:10px;font-size:14px;background:transparent;border:1px solid transparent;color:#3A3F46;font-weight:500}
.seg button.on{background:#fff;color:var(--teal);font-weight:700;border-color:var(--border)}
.seg.fit{display:inline-flex}
.seg.fit button{flex:none}

/* lists */
.task-pick{display:flex;align-items:center;gap:12px;min-height:44px;padding:8px 14px;background:#fff;border:1px solid var(--line);border-radius:12px}
.task-pick .dot{width:8px;height:8px;border-radius:4px;background:var(--teal);flex:none}
.task-pick span.t{flex:1;font-size:15px}
.task-pick button{border:0;background:transparent;color:var(--mute);width:36px;height:36px;font-size:20px;border-radius:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;text-align:left;width:100%}
a.card:hover,button.card:hover{border-color:var(--teal)}
.card .row{display:flex;justify-content:space-between;align-items:center;gap:10px}
.card .name{font-size:16px;font-weight:600}
.badge{font-size:12px;font-weight:600;border-radius:12px;padding:3px 10px;flex:none}
.badge.private{background:var(--seg);color:#3A3F46}.badge.shared{background:var(--teal-soft);color:var(--teal)}.badge.public{background:var(--indigo-soft);color:var(--indigo)}
.prog{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--mute)}
.prog .track{flex:1}
.track{height:8px;border-radius:4px;background:var(--line);overflow:hidden}
.track i{display:block;height:100%;background:var(--teal);border-radius:4px;transition:width .25s}
.empty{border:1.5px dashed var(--border);border-radius:16px;padding:22px;color:var(--mute);text-align:center}
.fab{position:sticky;bottom:0;align-self:stretch;margin-top:auto;padding:24px 0 calc(16px + env(safe-area-inset-bottom,0));margin-bottom:-12px;background:linear-gradient(to bottom,rgba(250,250,247,0),var(--bg) 40%)}

/* avatars */
.av{width:32px;height:32px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:#fff;flex:none}
.av.lg{width:36px;height:36px;border-radius:18px;border:2px solid var(--bg)}
.avs{display:flex;align-items:center}.avs .av+.av{margin-left:-8px}
.person{display:flex;align-items:center;gap:12px;min-height:48px}
.person .nm{flex:1;font-size:15px;font-weight:500}.person .st{font-size:13px;color:var(--mute)}

/* board */
.board{max-width:1280px;margin:0 auto;padding:16px 16px calc(32px + env(safe-area-inset-bottom,0));display:flex;flex-direction:column;gap:16px}
.board-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.board-head .l{display:flex;align-items:center;gap:10px;min-width:0}
.board-head h1{font-size:24px;letter-spacing:-.02em;overflow-wrap:anywhere}
.board-head .r{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.vis-note{font-size:14px;color:var(--mute)}
.tabs{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--seg)}
.tabs button{flex:1;min-height:44px;border-radius:10px;border:1px solid transparent;background:transparent;font-size:14px;color:#3A3F46;font-weight:500}
.tabs button.on{background:#fff;color:var(--teal);font-weight:700;border-color:var(--border)}
.panes{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
.pane{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:14px;min-width:0}
.pane h2{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--teal)}
.pane .hd{display:flex;align-items:baseline;justify-content:space-between}
.pane .hd b{font-size:14px;font-weight:600}
#sec-do{flex:1 1 340px}#sec-discuss{flex:1.4 1 420px}#sec-call{flex:0 1 320px;background:none;border:0;padding:0;gap:16px}
.t-row{display:flex;align-items:center;gap:4px;min-height:60px;padding:0 12px 0 4px;background:var(--bg);border:1px solid var(--line);border-radius:14px}
.t-row .ck{width:44px;height:44px;border:0;background:transparent;display:flex;align-items:center;justify-content:center;flex:none}
.t-row .ck span{width:24px;height:24px;border-radius:12px;border:2px solid #B8B7AE;display:flex;align-items:center;justify-content:center}
.t-row.done .ck span{background:var(--teal);border-color:var(--teal)}
.t-row .ck svg{display:none}.t-row.done .ck svg{display:block}
.t-row .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;padding:6px 0;text-align:left;border:0;background:none}
.t-row .tt{font-size:15px;font-weight:500;overflow-wrap:anywhere}.t-row.done .tt{text-decoration:line-through;color:var(--mute)}
.t-row .mt{font-size:13px;color:var(--mute)}.t-row .mt.late{color:var(--danger);font-weight:600}
.t-row .own{border:0;background:none;padding:0}
.add-row{display:flex;gap:8px}
.add-row .go{width:48px;height:48px;border-radius:24px;border:0;background:var(--teal);display:flex;align-items:center;justify-content:center;flex:none}
.poll{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px}
.poll .q{font-size:15px;font-weight:600}
.opt{position:relative;overflow:hidden;min-height:44px;border-radius:10px;border:1px solid var(--border);background:#fff;padding:0;text-align:left;width:100%}
.opt.mine{border-color:var(--teal)}
.opt i{position:absolute;top:0;bottom:0;left:0;background:var(--teal-bar);transition:width .25s}
.opt span{position:relative;display:flex;justify-content:space-between;padding:0 12px;min-height:44px;align-items:center;font-size:14px;font-weight:500}
.opt.mine span{font-weight:600}
.feed{display:flex;flex-direction:column;gap:12px;max-height:520px;overflow-y:auto;padding-right:2px}
.msg{display:flex;gap:10px;align-items:flex-start}.msg.me{flex-direction:row-reverse}
.msg .who{font-size:13px;font-weight:600}.msg .col2{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:85%}.msg.me .col2{align-items:flex-end}
.bubble{background:var(--bg);border:1px solid var(--line);border-radius:4px 14px 14px 14px;padding:10px 14px;line-height:1.45;overflow-wrap:anywhere;display:flex;flex-direction:column;gap:8px}
.msg.me .bubble{background:var(--teal-soft);border-color:transparent;border-radius:14px 4px 14px 14px;color:#0E2F2B}
.tag{align-self:flex-start;font-size:13px;font-weight:600;color:var(--teal);background:var(--teal-soft);border-radius:12px;padding:4px 10px}
.event{display:flex;align-items:center;gap:10px;color:var(--mute);font-size:13px}.event:before,.event:after{content:"";flex:1;height:1px;background:var(--line)}
.composer{display:flex;gap:8px;flex-wrap:wrap}
.composer .input{flex:1 1 180px;min-width:0}
.composer select{height:48px;border-radius:24px;border:1px solid var(--border);background:#fff;padding:0 12px;max-width:140px;font-size:13px}
.tools{display:flex;flex-wrap:wrap;gap:8px}
.wb{border:1px solid var(--line);border-radius:14px;background-color:#fff;background-image:radial-gradient(var(--border) 1px,transparent 1px);background-size:20px 20px;overflow:hidden;touch-action:none}
.wb canvas{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair}
.call-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:14px}
.call-card h2{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--teal)}
.tiles{display:flex;flex-wrap:wrap;gap:8px}
.tile{flex:1 1 80px;min-width:0;background:var(--call);border-radius:14px;padding:12px 6px;display:flex;flex-direction:column;align-items:center;gap:6px}
.tile .av{width:40px;height:40px;border-radius:20px;font-size:15px}
.tile .n{font-size:12px;color:#fff;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile .s{font-size:11px;color:#D1D5DB}.tile.speaking .s{color:#A7F3D0}.tile.speaking .av{box-shadow:0 0 0 3px #34D399}
.row-btns{display:flex;gap:8px}.row-btns .btn{flex:1;padding:0 4px;font-size:14px}

/* sheets (invite, add task, poll) */
.scrim{position:fixed;inset:0;background:rgba(22,24,29,.45);display:flex;align-items:flex-end;justify-content:center;z-index:50}
.sheet{background:var(--bg);width:100%;max-width:430px;max-height:94vh;overflow-y:auto;border-radius:24px 24px 0 0;padding:20px 24px calc(24px + env(safe-area-inset-bottom,0));display:flex;flex-direction:column;gap:18px}
@media(min-width:600px){.scrim{align-items:center}.sheet{border-radius:24px}}
.sheet .bar h1{font-size:28px}
.switch{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px}
.switch b{display:block;font-size:15px}.switch small{color:var(--mute);font-size:13px}
.sw{width:52px;height:32px;border-radius:16px;border:0;background:#8A8F96;position:relative;flex:none;transition:background .15s}
.sw i{position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:13px;background:#fff;transition:left .15s}
.sw[aria-checked=true]{background:var(--teal)}.sw[aria-checked=true] i{left:23px}
.sentence{background:var(--teal-soft);color:#0E2F2B;border-radius:12px;padding:12px 14px;font-weight:500}
.linkrow{display:flex;gap:8px}.linkrow .input{height:48px;font-size:15px;border-width:1px}
select.sel{height:44px;border-radius:22px;border:1px solid var(--border);background:#fff;padding:0 14px;font-weight:600;font-size:14px}
.share-row{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px}
#toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0));transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:10px 16px;border-radius:14px;opacity:0;pointer-events:none;transition:.2s;z-index:80;max-width:90vw;font-size:14px}
#toast.show{opacity:1;transform:translate(-50%,0)}
.spin{color:var(--mute);padding:40px 0;text-align:center}

/* board layout: one section at a time on phones, all three side by side on wide screens */
@media(max-width:979px){
  .panes>.pane{flex:1 1 100%!important}
  body[data-tab=do] #sec-discuss,body[data-tab=do] #sec-call,
  body[data-tab=discuss] #sec-do,body[data-tab=discuss] #sec-call,
  body[data-tab=call] #sec-do,body[data-tab=call] #sec-discuss{display:none}
  .polls-wide{display:none}
}
@media(min-width:980px){.tabs.narrow{display:none}.polls-narrow{display:none}.board{padding:20px 24px 32px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.hint a{color:var(--teal);font-weight:600;text-decoration:none}

/* ---------- journey pass: navigation, clearer board ---------- */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:space-around;background:rgba(250,250,247,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom,0))}
.tabbar a{flex:1;max-width:120px;min-height:50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;color:var(--mute);font-size:11px;font-weight:600;position:relative;border-radius:12px}
.tabbar a.on{color:var(--teal)}
.tabbar .dot{position:absolute;top:6px;left:calc(50% + 6px);width:9px;height:9px;border-radius:5px;background:var(--danger);border:2px solid var(--bg)}
.col.has-nav{padding-bottom:calc(92px + env(safe-area-inset-bottom,0))}
.has-nav .fab{bottom:calc(58px + env(safe-area-inset-bottom,0));margin-bottom:0}
@media(min-width:760px){
  .tabbar{position:sticky;top:0;bottom:auto;border-top:0;border-bottom:1px solid var(--line);justify-content:center;gap:6px;padding:6px 8px}
  .tabbar a{flex:none;max-width:none;flex-direction:row;gap:8px;padding:0 18px;min-height:44px;font-size:14px}
  .tabbar .dot{position:static;margin-left:2px}
  .col.has-nav{padding-bottom:28px}
  .has-nav .fab{bottom:0}
}
.vcards{display:flex;flex-direction:column;gap:8px}
.vcard{display:flex;gap:12px;align-items:flex-start;text-align:left;background:#fff;border:1.5px solid var(--border);border-radius:14px;padding:12px 14px;min-height:56px;width:100%}
.vcard b{display:block;font-size:15px}.vcard small{display:block;color:var(--mute);font-size:13px;line-height:1.35;margin-top:1px}
.vcard .rd{width:20px;height:20px;border-radius:10px;border:2px solid #B8B7AE;flex:none;margin-top:2px;position:relative}
.vcard.on{border-color:var(--teal);background:var(--teal-soft)}
.vcard.on .rd{border-color:var(--teal)}.vcard.on .rd:after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--teal)}
.status{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;border:0;background:var(--seg);color:#3A3F46;border-radius:99px;padding:5px 10px 5px 12px;font-size:13px;font-weight:500;min-height:32px}
.status:disabled{background:transparent;padding-left:0;color:var(--mute)}
.board-head .r{flex-wrap:nowrap}
.coach{position:relative;background:var(--teal-soft);border:1px solid #BFE0D9;border-radius:14px;padding:14px 40px 14px 14px;display:flex;flex-direction:column;gap:8px;color:#0E2F2B}
.coach b{font-size:15px}.coach span{font-size:14px;line-height:1.4}
.coach .x{position:absolute;top:4px;right:4px;width:36px;height:36px;border:0;background:none;font-size:22px;color:var(--mute);border-radius:18px}
.nudge{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:#fff;border:1px solid var(--teal);border-radius:14px;padding:10px 14px;min-height:52px;color:var(--teal)}
.nudge b{flex:1;font-size:14px;color:var(--ink)}.nudge span{font-size:13px;font-weight:600}
.t-row .mt{display:flex;flex-wrap:wrap;gap:0 6px;align-items:center}
.t-row .mt i{font-style:normal;color:#B8B7AE}
.t-row .mt .ph{color:#8A8F96}
.t-row .mt .late{color:var(--danger);font-weight:600}
.subrow{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.linkish{border:0;background:none;color:var(--teal);font-weight:600;font-size:14px;min-height:36px;padding:0}
.subrow select{height:40px;border-radius:20px;border:1px solid var(--border);background:#fff;padding:0 12px;font-size:13px;max-width:100%}
.rowlinks{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.rowlink{display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 16px;background:none;border:0;border-bottom:1px solid var(--line);text-align:left;text-decoration:none;color:var(--ink);width:100%}
.rowlink:last-child{border-bottom:0}.rowlink>span:first-child{flex:1}.rowlink b{display:block;font-size:15px}.rowlink small{display:block;color:var(--mute);font-size:13px}
details.more summary{cursor:pointer;font-weight:600;color:var(--teal);min-height:44px;display:flex;align-items:center}
@media(max-width:979px){#do-h,#dis-h,#call-card>h2{display:none}.pane .hd{justify-content:flex-end}}
@media(min-width:980px){#poll-nudge{display:none}}

/* board header: one tidy row on every width */
.board-head{flex-wrap:nowrap;align-items:flex-start;gap:12px}
.board-head .l{flex:1;min-width:0;align-items:flex-start;gap:8px}
.board-head .l .icon-btn{margin-top:-2px!important}
.board-head .r{flex:none;gap:10px;align-items:center}
.board-head h1{font-size:22px;line-height:1.2}
@media(min-width:980px){.board-head h1{font-size:26px}}
@media(max-width:520px){#h-avs{display:none}}

/* invitee journey */
.steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:1.4}
.take{border:1px solid var(--teal);background:#fff;color:var(--teal);font-weight:600;font-size:13px;border-radius:99px;min-height:36px;padding:0 12px;flex:none;white-space:nowrap}

/* ================= PRD v2 workspace: sheet + discuss drawer + whiteboard ================= */
.ws{max-width:none;margin:0;padding:12px 16px calc(20px + env(safe-area-inset-bottom,0));display:flex;flex-direction:column;gap:12px;min-height:100vh}
.ws-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ws-head .l{display:flex;gap:8px;align-items:flex-start;min-width:0;flex:1 1 260px}
.ws-head h1{font-size:22px;letter-spacing:-.02em;line-height:1.2;overflow-wrap:anywhere}
.ws-head .r{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.hbtns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.badge-n{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;margin-left:8px;border-radius:10px;background:var(--danger);color:#fff;font-size:12px;font-weight:700}
.ws-body{display:flex;gap:16px;align-items:flex-start}
.sheet-pane{flex:1;min-width:0;background:#fff;border:1px solid var(--line);border-radius:20px;display:flex;flex-direction:column;overflow:hidden}
.sheet-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
.st-left{display:flex;flex-direction:column;gap:2px}.st-left b{font-size:15px}
.st-right{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.seg.fit button small{display:block;font-size:10px;font-weight:600;color:var(--mute);line-height:1}
.sheet-scroll{overflow:auto;max-height:calc(100vh - 330px);min-height:220px}
.gsheet{min-width:max-content}
.grow{display:grid;grid-template-columns:var(--cols);border-bottom:1px solid var(--line);background:#fff}
.grow.kid{background:#FBFBF8}.grow.sel{background:#F1F8F6}.grow.isdone .ttl{color:var(--mute)}
.gcell{padding:8px 12px;display:flex;align-items:flex-start;min-width:0;position:relative}
.gcell.c-task{padding:6px 12px 6px 8px}
.ghead{position:sticky;top:0;z-index:3;background:var(--bg);border-bottom:2px solid var(--line)}
.gh{align-items:center;padding:6px 10px;gap:4px}
.gh-b{border:0;background:none;text-align:left;display:flex;flex-direction:column;gap:0;font-size:13px;font-weight:700;min-height:36px;padding:0 4px;border-radius:6px}
.gh-b small{font-size:10px;font-weight:500;color:var(--mute);text-transform:uppercase;letter-spacing:.06em}
.gh .arrow{font-size:13px;color:var(--teal);font-weight:700}
.gh .hm{margin-left:auto;width:32px;height:32px;font-size:18px;line-height:1}
.sumrow{background:var(--bg);border-top:2px solid var(--line);font-size:13px;color:var(--mute);position:sticky;bottom:0}
.gcell.sum{align-items:center;min-height:40px;font-weight:600}
.tcell{display:flex;flex-direction:column;gap:6px;min-width:0;width:100%}
.tcell.kid{padding-left:22px}
.trow{display:flex;align-items:flex-start;gap:6px;min-width:0;flex-wrap:wrap}
.chev{width:28px;height:36px;border:0;background:none;display:flex;align-items:center;justify-content:center;color:var(--mute);transform:rotate(90deg);flex:none}
.chev.c{transform:rotate(0)}.chev-sp{width:28px;flex:none}
.tick,.cbx{width:36px;height:36px;border:0;background:none;display:flex;align-items:center;justify-content:center;flex:none;padding:0}
.tick span,.cbx span{width:22px;height:22px;border-radius:11px;border:2px solid #B8B7AE;display:flex;align-items:center;justify-content:center}
.cbx span{border-radius:6px}
.tick svg,.cbx svg{display:none}.tick.on svg,.cbx.on svg{display:block}
.tick.on span,.cbx.on span{background:var(--teal);border-color:var(--teal)}
.ttl{border:0;background:none;text-align:left;font-size:15px;font-weight:500;line-height:1.35;padding:7px 4px;flex:1 1 120px;min-width:0;overflow-wrap:anywhere;white-space:normal;border-radius:8px}
.ttl:hover{background:var(--bg)}.ttl.done{text-decoration:line-through;color:var(--mute)}
.kid .ttl{font-weight:400}
.prio{border:0;border-radius:99px;font-size:12px;font-weight:700;padding:3px 10px;min-height:28px;align-self:center}
.kids{font-size:12px;font-weight:600;color:var(--mute);background:var(--seg);border-radius:99px;padding:2px 8px;align-self:center}
.addsub{width:32px;height:32px;border-radius:16px;border:1px dashed var(--border);background:none;color:var(--teal);font-size:18px;align-self:center;line-height:1}
.ctls{display:flex;flex-wrap:wrap;gap:6px;padding-left:34px}
.ctl{border:1px solid var(--border);background:#fff;border-radius:99px;min-height:36px;padding:0 12px;font-size:13px;font-weight:600}
.ctl:disabled{opacity:.4;cursor:not-allowed}.ctl:last-child{color:var(--danger)}
.pp{display:flex;align-items:center;gap:8px;border:0;background:none;min-height:36px;padding:0 4px;border-radius:99px;font-size:14px;max-width:100%}
.pp:hover:not(:disabled){background:var(--bg)}.pp .ph{color:var(--mute)}
.pp .av{width:26px;height:26px;font-size:12px}.av.ghost{background:var(--seg)!important;color:var(--mute)}
.dbtn.late{color:var(--danger);font-weight:600}
.spill{border:0;border-radius:99px;font-size:13px;font-weight:600;padding:0 12px;min-height:32px;align-self:center}
.ctxt{border:0;background:none;text-align:left;font-size:14px;min-height:36px;padding:0 4px;border-radius:8px;overflow-wrap:anywhere;white-space:normal;line-height:1.35;color:var(--ink)}
.ctxt:hover:not(:disabled){background:var(--bg)}.ctxt.empty{color:#8A8F96}
.cinput{width:100%;min-height:36px;border:2px solid var(--teal);border-radius:8px;padding:0 8px;font-size:14px;background:#fff}
button:disabled.pp,button:disabled.spill,button:disabled.ctxt{cursor:not-allowed}
.talk{display:flex;align-items:center;gap:4px;border:0;background:none;color:var(--mute);min-height:36px;padding:0 8px;border-radius:99px;margin:0 auto}
.talk.has{color:var(--teal);background:var(--teal-soft);font-weight:700}
.pres{outline:2px solid var(--pc,#4F46E5);outline-offset:-2px}
.pres::after{content:attr(data-who);position:absolute;top:0;right:0;background:var(--pc,#4F46E5);color:#fff;font-size:10px;font-weight:700;padding:1px 6px;border-radius:0 0 0 6px;z-index:2}
.addbar{padding:12px 16px 14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px;background:#fff}
.addrow{display:flex;gap:8px}.addrow .input{flex:1;min-width:0}
.subbar{display:flex;align-items:center;justify-content:space-between;background:var(--teal-soft);color:#0E2F2B;border-radius:10px;padding:4px 4px 4px 12px;font-size:14px;font-weight:600}
.subbar .x{width:36px;height:36px;font-size:20px}
.pop{position:absolute;z-index:70;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 8px 28px rgba(22,24,29,.18);padding:6px;min-width:200px;max-width:min(320px,92vw);display:flex;flex-direction:column;gap:2px}
.pop hr{border:0;border-top:1px solid var(--line);margin:4px 0}
.pi{display:flex;flex-direction:column;align-items:flex-start;gap:0;border:0;background:none;text-align:left;border-radius:10px;min-height:44px;padding:6px 12px;font-size:14px;font-weight:500;width:100%;justify-content:center}
.pi:hover:not(:disabled),.pi:focus-visible{background:var(--bg)}.pi:disabled{opacity:.45}.pi small{color:var(--mute);font-size:12px;font-weight:400}.pi.danger{color:var(--danger)}
.pi .av{width:24px;height:24px;font-size:11px;display:inline-flex;margin-right:8px;vertical-align:middle}.pnote{padding:8px 12px;font-size:14px;line-height:1.4}
.kanban{display:flex;gap:12px;padding:14px 16px;overflow:auto}
.kcol{flex:0 0 240px;display:flex;flex-direction:column;gap:8px;background:var(--bg);border-radius:14px;padding:8px}
.kcol h3{font-size:13px;border-radius:99px;padding:6px 12px;display:flex;justify-content:space-between;font-weight:700}
.kcard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;font-size:14px}
.kmeta{display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--mute)}.kmeta .av{width:22px;height:22px;font-size:10px}.kmeta .late{color:var(--danger);font-weight:600}
.kmove{display:flex;gap:6px}.kmove .x{border:1px solid var(--border);width:44px;height:36px;border-radius:10px;font-size:13px}.kmove .x:disabled{opacity:.35}
.timeline{overflow:auto;max-height:calc(100vh - 330px)}
.tl-scroll{min-width:max-content}
.tl-head,.tl-row{display:flex;border-bottom:1px solid var(--line);align-items:stretch}
.tl-head{position:sticky;top:0;background:var(--bg);z-index:2}
.tl-name{flex:0 0 260px;padding:8px 12px;font-size:14px;display:flex;align-items:center;gap:6px;position:sticky;left:0;background:inherit;z-index:1;overflow-wrap:anywhere}
.tl-row{background:#fff}.tl-row.kid{background:#FBFBF8}.tl-row.kid .tl-name{padding-left:30px;font-size:13px}
.tl-days,.tl-track{display:grid;align-items:center}.tl-d{text-align:center;font-size:12px;padding:6px 0;color:var(--mute);border-left:1px solid var(--line)}.tl-d small{display:block;font-size:10px}.tl-d.today{color:var(--teal);font-weight:700;background:var(--teal-soft)}
.tl-track{background-image:linear-gradient(to right,var(--line) 1px,transparent 1px);background-size:40px 100%}
.tl-mark{height:16px;width:16px;border-radius:8px;background:var(--teal);justify-self:center}.tl-mark.done{background:#B8B7AE}
/* drawer */
.drawer{flex:0 0 380px;width:380px;background:#fff;border:1px solid var(--line);border-radius:20px;display:flex;flex-direction:column;max-height:calc(100vh - 120px);position:sticky;top:12px;overflow:hidden}
.dr-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px 6px}.dr-head h2{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--teal)}.dr-head .x{width:36px;height:36px;font-size:22px;border:0;background:none;color:var(--mute)}
.dr-scroll{overflow-y:auto;padding:6px 16px;display:flex;flex-direction:column;gap:14px;flex:1;min-height:0}
.dr-foot{padding:10px 16px 14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.dr-scroll .feed{max-height:none;overflow:visible}
.thread-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--teal-soft);border-radius:10px;padding:6px 12px;font-size:13px}
.callcard{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
.callcard h3{font-size:16px;letter-spacing:-.01em}.cc-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.incall{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600}.live{width:10px;height:10px;border-radius:5px;background:#34D399;display:inline-block}
.tile.listener{background:#374151}.tile .hc{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:2px}.tile .hc .linkish{color:#A7F3D0;font-size:12px;min-height:28px}
.hostbox{border-top:1px dashed var(--border);padding-top:10px;display:flex;flex-direction:column;gap:8px}
.req{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:13px}.req span{flex:1 1 100%}
.presenting{background:#fff;border:1px solid var(--teal);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px}
.screenbox{background:#111;border-radius:10px;min-height:70px;overflow:hidden;display:flex;align-items:center;justify-content:center}.screenbox .hint{color:#ccc}
.screenvid{width:100%;max-height:260px;object-fit:contain;background:#000}
.callpill{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--call);color:#fff;border-radius:99px;padding:6px 8px 6px 16px;align-self:flex-start;position:sticky;top:8px;z-index:20}
.callpill .btn{height:36px;min-height:36px}.callpill .btn.plain{background:rgba(255,255,255,.12);color:#fff;border-color:transparent}
/* phone: the sheet becomes one card per row and the drawer a full-screen layer */
.cards-view{display:flex;flex-direction:column;gap:10px;padding:12px}
.tcard{border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:#fff;display:flex;flex-direction:column;gap:6px}.tcard.kid{margin-left:18px;background:#FBFBF8}.tcard.sel{border-color:var(--teal);background:#F1F8F6}
.kvs{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;padding-left:34px}.kv{display:flex;flex-direction:column;min-width:0}.kv .k{font-size:11px;color:var(--mute);text-transform:uppercase;letter-spacing:.05em}.kv .gcell{padding:0}
@media(max-width:759px){
  .ws{padding:10px 10px calc(16px + env(safe-area-inset-bottom,0))}
  .ws-body{display:block}
  .sheet-scroll{max-height:none}
  .drawer{position:fixed;inset:0;width:auto;max-height:none;border-radius:0;z-index:45;top:0}
  .drawer[hidden]{display:none}
  .callpill{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0));top:auto;justify-content:space-between;z-index:44}
  .st-right{width:100%}
}
@media(min-width:760px) and (max-width:1100px){.drawer{flex-basis:320px;width:320px}}
/* whiteboard: full screen, unlimited canvas */
.wbo{position:fixed;inset:0;z-index:60;background:var(--bg);display:flex;flex-direction:column}
.wb-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;background:#fff;border-bottom:1px solid var(--line);flex-wrap:wrap}
.wb-head .l,.wb-head .r{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.wb-stage{position:relative;flex:1;min-height:0;overflow:hidden;background:#fff;touch-action:none}
.wb-stage canvas{display:block;touch-action:none}
.wb-bar{position:absolute;left:50%;bottom:calc(46px + env(safe-area-inset-bottom,0));transform:translateX(-50%);background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:0 6px 24px rgba(22,24,29,.16);padding:6px;display:flex;gap:2px;align-items:center;max-width:96vw;overflow-x:auto;z-index:62}
.wbt{display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:none;border-radius:12px;min-width:52px;min-height:48px;font-size:11px;font-weight:600;color:#3A3F46;padding:4px 6px}
.wbt.on{background:var(--teal-soft);color:var(--teal)}.wbt:disabled{opacity:.35}
.wb-bar .sep{width:1px;height:30px;background:var(--line);margin:0 6px}
.swatches{display:flex;gap:6px;padding:0 6px}.sw-c{width:28px;height:28px;border-radius:14px;border:1px solid;padding:0}.sw-c.on{outline:3px solid var(--teal);outline-offset:1px}
.wb-sel{position:absolute;top:12px;left:50%;transform:translateX(-50%);background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 6px 24px rgba(22,24,29,.16);padding:6px;display:flex;gap:6px;z-index:62}
.wb-zoom,.wb-hist{position:absolute;bottom:calc(46px + env(safe-area-inset-bottom,0));background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 4px 16px rgba(22,24,29,.12);display:flex;z-index:62}
.wb-zoom{left:12px}.wb-hist{right:12px}
.wb-zoom .x,.wb-hist .x{min-width:44px;height:44px;border:0;background:none;font-size:15px;font-weight:600}.wb-hist .x:disabled{opacity:.35}
.wb-hint{position:absolute;left:0;right:0;bottom:calc(8px + env(safe-area-inset-bottom,0));text-align:center;font-size:13px;color:var(--mute);pointer-events:none;z-index:61}
.wb-edit{position:absolute;z-index:63;border:2px solid var(--teal);border-radius:8px;padding:8px 10px;font:500 16px Inter,system-ui,sans-serif;resize:none;min-width:180px;background:#fff;box-shadow:0 4px 14px rgba(22,24,29,.18)}
.wb-edit.note{width:180px;min-height:104px}
@media(max-width:759px){.wbt span{display:none}.wbt{min-width:42px}.wb-bar{bottom:calc(54px + env(safe-area-inset-bottom,0))}.wb-zoom,.wb-hist{bottom:calc(112px + env(safe-area-inset-bottom,0))}}
/* keep the Task column in view when the sheet scrolls sideways */
.gsheet .grow>.gcell:first-child{position:sticky;left:0;z-index:1;background:inherit}
.gsheet .ghead>.gcell:first-child{z-index:4;background:var(--bg)}
.gsheet .sumrow>.gcell:first-child{background:var(--bg)}
.gsheet .grow.sel>.gcell:first-child{background:#F1F8F6}

.strow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.strow .input{flex:1 1 140px}.donechk{display:flex;align-items:center;gap:6px;font-size:14px;min-height:44px}.donechk input{width:20px;height:20px;accent-color:var(--teal)}