/* The Inbox, like a real inbox (the Founder, 6 October 2026): one card on one grid for every item. inbox-list.js */

.inbox-count{margin:0 0 10px;color:var(--muted);font-size:.85rem;font-variant-numeric:tabular-nums}
.inbox-list{position:relative;display:grid;gap:12px;min-width:0}

/* One list in one card, as Home's Needs you (the Founder, 7 October 2026, 22:40): each item its top line (when, and its
   own actions), then Home's row — the dot, the title in bold, one muted line, the chevron — parted by hairlines. Every
   line of an item starts at the title's edge: the time, the row's words and its pills. */
.inbox-list.card{display:block;padding:4px 16px}
.inbox-item{position:relative;display:grid;grid-template-columns:minmax(0,1fr);min-width:0;padding:4px 0 8px;border-top:1px solid var(--line)}
.inbox-item:first-child{border-top-color:transparent}
.inbox-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;min-height:44px;padding-inline-start:17px}
.inbox-time{flex:1;min-width:0;font-size:.8125rem;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inbox-acts{flex:none;display:flex;gap:2px;margin-inline-end:-10px}
.inbox-act{display:inline-grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:none;color:var(--muted);cursor:pointer}
.inbox-act:hover{background:var(--soft,#f2ecfa);color:var(--ink,#24212d)}
.inbox-act:focus-visible{outline:2px solid var(--purple,#6d28b5);outline-offset:1px}
.inbox-act.on{color:var(--purple,#6d28b5)}
.inbox-act .icon{width:20px;height:20px}
.inbox-act[data-inbox-act=delete]:hover{color:var(--red,#bd3551)}

/* One row, one height (the Founder, 8 October 2026, 22:44): the dot, the title on one line, one muted line, at most one
   press as a compact pill on the right, the chevron. Unread is the dot and a bold title, like WhatsApp; read is regular
   weight in the ink colour, never the link's purple. */
.inbox-main{display:flex;align-items:center;gap:8px;min-width:0;height:52px}
.inbox-row.home-item{flex:1 1 auto;min-height:0;height:100%;padding:0;gap:8px;align-items:center;border:0;background:none;font:inherit;text-align:start;cursor:pointer}
div.inbox-row.home-item{cursor:default}
.inbox-row .inbox-title{font-weight:400;color:var(--ink,#24212d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inbox-item.unread .inbox-row .inbox-title{font-weight:700}
.inbox-row .inbox-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(hover:hover){.inbox-row.home-item:hover .inbox-title{color:var(--purple,#6d28b5)}}
@media(hover:none){.inbox-row.home-item:hover .inbox-title{color:var(--ink,#24212d)}}
/* The dot holds its place on every item, so every title starts at the same edge. */
.inbox-dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--purple,#6d28b5)}
.inbox-item:not(.unread) .inbox-dot{visibility:hidden}
.inbox-pill.btn{flex:none;width:auto;min-width:0;max-width:46%;height:36px;min-height:36px;padding:0 14px;border-radius:999px;font-size:.8125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inbox-pill .button-label{overflow:hidden;text-overflow:ellipsis}
.inbox-chevron{flex:none;display:inline-grid;place-items:center;width:20px;height:44px;color:var(--muted)}
.inbox-chevron .icon{width:18px;height:18px}
@media(max-width:420px){.inbox-pill.btn{max-width:56%;padding:0 10px}}
@media(max-width:360px){.inbox-pill.btn{max-width:64%}}

.inbox-more{display:flex;justify-content:center;margin:16px 0 4px}
.inbox-more .btn{min-height:44px;min-width:9rem}
/* A screen above the list's end (the rows are Home's, a few lines each, so not more): scrolling down loads the next twenty before Load more is in view, and a jump
   straight to Load more never passes it. At the list's top when the list is shorter than that. */
.inbox-sentinel{position:absolute;inset-inline-start:0;top:max(0px,calc(100% - 100vh - 60px));width:1px;height:1px;pointer-events:none}
.inbox-delete-title{margin:0 0 8px;overflow-wrap:anywhere}
.inbox-delete-line{margin:0}

.inbox-item .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

[data-theme=dark] .inbox-act.on{color:#c9a6f2}

@media(max-width:420px){
 .inbox-list.card{padding:2px 12px}
}

/* "…": the presses that do not resolve the item (the Founder, 6 October 2026), one press the size of the others. */
.needs-more{position:relative;min-width:0}
.needs-more>summary{list-style:none;display:flex;align-items:center;justify-content:center;min-height:44px;height:100%;width:100%;margin:0;cursor:pointer;font-size:1.1rem;letter-spacing:.08em}
.needs-more>summary::-webkit-details-marker{display:none}
.needs-more-menu{position:absolute;z-index:20;top:calc(100% + 6px);inset-inline-start:0;display:grid;gap:4px;min-width:min(16rem,80vw);padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--surface,#fff);box-shadow:0 12px 32px rgba(30,16,52,.16)}
.needs-more-menu .btn{justify-content:flex-start;width:100%;min-height:44px;border:0;background:none;color:var(--ink,#24212d);text-align:start}
.needs-more-menu .btn:hover{background:var(--soft,#f2ecfa)}
@media(max-width:700px){.needs-more-menu{inset-inline-start:auto;inset-inline-end:0}}

/* An agent's act held under Ask me, on its own page (terminal-views.js liveHeld; the Founder, 9 October 2026): the agent's
   words in a chat bubble at reading size, under the agent's face and name; To, why and when as small lines; the three presses. */
.held-card{display:grid;gap:12px}
.held-message{display:grid;gap:6px;justify-items:start;min-width:0}
.held-from{display:flex;align-items:center;gap:8px;min-width:0}
.held-from .portrait-box,.held-from .portrait-box.small{flex:0 0 32px;width:32px;min-width:32px;height:32px;align-self:center}
.held-face-letter{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--soft,#f2ecfa);color:var(--purple,#6d28b5);font-weight:700;font-size:.875rem}
.held-name{font-size:.875rem;font-weight:600}
.held-bubble{max-width:min(100%,36rem);box-sizing:border-box;padding:9px 13px;border-radius:6px 18px 18px 18px;background:#f0f1f5;font-size:15px;font-weight:400;line-height:1.45;overflow-wrap:anywhere;white-space:pre-wrap}
.held-bubble p{margin:0}
[data-theme=dark] .held-bubble{background:#312b3a}
.held-to{margin:2px 0 0;font-size:.9375rem;overflow-wrap:anywhere}
.held-to-label{color:var(--muted);margin-inline-end:4px}
.held-rule,.held-when{margin:0}
.held-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.held-actions>.btn{min-height:44px;min-width:0}
@media(max-width:480px){.held-actions{grid-template-columns:1fr 1fr}.held-actions>.btn:first-child{grid-column:1/-1}}

/* ---- An ask's own page, compact (the Founder, 13 October 2026, item 30): less space between its parts, its two small
   lines (why, when) one size down. ---- */
.held-card{gap:8px}
.held-rule,.held-when{font-size:.8125rem;line-height:1.35}
.held-to{margin:0;font-size:.875rem}
.held-actions{margin-top:12px}

/* ---- An ask already answered: what became of it, who, when, what (decided.js). ---- */
.decided-card{display:grid;gap:12px}
.decided-outcome{display:flex;align-items:center;gap:10px;min-width:0}
.decided-outcome strong{font-size:1.125rem}
.decided-mark{width:32px;height:32px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.decided-done{color:var(--green,#16794d)}
.decided-declined{color:var(--red,#bd3551)}
.decided-expired,.decided-closed{color:var(--muted,#686577)}
.decided-facts{margin:0}
.decided-facts [hidden]{display:none}

/* The check over the page after an answer: a large circle that draws itself, the mark inside, the word under it. */
.decided-check{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:rgba(247,247,250,.72);pointer-events:none;animation:decided-in .18s ease-out both}
.decided-check.leaving{animation:decided-out .18s ease-in both}
.decided-check-card{display:grid;justify-items:center;gap:10px;padding:28px 36px;border-radius:24px;background:var(--surface,#fff);box-shadow:0 18px 48px rgba(36,33,45,.18)}
.decided-check-card p{margin:0;font-size:1.125rem;font-weight:650;color:var(--ink,#24212d)}
.decided-check-mark{width:112px;height:112px;stroke-width:1.6}
.decided-check.decided-done .decided-check-mark{color:var(--green,#16794d)}
.decided-check.decided-declined .decided-check-mark{color:var(--red,#bd3551)}
.decided-check-mark circle{stroke-dasharray:63;stroke-dashoffset:63;animation:decided-draw .45s ease-out forwards}
.decided-check-mark path{stroke-dasharray:20;stroke-dashoffset:20;animation:decided-draw .3s .35s ease-out forwards}
.decided-check.still .decided-check-mark circle,.decided-check.still .decided-check-mark path{animation:none;stroke-dashoffset:0}
@keyframes decided-draw{to{stroke-dashoffset:0}}
@keyframes decided-in{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes decided-out{to{opacity:0}}
@media (prefers-reduced-motion:reduce){.decided-check,.decided-check.leaving{animation:none}.decided-check-mark circle,.decided-check-mark path{animation:none;stroke-dashoffset:0}}
[data-theme=dark] .decided-check{background:rgba(20,17,26,.72)}
[data-theme=dark] .decided-check-card{background:var(--surface,#1c1824)}
[data-theme=dark] .decided-check-card p{color:var(--ink,#eee)}
/* The shared done mark (done.js; the Founder, 17 October 2026): the check draws itself, a short burst of confetti, the headline and one plain line. */
.done-mark{display:grid;justify-items:center;gap:6px;text-align:center;min-width:0;max-width:100%}
.done-art{position:relative;display:grid;place-items:center;width:112px;height:112px}
.done-svg{animation:done-settle .5s .5s ease-out both}
.done-mark .decided-check-mark{color:var(--green,#16794d)}
.done-mark[data-done-tone=declined] .decided-check-mark{color:var(--red,#bd3551)}
.done-headline{font-size:1.25rem;font-weight:700;color:var(--ink,#24212d);overflow-wrap:anywhere}
.done-line{font-size:1rem;line-height:1.4;color:var(--muted,#686577);overflow-wrap:anywhere;max-width:30ch}
.done-inline{padding:12px 0 4px}
.done-burst{position:absolute;inset:0;pointer-events:none}
.done-burst i{position:absolute;left:50%;top:50%;width:7px;height:11px;border-radius:2px;opacity:0;background:var(--purple,#6d28b5);animation:done-fly 1s var(--d,380ms) cubic-bezier(.2,.7,.3,1) forwards}
.done-burst i[data-c="1"]{background:#22a05a}.done-burst i[data-c="2"]{background:#f2a516}.done-burst i[data-c="4"]{background:#e8559a}.done-burst i[data-c="5"]{background:#4a86e8}
.done-burst i:nth-child(3n){width:6px;height:6px;border-radius:50%}
@keyframes done-fly{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}12%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(var(--r)) scale(1)}}
@keyframes done-settle{0%{transform:scale(1)}45%{transform:scale(1.08)}100%{transform:scale(1)}}
.decided-check.still .done-burst,.reduced-motion .done-burst{display:none}
.decided-check.still .done-svg,.reduced-motion .done-svg{animation:none}
.reduced-motion .decided-check-mark circle,.reduced-motion .decided-check-mark path{animation:none;stroke-dashoffset:0}
@media (prefers-reduced-motion:reduce){.done-burst{display:none}.done-svg{animation:none}}
[data-theme=dark] .done-headline{color:var(--ink,#eee)}
[data-theme=dark] .done-mark .decided-check-mark{color:#4ade80}
.inbox-face{flex:none;display:grid;place-items:center;width:32px;height:32px;overflow:hidden;border-radius:9px}.inbox-face>*{max-width:32px;max-height:32px}
.nav-messages-count{margin-inline-start:auto}.bottom-nav a{position:relative}.bottom-nav .nav-messages-count{position:absolute;top:2px;inset-inline-end:calc(50% - 22px);min-width:18px;height:18px;font-size:11px;padding:0 4px}
.inbox-item:has(.inbox-face) .inbox-top{padding-inline-start:57px}
/* A dropped agent's item, one card (the Founder, 14 October 2026): the title, the tasks, the cause and the fix, one row of presses; stacked full width where two do not fit. */
.handover-card{display:grid;gap:14px;max-width:720px}
.handover-card .handover-title{margin:0;font-size:1.25rem;line-height:1.35;font-weight:700;overflow-wrap:anywhere}
/* The tasks folded under one line, "80 tasks waiting" and Show tasks; opened, the Tasks page's own rows (the Founder, 24 October 2026). */
.handover-count{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;margin:0}
.handover-count-said{min-width:0;font-weight:600}
.handover-toggle{flex:none;display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 4px;border:0;background:none;color:var(--purple,#6d28b5);font:inherit;font-weight:600;cursor:pointer}
.handover-toggle .icon{width:18px;height:18px;transition:transform .15s ease}
.handover-toggle[aria-expanded=true] .icon{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.handover-toggle .icon{transition:none}}
.handover-tasks{margin:-6px 0 0;min-width:0;border-top:1px solid var(--line,#e7e5ee)}
.handover-tasks[hidden]{display:none}
.handover-card .handover-tasks .feed-row{padding-inline:0}
.handover-card .handover-tasks .feed-row-copy{padding-inline-end:0}
.handover-card .handover-tasks .feed-row:last-child .feed-row-copy{border-bottom:0}
.handover-cause{margin:0;color:var(--muted,#686075);line-height:1.5}
.handover-none{margin:0}
.handover-actions{display:flex;flex-wrap:wrap;gap:8px}
.handover-actions .btn{min-height:44px;flex:0 0 auto;justify-content:center;padding-inline:14px;white-space:nowrap}
@media(max-width:700px){.handover-actions .btn{flex:1 1 auto}}
@media(max-width:380px){.handover-actions{flex-direction:column}.handover-actions .btn{width:100%}}
/* Mark all as read, the bell's before it left the bar (15 October 2026). */
.inbox-all-read{display:flex;justify-content:flex-end;margin:8px 0 0}
.inbox-all-read .text-button{min-height:44px}
/* Hand over (the Founder, 17 October 2026): one control, the tasks with Select all above them, one line, two buttons. */
[data-handover-scope]{display:grid;gap:14px;min-width:0}
.handover-who{display:flex;align-items:flex-end;gap:8px;min-width:0}
.handover-who-label{display:grid;gap:6px;flex:1;min-width:0;margin:0;font-weight:600}
.handover-who-label select{width:100%;min-width:0}
.handover-who .handover-info{flex:none;margin-bottom:6px}
.handover-tasks-pick{display:grid;gap:0;min-width:0}
[data-handover-scope] .handover-check{display:flex!important;grid-template-columns:none;align-items:center;gap:12px;min-height:44px;margin:0;font-weight:400;line-height:1.3;cursor:pointer;min-width:0}
.handover-check input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--purple,#6d28b5)}
.handover-check span{min-width:0;overflow-wrap:anywhere}
.handover-all{font-weight:600;border-bottom:1px solid var(--line,#e7e5ee)}
.handover-returns{margin:0;color:var(--ink,#24212d);line-height:1.4}