/* =======================================================================
THOUGHT CAPTURE — a self-contained GTD system (Capture → Clarify →
Organise → Reflect → Engage). All classes namespaced .tc-* so they
never collide with the rest of the app. Reuses the global design tokens.
======================================================================= */
.tc-panel{
grid-column:1;grid-row:3;
display:none;flex-direction:column;min-height:0;
overflow:hidden;
}
.tc-panel.visible{display:flex;}
/* Internal sub-navigation (pills) */
.tc-subnav{
flex:0 0 auto;display:flex;align-items:center;gap:6px;
padding:14px 24px 12px;flex-wrap:wrap;
border-bottom:1px solid var(--line-soft);
background:linear-gradient(180deg,rgba(var(--bg-rgb),.6),rgba(var(--bg-rgb),0));
}
.tc-subnav-title{
font-size:var(--fs-page-title);font-weight:800;color:var(--text);
margin:0 14px 0 0;letter-spacing:.2px;display:flex;align-items:center;gap:9px;
}
.tc-subnav-title .tc-logo{
width:30px;height:30px;border-radius:9px;flex:0 0 auto;
background:var(--accent);
display:flex;align-items:center;justify-content:center;color:#fff;
box-shadow:var(--glow-accent);
}
.tc-subnav-title .tc-logo svg{width:17px;height:17px;}
.tc-subnav-spacer{flex:1;}
.tc-subnav-btn{
background:var(--card);border:1px solid var(--line);color:var(--muted);
padding:7px 13px;font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit;
border-radius:9px;transition:color .15s,border-color .15s,background .15s;
display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
}
.tc-subnav-btn:hover{color:var(--text);border-color:var(--line-bright);}
.tc-subnav-btn.active{
color:#fff;border-color:transparent;
background:var(--accent);
box-shadow:var(--glow-accent);
}
.tc-subnav-btn .tc-count{
background:rgba(var(--text-rgb),.16);border-radius:20px;font-size:10.5px;
padding:1px 7px;font-weight:700;min-width:18px;text-align:center;
font-variant-numeric:tabular-nums;
}
.tc-subnav-btn:not(.active) .tc-count{background:var(--accent);color:#fff;}
/* View container — scroll area below the sub-nav */
.tc-scroll{flex:1;min-height:0;overflow-y:auto;padding:22px 24px 40px;}
.tc-view{display:none;flex-direction:column;gap:18px;}
.tc-view.visible{display:flex;}
.tc-view-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.tc-view-title{font-size:var(--fs-section);font-weight:800;color:var(--text);margin:0;display:flex;align-items:center;gap:9px;}
.tc-view-sub{font-size:var(--fs-small);color:var(--faint);margin:3px 0 0;font-weight:500;}
.tc-step-tag{
font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:2px;font-weight:800;
color:var(--accent2-soft);background:rgba(var(--accent2-rgb),.1);
border:1px solid rgba(var(--accent2-rgb),.28);border-radius:7px;padding:4px 9px;
}
/* ---- Capture box ---- */
.tc-capture-card{
background:linear-gradient(160deg,rgba(var(--accent-rgb),.09),var(--card-2));
border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:18px;
transition:border-color .2s,box-shadow .2s;
}
.tc-capture-card:focus-within{border-color:rgba(var(--accent-rgb),.55);box-shadow:0 12px 34px rgba(var(--accent-rgb),.16);}
.tc-capture-card textarea{
width:100%;background:rgba(var(--bg-rgb),.55);border:1px solid var(--line);border-radius:12px;
color:var(--text);font-family:inherit;font-size:15px;line-height:1.55;
padding:13px 14px;resize:none;min-height:62px;outline:none;
transition:border-color .15s,background .15s;
}
.tc-capture-card textarea:focus{border-color:var(--accent);background:var(--bg);}
.tc-capture-card textarea::placeholder{color:var(--faint);}
.tc-capture-foot{display:flex;align-items:center;justify-content:space-between;margin-top:12px;gap:12px;}
.tc-capture-hint{font-size:var(--fs-small);color:var(--faint);}
.tc-capture-hint kbd{
background:var(--card);border:1px solid var(--line);border-radius:5px;
padding:1px 6px;font-size:11px;font-family:inherit;color:var(--muted);
}
/* ---- Buttons ---- */
.tc-btn{
display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-family:inherit;
border-radius:11px;font-size:13px;font-weight:700;padding:10px 17px;border:1px solid var(--line);
background:var(--card);color:var(--text);transition:transform .1s,background .15s,border-color .15s;white-space:nowrap;
}
.tc-btn:active{transform:scale(.97);}
.tc-btn svg{width:15px;height:15px;flex:0 0 auto;}
.tc-btn-primary{background:var(--accent);border-color:transparent;color:#fff;box-shadow:var(--glow-accent);}
.tc-btn-accent2{background:rgba(var(--accent2-rgb),.14);border-color:rgba(var(--accent2-rgb),.4);color:var(--accent2-soft);}
.tc-btn-accent2:hover{background:rgba(var(--accent2-rgb),.24);}
.tc-btn-ghost{background:var(--card);color:var(--muted);}
.tc-btn-ghost:hover{color:var(--text);border-color:var(--line-bright);}
.tc-btn-danger{background:rgba(var(--danger-rgb),.12);border-color:rgba(var(--danger-rgb),.32);color:var(--danger-soft);}
.tc-btn-danger:hover{background:rgba(var(--danger-rgb),.22);}
.tc-btn-sm{padding:5px 11px;font-size:11.5px;border-radius:8px;}
.tc-btn-sm svg{width:12px;height:12px;}
/* ---- Quick-access grid (home) ---- */
.tc-quick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px;}
.tc-quick-card{
background:linear-gradient(160deg,var(--card),var(--card-2));
border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:15px 15px 14px;
cursor:pointer;transition:transform .12s,border-color .15s,background .15s;
display:flex;flex-direction:column;gap:9px;text-align:left;
}
.tc-quick-card:hover{border-color:var(--line-bright);transform:translateY(-2px);background:var(--card-hover);box-shadow:var(--sh-2);}
.tc-quick-ico{
width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;
background:rgba(var(--accent-rgb),.14);color:var(--accent-soft);flex:0 0 auto;
}
.tc-quick-ico svg{width:18px;height:18px;}
.tc-quick-name{font-size:var(--fs-content);font-weight:700;color:var(--text);}
.tc-quick-desc{font-size:var(--fs-caption);color:var(--faint);line-height:1.45;}
.tc-quick-card .tc-quick-n{margin-left:auto;font-size:12px;color:var(--accent-soft);font-weight:800;font-variant-numeric:tabular-nums;}
/* ---- Home hero greeting ---- */
.tc-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.tc-hero-greet{font-size:23px;font-weight:800;color:var(--text);letter-spacing:-.4px;line-height:1.1;}
.tc-hero-sub{font-size:var(--fs-small);color:var(--faint);margin-top:7px;font-weight:550;}
.tc-hero-date{font-size:var(--fs-small);color:var(--muted);font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap;}
/* ---- Capture card header ---- */
.tc-capture-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.tc-capture-headsub{font-size:var(--fs-small);color:var(--faint);font-weight:550;}
/* ---- Home stat strip (clickable KPIs) ---- */
.tc-stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;}
.tc-stat{
position:relative;overflow:hidden;text-align:left;font-family:inherit;cursor:pointer;
background:linear-gradient(160deg,var(--card),var(--card-2));border:1px solid var(--line-soft);
border-radius:var(--r-lg);padding:13px 16px 14px;box-shadow:var(--sh-1);transition:transform var(--t-snap) var(--ease),border-color var(--t-base) var(--ease),background var(--t-base) var(--ease),box-shadow var(--t-base) var(--ease);
}
.tc-stat:hover{transform:translateY(-2px);border-color:var(--line-bright);background:var(--card-hover);box-shadow:var(--sh-2);}
.tc-stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.9;}
.tc-stat.s-teal::before{background:var(--accent2);}
.tc-stat-ic{
width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;
background:rgba(var(--accent-rgb),.14);color:var(--accent-soft);margin-bottom:11px;
}
.tc-stat.s-teal .tc-stat-ic{background:rgba(var(--accent2-rgb),.14);color:var(--accent2-soft);}
.tc-stat-ic svg{width:15px;height:15px;}
.tc-stat .v{font-size:26px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text);line-height:1;}
.tc-stat .l{font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:1.3px;color:var(--faint);margin-top:6px;font-weight:700;}
/* ---- Clarify banner / inbox-zero state ---- */
.tc-clarify-banner{
display:flex;align-items:center;gap:14px;width:100%;text-align:left;font-family:inherit;cursor:pointer;
background:linear-gradient(135deg,rgba(var(--accent-rgb),.14),transparent);
border:1px solid rgba(var(--accent-rgb),.34);border-radius:16px;padding:15px 18px;
transition:transform .12s,border-color .15s,box-shadow .2s;
}
.tc-clarify-banner:hover{transform:translateY(-2px);border-color:rgba(var(--accent-rgb),.6);box-shadow:0 12px 30px rgba(var(--accent-rgb),.18);}
.tc-clarify-ic{
width:42px;height:42px;border-radius:12px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
background:rgba(var(--accent-rgb),.22);color:var(--accent-soft);
}
.tc-clarify-ic svg{width:21px;height:21px;}
.tc-clarify-txt{flex:1;min-width:0;}
.tc-clarify-txt b{display:block;font-size:var(--fs-content);color:var(--text);font-weight:750;}
.tc-clarify-txt span{font-size:var(--fs-small);color:var(--muted);line-height:1.4;}
.tc-clarify-go{flex:0 0 auto;color:var(--accent-soft);display:flex;}
.tc-clarify-go svg{width:20px;height:20px;}
.tc-clarify-banner:hover .tc-clarify-go{transform:translateX(3px);transition:transform .15s;}
.tc-allclear{
display:flex;align-items:center;gap:11px;
background:rgba(var(--accent2-rgb),.08);border:1px solid rgba(var(--accent2-rgb),.24);
border-radius:14px;padding:14px 16px;color:var(--accent2-soft);font-size:var(--fs-small);font-weight:600;
}
.tc-allclear svg{width:19px;height:19px;flex:0 0 auto;}
/* ---- Generic database list rows ---- */
.tc-list{display:flex;flex-direction:column;gap:9px;}
.tc-row{
background:linear-gradient(160deg,var(--card),var(--card-2));
border:1px solid var(--line);border-radius:var(--r-md);padding:13px 15px;box-shadow:var(--sh-1);
display:flex;align-items:flex-start;gap:12px;
transition:border-color var(--t-base) var(--ease),box-shadow var(--t-base) var(--ease);
}
.tc-row:focus-within{border-color:rgba(var(--accent-rgb),.55);box-shadow:var(--sh-1),0 0 0 3px rgba(var(--accent-rgb),.12);}
.tc-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px;}
.tc-row-name{
background:none;border:none;color:var(--text);font-size:var(--fs-content);font-weight:650;
font-family:inherit;outline:none;padding:0;width:100%;cursor:text;
}
.tc-row-name::placeholder{color:var(--faint);}
.tc-row-name.tc-done{text-decoration:line-through;color:var(--faint);}
.tc-row-notes{
width:100%;background:rgba(var(--bg-rgb),.35);border:1px solid var(--line);border-radius:9px;
color:var(--text);font-family:inherit;font-size:13.5px;line-height:1.5;
padding:9px 11px;margin-top:6px;resize:vertical;min-height:40px;outline:none;
transition:border-color .15s,background .15s;
}
.tc-row-notes:focus{border-color:var(--accent);background:var(--bg);}
.tc-row-notes::placeholder{color:var(--accent);}
.tc-action-inline-delete{
width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;
flex:0 0 auto;padding:0;
}
.tc-row-notes-readonly{
font-size:12.5px;color:var(--muted);line-height:1.5;margin-top:4px;
padding:8px 10px;background:var(--card);border:1px solid var(--line-soft);border-radius:8px;
white-space:pre-wrap;word-break:break-word;
}
.tc-row-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.tc-row-time{font-size:var(--fs-caption);color:var(--faint);white-space:nowrap;font-variant-numeric:tabular-nums;}
.tc-row-actions{display:flex;align-items:center;gap:5px;flex:0 0 auto;}
.tc-row-check{flex:0 0 auto;width:17px;height:17px;margin-top:2px;accent-color:var(--accent2);cursor:pointer;}
.tc-micro-list{margin-top:8px;padding-top:8px;border-top:1px solid var(--line-soft);display:flex;flex-direction:column;gap:3px;}
.tc-micro-input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:13px;font-family:inherit;padding:0;}
.tc-micro-input::placeholder{color:var(--faint);}
.tc-micro-input.tc-done{text-decoration:line-through;opacity:.5;}
.tc-add-micro{color:var(--muted);margin-top:6px;}
/* Third-tier sub-sub-actions (Tab from a sub-action input) */
.tc-sub-micro-list{margin-top:3px;margin-left:20px;padding-left:10px;border-left:2px solid var(--line-soft);display:flex;flex-direction:column;gap:2px;}
.tc-sub-micro-block{display:flex;flex-direction:column;gap:2px;}
.tc-sub-check-item{display:flex;align-items:center;gap:7px;padding:1px 0;}
.tc-sub-check-item input[type=checkbox]{flex:0 0 auto;width:12px;height:12px;accent-color:var(--accent);cursor:pointer;opacity:.7;}
.tc-sub-check-item .tc-micro-input{font-size:12px;color:var(--muted);}
.tc-sub-check-item input[type=text]{flex:1;background:none;border:none;color:var(--muted);font-size:12px;font-family:inherit;outline:none;padding:0;caret-color:var(--accent);}
.tc-sub-check-item input[type=text]::placeholder{color:var(--faint);}
.tc-sub-check-item.tc-checked input[type=text]{text-decoration:line-through;opacity:.45;}
.tc-sub-check-item .tc-check-x{opacity:0;}
.tc-sub-check-item:hover .tc-check-x{opacity:1;}
/* ---- Tag chips ---- */
.tc-chip{
display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:650;
border-radius:7px;padding:3px 9px;border:1px solid var(--line);
background:var(--card);color:var(--muted);white-space:nowrap;line-height:1.3;
}
.tc-chip .tc-dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto;}
.tc-chip svg{width:12px;height:12px;flex:0 0 auto;opacity:.8;}
.tc-chip input[type=date]{background:none;border:none;color:var(--muted);font-family:inherit;font-size:11px;outline:none;cursor:pointer;padding:0;}
.tc-chip input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.7);cursor:pointer;opacity:.7;}
/* Square icon-only button — replaces the old ✕ / ↩ text glyphs */
.tc-icon-btn{
display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
width:30px;height:30px;border-radius:9px;cursor:pointer;font-family:inherit;
background:var(--card);border:1px solid var(--line);color:var(--faint);
transition:color .15s,border-color .15s,background .15s;
}
.tc-icon-btn svg{width:15px;height:15px;}
.tc-icon-btn:hover{color:var(--text);border-color:var(--line-bright);background:var(--card-hover);}
.tc-icon-btn.tc-danger:hover{color:var(--danger-soft);border-color:rgba(var(--danger-rgb),.45);background:rgba(var(--danger-rgb),.12);}
/* Quick-schedule (Today / This Week) icons — light up while the action is on that list */
.tc-sched-btn svg{width:14px;height:14px;}
.tc-sched-btn.on{color:var(--accent-soft);border-color:var(--accent);background:rgba(var(--accent-rgb),.12);}
.tc-sched-btn.on:hover{color:var(--accent);}
.tc-chip-btn{cursor:pointer;transition:border-color .15s,color .15s;}
.tc-chip-btn:hover{border-color:var(--line-bright);color:var(--text);}
.tc-chip-add{border-style:dashed;color:var(--faint);cursor:pointer;}
.tc-chip-add:hover{color:var(--text);border-color:var(--line-bright);}
/* status select (native, restyled) */
.tc-status-sel{
-webkit-appearance:none;appearance:none;font-family:inherit;cursor:pointer;
font-size:11px;font-weight:700;border-radius:7px;padding:3px 22px 3px 9px;
border:1px solid var(--line);color:var(--text);
background:var(--card) url("data:image/svg+xml;utf8,") no-repeat right 6px center;
}
.tc-mini-sel{
-webkit-appearance:none;appearance:none;font-family:inherit;cursor:pointer;
font-size:11px;font-weight:600;border-radius:7px;padding:3px 22px 3px 9px;
border:1px solid var(--line);color:var(--muted);
background:var(--card) url("data:image/svg+xml;utf8,") no-repeat right 6px center;
max-width:160px;text-overflow:ellipsis;
}
.tc-mini-sel:hover{color:var(--text);border-color:var(--line-bright);}
/* ---- View toolbar (filters / view switch) ---- */
.tc-toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.tc-tab{
background:none;border:1px solid transparent;color:var(--muted);
padding:5px 12px;font-size:12px;font-weight:650;cursor:pointer;font-family:inherit;border-radius:8px;
transition:color .15s,background .15s;display:inline-flex;align-items:center;gap:6px;
}
.tc-tab:hover{color:var(--text);background:rgba(var(--text-rgb),.03);}
.tc-tab.active{color:var(--text);background:var(--card);border-color:var(--line);}
.tc-tab svg{width:14px;height:14px;flex:0 0 auto;}
.tc-tab.active svg{color:var(--accent-soft);}
/* ---- Idea Bank kanban ---- */
.tc-kanban{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px;align-items:flex-start;}
.tc-kanban-col{
flex:0 0 248px;width:248px;display:flex;flex-direction:column;gap:9px;
background:rgba(var(--card-subtle-rgb),.45);border:1px solid var(--line-soft);border-radius:14px;padding:11px;
}
.tc-kanban-head{display:flex;align-items:center;gap:9px;padding:3px 2px 6px;}
.tc-kanban-ico{
width:26px;height:26px;border-radius:8px;flex:0 0 auto;
display:flex;align-items:center;justify-content:center;
background:rgba(var(--accent-rgb),.12);
}
.tc-kanban-ico svg{width:15px;height:15px;}
.tc-kanban-name{font-size:var(--fs-small);font-weight:800;color:var(--text);flex:1;letter-spacing:.1px;}
.tc-kanban-n{font-size:11px;font-weight:700;color:var(--faint);background:var(--card);border-radius:20px;padding:1px 8px;}
.tc-kanban-cards{display:flex;flex-direction:column;gap:9px;}
.tc-kanban-card{
background:linear-gradient(160deg,var(--card),var(--card-2));border:1px solid var(--line);
border-radius:var(--r-md);padding:11px 12px 11px 22px;font-size:13px;line-height:1.45;color:var(--text);box-shadow:var(--sh-1);
position:relative;cursor:default;
}
.tc-kanban-card .tc-card-text{outline:none;}
.tc-kanban-card .tc-card-x{
position:absolute;top:6px;right:6px;opacity:0;cursor:pointer;color:var(--faint);
width:18px;height:18px;border-radius:6px;display:flex;align-items:center;justify-content:center;
font-size:15px;line-height:1;transition:opacity .15s,color .15s,background .15s;
}
.tc-kanban-card .tc-card-x svg{width:13px;height:13px;}
.tc-kanban-card:hover .tc-card-x{opacity:1;}
.tc-kanban-card .tc-card-x:hover{color:var(--danger);background:rgba(var(--danger-rgb),.12);}
.tc-kanban-card .tc-notes-toggle-btn{
position:absolute;top:6px;right:26px;opacity:0;cursor:pointer;color:var(--faint);
background:none;border:none;padding:0;
width:18px;height:18px;border-radius:6px;display:flex;align-items:center;justify-content:center;
transition:opacity .15s,color .15s,background .15s;
}
.tc-kanban-card .tc-notes-toggle-btn svg{width:13px;height:13px;}
.tc-kanban-card:hover .tc-notes-toggle-btn{opacity:1;}
.tc-kanban-card .tc-notes-toggle-btn:hover{color:var(--accent2);background:rgba(var(--accent-rgb),.12);}
.tc-kanban-card .tc-notes-toggle-btn.tc-notes-has-content{opacity:1;color:var(--accent2);}
.tc-kanban-drag{
position:absolute;left:4px;top:50%;transform:translateY(-50%);
width:16px;height:22px;cursor:grab;color:var(--faint);
opacity:0;transition:opacity .15s;
display:flex;align-items:center;justify-content:center;
}
.tc-kanban-card:hover .tc-kanban-drag{opacity:1;}
.tc-kanban-drag svg{width:9px;height:14px;}
.tc-kanban-add-btn{
flex:0 0 auto;width:22px;height:22px;border-radius:6px;
background:var(--card);border:1px solid var(--line);
color:var(--faint);cursor:pointer;margin-left:auto;
display:flex;align-items:center;justify-content:center;
transition:color .15s,background .15s,border-color .15s;
}
.tc-kanban-add-btn:hover{color:var(--text);background:var(--card-2);border-color:var(--line-soft);}
.tc-kanban-add-btn svg{width:12px;height:12px;}
.tc-kanban-add{
background:none;border:1px dashed var(--line);color:var(--faint);border-radius:10px;
padding:9px;font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit;transition:color .15s,border-color .15s;
display:flex;align-items:center;justify-content:center;gap:6px;
}
.tc-kanban-add:hover{color:var(--text);border-color:var(--line-bright);}
/* ---- Projects (with checklist) ---- */
.tc-proj{
background:linear-gradient(160deg,var(--card),var(--card-2));border:1px solid var(--line);
border-radius:var(--r-lg);padding:15px 16px 13px;display:flex;flex-direction:column;gap:11px;box-shadow:var(--sh-1);transition:border-color var(--t-base) var(--ease),box-shadow var(--t-base) var(--ease);
}
.tc-proj:focus-within{border-color:rgba(var(--accent-rgb),.5);}
.tc-proj-head{display:flex;align-items:flex-start;gap:11px;}
.tc-proj-name{
flex:1;background:none;border:none;color:var(--text);font-size:var(--fs-content);font-weight:700;
font-family:inherit;outline:none;padding:0;min-width:0;
}
.tc-proj-name::placeholder{color:var(--faint);}
.tc-proj-checklist{display:flex;flex-direction:column;gap:4px;padding-left:2px;}
.tc-check-item{display:flex;align-items:flex-start;gap:9px;padding:2px 0;}
.tc-check-item input[type=checkbox]{flex:0 0 auto;width:14px;height:14px;margin-top:4px;accent-color:var(--accent);cursor:pointer;}
.tc-check-item input[type=text]{
flex:1;background:none;border:none;color:var(--text);font-size:13.5px;font-family:inherit;outline:none;
line-height:1.5;min-width:0;padding:0;caret-color:var(--accent);
}
.tc-check-item input[type=text]::placeholder{color:var(--faint);}
.tc-check-item.tc-checked input[type=text]{text-decoration:line-through;color:var(--faint);}
.tc-check-x{opacity:0;cursor:pointer;color:var(--faint);line-height:1;padding:0 4px;transition:opacity .15s,color .15s;display:inline-flex;align-items:center;margin-top:3px;}
.tc-check-x svg{width:14px;height:14px;}
.tc-check-item:hover .tc-check-x{opacity:1;}
.tc-check-x:hover{color:var(--danger);}
.tc-sub-date{background:none;border:none;color:var(--faint);font-size:11.5px;font-family:inherit;outline:none;cursor:pointer;flex:0 0 auto;padding:0;max-width:110px;}
.tc-sub-date:hover,.tc-sub-date:focus{color:var(--text);}
.tc-check-item .tc-sub-date{margin-top:3px;}
.tc-check-item .tc-micro-input,
.tc-sub-check-item .tc-micro-input{
flex:1 1 220px;
min-width:120px;
max-width:420px;
}
.tc-nested-actions{
display:flex;align-items:center;gap:1px;flex:0 0 auto;
opacity:1;transition:opacity .12s;
}
.tc-check-item:hover .tc-nested-actions,
.tc-check-item:focus-within .tc-nested-actions,
.tc-sub-check-item:hover .tc-nested-actions,
.tc-sub-check-item:focus-within .tc-nested-actions,
.tc-flat-row:hover .tc-nested-actions,
.tc-flat-row:focus-within .tc-nested-actions{
opacity:1;
}
.tc-micro-action-btn{
width:21px;height:21px;border-radius:5px;
color:var(--muted);
background:rgba(var(--text-rgb),.045);
}
.tc-micro-action-btn svg{width:12px;height:12px;}
.tc-nested-notes{
margin:2px 0 4px 42px;
width:calc(100% - 42px);
min-height:52px;
}
.tc-add-step{background:none;border:none;color:var(--faint);font-size:12.5px;cursor:pointer;font-family:inherit;padding:3px 0 0;text-align:left;transition:color .15s;display:inline-flex;align-items:center;gap:5px;}
.tc-add-step:hover{color:var(--accent-soft);}
.tc-progress{height:5px;border-radius:5px;background:var(--line);overflow:hidden;}
.tc-progress > i{display:block;height:100%;background:linear-gradient(90deg,var(--accent-soft),var(--accent));transition:width .3s;}
/* ---- Empty state ---- */
.tc-empty{
text-align:center;color:var(--faint);font-size:13.5px;line-height:1.6;
padding:40px 20px;border:1px dashed var(--line);border-radius:14px;
}
.tc-empty svg{width:34px;height:34px;opacity:.5;margin-bottom:10px;}
.tc-empty b{color:var(--muted);display:block;margin-bottom:4px;font-size:14.5px;}
/* ---- Reference / tag taxonomy cards ---- */
.tc-ref-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;}
.tc-ref-card{background:linear-gradient(160deg,var(--card),var(--card-2));border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:15px 16px;}
.tc-ref-card h4{margin:0 0 11px;font-size:var(--fs-small);text-transform:uppercase;letter-spacing:1.2px;color:var(--accent2-soft);font-weight:800;}
.tc-ref-card .tc-ref-items{display:flex;flex-wrap:wrap;gap:7px;}
/* ---- Trigger list ---- */
.tc-trigger-item{display:flex;align-items:center;gap:11px;padding:9px 0;border-bottom:1px solid var(--line-soft);}
.tc-trigger-item:last-child{border-bottom:none;}
.tc-trigger-item input{flex:0 0 auto;width:16px;height:16px;accent-color:var(--accent2);cursor:pointer;}
.tc-trigger-item span{font-size:13.5px;color:var(--muted);}
.tc-trigger-item input:checked + span{color:var(--text);}
/* ---- Star toggle (action priority) ---- */
.tc-star{
flex:0 0 auto;width:26px;height:26px;margin-top:1px;border-radius:8px;cursor:pointer;
display:inline-flex;align-items:center;justify-content:center;
background:none;border:1px solid transparent;color:var(--faint);font-family:inherit;
transition:color .15s,background .15s,border-color .15s;
}
.tc-star svg{width:16px;height:16px;fill:none;}
.tc-star:hover{color:var(--warn);background:rgba(var(--warn-rgb),.12);}
.tc-star.on{color:var(--warn);}
.tc-star.on svg{fill:var(--warn);}
.tc-chip-star{color:var(--warn);border-color:rgba(var(--warn-rgb),.35);}
.tc-chip-star svg{fill:var(--warn);opacity:1;}
.tc-chip-current{color:var(--good);border-color:rgba(var(--good-rgb),.32);background:rgba(var(--good-rgb),.08);}
/* ---- Grouped section label (sprints) ---- */
.tc-group-label{
display:flex;align-items:center;gap:8px;margin:6px 0 -4px;
font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:1.4px;font-weight:800;color:var(--faint);
}
.tc-group-label .tc-group-n{
background:var(--card);border:1px solid var(--line);border-radius:20px;padding:0 7px;
font-size:10.5px;letter-spacing:0;color:var(--muted);font-variant-numeric:tabular-nums;
}
/* ---- Sprint planning cards ---- */
.tc-sprint{
background:linear-gradient(160deg,var(--card),var(--card-2));border:1px solid var(--line);
border-radius:var(--r-lg);padding:15px 16px 13px;display:flex;flex-direction:column;gap:11px;box-shadow:var(--sh-1);
transition:border-color var(--t-base) var(--ease),box-shadow var(--t-base) var(--ease);
}
.tc-sprint:focus-within{border-color:rgba(var(--accent-rgb),.5);}
.tc-sprint-active{border-color:rgba(var(--good-rgb),.4);box-shadow:var(--sh-1),0 0 0 1px rgba(var(--good-rgb),.12);}
.tc-sprint-head{display:flex;align-items:flex-start;gap:11px;}
.tc-sprint-goal{
background:rgba(var(--bg-rgb),.4);border:1px solid var(--line-soft);border-radius:9px;
color:var(--text);font-size:13px;font-family:inherit;outline:none;padding:8px 11px;width:100%;
transition:border-color .15s,background .15s;
}
.tc-sprint-goal:focus{border-color:var(--accent);background:var(--bg);}
.tc-sprint-goal::placeholder{color:var(--faint);}
.tc-sprint-acts{display:flex;flex-direction:column;gap:3px;}
.tc-sprint-act{display:flex;align-items:center;gap:9px;padding:3px 0;}
.tc-sprint-act > input[type=checkbox]{flex:0 0 auto;width:15px;height:15px;accent-color:var(--accent2);cursor:pointer;}
.tc-sprint-act-name{
flex:1;min-width:0;background:none;border:none;color:var(--text);font-size:13px;font-family:inherit;outline:none;
padding:0;caret-color:var(--accent);
}
.tc-sprint-act-name.tc-done{text-decoration:line-through;color:var(--faint);}
.tc-sprint-act-name::placeholder{color:var(--faint);}
.tc-sprint-empty{font-size:12.5px;color:var(--faint);padding:2px 0;}
.tc-sprint-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:2px;}
/* Sprint planning — section labels */
.tc-sprint-section-label{
display:flex;align-items:center;gap:6px;
font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:1.2px;font-weight:800;color:var(--faint);
margin-top:6px;
}
.tc-sprint-section-label svg{width:13px;height:13px;flex:0 0 auto;}
/* Secondary goal fields (learning goal, success criteria) */
.tc-sprint-goal-secondary{
opacity:.85;
border-style:dashed;
}
.tc-sprint-goal-secondary:focus{opacity:1;border-style:solid;}
/* Sprint unit list (draggable container) */
.tc-sprint-units-list{display:flex;flex-direction:column;gap:7px;}
/* Multi-step action unit inside sprint card */
.tc-sprint-unit{
background:rgba(var(--bg-rgb),.35);border:1px solid var(--line-soft);border-radius:10px;
padding:10px 12px 8px;display:flex;flex-direction:column;gap:7px;
}
.tc-sprint-unit.su-dragging{opacity:.55;box-shadow:0 4px 18px rgba(0,0,0,.22);z-index:10;position:relative;}
.tc-sprint-unit-head{display:flex;align-items:center;gap:8px;}
.tc-sprint-unit-head>svg{width:13px;height:13px;color:var(--muted);flex:0 0 auto;}
.tc-sprint-unit-name{
flex:1;min-width:0;background:none;border:none;color:var(--text);
font-size:13px;font-weight:700;font-family:inherit;outline:none;padding:0;
caret-color:var(--accent);
}
.tc-sprint-unit-name::placeholder{color:var(--faint);}
/* Drag handle on sprint unit */
.tc-su-drag{
display:inline-flex;align-items:center;justify-content:center;
width:14px;height:20px;cursor:grab;flex:0 0 auto;opacity:.35;transition:opacity .15s;
}
.tc-su-drag:hover{opacity:.8;}
.tc-su-drag svg{width:10px;height:16px;display:block;}
.tc-su-drag:active{cursor:grabbing;}
/* Collapse buttons on units / actions / micro-actions */
.tc-su-collapse-btn,.tc-sa-collapse-btn,.tc-micro-collapse-btn{
flex:0 0 auto;width:20px;height:20px;padding:0;opacity:.5;
display:inline-flex;align-items:center;justify-content:center;
margin-left:auto;
}
.tc-su-collapse-btn{margin-left:auto;}
.tc-su-collapse-btn:hover,.tc-sa-collapse-btn:hover,.tc-micro-collapse-btn:hover{opacity:1;}
.tc-su-collapse-btn svg,.tc-sa-collapse-btn svg,.tc-micro-collapse-btn svg{width:13px;height:13px;}
.tc-sa-collapse-btn{margin-left:2px;}
.tc-micro-collapse-btn{width:16px;height:16px;margin-left:2px;}
.tc-micro-collapse-btn svg{width:11px;height:11px;}
/* Leading (Notion-style) collapse chevron sitting before an action / project name */
.tc-lead-collapse{flex:0 0 auto;width:18px;height:18px;margin-left:0;}
.tc-proj-collapse-btn{
flex:0 0 auto;width:20px;height:20px;padding:0;opacity:.55;margin-top:1px;
display:inline-flex;align-items:center;justify-content:center;transition:opacity .15s;
}
.tc-proj-collapse-btn:hover{opacity:1;}
.tc-proj-collapse-btn svg{width:14px;height:14px;}
/* "N … hidden" affordance shown in place of a folded subtree */
.tc-collapsed-hint{color:var(--faint);font-style:italic;}
.tc-collapsed-hint svg{width:12px;height:12px;opacity:.7;}
/* Visible "Add micro-action" button — the third tier, indented under its sub-action */
.tc-add-microaction{margin-left:23px;color:var(--faint);font-size:12px;}
.tc-micro-block{display:flex;flex-direction:column;}
/* Drag handle on sprint action rows */
.tc-sa-drag{
display:inline-flex;align-items:center;justify-content:center;
width:12px;height:20px;cursor:grab;flex:0 0 auto;opacity:.25;transition:opacity .15s;
}
.tc-sa-drag:hover{opacity:.7;}
.tc-sa-drag svg{width:9px;height:14px;display:block;}
.tc-sa-drag:active{cursor:grabbing;}
/* Ghost clone while dragging a sprint action */
.sa-drag-ghost{
background:var(--surface);border:1px solid var(--accent);border-radius:6px;
padding:5px 8px;box-shadow:0 6px 24px rgba(0,0,0,.22);opacity:.9;
}
/* Placeholder showing insertion point */
.tc-sa-drag-placeholder{
background:var(--accent);opacity:.18;border-radius:5px;
margin:2px 0;flex:0 0 auto;
}
/* Empty container drop hint */
.tc-acts-drop-hint{
font-size:11px;color:var(--faint);text-align:center;padding:8px 4px;
border:1px dashed var(--line-soft);border-radius:5px;opacity:.7;
}
/* Thin progress bar variant */
.tc-progress-thin{height:3px;border-radius:3px;margin:0;}
/* Retrospective panel */
.tc-sprint-retro{border-top:1px solid var(--line-soft);padding-top:11px;}
.tc-sprint-retro-toggle{
display:flex;align-items:center;gap:7px;background:none;border:none;cursor:pointer;
font-family:inherit;font-size:12.5px;font-weight:700;color:var(--muted);padding:2px 0;
transition:color .15s;
}
.tc-sprint-retro-toggle:hover{color:var(--text);}
.tc-sprint-retro-toggle svg{width:14px;height:14px;flex:0 0 auto;}
.tc-retro-filled{
width:7px;height:7px;border-radius:50%;background:var(--accent2);
flex:0 0 auto;margin-left:2px;
}
.tc-retro-body{display:flex;flex-direction:column;gap:9px;margin-top:12px;}
.tc-retro-label{
font-size:11px;font-weight:800;color:var(--faint);
text-transform:uppercase;letter-spacing:.9px;
}
.tc-sprint-retro-ta{
background:rgba(var(--bg-rgb),.4);border:1px solid var(--line-soft);border-radius:9px;
color:var(--text);font-size:13px;line-height:1.5;font-family:inherit;
outline:none;padding:9px 11px;width:100%;resize:vertical;min-height:58px;
transition:border-color .15s,background .15s;
}
.tc-sprint-retro-ta:focus{border-color:var(--accent);background:var(--bg);}
.tc-sprint-retro-ta::placeholder{color:var(--faint);}
/* Loose actions pool (collapsible ) */
.tc-loose-pool{
border-top:1px solid var(--line-soft);padding-top:10px;margin-top:4px;
}
.tc-loose-pool summary{
display:flex;align-items:center;gap:7px;cursor:pointer;
font-size:11px;font-weight:800;color:var(--faint);
text-transform:uppercase;letter-spacing:1px;
padding:2px 0;user-select:none;list-style:none;
}
.tc-loose-pool summary::-webkit-details-marker{display:none;}
.tc-loose-pool summary svg{width:13px;height:13px;flex:0 0 auto;}
.tc-loose-list{display:flex;flex-direction:column;gap:0;margin-top:9px;}
.tc-loose-row{
display:flex;align-items:center;gap:8px;padding:5px 0;
border-bottom:1px solid var(--line-soft);
}
.tc-loose-row:last-child{border-bottom:none;}
.tc-loose-name{
flex:1;min-width:0;font-size:12.5px;color:var(--text);
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
/* ---- Project sub-section labels + linked actions ---- */
.tc-proj-sub{
display:flex;align-items:center;gap:6px;margin-top:3px;
font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:1.2px;font-weight:800;color:var(--faint);
}
.tc-proj-sub svg{width:13px;height:13px;}
/* ---- Areas-of-focus rollup ---- */
.tc-area-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:13px;}
.tc-area-card{
background:linear-gradient(160deg,var(--card),var(--card-2));border:1px solid var(--line);
border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:14px 15px;display:flex;flex-direction:column;gap:11px;
}
.tc-area-head{display:flex;align-items:center;gap:8px;}
.tc-area-head .tc-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;}
.tc-area-name{font-size:var(--fs-content);font-weight:750;color:var(--text);flex:1;min-width:0;}
.tc-area-total{
font-size:11px;font-weight:800;color:var(--muted);background:var(--card);border:1px solid var(--line);
border-radius:20px;padding:1px 8px;font-variant-numeric:tabular-nums;
}
.tc-area-block{display:flex;flex-direction:column;gap:5px;}
.tc-area-block-h{
display:flex;align-items:center;justify-content:space-between;
font-size:10.5px;text-transform:uppercase;letter-spacing:1px;font-weight:800;color:var(--accent2-soft);
}
.tc-area-block-h span{color:var(--faint);font-variant-numeric:tabular-nums;}
.tc-area-items{display:flex;flex-wrap:wrap;gap:5px;}
.tc-area-item{
font-family:inherit;cursor:pointer;font-size:11.5px;font-weight:600;color:var(--muted);text-align:left;
background:var(--card);border:1px solid var(--line);border-radius:7px;padding:3px 9px;max-width:100%;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .15s,border-color .15s;
}
.tc-area-item:hover{color:var(--text);border-color:var(--line-bright);}
.tc-area-none{font-size:12px;color:var(--faint);}
/* ---- Initiative Journal (inside each Multi-step Initiative card) ---- */
.tc-initiative-journal{
margin-top:2px;padding:13px 14px 12px;
background:rgba(var(--accent-rgb),.04);
border:1px solid rgba(var(--accent-rgb),.14);
border-radius:var(--r-md);display:flex;flex-direction:column;gap:9px;
}
.tc-journal-q{
display:flex;align-items:center;gap:7px;
font-size:12.5px;font-weight:700;color:var(--accent-soft);
}
.tc-journal-q svg{width:14px;height:14px;flex-shrink:0;opacity:.85;}
.tc-journal-hint{
font-size:11.5px;color:var(--faint);font-style:italic;margin-top:-4px;line-height:1.45;
}
.tc-journal-area{
width:100%;min-height:54px;
background:rgba(var(--bg-rgb),.45);border:1px solid var(--line);border-radius:var(--r-sm);
color:var(--text);font-size:13px;font-family:inherit;
padding:8px 10px;resize:vertical;box-sizing:border-box;
}
.tc-journal-area:focus{outline:none;border-color:rgba(var(--accent-rgb),.5);background:var(--bg);}
.tc-journal-area::placeholder{color:var(--faint);}
.tc-journal-sub-head{
display:flex;align-items:center;gap:6px;margin-top:2px;
font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:1.2px;font-weight:800;color:var(--faint);
}
.tc-journal-sub-head svg{width:12px;height:12px;}
.tc-brainstorm-list{display:flex;flex-direction:column;gap:4px;}
.tc-brainstorm-item{display:flex;align-items:center;gap:6px;}
.tc-brainstorm-item:hover .tc-brainstorm-x{opacity:1;}
.tc-brainstorm-n{font-size:11.5px;color:var(--faint);min-width:18px;text-align:right;flex-shrink:0;}
.tc-brainstorm-input{
flex:1;background:rgba(var(--bg-rgb),.35);border:1px solid var(--line);border-radius:var(--r-sm);
color:var(--text);font-size:13px;font-family:inherit;padding:5px 8px;min-width:0;
}
.tc-brainstorm-input:focus{outline:none;border-color:rgba(var(--accent-rgb),.45);}
.tc-brainstorm-input::placeholder{color:var(--faint);}
.tc-brainstorm-x{opacity:0;}
.tc-initiative-map-item{
display:flex;align-items:center;gap:8px;
padding:5px 0;border-bottom:1px solid rgba(var(--text-rgb),.04);
}
.tc-initiative-map-item:last-of-type{border-bottom:none;}
.tc-initiative-map-name{flex:1;font-size:13px;color:var(--text);}
/* ---- Sidebar / Panel: TC-powered Tactics view (tsb = tactic-sidebar) ---- */
.tsb-filters{display:flex;gap:0;margin:-11px -11px 8px;border-bottom:1px solid var(--line-soft);position:sticky;top:-11px;z-index:5;background:var(--panel-2);}
.tsb-f{flex:1;background:none;border:none;border-bottom:2px solid transparent;color:var(--muted);padding:9px 4px;font-size:10.5px;font-weight:600;cursor:pointer;font-family:inherit;letter-spacing:.3px;text-align:center;transition:color .15s,border-color .15s;margin-bottom:-1px;}
.tsb-f:hover{color:var(--text);}
.tsb-f-on{color:var(--accent-soft);border-bottom-color:var(--accent);}
.tsb-toggle-all-micros{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;background:none;border:none;border-bottom:1px solid var(--line-soft);color:var(--faint);font-size:10.5px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;padding:7px 4px;font-family:inherit;transition:color .12s,background .12s;}
.tsb-toggle-all-micros:hover{color:var(--muted);background:var(--hover);}
.tsb-toggle-all-micros svg{width:12px;height:12px;flex:0 0 auto;}
.tsb-sprint-label{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--muted);padding:5px 12px 2px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;}
.tsb-sprint-grp{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--accent2);padding:9px 12px 2px;letter-spacing:.04em;text-transform:uppercase;}
.tsb-sprint-grp svg{width:13px;height:13px;}
.tsb-empty{font-size:12px;color:var(--faint);padding:18px 14px;line-height:1.5;}
/* Unified rail: every open Action (loose to-do or planned) is one identical,
drag-reorderable row. tsb-check / tsb-chips are shared with micro rows. */
.rail-list{display:flex;flex-direction:column;}
.tsb-rows{display:flex;flex-direction:column;padding:4px 0 2px;}
.tsb-row{position:relative;display:flex;align-items:flex-start;gap:6px;padding:5px 6px 5px 4px;border-radius:8px;}
.tsb-row:hover{background:var(--hover);}
.tsb-row.dragging{z-index:50;cursor:grabbing;background:var(--card-2);box-shadow:0 8px 22px rgba(0,0,0,.20),0 0 0 1px rgba(var(--accent-rgb),.4);}
.tsb-drag{flex:0 0 auto;display:flex;align-items:center;cursor:grab;color:var(--faint);padding:4px 2px 0;touch-action:none;-webkit-user-select:none;user-select:none;opacity:0;transition:opacity .12s,color .12s;}
.tsb-row:hover .tsb-drag{opacity:1;}
.tsb-drag:hover{color:var(--muted);}
.tsb-drag:active{cursor:grabbing;}
.tsb-drag svg{width:10px;height:16px;pointer-events:none;}
.tsb-divider{display:flex;align-items:center;gap:7px;padding:10px 12px 5px 8px;color:var(--muted);touch-action:none;}
.tsb-divider::after{content:"";height:1px;flex:1;background:linear-gradient(90deg, rgba(35,131,226,.75), rgba(35,131,226,.24), var(--line-soft));}
.tsb-divider-label{flex:0 0 auto;font-size:10px;line-height:1;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);}
.tsb-divider-drag{flex:0 0 auto;display:flex;align-items:center;cursor:grab;color:var(--faint);opacity:0;transition:opacity .12s,color .12s;touch-action:none;-webkit-user-select:none;user-select:none;}
.tsb-divider:hover .tsb-divider-drag{opacity:1;}
.tsb-divider-drag:hover{color:var(--muted);}
.tsb-divider-drag:active{cursor:grabbing;}
.tsb-divider-drag svg{width:10px;height:16px;pointer-events:none;}
.tsb-divider.dragging{z-index:50;cursor:grabbing;background:var(--card-2);box-shadow:0 8px 22px rgba(0,0,0,.18),0 0 0 1px rgba(var(--accent-rgb),.32);}
.tsb-divider.dragging .tsb-divider-drag{opacity:1;color:var(--accent-soft);}
.tsb-divider[data-order-key="rail-divider:bonus"] .tsb-divider-label{color:var(--warn);}
.tsb-divider[data-order-key="rail-divider:bonus"]::after{background:linear-gradient(90deg, rgba(201,168,76,.75), rgba(201,168,76,.24), var(--line-soft));}
/* Week sections are fixed Monday to Sunday, so they carry no grip and sit
flush left where the handle would have been. Today is the one that lights up. */
.tsb-divider--week{padding-left:12px;}
.tsb-divider--week .tsb-divider-label{color:var(--muted);}
.tsb-divider--week::after{background:var(--line-soft);}
.tsb-divider--week.is-today .tsb-divider-label{color:var(--accent);}
.tsb-divider--week.is-today::after{background:linear-gradient(90deg, rgba(35,131,226,.75), rgba(35,131,226,.24), var(--line-soft));}
.tsb-divider-today{flex:0 0 auto;padding:2px 7px;border-radius:999px;font-size:9px;line-height:1;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);background:rgba(var(--accent-rgb),.14);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.3);}
.tsb-divider--week[data-order-key="rail-divider:week:next"]{margin-top:14px;padding-top:14px;border-top:1px dashed var(--line-soft);}
.tsb-divider--week[data-order-key="rail-divider:week:next"] .tsb-divider-label{color:var(--faint);}
/* Sprint sections are the sprint's projects, ordered by the Projects & Sprints
tab — so like the week they carry no grip: reorder them over there. */
.tsb-divider--project{padding-left:12px;gap:8px;}
.tsb-divider--project .tsb-divider-label{color:var(--accent);letter-spacing:.06em;max-width:70%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tsb-divider--project::after{background:linear-gradient(90deg, rgba(var(--accent-rgb),.35), var(--line-soft));}
.tsb-divider--project[data-order-key="rail-divider:project:"]{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line-soft);}
.tsb-divider--project[data-order-key="rail-divider:project:"] .tsb-divider-label{color:var(--faint);}
.tsb-divider-count{flex:0 0 auto;order:3;padding:1px 6px;border-radius:999px;font-size:9px;line-height:1.5;font-weight:800;color:var(--muted);background:var(--card-2);box-shadow:inset 0 0 0 1px var(--line-soft);}
.tsb-section-empty{padding:5px 12px 7px;font-size:11px;color:var(--faint);font-style:italic;}
.tsb-check{flex:0 0 auto;margin-top:3px;width:14px;height:14px;accent-color:var(--accent2);cursor:pointer;}
.tsb-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;}
.tsb-title-line{display:flex;align-items:center;gap:5px;}
.tsb-row-name{field-sizing:content;min-width:0;max-width:100%;background:none;border:none;outline:none;color:var(--text);font-size:13px;line-height:1.35;padding:1px 0;font-family:inherit;}
.tsb-row-name::placeholder{color:var(--faint);}
.tsb-row-name.tc-done{text-decoration:line-through;color:var(--faint);}
/* Gold note flag sits right next to the title so a note's presence is
obvious at rest, not just when hovering the row-foot icon row. Requires
the row-name input to size to its text (field-sizing:content) instead of
stretching to fill the row, otherwise the flag gets pushed to the far
right edge behind all that empty input space. */
.tsb-note-flag{flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:var(--warn);cursor:pointer;opacity:.9;}
.tsb-note-flag:hover{opacity:1;}
.tsb-note-flag svg{width:13px;height:13px;}
.tsb-chip{font-size:10px;padding:1px 6px;border-radius:10px;background:var(--bg2);color:var(--muted);}
.tsb-chip-ctx{background:rgba(var(--accent2-rgb),.16);color:var(--accent2);}
/* Project chip(s), the sub-action count toggle, and "Add sub-action" all
share this one line instead of stacking as separate full-width rows. */
.tsb-meta-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.tsb-subs-toggle{display:inline-flex;align-items:center;gap:4px;background:none;border:none;color:var(--faint);font-size:11px;cursor:pointer;padding:2px 0 2px 1px;font-family:inherit;opacity:.7;transition:opacity .12s,color .12s;}
.tsb-subs-toggle:hover{opacity:1;color:var(--muted);}
.tsb-subs-toggle svg{flex:0 0 auto;}
.tsb-micros{display:flex;flex-direction:column;gap:2px;padding-left:1px;margin-top:2px;}
.tsb-micro{display:flex;align-items:flex-start;gap:6px;position:relative;padding:1px 0;}
.tsb-micro .tsb-check{margin-top:3px;width:12px;height:12px;flex:0 0 auto;}
.tsb-micro-input{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--muted);font-size:12px;line-height:1.4;padding:1px 0;font-family:inherit;resize:none;overflow:hidden;white-space:pre-wrap;word-break:break-word;}
.tsb-micro-input::placeholder{color:var(--faint);}
.tsb-micro-input.tc-done{text-decoration:line-through;opacity:.5;}
/* The sub-action delete (×) sits at top-right so it doesn't obscure wrapped text. */
.tsb-micro-x{position:absolute;right:0;top:2px;display:flex;color:var(--faint);cursor:pointer;opacity:0;background:var(--hover);border-radius:4px;padding:1px 2px 1px 6px;transition:opacity .12s,color .12s;}
.tsb-micro:hover .tsb-micro-x{opacity:1;}
.tsb-micro-x:hover{color:var(--danger);}
.tsb-micro-x svg{width:11px;height:11px;}
/* Sidebar sub-sub-actions */
.tsb-sub-micros{margin-top:2px;margin-left:18px;padding-left:8px;border-left:2px solid var(--line-soft);display:flex;flex-direction:column;gap:2px;}
.tsb-sub-micro{display:flex;align-items:flex-start;gap:5px;position:relative;padding:1px 0;}
.tsb-sub-micro .tsb-check{width:11px;height:11px;opacity:.7;flex:0 0 auto;margin-top:3px;}
.tsb-sub-micro textarea.tsb-micro-input{font-size:11px;color:var(--faint);}
.tsb-sub-micro textarea.tsb-micro-input::placeholder{color:var(--faint);}
.tsb-sub-micro textarea.tsb-micro-input.tc-done{text-decoration:line-through;opacity:.45;}
.tsb-sub-micro .tsb-micro-x{flex:0 0 auto;display:flex;color:var(--faint);cursor:pointer;opacity:0;transition:opacity .12s,color .12s;}
.tsb-sub-micro:hover .tsb-micro-x{opacity:1;}
.tsb-add-micro{display:inline-flex;align-items:center;gap:4px;background:none;border:none;color:var(--faint);font-size:11px;cursor:pointer;padding:2px 0;font-family:inherit;flex:0 0 auto;min-width:0;overflow:hidden;white-space:nowrap;}
.tsb-add-micro svg{flex:0 0 auto;}
.tsb-add-micro:hover{color:var(--accent2);}
/* Row footer: revealed on hover only — just the action icons (notes /
schedule / star / delete), kept hidden until hover so nothing overlays
the action text. "Add sub-action" now lives on .tsb-meta-line instead. */
.tsb-row-foot{
display:flex;align-items:center;gap:8px;
opacity:0;height:0;overflow:hidden;
transition:opacity .12s,height .12s;
}
.tsb-row:hover .tsb-row-foot{opacity:1;height:24px;}
/* Icons sit at the far right, opposite the (flexible) "Add sub-action". */
.tsb-row-actions{display:flex;align-items:center;gap:1px;flex:0 0 auto;margin-left:auto;}
.tsb-archive,.tsb-del{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:3px;border-radius:6px;color:var(--faint);opacity:0;transition:opacity .12s,color .12s,background .12s;}
.tsb-row:hover .tsb-archive,.tsb-row:hover .tsb-del{opacity:.85;}
.tsb-archive svg,.tsb-del svg{width:14px;height:14px;}
.tsb-archive:hover{color:var(--accent);background:var(--hover);}
.tsb-del:hover{color:var(--danger);background:var(--hover);}
.tsb-add-todo{display:flex;align-items:center;justify-content:center;gap:6px;margin:6px 6px 10px;padding:7px;border:1px dashed var(--line);border-radius:9px;background:none;color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;transition:background .12s,color .12s,border-color .12s;font-family:inherit;}
.tsb-add-todo:hover{background:var(--hover);color:var(--text);border-color:var(--line-strong,var(--muted));}
.tsb-add-todo svg{width:14px;height:14px;}
/* ---- Compact to-do rail ----
The rail is a quick at-a-glance list, so the per-row icon buttons (notes +
the Today / This-Week quick-schedule icons) drop their boxed chrome and
stay hidden until row hover. An icon that is "active" (notes present, or the
action sits in that list) stays lit so the state is still visible at rest. */
.tsb-row .tc-notes-toggle-btn,
.tsb-row-actions .tc-sched-btn{
border:none;background:none;color:var(--faint);
width:22px;height:22px;border-radius:6px;padding:0;
opacity:0;transition:opacity .12s,color .12s,background .12s;
}
.tsb-row:hover .tc-notes-toggle-btn,
.tsb-row:hover .tc-sched-btn{opacity:.85;}
.tsb-row .tc-notes-toggle-btn:hover,
.tsb-row-actions .tc-sched-btn:hover{opacity:1;color:var(--accent);background:var(--hover);}
.tsb-row .tc-notes-toggle-btn.tc-notes-has-content{opacity:1;color:var(--accent2);}
.tsb-row-actions .tc-sched-btn.on{opacity:1;color:var(--accent);background:none;}
.tsb-row .tc-notes-toggle-btn svg,
.tsb-row-actions .tc-sched-btn svg{width:13px;height:13px;}
/* keep the whole row on one tighter line */
.tsb-row{padding-top:3px;padding-bottom:3px;}
/* The action icons live in .tsb-row-foot, hover-revealed as a unit (see above). */
/* ---- Planner: four-column drill-down (Sprint → Unit → Action → Micro) ---- */
.tc-planner{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:12px;align-items:start;}
.pl-col{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;min-height:260px;max-height:62vh;}
.pl-col-head{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:10px 12px;font-size:12px;font-weight:700;color:var(--text);border-bottom:1px solid var(--line-soft);background:var(--card-2);}
.pl-col-body{flex:1;overflow-y:auto;padding:6px;display:flex;flex-direction:column;gap:2px;}
.pl-add{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;background:rgba(var(--accent-rgb),.14);border:1px solid var(--accent);color:var(--accent-soft);cursor:pointer;padding:0;flex:0 0 auto;}
.pl-add:hover{background:rgba(var(--accent-rgb),.26);}
.pl-add svg{width:13px;height:13px;}
.pl-grp-label{font-size:10px;font-weight:700;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;padding:8px 8px 3px;}
.pl-empty{font-size:12px;color:var(--faint);padding:14px 10px;line-height:1.5;}
.pl-row{display:flex;align-items:center;gap:7px;width:100%;text-align:left;padding:7px 9px;border-radius:8px;border:1px solid transparent;background:none;color:var(--text);font-family:inherit;font-size:13px;cursor:pointer;transition:background .12s,border-color .12s;}
.pl-row:hover{background:var(--hover);}
.pl-row.pl-on{background:rgba(var(--accent-rgb),.14);border-color:var(--accent);}
.pl-row.pl-done .pl-row-name,.pl-row.pl-done .pl-row-input{text-decoration:line-through;opacity:.5;}
.pl-row-ic{flex:0 0 auto;display:flex;color:var(--muted);}
.pl-row-ic svg{width:15px;height:15px;}
.pl-row-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pl-row-input{flex:1;min-width:0;background:none;border:none;color:inherit;font-family:inherit;font-size:13px;padding:0;outline:none;}
.pl-row-input:focus{border-bottom:1px solid var(--accent);}
.pl-row-n{flex:0 0 auto;font-size:10px;font-weight:700;color:var(--muted);background:var(--bg2);border-radius:9px;padding:1px 6px;}
.pl-row-go{flex:0 0 auto;display:flex;color:var(--faint);opacity:0;transition:opacity .12s;}
.pl-row:hover .pl-row-go,.pl-row.pl-on .pl-row-go{opacity:1;}
.pl-row-go svg{width:13px;height:13px;}
.pl-action-check{flex:0 0 auto;width:14px;height:14px;accent-color:var(--accent2);cursor:pointer;}
.pl-micro{display:flex;align-items:center;gap:7px;padding:5px 8px;}
.pl-micro input[type=checkbox]{flex:0 0 auto;width:14px;height:14px;accent-color:var(--accent2);cursor:pointer;}
.pl-micro-input{flex:1;min-width:0;background:none;border:none;color:var(--text);font-family:inherit;font-size:13px;padding:0;outline:none;}
.pl-micro-input:focus{border-bottom:1px solid var(--accent);}
.pl-micro.pl-done .pl-micro-input{text-decoration:line-through;opacity:.5;}
@media (max-width:1080px){ .tc-planner{overflow-x:auto;grid-template-columns:repeat(4,minmax(168px,1fr));} }
/* Fix: × / trash buttons in sprint unit-action rows appear on hover */
.tc-sprint-act:hover .tc-check-x { opacity: 1; }
/* Expanded standalone action rows in sprint card */
.tc-standalone-act {
display: flex;
flex-direction: column;
gap: 6px;
background: rgba(var(--bg-rgb),.25);
border: 1px solid var(--line-soft);
border-radius: 9px;
padding: 8px 10px 7px;
}
.tc-standalone-act-head {
display: flex;
align-items: center;
gap: 9px;
}
.tc-standalone-act-head > input[type=checkbox] { flex: 0 0 auto; width: 15px; height: 15px; accent-color: var(--accent2); cursor: pointer; }
.tc-standalone-act:hover .tc-sa-unassign,
.tc-standalone-act:hover .tc-sa-del { opacity: 1; }
.tc-sa-del:hover { color: var(--danger) !important; }
.tc-standalone-act .tc-micro-list { margin-top: 4px; padding-top: 6px; }
.tc-standalone-act .tc-add-micro { padding-top: 2px; }
/* ---- Waitlist overlay panel — slides in from the right edge of #tcPanel ---- */
.tc-panel { position: relative; } /* overflow:hidden already present */
.tc-wl-overlay {
position: absolute;
top: 0; right: 0; bottom: 0;
width: 264px;
background: var(--bg, #0d0d0f);
border-left: 1px solid var(--line);
box-shadow: -12px 0 36px rgba(0,0,0,.25);
z-index: 30;
transform: translateX(100%);
transition: transform 0.22s cubic-bezier(0.4,0,0.2,1);
display: flex;
flex-direction: column;
gap: 10px;
padding: 16px 13px 20px;
overflow-y: auto;
overflow-x: hidden;
}
.tc-wl-overlay.open { transform: translateX(0); }
.tc-wpanel-head {
display: flex; align-items: center; gap: 7px;
padding-bottom: 10px;
border-bottom: 1px solid var(--line-soft);
flex-shrink: 0;
}
.tc-wpanel-head > svg { width: 15px; height: 15px; color: var(--accent2-soft); flex: 0 0 auto; }
.tc-wpanel-title {
font-size: 11px; font-weight: 800; color: var(--text);
text-transform: uppercase; letter-spacing: 1.2px;
}
.tc-wpanel-hint { font-size: 11.5px; color: var(--faint); line-height: 1.5; flex-shrink: 0; }
.tc-wpanel-list { display: flex; flex-direction: column; gap: 5px; }
.tc-wpanel-item {
display: flex; align-items: flex-start; gap: 7px;
padding: 8px 9px;
background: rgba(var(--text-rgb),.03);
border: 1px solid var(--line-soft);
border-radius: 9px;
cursor: grab;
transition: border-color .12s, background .12s, opacity .12s;
user-select: none;
}
.tc-wpanel-item:hover { border-color: var(--line-bright); background: rgba(var(--text-rgb),.05); }
.tc-wpanel-item:hover .tc-wpanel-del { opacity: 1; }
.tc-wpanel-item.wl-item-dragging { opacity: .35; cursor: grabbing; }
.tc-wpanel-drag-handle { flex: 0 0 auto; color: var(--faint); padding-top: 2px; opacity: .55; }
.tc-wpanel-item-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.tc-wpanel-item-name { font-size: 12.5px; color: var(--text); line-height: 1.35; word-break: break-word; }
.tc-wpanel-item-meta { display: flex; flex-wrap: wrap; gap: 3px; }
.tc-wpanel-item-meta .tc-chip { font-size: 10px; padding: 2px 6px; }
.tc-wpanel-del {
opacity: 0; transition: opacity .12s; flex: 0 0 auto;
width: 22px !important; height: 22px !important;
}
.tc-wpanel-del svg { width: 12px !important; height: 12px !important; }
.tc-wpanel-empty {
display: flex; flex-direction: column; align-items: center; gap: 8px;
padding: 24px 8px; color: var(--faint); font-size: 12px; text-align: center;
}
.tc-wpanel-empty svg { width: 22px; height: 22px; opacity: .4; }
/* Drop-zone visual hints inside sprint cards */
.tc-sprint-drop-hint {
display: none; align-items: center; justify-content: center; gap: 6px;
padding: 7px 12px; margin: 3px 0;
border: 1.5px dashed var(--line); border-radius: 8px;
color: var(--faint); font-size: 11.5px; font-weight: 600;
transition: border-color .15s, color .15s, background .15s;
pointer-events: none;
}
.tc-sprint-drop-hint svg { width: 13px; height: 13px; flex: 0 0 auto; }
body.wl-drag-active .tc-sprint-drop-hint { display: flex; }
/* Standalone section drop area */
.tc-standalone-drop-area {
display: flex; flex-direction: column; gap: 6px;
border-radius: 8px; padding: 5px; margin: -5px;
transition: background .15s;
}
/* =======================================================================
REDESIGN OVERRIDES — "Light Under the Door".
A firm, full-width, squared tab strip (no generic floating pills) and a
clearer Sprint-planning hierarchy. Appended last so these win over the
original .tc-* rules above.
======================================================================= */
/* ---- Full-width segmented tab strip ---- */
.tc-subnav{
gap:0;padding:0;align-items:stretch;flex-wrap:nowrap;min-height:54px;
border-bottom:1px solid var(--grid-line);
background:linear-gradient(180deg,var(--panel-2),var(--panel));
overflow-x:auto;scrollbar-width:none;
}
.tc-subnav::-webkit-scrollbar{display:none;}
.tc-subnav-title{
display:flex;align-items:center;gap:10px;margin:0;padding:0 22px;
font-size:15px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;
color:var(--text);border-right:1px solid var(--grid-line);white-space:nowrap;flex:0 0 auto;
}
.tc-subnav-title .tc-logo{width:26px;height:26px;box-shadow:none;}
.tc-subnav-btn{
border:none;border-right:1px solid var(--line-soft);
background:none;color:var(--muted);
padding:0 18px;min-height:54px;font-size:11px;font-weight:700;
letter-spacing:.8px;text-transform:uppercase;position:relative;flex:0 0 auto;
display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
transition:color .15s,background .15s;box-shadow:none;
}
.tc-subnav-btn:hover{color:var(--text);background:rgba(var(--text-rgb),.035);box-shadow:none;border-color:var(--line-soft);}
.tc-subnav-btn.active{
color:var(--accent-soft);background:rgba(var(--text-rgb),.05);box-shadow:none;border-color:var(--line-soft);
}
.tc-subnav-btn.active::after{
content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
background:var(--accent);box-shadow:0 0 9px rgba(var(--accent-rgb),.55);z-index:4;
}
.tc-subnav-btn .tc-count{
background:var(--line);color:var(--text);padding:1px 7px;font-size:10px;font-weight:800;min-width:18px;text-align:center;
}
.tc-subnav-btn:not(.active) .tc-count{background:var(--line);color:var(--muted);}
/* ---- Sprint-planning hierarchy: a firmer, clearer box ---- */
.tc-sprint{padding:15px 16px 16px;gap:11px;overflow:hidden;}
.tc-sprint-head{
margin:-15px -16px 5px;padding:13px 16px;gap:11px;align-items:center;
background:linear-gradient(180deg,var(--card-2),var(--card));
border-bottom:1px solid var(--grid-line);
}
.tc-sprint .tc-proj-name{font-size:17px;font-weight:800;letter-spacing:.2px;}
/* the primary objective is the most important line on the card */
.tc-sprint > .tc-sprint-goal:not(.tc-sprint-goal-secondary){
font-size:15px;font-weight:650;border-left:2px solid var(--accent);
background:rgba(var(--accent-rgb),.05);
}
/* firm divider above each section; the first (Goals) sits flush under the head */
.tc-sprint-section-label{
padding-top:11px;border-top:1px solid var(--line-soft);
font-size:var(--fs-label);letter-spacing:1.4px;
}
.tc-sprint-head + .tc-sprint-section-label{border-top:none;padding-top:0;}
/* an overdue / urgent date reads red — the one "important info" cue */
.tc-chip.tc-chip-overdue{
background:rgba(var(--important-rgb),.12);border-color:rgba(var(--important-rgb),.4);
color:var(--important-soft);
}
.tc-chip.tc-chip-weeks{
background:var(--card-subtle);border-color:var(--line);color:var(--muted);font-variant-numeric:tabular-nums;
}
/* ---- Sprint horizon overview: the upcoming 6–14 weeks at a glance ---- */
.tc-horizon{
display:flex;flex-direction:column;gap:0;border:1px solid var(--grid-line);
background:linear-gradient(160deg,var(--card),var(--card-2));margin-bottom:4px;position:relative;
}
.tc-horizon::after{
content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--leak-strong);
box-shadow:var(--leak-glow);pointer-events:none;
}
.tc-horizon-head{
display:flex;align-items:center;gap:8px;padding:11px 15px;border-bottom:1px solid var(--line-soft);
font-size:var(--fs-label);text-transform:uppercase;letter-spacing:1.4px;font-weight:800;color:var(--faint);
}
.tc-horizon-head svg{width:14px;height:14px;}
.tc-horizon-track{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;}
.tc-horizon-track::-webkit-scrollbar{display:none;}
.tc-horizon-seg{
flex:0 0 auto;min-width:150px;padding:12px 15px;border-right:1px solid var(--line-soft);
display:flex;flex-direction:column;gap:7px;cursor:pointer;text-align:left;
background:none;border-top:none;border-bottom:none;border-left:none;font-family:inherit;
transition:background .15s;
}
.tc-horizon-seg:hover{background:rgba(var(--text-rgb),.03);}
.tc-horizon-seg.is-active{background:rgba(var(--accent-rgb),.06);}
.tc-horizon-seg.is-active::after{} /* reserved */
.tc-horizon-seg-name{font-size:12.5px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tc-horizon-seg-when{font-size:10.5px;color:var(--faint);font-variant-numeric:tabular-nums;letter-spacing:.3px;display:flex;align-items:center;gap:6px;}
.tc-horizon-seg-when .tc-hz-now{color:var(--good);font-weight:800;}
.tc-horizon-seg-when .tc-hz-late{color:var(--important);font-weight:800;}
.tc-horizon-bar{height:4px;background:var(--line);overflow:hidden;}
.tc-horizon-bar > i{display:block;height:100%;background:var(--accent);}
/* Drag-over highlight for drop targets */
[data-drop-target].wl-drag-over {
background: rgba(var(--accent-rgb),.07) !important;
border-color: rgba(var(--accent-rgb),.5) !important;
}
[data-drop-target].wl-drag-over .tc-sprint-drop-hint {
border-color: var(--accent); color: var(--accent-soft);
background: rgba(var(--accent-rgb),.12);
}
/* =======================================================================
SPRINTS REDESIGN v2 — calmer hierarchy + one-keystroke capture.
The current sprint reads as "now" (signature light-leak seam); a single
composer makes recording an upcoming action one keystroke; the three
goals become a clearly-labelled "Intentions" block; progress gets a real
meter. Appended last so it wins over the earlier .tc-sprint rules.
======================================================================= */
/* The active sprint: a thin sliver of light along the top seam = "this is now". */
.tc-sprint{position:relative;}
.tc-sprint-active{border-color:var(--grid-line);box-shadow:var(--sh-1);}
.tc-sprint-active::before{
content:"";position:absolute;left:0;right:0;top:0;height:1px;
background:var(--leak-strong);box-shadow:var(--leak-glow);pointer-events:none;z-index:3;
}
/* Completed sprints recede until hovered — done work shouldn't shout. */
.tc-sprint-done{opacity:.66;}
.tc-sprint-done:hover,.tc-sprint-done:focus-within{opacity:1;}
/* Meta strip — start → end timeline + timing pill */
.tc-sprint-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.tc-sprint-meta-arrow{display:inline-flex;align-items:center;color:var(--faint);flex:0 0 auto;}
.tc-sprint-meta-arrow svg{width:13px;height:13px;}
/* Progress meter — bar + tabular stats + bold percentage */
.tc-sprint-progress-row{display:flex;align-items:center;gap:14px;}
.tc-sprint-progress{flex:1;height:6px;min-width:60px;}
.tc-sprint-progress-stats{display:flex;align-items:center;gap:13px;flex:0 0 auto;}
.tc-sprint-stat{
font-size:11.5px;color:var(--muted);display:inline-flex;align-items:center;gap:5px;
font-variant-numeric:tabular-nums;white-space:nowrap;
}
.tc-sprint-stat b{color:var(--text);font-weight:800;}
.tc-sprint-stat svg{width:12px;height:12px;opacity:.75;}
.tc-sprint-stat-cap{color:var(--faint);}
.tc-sprint-stat-pct{
font-size:14px;font-weight:800;color:var(--accent-soft);
font-variant-numeric:tabular-nums;min-width:38px;text-align:right;letter-spacing:.2px;
}
/* Intentions — objective (primary) + learning goal + success criteria */
.tc-sprint-intentions{
display:flex;flex-direction:column;gap:11px;
background:rgba(var(--accent-rgb),.035);border:1px solid var(--line-soft);
border-left:2px solid var(--accent);padding:13px 15px;
}
.tc-intent{display:flex;flex-direction:column;gap:5px;min-width:0;cursor:text;}
.tc-intent-label{
display:inline-flex;align-items:center;gap:6px;
font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:1.3px;font-weight:800;color:var(--faint);
}
.tc-intent-label svg{width:12px;height:12px;flex:0 0 auto;opacity:.85;}
.tc-intent-primary .tc-intent-label{color:var(--accent2-soft);}
.tc-intent-input{
width:100%;background:rgba(var(--bg-rgb),.5);border:1px solid var(--line-soft);
color:var(--text);font-family:inherit;font-size:13.5px;padding:8px 11px;outline:none;
transition:border-color .15s,background .15s;
}
.tc-intent-primary .tc-intent-input{font-size:15px;font-weight:600;}
.tc-intent-input:focus{border-color:var(--accent);background:var(--bg);}
.tc-intent-input::placeholder{color:var(--faint);font-weight:400;}
.tc-intent-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
@media (max-width:620px){.tc-intent-grid{grid-template-columns:1fr;}}
/* Quick-add composer — the primary "record an upcoming action" affordance */
.tc-sprint-add-label{color:var(--accent2-soft);}
.tc-sprint-compose{
display:flex;align-items:center;gap:10px;
background:linear-gradient(160deg,var(--card-2),var(--card));
border:1px solid var(--line);padding:8px 9px 8px 13px;
transition:border-color .15s,box-shadow .15s;
}
.tc-sprint-compose:focus-within{
border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.1);
}
.tc-sprint-compose-ic{width:16px;height:16px;flex:0 0 auto;color:var(--faint);transition:color .15s;}
.tc-sprint-compose:focus-within .tc-sprint-compose-ic{color:var(--accent-soft);}
.tc-sprint-compose-input{
flex:1;min-width:0;background:none;border:none;outline:none;
color:var(--text);font-family:inherit;font-size:14px;padding:5px 0;caret-color:var(--accent);
}
.tc-sprint-compose-input::placeholder{color:var(--faint);}
.tc-sprint-compose-btn{flex:0 0 auto;}
/* Footer "pull in existing" — a quiet secondary option */
.tc-sprint-foot .tc-sprint-foot-label{
display:inline-flex;align-items:center;gap:5px;
font-size:11.5px;color:var(--faint);font-weight:600;white-space:nowrap;
}
.tc-sprint-foot .tc-sprint-foot-label svg{width:13px;height:13px;}
.tc-sprint-foot .tc-mini-sel{max-width:none;flex:1;min-width:140px;}
/* ---- All Actions panel (accessible from the To-Do tab) ---- */
.all-actions-panel{
grid-column:1;grid-row:3;
display:none;flex-direction:column;min-height:0;overflow:hidden;
background:var(--bg);z-index:5;
}
.all-actions-panel.visible{display:flex;}
.all-actions-header{
flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
padding:18px 24px 14px;border-bottom:1px solid var(--line-soft);
background:linear-gradient(180deg,rgba(var(--bg-rgb),.9) 78%,rgba(var(--bg-rgb),0));
backdrop-filter:blur(6px);position:sticky;top:0;z-index:2;
}
.all-actions-title{
font-size:var(--fs-page-title);font-weight:800;color:var(--text);letter-spacing:.2px;
}
.all-actions-close{
display:inline-flex;align-items:center;gap:6px;
background:var(--card);border:1px solid var(--line);color:var(--muted);
border-radius:10px;padding:7px 14px;font-size:12.5px;font-weight:600;
cursor:pointer;font-family:inherit;white-space:nowrap;
transition:background .15s,border-color .15s,color .15s;
}
.all-actions-close:hover{color:var(--text);border-color:var(--line-bright);}
.all-actions-close svg{width:14px;height:14px;flex:0 0 auto;}
.all-actions-scroll{
flex:1;min-height:0;overflow-y:auto;
padding:22px 24px 40px;display:flex;flex-direction:column;gap:18px;
}
/* ---- "All Actions" trigger button in To-Do headers ---- */
.todo-all-actions-btn{
display:inline-flex;align-items:center;gap:6px;
background:var(--card);border:1px solid var(--line);color:var(--muted);
border-radius:10px;padding:7px 13px;font-size:12.5px;font-weight:600;
cursor:pointer;font-family:inherit;white-space:nowrap;
transition:background .15s,border-color .15s,color .15s;
}
.todo-all-actions-btn:hover{color:var(--text);border-color:var(--line-bright);}
.todo-sidebar .todo-all-actions-btn{padding:5px 10px;font-size:11.5px;}
.todo-header-actions{display:flex;align-items:center;gap:8px;}
.todo-sidebar-headright{display:flex;align-items:center;gap:7px;}
.todo-todays-goals-btn{
display:inline-flex;align-items:center;gap:6px;
background:var(--card);border:1px solid var(--line);color:var(--muted);
border-radius:10px;padding:5px 10px;font-size:11.5px;font-weight:600;
cursor:pointer;font-family:inherit;white-space:nowrap;
transition:background .15s,border-color .15s,color .15s;
}
.todo-todays-goals-btn:hover{color:var(--text);border-color:var(--line-bright);}
/* ---- Project action drag-to-reorder handle ---- */
.tc-row-drag{
flex:0 0 auto;display:flex;align-items:center;cursor:grab;
color:var(--faint);padding:4px 2px 0;
touch-action:none;-webkit-user-select:none;user-select:none;
opacity:0;transition:opacity .12s,color .12s;
}
.tc-row:hover .tc-row-drag{opacity:1;}
.tc-row-drag:hover{color:var(--muted);}
.tc-row-drag:active{cursor:grabbing;}
.tc-row-drag svg{width:10px;height:16px;pointer-events:none;}
.tc-row.dragging{
z-index:50;cursor:grabbing;
background:var(--card-2);
box-shadow:0 8px 22px rgba(0,0,0,.20),0 0 0 1px rgba(var(--accent-rgb),.4);
position:relative;
}
/* =====================================================================
FLAT ACTION ROWS — used inside .tc-proj-actions and .tc-sprint-acts.
Borderless, Notion-style database rows. The parent project/sprint card
supplies the chrome; rows are just indented lines with a hover state.
===================================================================== */
/* Old card styles are off for the legacy classes these rows still carry
(kept so the existing pointer-drag handlers keep working unchanged). */
.tc-proj-actions .tc-row,
.tc-sprint-acts .tc-standalone-act{
background:none !important;
border:none !important;
box-shadow:none !important;
}
/* Tighten the row spacing so flat rows read as one continuous list. */
.tc-proj-actions.tc-list{gap:1px;}
.tc-flat-row{
display:flex;
flex-direction:row;
align-items:flex-start;
gap:6px;
padding:5px 8px 5px 4px;
border-radius:6px;
min-height:32px;
position:relative;
transition:background var(--t-base) var(--ease);
}
.tc-flat-row:hover{background:rgba(var(--text-rgb),.028);}
/* Left column: drag + chevron + checkbox */
.tc-flat-left{
display:flex;align-items:center;gap:2px;
flex:0 0 auto;padding-top:2px;
}
.tc-flat-drag{
display:inline-flex;align-items:center;cursor:grab;color:var(--faint);
padding:0 1px;touch-action:none;-webkit-user-select:none;user-select:none;
}
.tc-flat-drag:hover{color:var(--muted);}
.tc-flat-drag:active{cursor:grabbing;}
.tc-flat-drag svg{width:9px;height:15px;pointer-events:none;}
.tc-flat-chevron{
width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;
border:none;background:none;color:var(--faint);border-radius:4px;cursor:pointer;
padding:0;flex-shrink:0;transition:color .12s,background .12s;
}
.tc-flat-chevron:hover{color:var(--text);background:rgba(var(--text-rgb),.06);}
.tc-flat-chevron svg{width:12px;height:12px;transition:transform .15s;}
.tc-flat-chevron.tc-flat-chevron-empty{opacity:0;pointer-events:none;}
.tc-flat-check{
width:14px;height:14px;flex-shrink:0;accent-color:var(--accent2);cursor:pointer;
}
/* Center column: name + notes + sub-actions */
.tc-flat-body{
flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;
}
.tc-flat-title-line{
display:flex;
align-items:center;
gap:6px;
min-width:0;
width:100%;
}
.tc-flat-name{
background:none;border:none;color:var(--text);
font-size:13.5px;font-weight:500;font-family:inherit;outline:none;
padding:0;line-height:1.35;cursor:text;
flex:1 1 260px;
min-width:160px;
max-width:520px;
width:auto;
}
.tc-flat-name::placeholder{color:var(--faint);}
.tc-flat-name.tc-done{text-decoration:line-through;color:var(--faint);}
.tc-flat-add-sub{
background:none;border:none;color:var(--faint);font-size:11.5px;cursor:pointer;
font-family:inherit;padding:2px 0;text-align:left;
display:inline-flex;align-items:center;gap:4px;transition:color .12s;
}
.tc-flat-add-sub:hover{color:var(--accent-soft);}
.tc-flat-add-sub svg{flex-shrink:0;}
/* Right column: quiet metadata tags */
.tc-flat-meta{
display:flex;align-items:center;gap:6px;flex-shrink:0;padding-top:3px;flex-wrap:nowrap;
}
.tc-flat-tag{
font-size:11px;color:var(--faint);white-space:nowrap;font-weight:500;
}
.tc-flat-tag-sprint{
display:inline-flex;align-items:center;gap:3px;color:rgba(var(--accent-2-rgb),.75);
}
.tc-flat-tag-sprint::before{
content:"";width:5px;height:5px;border-radius:50%;background:rgba(var(--accent-2-rgb),.65);
flex-shrink:0;display:inline-block;
}
.tc-flat-tag-project{color:var(--accent-soft);}
.tc-flat-tag-area{color:rgba(var(--text-rgb),.62);}
.tc-flat-tag-time{font-variant-numeric:tabular-nums;}
.tc-flat-tag-edited{font-variant-numeric:tabular-nums;}
.tc-flat-meta-item{
position:relative;
display:inline-flex;
align-items:center;
min-height:18px;
}
.tc-flat-meta-value{
transition:opacity .12s;
}
.tc-flat-meta-value-empty{opacity:.42;}
.tc-flat-meta-control{
position:absolute;
inset:0;
opacity:0;
pointer-events:none;
transition:opacity .12s;
}
.tc-flat-row:hover .tc-flat-meta-control,
.tc-flat-row:focus-within .tc-flat-meta-control,
.tc-flat-meta-item:focus-within .tc-flat-meta-control{
opacity:1;
pointer-events:auto;
}
.tc-flat-row:hover .tc-flat-meta-value,
.tc-flat-row:focus-within .tc-flat-meta-value,
.tc-flat-meta-item:focus-within .tc-flat-meta-value{
opacity:0;
}
/* Area select styled as plain text */
.tc-flat-area-sel{
-webkit-appearance:none;appearance:none;background:none;border:none;
color:var(--faint);font-size:11px;font-family:inherit;font-weight:500;
cursor:pointer;padding:0;outline:none;opacity:0;max-width:120px;
transition:opacity .12s;
width:100%;
}
.tc-flat-area-sel:hover,
.tc-flat-row:hover .tc-flat-area-sel{opacity:1;}
/* Date input styled as a quiet plain-text chip */
.tc-flat-date{
background:none;border:none;color:var(--faint);
font-size:11px;font-family:inherit;font-weight:500;
font-variant-numeric:tabular-nums;padding:0;outline:none;cursor:pointer;
opacity:0;transition:opacity .12s;width:100%;min-width:78px;
}
.tc-flat-date:hover,
.tc-flat-row:hover .tc-flat-date{opacity:1;}
.tc-flat-date::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer;}
/* Right column: action buttons — hidden at rest */
.tc-flat-actions{
display:flex;align-items:center;gap:1px;flex-shrink:0;padding-top:1px;
}
.tc-flat-inline-actions{
margin-left:2px;
}
.tc-flat-btn{
width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;
background:none;border:none;border-radius:5px;color:var(--faint);cursor:pointer;
padding:0;transition:color .12s,background .12s;flex-shrink:0;
}
.tc-flat-btn svg{width:13px;height:13px;}
.tc-flat-btn:hover{color:var(--text);background:rgba(var(--text-rgb),.06);}
.tc-flat-btn.tc-danger:hover{color:var(--danger-soft);}
.tc-flat-btn.tc-star svg{fill:none;}
.tc-flat-btn.tc-star.on{color:var(--warn);}
.tc-flat-btn.tc-star.on svg{fill:var(--warn);}
.tc-flat-btn.tc-notes-has-content{color:var(--accent2-soft);opacity:1 !important;}
.tc-flat-btn.tc-sched-btn.on{color:var(--accent-soft);opacity:1 !important;}
.tc-flat-row-action-btn{
opacity:1;
color:var(--muted);
background:rgba(var(--text-rgb),.045);
}
.tc-flat-row:hover .tc-flat-row-action-btn,
.tc-flat-row:focus-within .tc-flat-row-action-btn{
opacity:1;
}
/* Hover-only: opacity 0 at rest, 1 on parent hover */
.tc-flat-hover-only{opacity:0;transition:opacity .12s;}
.tc-flat-row:hover .tc-flat-hover-only{opacity:1;}
/* Exception: buttons that carry an active "on" / content state stay visible */
.tc-flat-row .tc-flat-btn.on,
.tc-flat-row .tc-notes-has-content{opacity:1;}
/* Sub-action tree indentation inside flat rows */
.tc-flat-row .tc-micro-list{
margin-top:4px;padding-top:6px;
margin-left:2px;padding-left:18px;
border-left:1.5px solid var(--line-soft);border-top:none;
}
/* Leftmost collapse chevron on each sub-action row (tier 2 → tier 3) */
.tc-micro-chevron{
width:16px;height:16px;margin-right:2px;flex-shrink:0;
}
.tc-micro-chevron svg{
width:11px;height:11px;
}
/* ---- Archived drawer (projects / sprints / actions) ----
A quiet, collapsed footer of archived rows with one-tap Restore. */
.tc-archived-section{
margin-top:14px;border-top:1px dashed var(--line-soft);padding-top:8px;
}
.tc-archived-head{
display:flex;align-items:center;gap:7px;width:100%;
background:none;border:0;cursor:pointer;
color:var(--muted);font-size:var(--fs-label);font-weight:600;
padding:6px 4px;border-radius:8px;transition:background .15s var(--ease,ease);
}
.tc-archived-head:hover{ background:var(--hover); color:var(--text); }
.tc-archived-head svg{ width:14px;height:14px; }
.tc-archived-n{
background:var(--card-2);color:var(--muted);border-radius:20px;
font-size:10.5px;font-weight:700;padding:1px 7px;min-width:18px;text-align:center;
}
.tc-archived-list{ margin-top:4px; }
.tc-archived-row{ opacity:.72; }
.tc-archived-row:hover{ opacity:1; }
.tc-archived-title{
color:var(--muted);font-size:var(--fs-content);
text-decoration:line-through;text-decoration-color:var(--line);
}
/* =====================================================================
BACKLOG TREE LAYOUT — Projects + Sprints views
===================================================================== */
.bk-tree{display:flex;flex-direction:column;}
.bk-row{display:flex;align-items:center;gap:7px;padding:5px 7px;border-radius:var(--r-md);border:1px solid transparent;transition:background .12s,border-color .12s;min-height:32px;}
.bk-row:hover{background:var(--card-hover);}
.bk-row-project{background:var(--card);border-color:var(--line);margin-top:6px;padding:7px 10px;}
.bk-node:first-child > .bk-row-project{margin-top:0;}
.bk-unassigned-block > .bk-row-project{border-style:dashed;border-color:var(--line-soft);}
/* Only the Unassigned block's own header handle is inert (the block itself is not
draggable). Action rows inside it keep working handles so they can be dragged
out into any project group in the sprint. */
.bk-unassigned-block > .bk-row-project > .bk-drag{opacity:0!important;cursor:default;pointer-events:none;}
.bk-row-project:hover{background:var(--card-hover);border-color:var(--line-bright);}
/* ---- Sprint dividers (Celtic braid) ---- */
.sprint-divider{display:flex;align-items:center;gap:14px;margin:22px 0 10px;padding:0 2px;}
.sprint-div-label{
flex:none;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
color:rgba(var(--accent-rgb),.9);padding:3px 12px;white-space:nowrap;
border:1px solid rgba(var(--accent-rgb),.28);border-radius:20px;
background:rgba(var(--accent-rgb),.07);
}
.sprint-div-line{
flex:1;height:14px;position:relative;
background:
repeating-linear-gradient(60deg, transparent 0,transparent 5px, rgba(var(--accent-rgb),.22) 5px,rgba(var(--accent-rgb),.22) 6.5px),
repeating-linear-gradient(-60deg,transparent 0,transparent 5px, rgba(var(--accent-rgb),.18) 5px,rgba(var(--accent-rgb),.18) 6.5px),
linear-gradient(transparent 0,transparent 2px, rgba(var(--accent-rgb),.55) 2px,rgba(var(--accent-rgb),.55) 3px, transparent 3px,transparent 11px, rgba(var(--accent-rgb),.35) 11px,rgba(var(--accent-rgb),.35) 12px,transparent 12px);
-webkit-mask:linear-gradient(90deg,transparent 0%,#000 30%,#000 70%,transparent 100%);
mask:linear-gradient(90deg,transparent 0%,#000 30%,#000 70%,transparent 100%);
}
.bk-row-sprint{background:var(--card);border:1px solid var(--line);padding:8px 10px;margin-top:8px;}
.bk-row-sprint .bk-name{font-size:14.5px;font-weight:700;}
.bk-sprint-active > .bk-row-sprint{border-color:rgba(var(--good-rgb),.35);}
.bk-sprint-done{opacity:.65;}
.bk-sprint-done:hover,.bk-sprint-done:focus-within{opacity:1;}
.bk-row-action{padding:4px 8px;}
.bk-row-action.bk-done .bk-name-inp{text-decoration:line-through;color:var(--faint);}
.bk-row-micro{padding:3px 8px;}
.bk-row-micro .bk-name-inp{font-size:13px;color:var(--muted);}
.bk-row-micro.bk-done .bk-name-inp{text-decoration:line-through;color:var(--faint);}
.bk-fold{width:18px;height:18px;flex:none;display:grid;place-items:center;border:none;background:none;color:var(--faint);cursor:pointer;border-radius:3px;padding:0;transition:color .12s,background .12s;}
.bk-fold:hover{background:rgba(var(--text-rgb),.08);color:var(--text);}
.bk-fold svg{width:12px;height:12px;transition:transform .15s;}
.bk-fold.bk-fold-collapsed svg{transform:rotate(-90deg);}
.bk-fold-spacer{width:18px;flex:none;}
.bk-kids{margin-left:8px;padding-left:9px;border-left:1px solid var(--line-soft);display:flex;flex-direction:column;}
.bk-kids.bk-hidden{display:none;}
/* An action with no sub-actions still has a sub-action lane, so an action can be
dragged into it and demoted. It stays out of the way until a drag is running. */
.bk-kids-subs.bk-subs-empty{display:none;}
body.bk-reparenting .bk-kids-subs.bk-subs-empty.bk-subs-armed{display:flex;border-left-style:dashed;border-left-color:rgba(var(--accent-rgb),.5);}
body.bk-reparenting .bk-kids-subs.bk-subs-empty.bk-subs-armed .bk-add-inline{color:var(--accent-soft);opacity:.9;}
/* ---- Drag-and-drop (bk-tree reordering) ---- */
.bk-drag{width:15px;flex:none;display:grid;place-items:center;color:var(--faint);cursor:grab;opacity:0;transition:opacity .12s,color .12s;touch-action:none;margin-right:-2px;align-self:center;}
.bk-drag.bk-drag-spacer{width:18px;margin-right:0;}
.bk-drag svg{width:9px;height:14px;display:block;}
.bk-row:hover > .bk-drag{opacity:.5;}
.bk-drag:hover{opacity:1;color:var(--text);}
.bk-drag:active{cursor:grabbing;}
.bk-draggable.bk-drag-ghost{opacity:.95;background:var(--surface);border:1px solid var(--accent);border-radius:var(--r-md);box-shadow:0 10px 28px rgba(0,0,0,.22);}
.bk-draggable.bk-drag-ghost .bk-drag{opacity:1;color:var(--accent-soft);}
.bk-drag-ph{background:rgba(var(--accent-rgb),.16);border:1px dashed rgba(var(--accent-rgb),.55);border-radius:5px;margin:2px 0;flex:0 0 auto;}
.bk-zone-over{background:rgba(var(--accent-rgb),.06);border-radius:6px;}
body.reordering{cursor:grabbing;user-select:none;-webkit-user-select:none;}
/* ---- Generic mini-action reorder grip (all views) ---- */
.tc-msort-handle{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:12px;align-self:center;cursor:grab;color:var(--faint);opacity:0;transition:opacity .12s,color .12s;touch-action:none;-webkit-user-select:none;user-select:none;}
.tc-msort-handle svg{width:8px;height:13px;display:block;pointer-events:none;}
.tc-msort-handle:hover{color:var(--text);opacity:1;}
.tc-msort-handle:active{cursor:grabbing;}
.tc-check-item:hover .tc-msort-handle,
.tc-sub-check-item:hover .tc-msort-handle,
.pl-micro:hover .tc-msort-handle,
.tsb-micro:hover .tc-msort-handle,
.tsb-sub-micro:hover .tc-msort-handle,
.bk-row-micro:hover .tc-msort-handle{opacity:.55;}
.tc-msort-ph{background:rgba(var(--accent-rgb),.16);border:1px dashed rgba(var(--accent-rgb),.55);border-radius:5px;margin:2px 0;flex:0 0 auto;}
.tc-msort-ghost{opacity:.95;background:var(--surface);border:1px solid var(--accent);border-radius:var(--r-md);box-shadow:0 10px 28px rgba(0,0,0,.22);pointer-events:none;}
.bk-proj-link{flex:1;min-width:0;text-align:left;background:none;border:none;color:var(--text);font-weight:600;font-size:14px;font-family:inherit;cursor:pointer;padding:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;outline:none;}
.bk-proj-link:hover{color:var(--accent-soft);}
.bk-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;color:var(--text);font-weight:500;}
.bk-name-inp{flex:1;min-width:0;background:none;border:none;color:var(--text);font-size:13.5px;font-family:inherit;outline:none;padding:0;cursor:text;}
.bk-name-inp::placeholder{color:var(--faint);}
/* Project rows: the name is edited in place (the old planning page is gone) and
the notes button turns gold once the project has notes, matching the sidebar. */
.bk-proj-name-inp{font-size:14px;font-weight:600;}
.bk-proj-notes{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;background:none;border:none;border-radius:var(--r-sm);color:var(--faint);cursor:pointer;opacity:0;transition:opacity .12s,color .12s,background .12s;}
.bk-proj-notes svg{width:14px;height:14px;}
.bk-row-project:hover .bk-proj-notes{opacity:.65;}
.bk-proj-notes:hover{opacity:1;color:var(--text);background:var(--card-hover);}
.bk-proj-notes.has-notes{opacity:1;color:var(--warn);}
.bk-proj-notes.has-notes:hover{color:var(--warn);background:rgba(var(--warn-rgb),.14);}
.bk-ic{flex:none;color:var(--faint);display:inline-flex;align-items:center;}
.bk-ic svg{width:14px;height:14px;}
.bk-check{flex:none;width:14px;height:14px;accent-color:var(--accent2);cursor:pointer;}
.bk-meta{display:flex;align-items:center;gap:6px;flex:none;margin-left:auto;}
.bk-chip{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:var(--r-sm);font-size:11.5px;font-weight:500;white-space:nowrap;}
.bk-chip-area{background:rgba(var(--text-rgb),.055);border:1px solid var(--line-soft);color:var(--muted);}
.bk-chip-sprint{background:rgba(var(--accent-2-rgb),.12);border:1px solid rgba(var(--accent-2-rgb),.28);color:var(--accent-2);}
.bk-badge{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:var(--r-sm);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;}
.bk-badge-done{background:rgba(var(--good-rgb),.10);border:1px solid rgba(var(--good-rgb),.30);color:var(--good);}
.bk-badge-prog{background:rgba(var(--warn-rgb),.10);border:1px solid rgba(var(--warn-rgb),.30);color:var(--warn);}
.bk-badge-in-progress{background:rgba(var(--warn-rgb),.10);border:1px solid rgba(var(--warn-rgb),.30);color:var(--warn);}
.bk-badge-start,.bk-badge-not-started{background:rgba(var(--text-rgb),.04);border:1px solid var(--line-soft);color:var(--faint);}
.bk-badge-active{background:rgba(var(--good-rgb),.10);border:1px solid rgba(var(--good-rgb),.30);color:var(--good);}
.bk-badge-planning{background:rgba(var(--text-rgb),.04);border:1px solid var(--line-soft);color:var(--muted);}
.bk-mini-prog{display:inline-flex;align-items:center;gap:5px;}
.bk-prog{width:54px;height:4px;background:var(--line);border-radius:2px;overflow:hidden;flex-shrink:0;}
.bk-prog-bar{display:block;height:100%;background:linear-gradient(90deg,var(--accent-soft),var(--accent));transition:width .3s;}
.bk-prog-num{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;}
.bk-sub-ct{display:inline-flex;align-items:center;gap:3px;font-size:12px;color:var(--muted);}
.bk-time{font-size:12px;color:var(--muted);white-space:nowrap;}
.bk-row-quick-acts{display:flex;align-items:center;gap:1px;opacity:0;transition:opacity .12s;}
/* Hover-revealed "add sub-action" — the fastest way to nest a step from the tree. */
.bk-add-sub-btn:hover{color:var(--accent-soft);background:rgba(var(--accent-rgb),.12);}
.bk-row-action:hover .bk-row-quick-acts,
.bk-row-action:focus-within .bk-row-quick-acts{opacity:1;}
/* Archive + x on project and sub-action rows. Same hover-reveal as the action
row's quick-acts, so a resting tree stays free of icon noise. */
.bk-remove-acts{margin-left:2px;}
.bk-row-project:hover .bk-remove-acts,
.bk-row-project:focus-within .bk-remove-acts,
.bk-row-micro:hover .bk-remove-acts,
.bk-row-micro:focus-within .bk-remove-acts{opacity:1;}
.bk-row-micro .bk-remove-acts{margin-left:auto;}
.bk-node-notes{display:block;width:100%;box-sizing:border-box;margin-top:0;margin-left:26px;width:calc(100% - 26px);}
.bk-cap-chip{font-size:12px;color:var(--muted);background:rgba(var(--text-rgb),.05);border:1px solid var(--line-soft);border-radius:var(--r-sm);padding:1px 7px;white-space:nowrap;}
.bk-cap-chip-archive{color:var(--accent-soft);border-color:rgba(var(--accent-rgb),.35);}
.bk-cap-chip-danger{color:var(--danger-soft);border-color:rgba(var(--danger-rgb),.35);}
.bk-cap-chip-muted{opacity:.65;}
.bk-cap-chip-muted:hover{opacity:1;}
.bk-timing{font-size:12px;color:var(--muted);white-space:nowrap;}
.bk-timing.bk-late{color:var(--danger);}
.bk-add-inline{display:flex;align-items:center;gap:7px;padding:5px 7px 5px 25px;color:var(--faint);font-size:12.5px;cursor:pointer;border:none;background:none;font-family:inherit;width:100%;text-align:left;border-radius:var(--r-md);transition:color .12s;}
.bk-add-inline:hover{color:var(--accent-soft);}
.bk-add-inline svg{width:13px;height:13px;flex:none;}
.bk-del-btn{opacity:0;flex:none;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border:none;background:none;color:var(--faint);cursor:pointer;border-radius:3px;padding:0;transition:opacity .12s,color .12s;}
.bk-del-btn svg{width:13px;height:13px;}
.bk-del-btn:hover{color:var(--danger);}
.bk-row:hover .bk-del-btn{opacity:1;}
/* =====================================================================
PROJECT + SPRINT PLANNING OVERLAYS
===================================================================== */
.tc-pp-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--bg);z-index:80;display:flex;flex-direction:column;transform:translateX(102%);transition:transform .22s cubic-bezier(.4,0,.2,1);overflow:hidden;pointer-events:none;}
.tc-pp-overlay.open{transform:translateX(0);pointer-events:auto;}
.tc-pp-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line-soft);flex:none;}
.tc-pp-back{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--muted);background:none;border:none;cursor:pointer;font-family:inherit;padding:4px 8px;border-radius:var(--r-sm);transition:color .15s,background .15s;white-space:nowrap;flex:none;}
.tc-pp-back:hover{color:var(--text);background:var(--card-hover);}
.tc-pp-back svg{width:14px;height:14px;}
.tc-pp-title{flex:1;background:none;border:none;color:var(--text);font-size:16px;font-weight:700;font-family:inherit;outline:none;padding:0;min-width:0;}
.tc-pp-title::placeholder{color:var(--faint);}
.tc-pp-title-static{flex:1;font-size:16px;font-weight:700;color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tc-pp-head-acts{display:flex;align-items:center;gap:6px;flex:none;}
.tc-pp-progress{height:3px;background:var(--line);flex:none;overflow:hidden;}
.tc-pp-progress-bar{height:100%;background:linear-gradient(90deg,var(--accent-soft),var(--accent));transition:width .3s;}
.tc-pp-body{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:12px;}
.tc-pp-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:4px;}
.tc-pp-section-lbl{font-size:11px;text-transform:uppercase;letter-spacing:.9px;font-weight:700;color:var(--faint);display:flex;align-items:center;gap:6px;margin-bottom:6px;}
.tc-pp-section-lbl svg{width:13px;height:13px;}
.tc-pp-body .tc-sprint{box-shadow:none;border:none;background:none;padding:0;}
/* =====================================================================
SPRINT FIELD JOURNAL — the Plan button opens reflection, not task trees.
A cyan signal spine and numbered index keep the long charter navigable;
all writing surfaces remain recessed and quiet inside the command deck.
===================================================================== */
.tc-sj-head{
min-height:64px;padding:9px 18px;background:var(--panel);border-bottom-color:var(--grid-line);
}
.tc-sj-head-main{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px;}
.tc-sj-head-kicker,.tc-sj-kicker,.tc-sj-card-kicker,.tc-sj-nav-label{
color:var(--faint);font:700 var(--fs-caption)/1.2 var(--font-mono);letter-spacing:var(--tracking-label);text-transform:uppercase;
}
.tc-sj-title{font:650 17px/1.25 var(--font-display);letter-spacing:-.01em;}
.tc-sj-saved{
display:inline-flex;align-items:center;gap:7px;color:var(--faint);white-space:nowrap;
font:700 9.5px/1 var(--font-mono);letter-spacing:.08em;font-variant-numeric:tabular-nums;
}
.tc-sj-saved i{width:6px;height:6px;border-radius:50%;background:var(--good);box-shadow:0 0 0 3px rgba(var(--good-rgb),.1);}
.tc-sj-status{min-width:92px;}
.tc-sj-body{display:block;padding:24px 24px 56px;scroll-behavior:smooth;background:var(--bg);}
.tc-sj-hero{
position:relative;max-width:1220px;margin:0 auto 24px;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);
border:1px solid var(--line);background:var(--panel);overflow:hidden;
}
.tc-sj-hero::before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:var(--accent);}
.tc-sj-hero-copy{padding:28px 32px 24px;min-width:0;}
.tc-sj-theme-field{display:block;margin-top:12px;}
.tc-sj-theme-field>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
.tc-sj-theme-field textarea{
display:block;width:100%;resize:none;overflow:hidden;padding:0;border:0;background:transparent;color:var(--text);
font:600 clamp(26px,3vw,40px)/1.12 var(--font-display);letter-spacing:-.035em;text-wrap:balance;outline:none;
}
.tc-sj-theme-field textarea::placeholder{color:var(--faint);}
.tc-sj-theme-field textarea:focus{color:var(--accent);}
.tc-sj-date-row{display:flex;align-items:center;gap:10px;margin-top:22px;color:var(--muted);}
.tc-sj-date-row label{display:flex;align-items:center;gap:7px;font:700 10px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;}
.tc-sj-date-row svg{width:14px;height:14px;color:var(--accent);}
.tc-sj-date-row input{
color:var(--text);background:var(--card-subtle);border:1px solid var(--line);padding:7px 9px;border-radius:var(--r-sm);
font:500 11px/1 var(--font-mono);color-scheme:dark;
}
.tc-sj-date-line{width:20px;height:1px;background:var(--line-strong);}
.tc-sj-date-readable{margin-left:auto;color:var(--faint);font:600 10px/1 var(--font-mono);font-variant-numeric:tabular-nums;}
.tc-sj-principle{
padding:28px 28px 24px;border-left:1px solid var(--line);background:var(--card-subtle);display:flex;flex-direction:column;gap:12px;
}
.tc-sj-principle>span{color:var(--accent);font:700 var(--fs-caption)/1.2 var(--font-mono);letter-spacing:var(--tracking-label);}
.tc-sj-principle textarea{
flex:1;width:100%;resize:none;overflow:hidden;border:0;background:transparent;color:var(--text);outline:none;
font:400 18px/1.55 var(--font-reading);text-wrap:pretty;
}
.tc-sj-principle textarea::placeholder{color:var(--faint);}
.tc-sj-layout{max-width:1220px;margin:0 auto;display:grid;grid-template-columns:188px minmax(0,1fr);gap:24px;align-items:start;}
.tc-sj-nav{position:sticky;top:0;display:flex;flex-direction:column;border-top:1px solid var(--line);padding-top:12px;}
.tc-sj-nav-label{padding:0 8px 9px;}
.tc-sj-nav-item{
min-height:38px;padding:0 8px;display:flex;align-items:center;gap:10px;text-align:left;border:0;border-left:1px solid var(--line-soft);
background:transparent;color:var(--muted);font:600 12px/1.2 var(--font-body);cursor:pointer;transition:color var(--t-snap),background var(--t-snap),border-color var(--t-snap);
}
.tc-sj-nav-item span{color:var(--faint);font:600 9px/1 var(--font-mono);font-variant-numeric:tabular-nums;}
.tc-sj-nav-item:hover,.tc-sj-nav-item:focus-visible{color:var(--text);background:rgba(var(--accent-rgb),.045);border-left-color:var(--accent);}
.tc-sj-nav-item:active{transform:scale(.98);}
.tc-sj-nav p{margin:16px 8px 0;color:var(--faint);font-size:11px;line-height:1.55;text-wrap:pretty;}
.tc-sj-content{min-width:0;display:flex;flex-direction:column;gap:20px;}
.tc-sj-section{scroll-margin-top:12px;border:1px solid var(--line);background:var(--panel);}
.tc-sj-section-head{
display:grid;grid-template-columns:32px 34px minmax(0,1fr);gap:10px;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line-soft);
}
.tc-sj-section-number{color:var(--faint);font:600 10px/1 var(--font-mono);font-variant-numeric:tabular-nums;}
.tc-sj-section-icon{width:32px;height:32px;display:grid;place-items:center;color:var(--accent);border:1px solid rgba(var(--accent-rgb),.22);background:rgba(var(--accent-rgb),.055);}
.tc-sj-section-icon svg{width:15px;height:15px;}
.tc-sj-section-head h2{margin:0;color:var(--text);font:650 18px/1.2 var(--font-display);letter-spacing:-.015em;}
.tc-sj-section-head p{margin:3px 0 0;color:var(--muted);font-size:12px;line-height:1.45;text-wrap:pretty;}
.tc-sj-grid{display:grid;gap:12px;padding:16px;}
.tc-sj-grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.tc-sj-grid-milestones{grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);}
.tc-sj-card,.tc-sj-workstream,.tc-sj-system-card{
min-width:0;padding:16px;border:1px solid var(--line-soft);background:var(--card-subtle);
}
.tc-sj-card-warn{border-left:2px solid rgba(var(--warn-rgb),.55);}
.tc-sj-field{display:flex;flex-direction:column;min-width:0;}
.tc-sj-field+.tc-sj-field{margin-top:14px;}
.tc-sj-field-label{color:var(--text);font:700 var(--fs-label)/1.3 var(--font-display);letter-spacing:.02em;}
.tc-sj-field-hint{margin-top:2px;color:var(--faint);font:500 10px/1.35 var(--font-mono);}
.tc-sj-input,.tc-sj-textarea,.tc-sj-milestone input,.tc-sj-milestone textarea,.tc-sj-question textarea{
width:100%;margin-top:8px;padding:10px 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);color:var(--text);
font:400 13px/1.55 var(--font-body);outline:none;transition:border-color var(--t-snap),background var(--t-snap);color-scheme:dark;
}
.tc-sj-textarea,.tc-sj-milestone textarea,.tc-sj-question textarea{resize:none;overflow:hidden;}
.tc-sj-input:hover,.tc-sj-textarea:hover,.tc-sj-milestone input:hover,.tc-sj-milestone textarea:hover,.tc-sj-question textarea:hover{border-color:var(--line-strong);}
.tc-sj-input:focus,.tc-sj-textarea:focus,.tc-sj-milestone input:focus,.tc-sj-milestone textarea:focus,.tc-sj-question textarea:focus{
border-color:rgba(var(--accent-rgb),.62);background:var(--card-subtle);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.08);
}
.tc-sj-money-card{
margin:0 16px 16px;padding:16px;display:grid;grid-template-columns:minmax(220px,1fr) minmax(120px,180px);gap:12px;align-items:end;
border:1px solid rgba(var(--good-rgb),.24);border-left:2px solid var(--good);background:rgba(var(--good-rgb),.035);
}
.tc-sj-money-card p{max-width:520px;margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.45;}
.tc-sj-money-card .tc-sj-field+.tc-sj-field{margin:0;}
.tc-sj-workstream-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px 16px 10px;}
.tc-sj-workstream{padding:0;}
.tc-sj-workstream-head{height:34px;padding:0 10px;display:flex;align-items:center;border-bottom:1px solid var(--line-soft);color:var(--faint);font:700 9px/1 var(--font-mono);letter-spacing:.12em;}
.tc-sj-workstream>.tc-sj-field{margin:0;padding:12px 14px 0;}
.tc-sj-workstream>.tc-sj-field:last-child{padding-bottom:14px;}
.tc-sj-remove{width:28px;height:28px;margin-left:auto;display:grid;place-items:center;border:0;background:transparent;color:var(--faint);cursor:pointer;}
.tc-sj-remove:hover{color:var(--danger);background:rgba(var(--danger-rgb),.08);}
.tc-sj-remove:active{transform:scale(.96);}
.tc-sj-remove svg{width:13px;height:13px;}
.tc-sj-add{
min-height:38px;margin:0 16px 16px;padding:0 12px;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:var(--r-sm);
background:transparent;color:var(--muted);font-size:12px;font-weight:650;cursor:pointer;transition:color var(--t-snap),border-color var(--t-snap),background var(--t-snap);
}
.tc-sj-add:hover{color:var(--accent);border-color:rgba(var(--accent-rgb),.42);background:rgba(var(--accent-rgb),.045);}
.tc-sj-add:active{transform:scale(.98);}
.tc-sj-add svg{width:13px;height:13px;}
.tc-sj-milestone-list{display:flex;flex-direction:column;margin-top:10px;}
.tc-sj-milestone{position:relative;display:grid;grid-template-columns:130px minmax(0,1fr) 28px;gap:10px;padding:12px 0;border-top:1px solid var(--line-soft);}
.tc-sj-milestone label{min-width:0;display:flex;flex-direction:column;color:var(--faint);font:650 9.5px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;}
.tc-sj-milestone input,.tc-sj-milestone textarea{font-family:var(--font-body);text-transform:none;letter-spacing:0;}
.tc-sj-milestone .tc-sj-remove{align-self:center;}
.tc-sj-card>.tc-sj-add{margin:4px 0 0;}
.tc-sj-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px;}
.tc-sj-system-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:16px;}
.tc-sj-system-card header{min-height:30px;display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:4px;}
.tc-sj-system-card header>span{display:flex;align-items:center;gap:7px;color:var(--text);font:700 10px/1.3 var(--font-mono);letter-spacing:.08em;}
.tc-sj-system-card header svg{width:14px;height:14px;color:var(--accent);}
.tc-sj-linked{color:var(--good);font:700 8px/1.2 var(--font-mono);letter-spacing:.08em;white-space:nowrap;}
.tc-sj-cadence-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:16px;}
.tc-sj-review-head{padding:8px 16px 12px;border-top:1px solid var(--line-soft);}
.tc-sj-review-head span{color:var(--accent);font:700 10px/1 var(--font-mono);letter-spacing:var(--tracking-label);}
.tc-sj-review-head p{margin:5px 0 0;color:var(--muted);font-size:12px;}
.tc-sj-question-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;padding:1px 16px 16px;background:var(--line-soft);}
.tc-sj-question{min-width:0;padding:16px;background:var(--panel);display:grid;grid-template-columns:34px minmax(0,1fr);align-content:start;}
.tc-sj-question-number{color:var(--accent);font:650 9px/1.4 var(--font-mono);}
.tc-sj-question-copy{color:var(--text);font:600 13px/1.45 var(--font-body);text-wrap:pretty;}
.tc-sj-question textarea{grid-column:1/-1;min-height:84px;font-family:var(--font-reading);font-size:14px;}
@media (max-width:1080px){
.tc-sj-layout{grid-template-columns:164px minmax(0,1fr);gap:16px;}
.tc-sj-system-grid,.tc-sj-cadence-grid{grid-template-columns:1fr;}
.tc-sj-money-card{grid-template-columns:minmax(180px,1fr) minmax(110px,150px);}
}
@media (max-width:820px){
.tc-sj-body{padding:16px 16px 44px;}
.tc-sj-hero{grid-template-columns:1fr;}
.tc-sj-principle{border-left:0;border-top:1px solid var(--line);}
.tc-sj-layout{grid-template-columns:1fr;}
.tc-sj-nav{position:static;flex-direction:row;overflow-x:auto;padding:0 0 8px;border-top:0;scrollbar-width:none;}
.tc-sj-nav::-webkit-scrollbar{display:none;}
.tc-sj-nav-label,.tc-sj-nav p{display:none;}
.tc-sj-nav-item{flex:0 0 auto;border-left:0;border-bottom:1px solid var(--line-soft);padding:0 12px;}
.tc-sj-nav-item:hover,.tc-sj-nav-item:focus-visible{border-bottom-color:var(--accent);}
.tc-sj-workstream-grid,.tc-sj-question-list{grid-template-columns:1fr;}
.tc-sj-money-card{grid-template-columns:minmax(0,1fr) minmax(110px,150px);}
}
@media (max-width:620px){
.tc-sj-head{padding:8px 10px;}
.tc-sj-saved{display:none;}
.tc-sj-status{max-width:82px;}
.tc-sj-body{padding:10px 10px 36px;}
.tc-sj-hero-copy,.tc-sj-principle{padding:20px;}
.tc-sj-date-row{align-items:flex-start;flex-wrap:wrap;}
.tc-sj-date-readable{width:100%;margin:4px 0 0;}
.tc-sj-grid-2,.tc-sj-grid-milestones,.tc-sj-metric-grid{grid-template-columns:1fr;}
.tc-sj-money-card{grid-template-columns:1fr;}
.tc-sj-money-card>div:first-child{grid-column:auto;}
.tc-sj-section-head{grid-template-columns:24px 30px minmax(0,1fr);padding:14px;}
.tc-sj-section-icon{width:28px;height:28px;}
.tc-sj-grid,.tc-sj-workstream-grid,.tc-sj-metric-grid,.tc-sj-system-grid,.tc-sj-cadence-grid{padding:10px;}
.tc-sj-add{margin:0 10px 10px;}
.tc-sj-milestone{grid-template-columns:1fr 28px;}
.tc-sj-milestone-copy{grid-column:1/-1;grid-row:2;}
}
/* =====================================================================
SPRINT DELETE CONFIRMATION — 3-step scatter flow
===================================================================== */
#tc-sprint-del-confirm{position:fixed;inset:0;z-index:9999;pointer-events:auto;}
.sdc-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px);}
.sdc-box{
position:absolute;
width:340px;
background:var(--card,#1e1e1e);
border:1px solid var(--line);
border-radius:10px;
padding:20px 22px 18px;
box-shadow:var(--sh-3);
display:flex;flex-direction:column;gap:10px;
animation:sdc-pop .18s cubic-bezier(.4,0,.2,1);
}
@keyframes sdc-pop{from{opacity:0;transform:scale(.93)}to{opacity:1;transform:scale(1)}}
/* Position variants */
.sdc-bottom-left{bottom:40px;left:40px;}
.sdc-top-right{top:40px;right:40px;}
.sdc-center{top:50%;left:50%;transform:translate(-50%,-50%);}
/* keep center pop animation working despite transform */
@keyframes sdc-pop-center{from{opacity:0;transform:translate(-50%,-50%) scale(.93)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.sdc-center{animation:sdc-pop-center .18s cubic-bezier(.4,0,.2,1);}
.sdc-step{font-size:10px;font-weight:700;letter-spacing:.9px;text-transform:uppercase;color:var(--faint);margin-bottom:2px;}
.sdc-icon{font-size:26px;line-height:1;}
.sdc-title{font-size:15px;font-weight:700;color:var(--text);}
.sdc-body{font-size:13px;color:var(--muted);line-height:1.55;}
.sdc-body b{color:var(--text);font-weight:600;}
.sdc-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:4px;}
.sdc-cancel-btn{background:none;border:1px solid var(--line);color:var(--muted);font-size:13px;font-family:inherit;padding:6px 14px;border-radius:var(--r-sm,5px);cursor:pointer;transition:color .15s,border-color .15s;}
.sdc-cancel-btn:hover{color:var(--text);border-color:var(--muted);}
.sdc-btn-warn{background:rgba(var(--warn-rgb),.14);border:1px solid rgba(var(--warn-rgb),.40);color:var(--warn);font-size:13px;font-family:inherit;font-weight:600;padding:6px 14px;border-radius:var(--r-sm,5px);cursor:pointer;transition:background .15s;}
.sdc-btn-warn:hover{background:rgba(var(--warn-rgb),.25);}
.sdc-btn-danger{background:rgba(var(--danger-rgb),.18);border:1px solid rgba(var(--danger-rgb),.5);color:var(--danger-soft,#f87171);font-size:13px;font-family:inherit;font-weight:700;padding:6px 16px;border-radius:var(--r-sm,5px);cursor:pointer;transition:background .15s;}
.sdc-btn-danger:hover{background:rgba(var(--danger-rgb),.32);}