/* Plan with Tater (Setup page tab). Uses the tt- tokens defined in admin.html. */
.pwt-layout { display:grid; grid-template-columns:minmax(300px, 380px) 1fr; gap:1rem; margin-top:1rem; align-items:start; }
.pwt-layout .tt-panel + .tt-panel { margin-top:0; }

.pwt-chat { display:flex; flex-direction:column; position:sticky; top:1rem; max-height:calc(100vh - 2rem); padding:0; overflow:hidden; }
.pwt-chat-head { display:flex; align-items:center; gap:.6rem; padding:.8rem 1rem; border-bottom:1px solid var(--line); }
.pwt-chat-head strong { display:block; color:var(--ink); }
.pwt-sub { display:block; font-size:.78rem; color:var(--muted); }
.pwt-avatar { width:40px; height:40px; border-radius:50%; object-fit:cover; background:#3a2412; }
.pwt-messages { flex:1; overflow-y:auto; padding:1rem; display:flex; flex-direction:column; gap:.6rem; min-height:260px; }
.pwt-msg { display:flex; flex-direction:column; max-width:92%; }
.pwt-msg.from-tater { align-self:flex-start; }
.pwt-msg.from-you { align-self:flex-end; align-items:flex-end; }
.pwt-bubble { padding:.55rem .8rem; border-radius:14px; font-size:.9rem; line-height:1.45; }
.from-tater .pwt-bubble { background:var(--surface-2); color:var(--ink); border-bottom-left-radius:4px; }
.from-you .pwt-bubble { background:var(--teal); color:#fff; border-bottom-right-radius:4px; }
.pwt-note { font-size:.74rem; color:var(--good); font-weight:650; margin:.2rem .3rem 0; }
.pwt-typing { display:flex; gap:.25rem; padding:.7rem .9rem; }
.pwt-typing span { width:7px; height:7px; border-radius:50%; background:var(--muted); animation:pwt-blink 1.2s infinite ease-in-out; }
.pwt-typing span:nth-child(2) { animation-delay:.2s; }
.pwt-typing span:nth-child(3) { animation-delay:.4s; }
@keyframes pwt-blink { 0%, 80%, 100% { opacity:.25; transform:translateY(0); } 40% { opacity:1; transform:translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { .pwt-typing span { animation:none; opacity:.6; } }

.pwt-starters { display:flex; flex-wrap:wrap; gap:.4rem; padding:0 1rem .6rem; }
.pwt-starters:empty { display:none; }
.pwt-chip { border:1px solid var(--line); background:var(--surface); color:var(--text); border-radius:999px; padding:.3rem .7rem; font:inherit; font-size:.78rem; cursor:pointer; text-align:left; }
.pwt-chip:hover { border-color:var(--teal); color:var(--ink); }
.pwt-form { border-top:1px solid var(--line); padding:.7rem 1rem 1rem; }
.pwt-form textarea { width:100%; box-sizing:border-box; border:1px solid var(--line); border-radius:10px; padding:.55rem .65rem; font:inherit; font-size:.9rem; background:var(--surface); color:var(--ink); resize:vertical; }
.pwt-form-actions { display:flex; justify-content:flex-end; gap:.5rem; margin-top:.5rem; }

.pwt-guide-head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; flex-wrap:wrap; }
.pwt-toolbar { display:flex; gap:.4rem; flex-wrap:wrap; }
.pwt-toolbar .tt-btn[disabled] { opacity:.45; cursor:not-allowed; }
.pwt-guide-body { margin-top:1rem; }
.pwt-empty { text-align:center; color:var(--muted); padding:2rem 1rem; }
.pwt-empty img { width:140px; opacity:.9; }
.pwt-overview { display:grid; gap:.7rem; padding-bottom:1rem; border-bottom:1px solid var(--line); }
.pwt-row { display:flex; gap:.8rem; flex-wrap:wrap; }
.pwt-num { width:110px; }

.pwt-timeline { display:flex; flex-direction:column; gap:.5rem; margin-top:1rem; }
.pwt-seg { border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.pwt-seg[open] { box-shadow:var(--shadow); }
.pwt-seg summary { list-style:none; display:flex; align-items:center; gap:.7rem; padding:.65rem .9rem; cursor:pointer; }
.pwt-seg summary::-webkit-details-marker { display:none; }
.pwt-time { font-family:var(--mono); font-size:.85rem; color:var(--teal); font-weight:700; min-width:3.2rem; }
.pwt-seg-title { flex:1; font-weight:650; color:var(--ink); }
.pwt-dur { font-size:.8rem; color:var(--muted); }
.pwt-tater-dot { width:20px; height:20px; border-radius:50%; background:var(--teal-soft); color:var(--teal); font-size:.7rem; font-weight:800; display:grid; place-items:center; }
.pwt-seg-body { display:grid; gap:.75rem; padding:.2rem .9rem 1rem; }
.pwt-seg-body .tt-fld input, .pwt-seg-body .tt-fld textarea, .pwt-overview .tt-fld input, .pwt-overview .tt-fld textarea { box-sizing:border-box; }

.pwt-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.4rem; }
.pwt-none { color:var(--muted); font-size:.84rem; }
.pwt-assist, .pwt-pivot { display:flex; align-items:flex-start; gap:.45rem; }
.pwt-pivot textarea:first-child { flex:0 1 38%; }
.pwt-assist .pwt-badge, .pwt-arrow, .pwt-x { margin-top:.45rem; }
.pwt-assist textarea, .pwt-pivot textarea { flex:1; min-width:0; resize:vertical; line-height:1.4; padding:.45rem .6rem; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:.86rem; }
.pwt-badge { flex:none; font-size:.74rem; font-weight:700; color:var(--teal); background:var(--teal-soft); border-radius:999px; padding:.2rem .55rem; white-space:nowrap; }
.pwt-arrow { color:var(--muted); }
.pwt-x { flex:none; border:0; background:transparent; color:var(--muted); font-size:1.1rem; cursor:pointer; padding:0 .3rem; }
.pwt-x:hover { color:#b42318; }
.pwt-add { display:flex; gap:.4rem; margin-top:.4rem; align-items:center; }
.pwt-add .tt-btn { white-space:nowrap; }
.pwt-add select { width:auto !important; flex:0 1 220px; padding:.35rem .5rem; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:.82rem; }
.pwt-seg-actions { display:flex; gap:.4rem; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:.7rem; }
.pwt-seg-actions .tt-btn[disabled] { opacity:.4; }
.pwt-danger { color:#b42318 !important; }

.pwt-box { margin-top:1rem; padding:.7rem .9rem; border-radius:10px; background:var(--surface-2); font-size:.88rem; }
.pwt-box ul { margin:.3rem 0 0; padding-left:1.1rem; }
.pwt-open { background:rgba(161,98,7,.08); border:1px solid rgba(161,98,7,.25); }
.pwt-foot { display:flex; justify-content:flex-end; margin-top:1rem; }

@media (max-width: 900px) {
  .pwt-pivot { flex-wrap:wrap; }
  .pwt-pivot textarea:first-child { flex-basis:100%; }
  .pwt-layout { grid-template-columns:1fr; }
  .pwt-chat { position:static; max-height:none; }
  .pwt-messages { max-height:50vh; }
}
.pwt-locked { opacity:.55; transition:opacity .2s; }