/* Today's pile: the people rows are the folders; the selected folder opens on the desk with its cards inside.
   Cards stack with their header bars showing above the front card. Each card keeps its own look. */
.stage{position:relative;height:calc(100vh - 300px);min-height:560px;background:linear-gradient(180deg,#f5f7fa 0%,#eef2f7 100%);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:inset 0 0 60px rgba(27,36,51,.05);}
.stage::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(27,36,51,.03) 0 1px,transparent 1px 32px),repeating-linear-gradient(90deg,rgba(27,36,51,.03) 0 1px,transparent 1px 32px);pointer-events:none;}
/* the DataRipple badge: the bug in a white circle, same everywhere */
.drb{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);flex-shrink:0;}
.drb img{width:16px;height:16px;display:block;}
/* the found band: the worst overdue promise */
.foundband{position:absolute;left:340px;right:20px;top:14px;z-index:30;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #f3c2c2;border-left:4px solid var(--red);border-radius:10px;padding:8px 14px;font-family:inherit;font-size:12.5px;color:var(--text);box-shadow:var(--sh-sm);cursor:pointer;text-align:left;}
.foundband .ic{color:var(--bad-ink);font-size:15px;}
.foundband b{color:var(--bad-ink);white-space:nowrap;}
.foundband span:not(.ic):not(.go){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.foundband .go{font-weight:700;color:var(--red);margin-left:auto;white-space:nowrap;}
.foundband:hover{border-color:var(--red);}
/* the folders: one row per person, shaped like a folder tab */
.people-col{position:absolute;left:14px;top:14px;bottom:64px;width:300px;display:flex;flex-direction:column;}
.people-col .fh{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:4px 10px 8px;}
.plist{overflow:auto;padding-right:4px;display:grid;gap:4px;align-content:start;flex:1;}
.plist .pr{position:relative;display:grid;grid-template-columns:14px minmax(0,1fr) auto auto;grid-template-areas:"tab name time cnt" "tab state time cnt";gap:0 8px;align-items:center;width:100%;border:1px solid var(--line);background:#fff;text-align:left;padding:6px 10px 6px 8px;border-radius:0 8px 8px 8px;color:var(--muted);font-family:inherit;box-shadow:var(--sh-xs);transition:transform .2s,background .2s;}
.plist .pr::before{content:"";position:absolute;left:12px;top:-5px;width:54px;height:6px;background:var(--tab);border-radius:4px 4px 0 0;}
.plist .pr .ftab{grid-area:tab;width:10px;height:100%;min-height:26px;background:var(--tab);border-radius:3px;opacity:.9;}
.plist .pr .n{grid-area:name;color:var(--ink);font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.plist .pr .s{grid-area:state;font-size:10.5px;color:var(--muted);}
.plist .pr .t{grid-area:time;font-size:10.5px;color:var(--faint);white-space:nowrap;}
.plist .pr .cnt{grid-area:cnt;font-size:10px;font-weight:700;color:var(--muted);background:var(--wash);border-radius:999px;padding:1px 7px;}
.plist .pr:hover{transform:translateX(4px);}
.plist .pr.cur{background:var(--navy-2);border-color:var(--navy-2);transform:translateX(10px);box-shadow:var(--sh-md);}
.plist .pr.cur .n{color:#fff;}
.plist .pr.cur .s,.plist .pr.cur .t{color:#c3cddc;}
.plist .pr.cur .cnt{background:rgba(255,255,255,.14);color:#fff;}
.legend{display:flex;flex-wrap:wrap;gap:4px 10px;padding:10px 8px 0;font-size:10.5px;color:var(--muted);border-top:1px solid var(--line-soft);margin-top:8px;}
.legend span{display:inline-flex;align-items:center;gap:5px;}
.legend i{width:8px;height:8px;border-radius:2px;display:inline-block;}
/* the open folder on the desk */
.desk{position:absolute;left:340px;top:62px;right:20px;bottom:64px;}
.folder{position:absolute;inset:0;display:flex;flex-direction:column;}
.folder .ftop{display:flex;align-items:center;gap:12px;background:var(--navy-2);color:#fff;border-radius:12px 12px 0 0;padding:10px 14px;border-bottom:4px solid var(--tab);}
.folder .ftabbig{display:inline-flex;align-items:center;gap:8px;font-size:14px;}
.folder .ftabbig b{color:#fff;}
.folder .ftabbig .av{background:#fff;color:var(--navy-2);}
.folder .fmeta{font-size:11.5px;color:#c3cddc;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.folder .fbody{position:relative;flex:1;min-height:0;background:#fff;border:1px solid var(--line);border-top:none;border-radius:0 0 12px 12px;padding:10px 14px 14px;box-shadow:var(--sh-sm);display:flex;flex-direction:column;}
.pchips{display:flex;align-items:center;gap:6px;height:30px;margin-bottom:8px;}
.pchip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 11px;font-size:11.5px;font-weight:700;color:var(--muted);font-family:inherit;}
.pchip.on{background:var(--red);border-color:var(--red);color:#fff;}
.pchip:hover:not(.on){color:var(--ink);border-color:#b8c8d8;}
.pchips .grow{flex:1;}
.pchips .hint{font-size:11.5px;color:var(--muted);}
.pchips .hint a{color:var(--muted);text-decoration:underline;font-weight:600;}
.pdeck{position:relative;flex:1;min-height:0;}
/* the cards: a column of header bars; the open card expands in place, hover peeks, each card slightly overlaps the one above */
.pdeck{position:relative;flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;padding:2px 4px 6px 0;}
.paper{position:relative;flex:none;width:min(680px,100%);max-height:44px;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 3px 10px rgba(11,18,32,.08);font-size:12.5px;color:var(--text);opacity:0;transform:translate(-30px,-40px);transition:transform .45s cubic-bezier(.2,.85,.25,1),opacity .3s,max-height .35s ease,box-shadow .25s;cursor:pointer;z-index:calc(1 + var(--i));margin-top:-6px;}
.paper:first-child{margin-top:0;}
.paper.in{opacity:1;transform:none;}
.paper.front{max-height:1400px;overflow:visible;cursor:default;box-shadow:0 14px 34px rgba(11,18,32,.16),0 2px 4px rgba(11,18,32,.06);z-index:40;margin-bottom:6px;}
.paper:not(.front):hover{max-height:560px;z-index:60;box-shadow:0 14px 30px rgba(11,18,32,.18);}
.paper .chd{display:flex;align-items:center;gap:8px;height:43px;padding:0 12px 0 14px;border-bottom:1px solid var(--line-soft);background:#fff;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);position:sticky;top:0;z-index:2;}
.paper .chd b{color:var(--ink);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.paper .chd .grow{flex:1;}
.paper .chd a{color:var(--muted);text-decoration:underline;font-weight:600;letter-spacing:0;text-transform:none;font-size:11.5px;}
.paper .chd .muted{letter-spacing:0;text-transform:none;font-size:11.5px;color:var(--faint);}
.paper .chd.warm{background:#fff8e1;border-bottom-color:#f0dfa0;}
.paper .chd.red{background:#fff5f5;border-bottom-color:#f3c2c2;}
.paper .chd.blue{background:#f3f7fb;border-bottom-color:#c9d8e8;}
.paper .chd.amber{background:#fffdf5;border-bottom-color:#f3e2a6;}
.paper > :not(.chd){margin-left:14px;margin-right:14px;}
.paper > :nth-child(2){margin-top:12px;}
.paper > :last-child{margin-bottom:14px;}
/* the message: the same yellow slip as the drawer */
.paper.slippaper .slipcard{border-radius:8px;grid-template-columns:1.15fr .85fr;}
.paper.slippaper .slipcard .f span{font-size:12.5px;line-height:1.35;}
.paper.slippaper .pdue{margin-top:8px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 10px;display:inline-block;box-shadow:var(--sh-xs);}
/* the promise */
.paper.promise{border-left:4px solid var(--red);}
.paper.promise .said .sl .src{margin-top:6px;}
/* the contact card */
.paper .chead{display:flex;gap:10px;align-items:center;margin-bottom:10px;}
.paper .chead .av{width:34px;height:34px;font-size:12px;}
.paper .chead b{display:block;font-size:14px;color:var(--ink);}
.paper .chead span{font-size:11.5px;color:var(--muted);}
.paper .kv.two{grid-template-columns:1fr 1fr;}
/* the blue facts (project, bid, appointment) */
.paper.factsheet{background:#f8fafd;border-color:#c9d8e8;}
.paper.factsheet .bigline{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:6px;}
.paper.factsheet .row{padding:7px 0;}
.paper.factsheet .row .r{font-weight:700;color:var(--ink);}
.paper .srcline{margin-top:8px;font-size:11px;color:var(--faint);}
/* approval and question cards */
.paper.apcard .apc{box-shadow:none;border-radius:8px;}
/* desk bar */
.deskbar{position:absolute;left:14px;right:14px;bottom:12px;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:10px;padding:8px 12px;z-index:70;}
.deskbar .who{display:flex;align-items:center;gap:8px;font-size:13px;flex-wrap:wrap;}
.deskbar .who b{color:var(--ink);}
.deskbar .grow{flex:1;}
.deskbar .cnt{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;}
.deskbar .sep{width:1px;height:20px;background:var(--line);margin:0 4px;}
.deskbar .btn.sm[title="Previous"] .ic{transform:rotate(180deg);}
.deskbar .howgo{flex:1;margin:0;}

/* the List | Triage switch on Today */
.viewseg a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--muted);font-weight:600;font-size:12px;padding:5px 11px;border-radius:6px;}
.viewseg a.on{background:#fff;color:var(--ink);box-shadow:var(--sh-xs);}
.viewseg a:hover:not(.on){color:var(--ink);}
.viewhint{font-size:11.5px;color:var(--faint);margin-left:8px;}
.startwith{font-weight:700;color:var(--red);text-decoration:underline;white-space:nowrap;}
