/* AI Minimalist Hub, 20 Oct: the folding Agents group, the Tasks board, workflows (the map and its editor), Ready for your
   check, concepts given to agents, change log categories and software updates. Same tokens as app.css. */

/* ---------- rail: Agents folds away ---------- */
button.navlabel.fold{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;cursor:pointer;font:500 10.5px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.18em;color:var(--on-navy-3);padding:18px 10px 8px;border-radius:8px}
button.navlabel.fold:hover{color:#fff}
button.navlabel.fold:focus-visible{outline:2px solid #fff;outline-offset:2px}
.fold .foldn{margin-left:auto;font:500 11px/1 var(--f-body);letter-spacing:0;text-transform:none;color:var(--on-navy-3)}
.fold svg.chev{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .15s}
.fold[aria-expanded="false"] svg.chev{transform:rotate(-90deg)}
.pres.setup{background:transparent;border:1.5px dashed var(--on-navy-3)}
.main .pres.setup{border-color:var(--g400)}
.pill.setup{background:var(--call-bg);color:var(--call)}.pill.setup i{background:transparent;border:1.5px dashed var(--call)}
.notice{background:var(--call-bg);color:#5A3800;border-radius:14px;padding:14px 16px;margin:-8px 0 22px;font-size:14px;max-width:90ch}
@media (prefers-reduced-motion:reduce){.fold svg.chev{transition:none}}

/* ---------- Tasks: the board ---------- */
.kbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.kbar select{border:1px solid var(--g300);border-radius:999px;padding:6px 12px;background:#fff;font-size:13px;width:auto;max-width:240px}
.kboard{display:grid;grid-template-columns:repeat(4,minmax(240px,1fr));gap:14px;align-items:start;overflow-x:auto;padding-bottom:8px}
.kcol{background:var(--g100);border-radius:16px;padding:10px;min-height:220px;display:grid;grid-template-rows:auto 1fr;gap:8px;transition:background .12s,box-shadow .12s}
.kcol header{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 2px}
.kcol h2{font:700 14px var(--f-display);letter-spacing:-.005em}
.kcol .kc{font:600 12px var(--f-body);color:var(--g500)}
.kcol.over{background:var(--wash);box-shadow:inset 0 0 0 2px var(--navy)}
.klist{display:grid;gap:8px;align-content:start}
.kempty{color:var(--g400);font-size:12.5px;padding:10px 6px}
.kcard{background:#fff;border:1px solid var(--g200);border-radius:12px;padding:11px 12px;display:grid;gap:8px;cursor:grab;touch-action:none;user-select:none;text-align:left}
.kcard:hover{border-color:var(--g400)}
.kcard:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.kcard.dragging{opacity:.35}
.kcard.late{border-left:3px solid var(--rej)}
.kcard.rs-held{background:#FFFCF5}
.kcard .kt{font:600 13.5px/1.35 var(--f-body)}
.kcard .kmeta{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--g600)}
.kcard .kmeta .av{width:22px;height:22px;font-size:9.5px}
.kcard .kdue{margin-left:auto;color:var(--g500)}
.kcard.late .kdue{color:var(--rej);font-weight:600}
.kcard .ktags{display:flex;gap:5px;flex-wrap:wrap}
.kcard .ktags .tag{font-size:10.5px;padding:4px 7px}
.kcard.ghost{position:fixed;left:0;top:0;z-index:70;pointer-events:none;box-shadow:0 18px 40px rgba(1,31,91,.18);cursor:grabbing}
body.kdrag{cursor:grabbing}
body.kdrag *{user-select:none}
@media (max-width:760px){.kboard{grid-template-columns:repeat(4,82vw);scroll-snap-type:x mandatory}.kcol{scroll-snap-align:start}}

/* the drawer a card opens into */
.drawer-wrap{position:fixed;inset:0;z-index:55;background:rgba(1,16,48,.32);display:flex;justify-content:flex-end}
.drawer{width:min(480px,100%);height:100%;background:#fff;overflow-y:auto;padding:22px 24px 32px;display:grid;gap:14px;align-content:start;box-shadow:-12px 0 40px rgba(1,16,48,.16)}
.drawer .dh{display:flex;justify-content:space-between;align-items:center}
.drawer input[type=text]{font:700 19px/1.3 var(--f-display);border:0;border-bottom:1px solid var(--g200);padding:6px 0;border-radius:0;width:100%}
.drawer input[type=text]:focus{outline:none;border-bottom-color:var(--navy)}
.drawer .dgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.drawer .dgrid label{display:grid;gap:5px;font-weight:600;font-size:12.5px;color:var(--g600)}
.drawer select,.drawer input[type=date],.drawer textarea{border:1px solid var(--g300);border-radius:10px;padding:8px 10px;background:#fff;width:100%}
.drawer textarea{min-height:130px;resize:vertical}
.drawer .dresult,.drawer .dfiles{background:var(--g50);border-radius:12px;padding:12px;display:grid;gap:6px}
.drawer .file{display:block;font-size:13.5px}
.drawer .dfoot{position:sticky;bottom:-32px;background:#fff;padding:12px 0 4px;border-top:1px solid var(--g100)}
@media (max-width:560px){.drawer{padding:18px 16px 28px}.drawer .dgrid{grid-template-columns:1fr}}

/* ---------- workflows ---------- */
.wftop{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;margin-bottom:28px}
.rcheck{display:grid;gap:12px;align-content:start}
.rcheck .who{display:flex;gap:12px;align-items:center}
.wfnums{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;align-content:center}
.wfnums div{display:grid;gap:2px}
.wfnums b{font:800 30px/1 var(--f-display);letter-spacing:-.02em}
.wfnums span{font-size:12.5px;color:var(--g500)}
.wfnums .bad b{color:var(--rej)}
.wfgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.wfcard{display:grid;gap:10px;text-decoration:none;color:inherit;align-content:start}
.wfcard:hover{border-color:var(--g400)}
.wfcard .top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.wfcard h3{font:700 17px var(--f-display);letter-spacing:-.01em}
.wfstrip{display:flex;gap:4px;flex-wrap:wrap}
.wfstrip i{width:16px;height:8px;border-radius:3px;background:var(--navy-3);opacity:.75}
.wfstrip i.g{background:var(--navy);opacity:1;box-shadow:0 0 0 2px var(--wash)}
.wfstrip i.m{background:var(--g300);opacity:1}
.wffoot{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.avs{display:inline-flex}
.avs .av{width:24px;height:24px;font-size:9.5px;margin-left:-6px;box-shadow:0 0 0 2px #fff}
.avs .av:first-child{margin-left:0}
.wtrack{display:grid;gap:0;padding:6px 20px}
.trackp{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px;padding:14px 0;border-top:1px solid var(--g100)}
.trackp:first-child{border-top:0}
.trackp .tp{display:grid;gap:2px;text-decoration:none;color:inherit;align-content:start}
.trackp .tp b{font:700 14.5px var(--f-display)}
.tsteps{display:grid;gap:8px}
.tstep{display:flex;gap:10px;align-items:center}
.tstep .av{width:28px;height:28px;font-size:10.5px;flex:none}
.tstep b{font-weight:600;font-size:13.5px;margin-right:6px}
.tstep.late b{color:var(--rej)}
.tstep.held .av{opacity:.55}
.tstep.you b{color:var(--navy)}
@media (max-width:900px){.wftop{grid-template-columns:1fr}.trackp{grid-template-columns:1fr;gap:8px}}

/* the map */
.fmap{position:relative;overflow:auto;background:
  radial-gradient(circle,var(--g200) 1px,transparent 1.2px) 0 0/20px 20px,#FCFCFD;border:1px solid var(--g200);border-radius:14px;max-height:620px}
.farea{position:relative;min-width:100%}
.flines{position:absolute;inset:0;pointer-events:none;overflow:visible}
.flines path.e{fill:none;stroke-width:1.6}
.flines path.e.next{stroke:var(--g400)}
.flines path.e.done{stroke:var(--pass)}
.flines path.e.changes{stroke:var(--call);stroke-dasharray:5 5}
.flines .ah.next{fill:var(--g400)}.flines .ah.done{fill:var(--pass)}.flines .ah.changes{fill:var(--call)}
.flines .elabel{font:500 10.5px var(--f-mono);fill:var(--call);letter-spacing:.06em}
.fnode{position:absolute;display:grid;grid-template-rows:auto auto 1fr;gap:5px;align-content:start;text-align:left;background:#fff;border:1px solid var(--g300);border-radius:12px;padding:9px 11px;font:inherit;color:inherit;box-shadow:0 1px 0 rgba(13,13,13,.03)}
.fmap.edit .fnode{cursor:grab;touch-action:none;user-select:none}
.fnode.drag{cursor:grabbing;box-shadow:0 14px 30px rgba(1,31,91,.16);z-index:3}
.fnode:hover{border-color:var(--g500)}
.fnode.sel{border-color:var(--navy);box-shadow:0 0 0 3px rgba(1,31,91,.14);z-index:2}
.fnode .fwho{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--g600);min-width:0}
.fnode .fwho .av{width:20px;height:20px;font-size:8.5px;flex:none}
.fnode .fst,.fnode .fsla{margin-left:auto;font:500 10px/1 var(--f-mono);letter-spacing:.04em;color:var(--g500);white-space:nowrap}
.fnode b{font:700 13.5px/1.25 var(--f-display);letter-spacing:-.005em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fnode .ftool{font-size:11.5px;color:var(--g500);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35}
.fnode.jgate{background:var(--wash);border-color:#B9C6E4}
.fnode.jgate b{color:var(--navy)}
.fnode.mach{background:var(--g50);border-style:dashed}
.fnode.st-done{border-color:#9ED3B5;background:#F6FBF8}
.fnode.st-done .fst{color:var(--pass)}
.fnode.st-skipped{opacity:.55}
.fnode.st-active{border-color:var(--navy);box-shadow:0 0 0 3px rgba(1,31,91,.1)}
.fnode.st-active .fst{color:var(--navy);font-weight:600}
.fnode.st-review{border-color:#E9B949;background:var(--call-bg)}
.fnode.st-review .fst{color:var(--call);font-weight:600}
.fnode.st-waiting,.fnode.st-idle{opacity:.78}

/* the editor */
.wfhead{align-items:flex-start}
.wfhead > div:first-child{display:grid;gap:8px;flex:1;min-width:280px}
.wfhead .actions{flex:none}
.wfname{font:800 34px/1.1 var(--f-display);letter-spacing:-.03em;border:0;border-bottom:1px solid transparent;background:transparent;padding:2px 0;width:100%;max-width:640px}
.wfname:hover,.wfname:focus{border-bottom-color:var(--g300);outline:none}
.wfsum{border:1px solid transparent;border-radius:10px;background:transparent;padding:6px 8px;margin-left:-8px;color:var(--g600);font-size:15px;min-height:46px;max-width:72ch;resize:vertical}
.wfsum:hover,.wfsum:focus{border-color:var(--g300);background:#fff;outline:none}
.ftools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.ftools .btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.fhint{margin-left:6px}
.feditor{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.feditor .fmap{min-height:520px;max-height:72vh}
.fpanel{display:grid;gap:12px;position:sticky;top:20px;max-height:calc(100vh - 40px);overflow-y:auto}
.fpanel input,.fpanel select,.fpanel textarea{border:1px solid var(--g300);border-radius:10px;padding:8px 10px;background:#fff;width:100%}
.fpanel textarea{min-height:110px;resize:vertical}
.fpanel .row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.farrows{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.farrows .chip{display:inline-flex;gap:6px;align-items:center;padding:4px 6px 4px 10px;font-size:12px}
.farrows .chip button{all:unset;cursor:pointer;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;color:var(--g500);font-size:11px}
.farrows .chip button:hover{background:var(--g100);color:var(--rej)}
.flegend{display:grid;gap:8px;font-size:12.5px;color:var(--g600)}
.flegend span{display:flex;align-items:center;gap:8px}
.lg.jg{width:16px;height:11px;border-radius:3px;background:var(--wash);border:1px solid #B9C6E4;display:inline-block}
.lg.mach{width:16px;height:11px;border-radius:3px;background:var(--g50);border:1px dashed var(--g400);display:inline-block}
.lg.back{width:18px;height:0;border-top:2px dashed var(--call);display:inline-block}
@media (max-width:1100px){.feditor{grid-template-columns:1fr}.fpanel{position:static;max-height:none}}

/* a project's workflow */
.fproj{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.fproj .fmap{max-height:420px}
.fproj.empty-flow{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px}
.fstep{display:grid;gap:8px;border-top:1px solid var(--g100);padding-top:12px}
.fstep .fsh{display:flex;gap:10px;align-items:center}
.fstep .fsh > div{flex:1;min-width:0}

/* ---------- Ready for your check ---------- */
.readyp{display:grid;grid-template-columns:minmax(220px,360px) minmax(0,1fr);gap:22px;align-items:center;background:var(--navy);color:#fff;border-radius:18px;padding:18px;margin-bottom:22px}
.readyp.delivered{background:#fff;color:var(--ink);border:1px solid var(--g200)}
.readyp .rthumb{aspect-ratio:16/9;width:100%;border-radius:12px;background:var(--navy-2) center/cover no-repeat;border:0;padding:0}
.readyp .rthumb.ph{display:grid;place-items:center;color:var(--on-navy-3);font-size:13px}
.readyp.delivered .rthumb.ph{background:var(--g100);color:var(--g500)}
.readyp .rbody{display:grid;gap:8px;align-content:center}
.readyp .eyebrow{color:var(--on-navy-3)}
.readyp.delivered .eyebrow{color:var(--g500)}
.readyp h2{font:800 26px/1.1 var(--f-display);letter-spacing:-.02em}
.readyp .small{color:var(--on-navy-2);max-width:60ch}
.readyp.delivered .small{color:var(--g600)}
.readyp .btn.primary{background:#fff;border-color:#fff;color:var(--navy)}
.readyp .btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.readyp .btn.quiet{border-color:transparent;color:var(--on-navy-2)}
.readyp.delivered .btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}
.readyp.delivered .btn{color:var(--ink);border-color:var(--g300)}
@media (max-width:760px){.readyp{grid-template-columns:1fr}}
.tline{position:relative;height:10px;border-radius:999px;background:var(--g100);margin:2px 0 4px}
.tline i{position:absolute;top:1px;width:3px;height:8px;border-radius:2px;background:var(--navy);transform:translateX(-1px)}
details.fold > summary{display:flex;justify-content:space-between;align-items:baseline;gap:12px;cursor:pointer;list-style:none}
details.fold > summary::-webkit-details-marker{display:none}
details.fold > summary h2{font-weight:700;font-size:19px;letter-spacing:-.015em}
details.fold[open] > summary{margin-bottom:14px}

/* ---------- concepts ---------- */
.concept .top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.concept .who{display:flex;gap:12px;align-items:flex-start}
.cinput{display:inline-grid;gap:2px;border:1px solid var(--g200);border-radius:12px;padding:10px 14px;text-decoration:none;color:var(--navy);max-width:100%;justify-self:start}
.cinput:hover{border-color:var(--navy)}
.cresult{background:var(--wash);border-radius:12px;padding:14px 16px;display:grid;gap:6px}
.cresult .pre{white-space:pre-wrap;max-width:80ch}
.mkproj{display:inline-flex;gap:6px;align-items:center}
.mkproj select{width:auto;border:1px solid var(--g300);border-radius:999px;padding:5px 10px;background:#fff;font-size:12.5px}

/* ---------- change log and software updates ---------- */
.datebar{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.datebar input{width:auto;border:1px solid var(--g300);border-radius:10px;padding:5px 8px;background:#fff}
.tag.cat-system{background:var(--g100);color:var(--g700)}
.tag.cat-workflow{background:var(--call-bg);color:var(--call)}
.tag.cat-app{background:var(--wash);color:var(--navy)}
.refile{display:inline-flex;gap:6px;align-items:center;margin-top:8px;color:var(--g500)}
.refile select{width:auto;border:1px solid var(--g300);border-radius:8px;padding:3px 6px;background:#fff;font-size:12px}
.swgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.sw{display:grid;gap:12px;align-content:start}
.sw .top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.sw h3{font:700 17px var(--f-display);letter-spacing:-.01em}
.swlatest{display:grid;gap:4px;border-left:3px solid var(--navy);padding-left:12px}
.swhist{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:7px;font-size:13px}
.swhist li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:8px}
.swhist .when{color:var(--g500);font-size:12px}

/* ---------- employees, operations log, Legatus ---------- */
.sendbox{margin-top:20px}
.sendbox > summary{cursor:pointer;display:flex;gap:6px;align-items:baseline}
.sendbox[open] > summary{margin-bottom:14px}
.legal .drop{border:1.5px dashed var(--g300);border-radius:12px;padding:16px;background:var(--g50)}
.legal input[type=file]{max-width:100%;width:100%}
@media (min-width:761px){.entry{grid-template-columns:58px 86px minmax(0,1fr)}}
