/* Tico Entregas panel — approved M0-C "Mercado" tokens (mocks/_tokens.css) + M2-C "Bandeja de tareas".
   Fonts are self-hosted (SIL OFL 1.1, see ../fonts/OFL-*.txt). Keep tokens in sync with mocks/_tokens.css. */
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:500 800;font-display:swap;src:url(../fonts/bricolage-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:500 800;font-display:swap;src:url(../fonts/bricolage-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/dmsans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/dmsans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --c-bg:#FFFBF2; --c-surface:#FFFFFF; --c-ink:#111111; --c-ink-2:#4A3F36;
  --c-primary:#3D2314; --c-on-primary:#FFFFFF; --c-accent:#FFB000; --c-on-accent:#111111;
  --c-leaf:#1F7A3A; --c-on-leaf:#FFFFFF; --c-danger:#B3261E;
  --c-tint-coffee:#F1E4D8; --c-tint-mango:#FFEFC2; --c-tint-leaf:#DDF0E1; --c-tint-sky:#DCEBFA;
  --c-disabled-bg:#ECE6DC; --c-disabled-ink:#6B6158;
  --c-rule:#D9CFC2; --c-cream:#F3D9A6;
  --font-display:"Bricolage Grotesque","Arial Black","Helvetica Neue",Arial,system-ui,sans-serif;
  --font-body:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --fs-display:40px; --lh-display:44px; --fs-h1:28px; --lh-h1:32px; --fs-h2:21px; --lh-h2:26px;
  --fs-body:17px; --lh-body:24px; --fs-caption:14px; --lh-caption:20px;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
  --bw:2px; --radius-sm:6px; --radius:8px; --radius-lg:14px; --radius-pill:999px;
  --shadow:4px 4px 0 var(--c-ink); --shadow-sm:2px 2px 0 var(--c-ink); --tap:48px;
}

/* ---------- base ---------- */
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--c-bg);color:var(--c-ink);font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);margin:0;letter-spacing:-.01em}
p{margin:0}
a{color:inherit}
svg{flex:none}
[hidden]{display:none !important}
.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}
.skip{position:absolute;left:8px;top:-60px;z-index:20;background:var(--c-accent);border:var(--bw) solid var(--c-ink);border-radius:var(--radius);padding:8px 12px;font-weight:700}
.skip:focus{top:8px}
:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px}

/* ---------- components (M0-C) ---------- */
.btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 18px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius);font-family:var(--font-body);font-size:var(--fs-body);font-weight:700;line-height:1.1;cursor:pointer;box-shadow:var(--shadow);transition:transform .06s,box-shadow .06s;text-decoration:none;white-space:nowrap;color:inherit}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--c-ink)}
.btn:focus-visible{outline:3px solid var(--c-accent);outline-offset:3px}
.btn-primary{background:var(--c-primary);color:var(--c-on-primary)}
.btn-secondary{background:var(--c-surface);color:var(--c-ink)}
.btn-accent{background:var(--c-accent);color:var(--c-on-accent)}
.btn-danger{background:var(--c-surface);color:var(--c-danger);border-color:var(--c-danger);box-shadow:2px 2px 0 var(--c-danger)}
.btn-ghost{background:transparent;border-color:transparent;box-shadow:none;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px;padding:0 10px}
.btn-ghost:active{transform:none;box-shadow:none;background:var(--c-tint-mango)}
.btn[disabled]{background:var(--c-disabled-bg);color:var(--c-disabled-ink);border-style:dashed;border-color:var(--c-disabled-ink);box-shadow:none;cursor:not-allowed;transform:none}
.btn-block{width:100%}
.btn-sm{min-height:48px;padding:0 14px;font-size:16px;box-shadow:var(--shadow-sm)}

.chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius-pill);background:var(--c-surface);font-weight:600;font-size:16px;white-space:nowrap;text-decoration:none;color:var(--c-ink)}
.chip.is-on{background:var(--c-accent);color:var(--c-on-accent);font-weight:700;box-shadow:var(--shadow-sm)}
.chip .n{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:var(--radius-pill);background:var(--c-ink);color:#fff;font-size:13px;font-weight:800}
.chip.is-on .n{background:var(--c-ink);color:var(--c-accent)}
.chips{display:flex;flex-wrap:wrap;gap:8px}

.field{display:flex;flex-direction:column;gap:6px}
.field > label,.field > .label{font-weight:700;font-size:15px}
.input{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 14px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius);background:var(--c-surface);font-size:var(--fs-body)}
.input input,.input select{border:0;outline:0;background:transparent;font:inherit;color:var(--c-ink);width:100%;min-width:0;min-height:48px}
.input input::placeholder{color:#6E645B}
.input:focus-within{box-shadow:0 0 0 3px var(--c-accent)}
.input.is-err{border-color:var(--c-danger);box-shadow:0 0 0 2px var(--c-danger)}
.input .reveal{flex:none;appearance:none;border:0;background:none;padding:0;font:inherit;color:var(--c-ink);font-weight:700;font-size:15px;text-decoration:underline;text-underline-offset:3px;min-height:48px;display:grid;place-items:center;cursor:pointer}
textarea.area{width:100%;min-height:96px;padding:12px 14px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius);background:var(--c-surface);font:inherit;color:var(--c-ink);resize:vertical}
textarea.area:focus{outline:0;box-shadow:0 0 0 3px var(--c-accent)}
textarea.area.is-err{border-color:var(--c-danger);box-shadow:0 0 0 2px var(--c-danger)}
.hint{font-size:var(--fs-caption);line-height:var(--lh-caption);color:var(--c-ink-2)}
.ferr{font-size:var(--fs-caption);line-height:var(--lh-caption);color:var(--c-danger);font-weight:700}

.alert{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:10px 12px;border:var(--bw) solid var(--c-danger);border-radius:var(--radius);background:var(--c-surface);color:var(--c-danger);font-weight:700;font-size:15px;line-height:20px}
.alert::before{content:"!";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--c-danger);color:#fff;font-size:13px;font-weight:800}
.alert span{color:var(--c-ink);font-weight:400;display:block;margin-top:2px}
.notice{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:10px 12px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius);background:var(--c-tint-leaf);font-weight:700;font-size:15px;line-height:20px}
.notice::before{content:"✓";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--c-leaf);color:#fff;font-size:13px;font-weight:800}
.notice.info{background:var(--c-tint-sky)}
.notice.info::before{content:"i";background:var(--c-ink)}

.panel{background:var(--c-surface);border:var(--bw) solid var(--c-ink);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:var(--sp-5)}
.panel h3{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:800;margin-bottom:var(--sp-4)}

.logo{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-display);font-weight:800;font-size:18px;letter-spacing:-.01em}
.logo i{display:inline-grid;place-items:center;width:28px;height:28px;background:var(--c-accent);border:var(--bw) solid var(--c-ink);border-radius:6px;font-style:normal;font-size:15px}
.avatar{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--c-tint-leaf);color:var(--c-ink);border:var(--bw) solid var(--c-ink);font-weight:800;font-family:var(--font-display);text-decoration:none;flex:none}

/* ---------- login (frame 1 / 1b) ---------- */
.login{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:24px 16px;background:
  radial-gradient(circle at 12% 18%,var(--c-tint-mango) 0 120px,transparent 121px),
  radial-gradient(circle at 88% 82%,var(--c-tint-leaf) 0 150px,transparent 151px),var(--c-bg)}
.lcard{width:100%;max-width:440px;background:var(--c-surface);border:var(--bw) solid var(--c-ink);border-radius:var(--radius-lg);box-shadow:6px 6px 0 var(--c-ink);padding:28px 28px 24px;display:flex;flex-direction:column;gap:16px}
.lcard .logo{font-size:17px}
.lcard h1{font-size:var(--fs-h1);line-height:var(--lh-h1);font-weight:800}
.lcard .sub{color:var(--c-ink-2);margin-top:-8px;font-size:16px}
.lcard .btn-ghost{align-self:center;min-height:48px}
.lcard .foot{border-top:1px solid var(--c-rule);padding-top:14px;font-size:14px;line-height:20px;color:var(--c-ink-2);text-align:center}
.lcard .foot a{font-weight:700;color:var(--c-ink)}
.lcard form{display:flex;flex-direction:column;gap:16px;margin:0}
@media (max-width:480px){.lcard{padding:22px 18px 20px}.login{background:var(--c-bg)}}

/* ---------- shell ---------- */
.shell{min-height:100vh;display:flex;position:relative;background:linear-gradient(90deg,var(--c-primary) 0 82px,var(--c-ink) 82px 84px,transparent 84px)}
.shell.x{background:linear-gradient(90deg,var(--c-primary) 0 290px,var(--c-ink) 290px 292px,transparent 292px)}
.rail{flex:0 0 84px;position:sticky;top:0;height:100vh;background:var(--c-primary);color:var(--c-on-primary);border-right:var(--bw) solid var(--c-ink);display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 0;z-index:3}
.rail .mark{display:grid;place-items:center;width:48px;height:48px;background:var(--c-accent);border:var(--bw) solid var(--c-ink);border-radius:var(--radius);font-size:24px;margin-bottom:10px;text-decoration:none}
.rail form{margin:0}
.ritem{position:relative;display:grid;place-items:center;width:60px;height:56px;border-radius:var(--radius);color:var(--c-on-primary);text-decoration:none;border:var(--bw) solid transparent;background:transparent;padding:0;cursor:pointer;font:inherit}
.ritem.is-active{background:var(--c-accent);color:var(--c-on-accent);border-color:var(--c-ink);box-shadow:var(--shadow-sm)}
.ritem:not(.is-active):hover,.ritem:not(.is-active):focus-visible{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5)}
.ritem:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px}
.ritem .cnt{position:absolute;top:2px;right:2px;min-width:22px;height:22px;padding:0 5px;border-radius:var(--radius-pill);background:var(--c-surface);color:var(--c-ink);border:var(--bw) solid var(--c-ink);font-size:12px;font-weight:800;display:grid;place-items:center;line-height:1}
.ritem.is-active .cnt{background:var(--c-ink);color:var(--c-accent)}
.ritem .rdot{position:absolute;top:6px;right:8px;width:10px;height:10px;border-radius:50%;background:var(--c-accent);border:1.5px solid var(--c-ink)}
.rsep{width:44px;height:2px;background:rgba(255,255,255,.35);margin:6px 0}
.rail .grow{flex:1}
.tip{display:none;position:absolute;left:calc(100% + 14px);top:50%;transform:translateY(-50%);z-index:5;white-space:nowrap;background:var(--c-ink);color:#fff;border-radius:var(--radius-sm);padding:8px 12px;font-size:15px;font-weight:700;line-height:18px;box-shadow:3px 3px 0 var(--c-accent);text-align:left;pointer-events:none}
.tip small{display:block;font-weight:500;font-size:13px;color:var(--c-cream)}
.tip::before{content:"";position:absolute;left:-6px;top:50%;width:12px;height:12px;background:var(--c-ink);transform:translateY(-50%) rotate(45deg)}
.ritem:focus-visible .tip{display:block}
/* hover tooltips wait a beat so passing the pointer over the rail never covers the page title/subtitle */
@media (hover:hover){.ritem:hover .tip{display:block;animation:tip-in .15s .35s both}}
@keyframes tip-in{from{opacity:0}to{opacity:1}}

.rail-x{flex:0 0 292px;position:sticky;top:0;height:100vh;overflow-y:auto;background:var(--c-primary);color:var(--c-on-primary);border-right:var(--bw) solid var(--c-ink);display:flex;flex-direction:column;padding:14px 12px;gap:4px;z-index:3}
.rx-top{display:flex;align-items:center;gap:10px;margin:0 2px 10px}
.rx-top .mark{display:grid;place-items:center;width:44px;height:44px;background:var(--c-accent);border:var(--bw) solid var(--c-ink);border-radius:var(--radius);font-size:22px;color:var(--c-ink);text-decoration:none}
.rx-top b{font-family:var(--font-display);font-weight:800;font-size:18px;line-height:20px;flex:1}
.rx-top b small{display:block;font-family:var(--font-body);font-weight:500;font-size:13px;color:var(--c-cream)}
.rx-top form{margin:0}
.rx-btn{display:grid;place-items:center;width:44px;height:44px;border-radius:var(--radius);border:var(--bw) solid rgba(255,255,255,.55);color:#fff;font-weight:800;background:transparent;font:inherit;font-weight:800;cursor:pointer}
.rx{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 12px;border-radius:var(--radius);color:#fff;text-decoration:none;font-weight:700;font-size:16px;border:var(--bw) solid transparent;cursor:pointer;list-style:none}
.rx::-webkit-details-marker{display:none}
.rx:hover{background:rgba(255,255,255,.1)}
.rx .cnt{margin-left:auto;min-width:24px;height:24px;padding:0 6px;border-radius:var(--radius-pill);background:var(--c-surface);color:var(--c-ink);border:var(--bw) solid var(--c-ink);font-size:12px;font-weight:800;display:grid;place-items:center}
.rx.is-active{background:var(--c-accent);color:var(--c-ink);border-color:var(--c-ink)}
.rx.is-active .cnt{background:var(--c-ink);color:var(--c-accent)}
.rx-sec{margin-top:6px;border-top:var(--bw) solid rgba(255,255,255,.3);padding-top:6px}
.rx-sec > .rx small{display:block;font-weight:500;font-size:13px;line-height:16px;color:var(--c-cream)}
.rx-sec > .rx .chev{margin-left:auto}
.rx-sec[open] > .rx .chev{transform:rotate(90deg)}
.rx-sub{list-style:none;margin:2px 0 0;padding:0 0 0 30px;display:grid;gap:0}
.rx-sub a{display:flex;align-items:center;min-height:40px;padding:0 12px;border-radius:var(--radius-sm);color:#fff;text-decoration:none;font-size:15px;border-left:var(--bw) solid rgba(255,255,255,.3)}
.rx-sub a:hover{background:rgba(255,255,255,.08)}
.rx-sub a.is-cur{background:rgba(255,255,255,.14);font-weight:700;border-left-color:var(--c-accent)}
.dot{margin-left:auto;width:10px;height:10px;border-radius:50%;background:var(--c-accent);border:1.5px solid var(--c-ink);flex:none}
.rx-foot{margin-top:auto;display:flex;align-items:center;gap:10px;padding:10px 4px 0;border-top:var(--bw) solid rgba(255,255,255,.3);font-size:14px;line-height:18px}
.rx-foot b{display:block;font-size:15px}
.rx-foot div{min-width:0;flex:1}
.rx-foot div span{color:var(--c-cream);overflow-wrap:anywhere}
.rx-foot form{margin:0}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topb{display:flex;align-items:center;gap:16px;padding:14px 28px;background:var(--c-surface);border-bottom:var(--bw) solid var(--c-ink)}
.topb form{flex:0 1 520px;margin:0}
.topb .input{width:100%}
.topb .who{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:15px;line-height:19px;text-decoration:none}
.topb .who b{display:block}
.topb .who-t{text-align:right}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.topb .who span{color:var(--c-ink-2)}
.content{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 272px;gap:24px;padding:24px 28px 48px;align-content:start}
.content.single{grid-template-columns:minmax(0,1fr)}
.hhead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}
.hhead h1{font-size:var(--fs-display);line-height:var(--lh-display);font-weight:800;letter-spacing:-.02em}
.hhead p{color:var(--c-ink-2);font-size:16px;margin-top:2px}
.hhead .kicker{margin:0 0 4px}
.hhead .kicker a{color:var(--c-ink-2)}
.flash{margin-bottom:16px}

.grp{font-family:var(--font-display);font-weight:800;font-size:17px;line-height:22px;letter-spacing:normal;margin:20px 0 10px;display:flex;align-items:center;gap:10px}
.grp .ct{font-family:var(--font-body);font-size:14px;font-weight:600;color:var(--c-ink-2)}
.grp.danger{color:var(--c-danger)}
.tasks{display:flex;flex-direction:column;gap:10px}
.task{display:grid;grid-template-columns:136px minmax(0,1fr) auto auto;grid-template-areas:"role main due act";gap:16px;align-items:center;min-height:76px;padding:12px 14px;background:var(--c-surface);border:var(--bw) solid var(--c-ink);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.task > .role{grid-area:role}
.task > .tmain{grid-area:main;min-width:0}
.task > .due{grid-area:due}
.task > .act{grid-area:act}
.task.urgent{border-left-width:8px;border-left-color:var(--c-danger);padding-left:8px}
.task .tt{font-family:var(--font-body);letter-spacing:0;margin:0;font-weight:700;font-size:17px;line-height:22px}
.task .tt a{text-decoration:none}
.task .tt a:hover{text-decoration:underline}
.task .cx{font-size:14px;line-height:19px;color:var(--c-ink-2);margin-top:2px}
.task .due{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:700;white-space:nowrap;color:var(--c-ink-2)}
.task .due.hot{color:var(--c-danger)}
.task .btn-sm{min-width:150px}
.role{display:inline-flex;align-items:center;gap:6px;justify-self:start;font-size:13px;font-weight:800;line-height:1;padding:6px 9px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius-sm);white-space:nowrap;color:var(--c-ink)}
.r-prov{background:var(--c-tint-coffee)} .r-val{background:var(--c-tint-leaf)} .r-ops{background:var(--c-tint-sky)} .r-adm{background:var(--c-tint-mango)}
.st-new{background:var(--c-tint-mango)} .st-review{background:var(--c-tint-sky)} .st-ok{background:var(--c-leaf);color:#fff} .st-bad{background:var(--c-surface);color:var(--c-danger);border-color:var(--c-danger)}
.side{display:flex;flex-direction:column;gap:18px}
.side .panel{padding:16px 16px 10px}
.side .panel h3{font-size:18px;line-height:22px;margin-bottom:8px}
.orgs{list-style:none;margin:0;padding:0}
.orgs li a{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;min-height:56px;border-top:1px solid var(--c-rule);text-decoration:none;padding:6px 0}
.orgs li:first-child a{border-top:0}
.orgs b{display:block;font-size:15px;line-height:19px}
.orgs small{font-size:13px;line-height:17px;color:var(--c-ink-2)}
.done{list-style:none;margin:0;padding:0;font-size:14px;line-height:19px;color:var(--c-ink-2)}
.done li{display:grid;grid-template-columns:22px 1fr;gap:8px;padding:6px 0}
.done li::before{content:"✓";display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--c-leaf);color:#fff;font-size:12px;font-weight:800}
.done li.none{display:block;padding:2px 0 6px}
.done li.none::before{content:none}

/* empty states */
.src-fail{margin:16px 0 0}
.inbox-empty{margin-top:20px}
.empty{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:24px;background:var(--c-surface);border:var(--bw) dashed var(--c-ink);border-radius:var(--radius-lg)}
.empty h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:800}
.empty p{color:var(--c-ink-2);max-width:560px}
.empty .badge-soon{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;background:var(--c-tint-mango);border:var(--bw) solid var(--c-ink);border-radius:var(--radius-sm);padding:4px 9px}
.empty .ico{display:grid;place-items:center;width:56px;height:56px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius);box-shadow:var(--shadow-sm)}

/* detail / forms (unmocked; same language) */
.cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
.stack{display:flex;flex-direction:column;gap:16px}
.card{background:var(--c-surface);border:var(--bw) solid var(--c-ink);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:20px}
.card > h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:800;margin-bottom:12px;display:flex;align-items:center;gap:10px}
.card > h2 .ct{font-family:var(--font-body);font-size:14px;font-weight:600;color:var(--c-ink-2)}
.kv{display:grid;grid-template-columns:150px 1fr;gap:6px 16px;margin:0;font-size:15px;line-height:21px}
.kv dt{color:var(--c-ink-2)}
.kv dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.doc{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;padding:14px 0;border-top:1px solid var(--c-rule)}
.doc:first-of-type{border-top:0;padding-top:0}
.doc .fico{display:grid;place-items:center;width:44px;height:44px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius-sm);background:var(--c-tint-coffee)}
.doc .dt{font-weight:700;line-height:22px}
.doc .dm{font-size:14px;line-height:19px;color:var(--c-ink-2);margin-top:2px}
.doc .drow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.doc form{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;margin:10px 0 0}
.doc form > .input{flex:1 1 220px;min-height:48px}
.decision{position:sticky;top:16px}
.decision form{display:flex;flex-direction:column;gap:12px;margin:0}
.crit{display:flex;align-items:center;gap:12px;min-height:48px;padding:6px 0;border-top:1px solid var(--c-rule);font-weight:600}
.crit:first-child{border-top:0}
.crit input{width:24px;height:24px;accent-color:var(--c-leaf)}
.timeline{list-style:none;margin:0;padding:0;font-size:14px;line-height:19px}
.timeline li{display:grid;grid-template-columns:12px 1fr;gap:10px;padding:6px 0}
.timeline li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--c-ink);margin-top:5px}
.timeline small{display:block;color:var(--c-ink-2)}
.tabs{display:flex;gap:8px;margin:0 0 6px}
.reqlink{text-decoration:none}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px;counter-reset:step}
.step{background:var(--c-surface);border:var(--bw) solid var(--c-ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:18px 20px;scroll-margin-top:16px}
.step-h{display:flex;align-items:center;gap:12px}
.step-h h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:800;flex:1}
.step-n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:var(--bw) solid var(--c-ink);font-family:var(--font-display);font-weight:800;background:var(--c-surface);flex:none}
.step.is-done .step-n{background:var(--c-leaf);color:#fff}
.step-b{margin-top:14px;display:flex;flex-direction:column;gap:14px}
.step-b > p{color:var(--c-ink-2)}
.step-b > .btn,.step-b > form,.step-b > details{align-self:flex-start}
.step-b > details[open]{align-self:stretch}
.step-b details > summary{list-style:none;margin-bottom:14px}
.step-b details > summary::-webkit-details-marker{display:none}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.fgrid .wide{grid-column:1 / -1}
.progress{display:flex;align-items:center;gap:12px;font-weight:700;font-size:15px}
.progress .bar{flex:0 1 240px;height:12px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius-pill);background:var(--c-surface);overflow:hidden}
.progress .bar i{display:block;height:100%;background:var(--c-leaf)}
.progress .bar i.p0{width:0}.progress .bar i.p1{width:25%}.progress .bar i.p2{width:50%}.progress .bar i.p3{width:75%}.progress .bar i.p4{width:100%}
.doc form.upload{display:grid;grid-template-columns:minmax(0,1fr) 200px auto;gap:12px;align-items:end;margin:12px 0 0}
.upload input[type=file]::file-selector-button{font:inherit;font-weight:700;font-size:15px;min-height:44px;padding:0 14px;margin-right:10px;border:var(--bw) solid var(--c-ink);border-radius:var(--radius);background:var(--c-surface);box-shadow:var(--shadow-sm);cursor:pointer}
.upload input[type=file]{font:inherit;font-size:15px;max-width:100%}
.upload .input{min-height:52px}
.err-box{border-color:var(--c-danger)}
.search-empty{max-width:640px}

/* ---------- mobile (375; frames 3 / 3b) ---------- */
.m-head{display:none}
.tabbar{display:none}
.only-m{display:none}
/* expanded rail (292 px) leaves no room for the side column below ~1400 px: it flows under the list */
@media (max-width:1399px){.shell.x .content{grid-template-columns:minmax(0,1fr)}.shell.x .side{flex-direction:row;flex-wrap:wrap}.shell.x .side .panel{flex:1 1 280px}}
@media (max-width:1099px){
  .content{grid-template-columns:minmax(0,1fr)}
  .cols{grid-template-columns:minmax(0,1fr)}
  .decision{position:static}
}
@media (max-width:899px){
  .rail,.rail-x,.topb{display:none}
  .only-d{display:none !important}
  .only-m{display:revert}
  .shell,.shell.x{display:block;background:none}
  .menu-wrap{padding-top:14px}
  .main{min-height:100vh}
  .m-head{display:flex;align-items:center;justify-content:space-between;margin:14px 0 4px}
  .m-head .logo{font-size:15px}.m-head .logo i{width:24px;height:24px;font-size:13px}
  .content{padding:4px 20px 120px;gap:20px}
  .hhead{margin-bottom:0;flex-wrap:wrap}
  .hhead h1{font-size:var(--fs-h1);line-height:var(--lh-h1)}
  .hhead p{font-size:15px}
  .chips.hscroll{flex-wrap:nowrap;overflow-x:auto;margin:12px -20px 0;padding:2px 20px 6px;scrollbar-width:none}
  .chips.hscroll::-webkit-scrollbar{display:none}
  /* edge fades show there is more to scroll (toggled by panel.js); the last chip scrolls fully into view */
  .chips.hscroll{scroll-padding-inline:20px}
  .chips.hscroll::after{content:"";flex:0 0 12px}
  .chips.hscroll.fade-r{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 48px),transparent)}
  .chips.hscroll.fade-l{-webkit-mask-image:linear-gradient(90deg,transparent,#000 48px,#000 100%);mask-image:linear-gradient(90deg,transparent,#000 48px,#000 100%)}
  .chips.hscroll.fade-l.fade-r{-webkit-mask-image:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent)}
  .grp{margin:14px 0 10px}
  .task{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"role due" "main main" "act act";gap:8px;padding:12px;min-height:0}
  .task.urgent{padding-left:8px}
  .task > .tmain{display:flex;flex-direction:column;gap:8px}
  .task .cx{margin-top:0}
  .task .due{font-size:13px}
  .task .act{width:100%;margin-top:4px;min-height:52px;font-size:17px;box-shadow:var(--shadow)}
  .task .btn-sm{min-width:0}
  .side{display:none}
  .tabbar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:10;border-top:var(--bw) solid var(--c-ink);background:var(--c-surface);padding:8px 6px calc(10px + env(safe-area-inset-bottom))}
  .tab{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:56px;justify-content:center;text-decoration:none;color:var(--c-ink-2);font-size:12.5px;line-height:15px;font-weight:600;text-align:center}
  .tab .ico{display:grid;place-items:center;width:56px;height:32px;border-radius:var(--radius-pill);border:var(--bw) solid transparent}
  .tab.is-active{color:var(--c-ink);font-weight:800}
  .tab.is-active .ico{background:var(--c-accent);border-color:var(--c-ink)}
  .tab .tcnt{position:absolute;top:2px;left:calc(50% + 12px);min-width:22px;height:22px;padding:0 5px;border-radius:var(--radius-pill);background:var(--c-ink);color:var(--c-accent);font-size:12px;font-weight:800;display:grid;place-items:center}
  .fgrid{grid-template-columns:1fr}
  .doc form.upload{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr;gap:0 0}
  .kv dd{margin-bottom:8px}
  .card{padding:16px}
}
/* mobile menu (3b) */
.m-title{font-family:var(--font-display);font-weight:800;font-size:var(--fs-h1);line-height:var(--lh-h1);margin:4px 0 12px}
.menu-user{display:flex;align-items:center;gap:12px;padding:12px;background:var(--c-surface);border:var(--bw) solid var(--c-ink);border-radius:var(--radius);box-shadow:var(--shadow-sm);font-size:15px;line-height:19px}
.menu-user b{display:block;font-size:16px}
.menu-user span{color:var(--c-ink-2)}
.acc{margin-top:12px;background:var(--c-surface);border:var(--bw) solid var(--c-ink);border-radius:var(--radius);overflow:hidden}
.acc-h{display:flex;align-items:center;gap:10px;min-height:60px;padding:6px 12px;font-weight:800;font-size:16px;line-height:19px;cursor:pointer;list-style:none}
.acc-h::-webkit-details-marker{display:none}
.acc-h small{display:block;font-weight:500;font-size:13px;line-height:17px;color:var(--c-ink-2)}
.acc-h .chev{margin-left:auto}
.acc[open] .acc-h{border-bottom:var(--bw) solid var(--c-ink);background:var(--c-tint-coffee)}
.acc[open] .acc-h .chev{transform:rotate(90deg)}
.acc ul{list-style:none;margin:0;padding:0}
.acc li a{display:flex;align-items:center;min-height:48px;padding:0 16px;border-top:1px solid var(--c-rule);text-decoration:none;font-weight:600;font-size:16px}
.acc li:first-child a{border-top:0}
.menu-out{margin-top:16px}
.menu-wrap{max-width:560px}
/* full-bleed pages (M3 map canvas) */
.content.bleed{padding:0;display:block;position:relative}
/* tasks with two answers (M12 "Todo listo" + "Me falta algo") */
.task .acts{display:flex;gap:8px;align-items:center}
.task .acts form{margin:0}
@media (max-width:899px){.task .acts{display:grid;grid-template-columns:1fr auto;box-shadow:none;min-height:0}.task .acts .btn{min-height:52px;width:100%}}

/* Complaint replacements ("reposición", free) on manifests, intake counts and pick lists */
.replq{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;line-height:1;color:var(--c-ink);padding:4px 7px;
  border-radius:var(--radius-pill);background:var(--c-tint-mango);border:1.5px solid var(--c-ink);white-space:nowrap}
b.replq{padding:2px 6px}

/* D54 · entregas con código por revisar */
.otprev{list-style:none;margin:0;padding:0}
.otprev li{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid var(--c-line,#e6ddd0)}
.otprev li:first-child{border-top:0}
.otprev li > div{display:flex;flex-direction:column;gap:2px;min-width:0}
.codeline{margin:0 0 8px}
