/* Phase 2 — timeline home (Palette design). Uses the app's theme tokens;
   derives fills/glows from --accent-rgb so it retints per theme. */
.p2h-root{
  --p2-fill: rgba(var(--accent-rgb), .12);
  --p2-soft: rgba(var(--accent-rgb), .28);
  --p2-glow: 0 0 0 3px var(--bg), 0 0 16px rgba(var(--accent-rgb), .6);
  max-width:42rem; margin:0 auto; padding:1.6rem 0 3rem;
  font-family:var(--font-body, var(--sans)); color:var(--text);
}
.p2h-capture{ position:relative; background:var(--surface); border:var(--border-w) solid var(--border);
  border-radius:var(--radius); padding:1.2rem 1.3rem; box-shadow:var(--card-shadow); margin-bottom:2rem; }
.p2h-capture h2{ margin:0 0 .75rem; font-family:var(--font-head, var(--serif)); font-weight:600; font-size:1.5rem; }
:root[data-theme="brutal"] .p2h-capture h2{ text-transform:uppercase; font-weight:700; }
.p2h-field{ width:100%; font:inherit; color:var(--text); resize:vertical; min-height:3.2rem;
  background:var(--bg-in); border:var(--border-w) solid var(--border); border-radius:var(--btn-radius); padding:.75rem .85rem; }
.p2h-field::placeholder{ color:var(--dim); } .p2h-field:focus{ outline:none; border-color:var(--accent); }
.p2h-caprow{ display:flex; align-items:center; gap:.6rem; margin-top:.85rem; }
.p2h-ghost{ font:inherit; cursor:pointer; color:var(--text); background:transparent; border:var(--border-w) solid var(--border);
  border-radius:var(--btn-radius); padding:.42rem .75rem; font-size:.85rem; display:inline-flex; align-items:center; gap:.4rem; }
.p2h-ghost:hover{ border-color:var(--accent); }
.p2h-save{ font:inherit; cursor:pointer; color:var(--accent-text); background:var(--iris); border:var(--border-w) solid transparent;
  border-radius:var(--btn-radius); padding:.5rem .95rem; font-weight:600; font-size:.87rem; box-shadow:var(--btn-glow); }
:root[data-theme="brutal"] .p2h-save{ border-color:#111; text-transform:uppercase; letter-spacing:.05em; }
.p2h-capmsg{ font-size:.8rem; color:var(--dim); margin-top:.5rem; min-height:1.1rem; }

/* CAPTURE-TYPE: what the fragment becomes — mirrors the classic "Turn this into" row. */
.p2h-types{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; margin-top:.85rem; }
.p2h-types-label{ font-size:.8rem; color:var(--dim); margin-right:.15rem; }
.p2h-types-sep{ color:var(--muted); }
.p2h-types .p2h-note{ margin-left:auto; }
.p2h-types[hidden], .p2h-caprow[hidden]{ display:none; }

.p2h-line{ position:relative; display:flex; flex-direction:column; gap:.3rem; }
.p2h-line::before{ content:""; position:absolute; left:.94rem; top:.8rem; bottom:.8rem; width:var(--border-w); background:var(--border); }
.p2h-row{ display:flex; gap:1rem; align-items:flex-start; padding:.6rem .55rem; border-radius:var(--radius); }
.p2h-row.click{ cursor:pointer; } .p2h-row.click:hover{ background:var(--hover-bg); }
.p2h-node{ width:1.9rem; height:1.9rem; flex:none; position:relative; z-index:1; border-radius:var(--radius);
  background:var(--muted); color:var(--bg); display:flex; align-items:center; justify-content:center;
  font-size:.74rem; font-weight:700; box-shadow:0 0 0 3px var(--bg); }
.p2h-row.lit .p2h-node{ background:var(--iris); color:var(--accent-text); box-shadow:var(--p2-glow); }
.p2h-body{ flex:1; min-width:0; }
.p2h-row.lit .p2h-body{ background:var(--p2-fill); border:var(--border-w) solid var(--p2-soft); border-radius:var(--radius); padding:.6rem .8rem; margin-top:-.3rem; }
.p2h-litrow{ display:flex; align-items:flex-start; gap:.8rem; }
.p2h-meta{ display:flex; align-items:baseline; gap:.5rem; margin-bottom:.25rem; flex-wrap:wrap; }
.p2h-who{ font-weight:600; font-size:.9rem; } .p2h-when{ font-size:.78rem; color:var(--dim); }
.p2h-txt{ margin:0; color:var(--text2); }
.p2h-act{ flex:none; font:inherit; cursor:pointer; font-weight:600; font-size:.8rem; color:var(--accent);
  background:var(--p2-fill); border:var(--border-w) solid var(--p2-soft); border-radius:var(--btn-radius); padding:.32rem .68rem; }
:root[data-theme="brutal"] .p2h-act{ text-transform:uppercase; letter-spacing:.05em; }
.p2h-hair{ height:var(--border-w); background:var(--border); margin:.2rem 0 .2rem 2.9rem; }
.p2h-empty{ color:var(--dim); font-size:.86rem; padding:.5rem .55rem; }
.p2h-txt a{ color:var(--accent); text-decoration:none; }

/* every row is clickable → expands an inline action bar */
.p2h-row{ cursor:pointer; }
.p2h-row:hover{ background:var(--hover-bg); }
.p2h-top{ display:flex; align-items:flex-start; gap:.8rem; }
.p2h-txtwrap{ flex:1; min-width:0; }
.p2h-acts{ display:none; gap:.35rem; margin-top:.6rem; padding-top:.55rem; border-top:var(--border-w) solid var(--line); flex-wrap:wrap; }
.p2h-row.open .p2h-acts{ display:flex; }
.p2h-ic{ width:2rem; height:2rem; display:inline-flex; align-items:center; justify-content:center;
  border:var(--border-w) solid var(--line); border-radius:var(--btn-radius); background:transparent; color:var(--muted); cursor:pointer; }
.p2h-ic svg{ flex:none; }
.p2h-ic:hover{ color:var(--text); border-color:var(--accent); }
.p2h-ic.on{ background:var(--p2-fill); color:var(--accent); border-color:var(--p2-soft); }
.p2h-composer{ display:none; flex-direction:column; gap:.5rem; margin-top:.6rem; }
.p2h-row.commenting .p2h-composer{ display:flex; }
.p2h-composer textarea{ width:100%; font:inherit; color:var(--text); resize:vertical; min-height:2.4rem;
  background:var(--bg-in); border:var(--border-w) solid var(--line); border-radius:var(--btn-radius); padding:.5rem .65rem; }
.p2h-composer textarea:focus{ outline:none; border-color:var(--accent); }
.p2h-crow{ display:flex; justify-content:flex-end; }
.p2h-btn{ font:inherit; cursor:pointer; color:var(--accent-text); background:var(--iris); border:var(--border-w) solid transparent;
  border-radius:var(--btn-radius); padding:.4rem .8rem; font-weight:600; font-size:.84rem; box-shadow:var(--btn-glow); }
@media (prefers-reduced-motion:reduce){ .p2h-root *{ transition:none !important; } }

.p2h-root svg{ flex:none; }  /* keep inline icons from collapsing in flex */

/* on-screen command bar — opens the ⌘K palette */
.p2h-cmd{ width:100%; display:flex; align-items:center; gap:.6rem; cursor:pointer; text-align:left; font:inherit;
  color:var(--dim); background:var(--bg-in); border:var(--border-w) solid var(--line-hi); border-radius:var(--btn-radius);
  padding:.85rem 1rem; box-shadow:var(--cmd-shadow); margin-bottom:1.4rem; }
.p2h-cmd:hover{ border-color:var(--accent); }
.p2h-cmd .p2h-cmd-ic{ color:var(--accent); }
.p2h-cmd .p2h-cmd-t{ flex:1; font-size:.95rem; }
.p2h-cmd .p2h-kbd{ font-family:var(--mono); font-size:.72rem; color:var(--muted); border:1px solid var(--border);
  border-bottom-width:2px; border-radius:calc(var(--btn-radius) * .5); padding:.05rem .4rem; }

/* Phase 2: the timeline home supersedes the classic capture/composition/nudges. */
#capture, #composition, #nudges { display:none !important; }
#p2-home:empty { display:none; }

/* declutter the header — navigation lives in the command palette (⌘K) now */
#nav-people, #nav-agenda, #nav-round, #nav-bets, #nav-standin, #export, #nav-share { display:none !important; }

/* the ⌘K launcher matches the on-screen command bar's width (the content column) */
.cmdk-panel { max-width: 42rem; }
.cmdk { padding-top: 9vh; }
