/* AH99 · centro de mando. Una estructura, cuatro aspectos: data-look = trazada | crono | salidas | estandar */

/* ---------- tokens: La trazada (por defecto, claro de paddock) ---------- */
:root{
  --bg:#e8ecef; --panel:#ffffff; --panel-2:#f2f5f7; --sunk:#dfe5e9;
  --ink:#11171b; --ink-2:#4f5d65; --ink-3:#6f7c84; --line:#d2dade;
  --accent:#0a7882; --accent-ink:#ffffff; --accent-soft:#d9eef0;
  --brake:#c8302e; --brake-soft:#fae3e2; --ok:#1d7442; --ok-soft:#dcf0e3; --warn:#9c5c00; --warn-soft:#fbeed6; --done:#1d7442;
  --track:#b7c1c7; --track-done:#11171b; --kerb-a:#c8302e; --kerb-b:#ffffff;
  --font:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:"Barlow Condensed","Barlow",system-ui,sans-serif;
  --head-case:uppercase; --head-track:.01em; --head-weight:700;
  --r:10px; --r-sm:6px; --pad-row:.7rem; --bar-bg:#11171b; --bar-ink:#e9eef1; --bar-ink-2:#97a6ae;
  --shadow:0 1px 2px rgba(17,23,27,.06),0 6px 20px rgba(17,23,27,.06);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root[data-look="trazada"]{
    --bg:#0e1316; --panel:#161d21; --panel-2:#1b2328; --sunk:#0b0f12; --ink:#e8eef1; --ink-2:#a3b1b8; --ink-3:#7f8d94; --line:#273239;
    --accent:#2fb9c4; --accent-ink:#05181a; --accent-soft:#123138; --brake:#f06a60; --brake-soft:#3a1a18; --ok:#5cc685; --ok-soft:#14301f;
    --warn:#e6a64a; --warn-soft:#33270f; --done:#5cc685; --track:#3a474f; --track-done:#e8eef1; --kerb-b:#e8eef1;
    --bar-bg:#070a0c; --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.25); color-scheme:dark;
  }
}

/* ---------- Torre de cronometraje ---------- */
:root[data-look="crono"]{
  --bg:#07090b; --panel:#0f1317; --panel-2:#151a1f; --sunk:#050607; --ink:#f3f5f7; --ink-2:#a2acb5; --ink-3:#7d8892; --line:#222930;
  --accent:#27c46b; --accent-ink:#03140a; --accent-soft:#0f2a1b; --brake:#ff4d4d; --brake-soft:#3a1212;
  --ok:#b45cff; --ok-soft:#2a1640; --warn:#ffd21f; --warn-soft:#3a3108; --done:#b45cff;
  --track:#2b333b; --track-done:#ffd21f; --kerb-a:#ff4d4d; --kerb-b:#f3f5f7;
  --font:"Titillium Web",system-ui,sans-serif; --display:"Titillium Web",system-ui,sans-serif;
  --head-case:uppercase; --head-track:.04em; --head-weight:700;
  --r:2px; --r-sm:2px; --pad-row:.45rem; --bar-bg:#000; --bar-ink:#f3f5f7; --bar-ink-2:#8d97a1; --shadow:none; color-scheme:dark;
}
/* ---------- Panel de salidas ---------- */
:root[data-look="salidas"]{
  --bg:#050505; --panel:#101010; --panel-2:#171717; --sunk:#000; --ink:#f4f2ea; --ink-2:#a9a69b; --ink-3:#8a877d; --line:#262626;
  --accent:#ffc800; --accent-ink:#141100; --accent-soft:#2e2600; --brake:#ff6a3d; --brake-soft:#361709;
  --ok:#8fdc5a; --ok-soft:#1b2c10; --warn:#ffc800; --warn-soft:#2e2600; --done:#8fdc5a;
  --track:#2c2c2c; --track-done:#ffc800; --kerb-a:#ff6a3d; --kerb-b:#f4f2ea;
  --font:"Archivo",system-ui,sans-serif; --display:"Martian Mono",ui-monospace,monospace;
  --head-case:uppercase; --head-track:.02em; --head-weight:600;
  --r:3px; --r-sm:2px; --pad-row:.6rem; --bar-bg:#000; --bar-ink:#f4f2ea; --bar-ink-2:#8a877d; --shadow:none; color-scheme:dark;
}
/* ---------- Estándar ---------- */
:root[data-look="estandar"]{
  --bg:#f6f6f7; --panel:#ffffff; --panel-2:#fafafa; --sunk:#efeff1; --ink:#18181b; --ink-2:#55555d; --ink-3:#71717a; --line:#e4e4e7;
  --accent:#0b7680; --accent-ink:#fff; --accent-soft:#e3f2f3; --brake:#c42b2b; --brake-soft:#fce8e8; --ok:#18794e; --ok-soft:#e3f4ea;
  --warn:#9a5b00; --warn-soft:#fdf0d9; --done:#18794e; --track:#d4d4d8; --track-done:#18181b; --kerb-a:#c42b2b; --kerb-b:#fff;
  --font:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif; --display:"Geist",system-ui,sans-serif;
  --head-case:none; --head-track:-.02em; --head-weight:600;
  --r:10px; --r-sm:6px; --pad-row:.65rem; --bar-bg:#ffffff; --bar-ink:#18181b; --bar-ink-2:#71717a;
  --shadow:0 1px 2px rgba(0,0,0,.04),0 4px 14px rgba(0,0,0,.05); color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root[data-look="estandar"]{
    --bg:#0c0c0e; --panel:#151518; --panel-2:#1a1a1e; --sunk:#09090b; --ink:#ececf0; --ink-2:#a1a1aa; --ink-3:#83838c; --line:#27272b;
    --accent:#35b8c3; --accent-ink:#051a1c; --accent-soft:#11313a; --brake:#f2706a; --brake-soft:#3a1716; --ok:#4cc38a; --ok-soft:#10301f;
    --warn:#e8a94a; --warn-soft:#33270f; --done:#4cc38a; --track:#3a3a40; --track-done:#ececf0; --kerb-b:#ececf0;
    --bar-bg:#0f0f12; --bar-ink:#ececf0; --bar-ink-2:#83838c; --shadow:none; color-scheme:dark;
  }
}

/* ---------- base ---------- */
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.5 var(--font);font-variant-numeric:tabular-nums;overflow-x:clip;min-height:100dvh}
::selection{background:var(--accent);color:var(--accent-ink)}
a{color:var(--accent);text-underline-offset:3px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
svg{width:1.15em;height:1.15em;flex:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;z-index:50;background:var(--accent);color:var(--accent-ink);padding:.5rem .8rem}
.skip:focus{left:8px;top:8px}
h1,h2,h3{font-family:var(--display);font-weight:var(--head-weight);text-transform:var(--head-case);letter-spacing:var(--head-track);line-height:1.05;margin:0;text-wrap:balance}
h1{font-size:2rem} h2{font-size:1.35rem} h3{font-size:1.05rem}
p{margin:0}
*{scrollbar-color:var(--line) transparent;scrollbar-width:thin}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- barra superior ---------- */
.bar{position:sticky;top:0;z-index:20;background:var(--bar-bg);color:var(--bar-ink);padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid color-mix(in srgb,var(--bar-ink) 10%,transparent)}
.bar-in{max-width:1320px;margin:0 auto;display:flex;align-items:center;gap:1.2rem;padding:.55rem max(16px,env(safe-area-inset-right,0px)) .55rem max(16px,env(safe-area-inset-left,0px))}
.brand{display:flex;align-items:center;gap:.6rem;color:inherit;text-decoration:none;min-width:0}
.brand-num{font:700 1.75rem/1 var(--display);color:var(--accent);letter-spacing:-.02em}
:root[data-look="trazada"] .brand-num,:root[data-look="crono"] .brand-num{color:#2fb9c4}
.brand-txt{display:flex;flex-direction:column;line-height:1.1}
.brand-txt b{font:var(--head-weight) .98rem/1.1 var(--display);text-transform:var(--head-case);letter-spacing:var(--head-track)}
.brand-txt small{font-size:.72rem;color:var(--bar-ink-2)}
.nav{display:flex;gap:.15rem;margin-left:auto}
.nav a{display:flex;align-items:center;gap:.4rem;color:var(--bar-ink-2);text-decoration:none;padding:.45rem .7rem;border-radius:var(--r-sm);font-weight:500;font-size:.92rem;transition:background .15s,color .15s}
.nav a:hover{color:var(--bar-ink);background:color-mix(in srgb,var(--bar-ink) 8%,transparent)}
.nav a[aria-current="page"]{color:var(--bar-ink);background:color-mix(in srgb,var(--bar-ink) 12%,transparent)}
:root[data-look="trazada"] .nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 #2fb9c4}
:root[data-look="crono"] .nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--accent);background:transparent}
:root[data-look="salidas"] .nav a[aria-current="page"]{background:var(--accent);color:var(--accent-ink)}
.bar-tools{display:flex;align-items:center;gap:.6rem}
.look select{background:transparent;border:1px solid color-mix(in srgb,var(--bar-ink) 22%,transparent);color:var(--bar-ink);border-radius:var(--r-sm);padding:.35rem .5rem;font-size:.85rem;max-width:11rem}
.look select option{color:#111;background:#fff}
.me{font-size:.78rem;color:var(--bar-ink-2);max-width:12rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sync{font-size:.78rem;color:var(--bar-ink-2);display:flex;align-items:center;gap:.3rem}
.sync.is-off{color:#ffb547}
@media (max-width:1080px){.me{display:none}}
@media (max-width:860px){
  .nav{position:fixed;left:0;right:0;bottom:0;z-index:20;margin:0;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;background:var(--bar-bg);padding:.35rem max(6px,env(safe-area-inset-right,0px)) calc(.35rem + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px));border-top:1px solid color-mix(in srgb,var(--bar-ink) 12%,transparent)}
  .nav a{flex-direction:column;gap:.15rem;font-size:.72rem;padding:.35rem .3rem;min-width:3.4rem}
  .nav a svg{width:1.35em;height:1.35em}
  .bar-tools{margin-left:auto}
  body{padding-bottom:calc(4.2rem + env(safe-area-inset-bottom,0px))}
}

/* Estándar: barra lateral en escritorio */
@media (min-width:1080px){
  :root[data-look="estandar"] body{display:grid;grid-template-columns:240px minmax(0,1fr)}
  :root[data-look="estandar"] .bar{grid-row:1/3;height:100dvh;position:sticky;top:0;border-bottom:0;border-right:1px solid var(--line)}
  :root[data-look="estandar"] .bar-in{flex-direction:column;align-items:stretch;height:100%;padding:1.2rem .9rem}
  :root[data-look="estandar"] .nav{flex-direction:column;margin:1.2rem 0 0}
  :root[data-look="estandar"] .nav a{padding:.55rem .7rem}
  :root[data-look="estandar"] .bar-tools{margin-top:auto;flex-direction:column;align-items:stretch}
  :root[data-look="estandar"] .me{display:block}
  :root[data-look="estandar"] .look select{max-width:none;width:100%;color:var(--ink);border-color:var(--line)}
}

/* ---------- página ---------- */
main{max-width:1320px;margin:0 auto;padding:1.4rem max(16px,env(safe-area-inset-right,0px)) 3rem max(16px,env(safe-area-inset-left,0px));outline:0}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.1rem}
.page-head p{color:var(--ink-2);margin-top:.35rem;max-width:62ch}
.toolbar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.stack{display:flex;flex-direction:column;gap:1.4rem}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.muted{color:var(--ink-2)}
.empty{padding:1.4rem;color:var(--ink-2);text-align:center;border:1px dashed var(--line);border-radius:var(--r);background:var(--panel-2)}
.empty b{display:block;color:var(--ink);margin-bottom:.2rem}

/* ---------- botones y campos ---------- */
.btn{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:var(--r-sm);padding:.48rem .8rem;font-weight:500;font-size:.9rem;cursor:pointer;transition:background .15s,border-color .15s}
.btn:hover{border-color:var(--ink-3)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{filter:brightness(1.07)}
.btn.ghost{background:transparent;border-color:transparent}
.btn.ghost:hover{background:var(--panel-2)}
.btn.danger{color:var(--brake)}
.btn.icon{padding:.45rem}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:var(--panel)}
.seg button{border:0;background:transparent;padding:.42rem .75rem;font-size:.86rem;font-weight:500;cursor:pointer;color:var(--ink-2)}
.seg button+button{border-left:1px solid var(--line)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--panel)}
:root[data-look="salidas"] .seg button[aria-pressed="true"],:root[data-look="crono"] .seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.field{display:flex;flex-direction:column;gap:.3rem}
.field>span{font-size:.75rem;font-weight:600;color:var(--ink-2);text-transform:uppercase;letter-spacing:.05em}
.input,.select,textarea.input{width:100%;border:1px solid var(--line);background:var(--panel);border-radius:var(--r-sm);padding:.5rem .6rem;font-size:.93rem;min-height:2.4rem}
.input:hover,.select:hover{border-color:var(--ink-3)}
.input::placeholder{color:var(--ink-3)}
textarea.input{min-height:5.5rem;resize:vertical;line-height:1.45}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
@media (max-width:520px){.grid2{grid-template-columns:minmax(0,1fr)}}

/* ---------- etiquetas ---------- */
.chip{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:500;color:var(--ink-2);white-space:nowrap}
.avatar{display:inline-grid;place-items:center;width:1.55rem;height:1.55rem;border-radius:50%;font:600 .68rem/1 var(--font);color:#fff;flex:none}
:root[data-look="crono"] .avatar,:root[data-look="salidas"] .avatar{border-radius:2px}
.av-adrian{background:#0a7882}.av-judith{background:#8a4fd6}.av-javier{background:#37474f}.av-box{background:#b06a00}
.tag{display:inline-flex;align-items:center;font-size:.72rem;font-weight:600;padding:.12rem .45rem;border-radius:999px;background:var(--panel-2);color:var(--ink-2);border:1px solid var(--line);white-space:nowrap}
:root[data-look="crono"] .tag,:root[data-look="salidas"] .tag{border-radius:2px;text-transform:uppercase;letter-spacing:.04em}
.tag.sponsor{background:var(--warn-soft);color:var(--warn);border-color:transparent}
.tag.conf{background:var(--brake-soft);color:var(--brake);border-color:transparent}
.state{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:.14rem .5rem;border-radius:999px;white-space:nowrap}
.st-pendiente{background:var(--panel-2);color:var(--ink-2);border:1px solid var(--line)}
.st-en-curso{background:var(--warn-soft);color:var(--warn)}
.st-hecho{background:var(--ok-soft);color:var(--done)}
.st-bloqueado,.st-vencida{background:var(--brake-soft);color:var(--brake)}

/* ---------- La trazada: tira de temporada ---------- */
.lap{padding:1rem 1.1rem .7rem;overflow:hidden}
.lap-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.4rem}
.lap-head h2{font-size:1.15rem}
.lap-meter{display:flex;align-items:center;gap:.7rem;font-size:.85rem;color:var(--ink-2)}
.lap-meter b{font:700 1.35rem/1 var(--display);color:var(--ink)}
.lap-scroll{overflow-x:auto;margin:0 -1.1rem;padding:0 1.1rem;scroll-snap-type:x proximity}
.lap svg.track{width:100%;min-width:900px;height:auto;display:block}
.track .line{fill:none;stroke:var(--track);stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
.track .line-done{fill:none;stroke:var(--track-done);stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
.track .kerb{fill:none;stroke:var(--kerb-a);stroke-width:7;stroke-dasharray:6 6;stroke-linecap:butt}
.track .kerb-b{fill:none;stroke:var(--kerb-b);stroke-width:7;stroke-dasharray:6 6;stroke-dashoffset:6}
.track .turn{cursor:pointer}
.track .turn circle{fill:var(--panel);stroke:var(--track);stroke-width:2.5;transition:r .15s}
.track .turn.past circle{fill:var(--track-done);stroke:var(--track-done)}
.track .turn.home circle{stroke:var(--warn)}
.track .turn.duda circle{stroke-dasharray:3 3}
.track .turn.sel circle{stroke:var(--accent);stroke-width:4}
.track .turn.now circle{fill:var(--accent);stroke:var(--accent)}
.track .turn text{font:700 11px var(--display);fill:var(--ink-2);text-anchor:middle}
.track .turn.past text.tn{fill:var(--ink-3)}
.track .turn .gp{font:600 10.5px var(--font);fill:var(--ink-3);text-transform:uppercase;letter-spacing:.02em}
.track .turn.now .gp,.track .turn.sel .gp{fill:var(--ink);font-weight:700}
.track .turn:hover circle{stroke:var(--accent)}
.track .here{font:700 11px var(--font);fill:var(--accent);text-anchor:middle;letter-spacing:.04em}
.track .turn:focus-visible{outline:none}
.track .turn:focus-visible circle{stroke:var(--accent);stroke-width:4}
:root[data-look="crono"] .track .line,:root[data-look="salidas"] .track .line{stroke-width:4}
:root[data-look="crono"] .track .line-done,:root[data-look="salidas"] .track .line-done{stroke-width:4}
:root[data-look="estandar"] .track .kerb,:root[data-look="estandar"] .track .kerb-b{display:none}

/* ---------- sector y tareas ---------- */
.sector{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:end;margin:1.4rem 0 .8rem}
.sector h1{font-size:2.1rem}
.sector .when{color:var(--ink-2);margin-top:.3rem;display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
@media (max-width:640px){.sector{grid-template-columns:minmax(0,1fr)}.sector h1{font-size:1.7rem}}
.prog{display:flex;align-items:center;gap:.55rem;min-width:0}
.prog-bar{flex:1;height:6px;border-radius:99px;background:var(--sunk);overflow:hidden;min-width:3.5rem}
.prog-bar i{display:block;height:100%;background:var(--accent);border-radius:inherit}
.prog-bar.full i{background:var(--done)}
.prog small{font-size:.75rem;color:var(--ink-2);min-width:2.6rem;text-align:right}
:root[data-look="crono"] .prog-bar,:root[data-look="salidas"] .prog-bar{border-radius:0;height:5px}
.big-prog{width:min(320px,100%)}
.big-prog .prog-bar{height:10px}

.filters{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-bottom:.8rem}
.who-filter{display:flex;gap:.3rem;flex-wrap:wrap}
.who-filter button{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:.25rem .65rem .25rem .3rem;font-size:.84rem;cursor:pointer;color:var(--ink-2)}
.who-filter button.all{padding:.25rem .7rem}
.who-filter button[aria-pressed="true"]{border-color:var(--ink);color:var(--ink);background:var(--panel-2);font-weight:600}
:root[data-look="crono"] .who-filter button,:root[data-look="salidas"] .who-filter button{border-radius:2px}

.tasks{list-style:none;margin:0;padding:0}
.task{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.2rem .8rem;align-items:center;padding:var(--pad-row) 1rem;border-bottom:1px solid var(--line);background:var(--panel);position:relative}
.task:first-child{border-top-left-radius:var(--r);border-top-right-radius:var(--r)}
.task:last-child{border-bottom:0;border-bottom-left-radius:var(--r);border-bottom-right-radius:var(--r)}
.task:hover{background:var(--panel-2)}
.task.late::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:repeating-linear-gradient(180deg,var(--kerb-a) 0 6px,var(--kerb-b) 6px 12px)}
.task.is-done .t-title{color:var(--ink-3);text-decoration:line-through;text-decoration-color:var(--ink-3)}
.t-main{min-width:0;cursor:pointer;display:flex;flex-direction:column;gap:.2rem;padding:.1rem 0}
.t-title{font-weight:600;font-size:.97rem;line-height:1.3}
.t-meta{display:flex;gap:.45rem;align-items:center;flex-wrap:wrap;font-size:.8rem;color:var(--ink-2)}
.t-side{display:grid;grid-template-columns:7.5rem 4.6rem 6.2rem;gap:.8rem;align-items:center;justify-items:start}
.t-date{font-size:.84rem;color:var(--ink-2);white-space:nowrap}
.t-date.late{color:var(--brake);font-weight:600}
@media (max-width:760px){
  .task{grid-template-columns:auto minmax(0,1fr);padding:.75rem .85rem}
  .t-side{grid-column:2;grid-template-columns:auto auto minmax(4rem,1fr);gap:.6rem}
}
.check{appearance:none;width:1.45rem;height:1.45rem;border:2px solid var(--ink-3);border-radius:5px;background:var(--panel);cursor:pointer;display:grid;place-items:center;transition:background .15s,border-color .15s;margin:0;flex:none}
.check::after{content:"";width:.75rem;height:.4rem;border-left:2.5px solid var(--accent-ink);border-bottom:2.5px solid var(--accent-ink);transform:rotate(-45deg) translate(1px,-1px) scale(0);transition:transform .15s cubic-bezier(.2,.8,.2,1)}
.check:checked{background:var(--accent);border-color:var(--accent)}
.check:checked::after{transform:rotate(-45deg) translate(1px,-1px) scale(1)}
.check:hover{border-color:var(--accent)}
:root[data-look="crono"] .check,:root[data-look="salidas"] .check{border-radius:1px}
.check.sm{width:1.2rem;height:1.2rem}
.check.sm::after{width:.6rem;height:.32rem}

.quick{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto auto;gap:.5rem;margin-top:.7rem;padding:.6rem;background:var(--panel-2);border:1px dashed var(--line);border-radius:var(--r)}
@media (max-width:760px){.quick{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.quick .input{grid-column:1/-1}}

.group-h{display:flex;align-items:baseline;gap:.6rem;margin:1.3rem 0 .5rem;flex-wrap:wrap}
.group-h h3{color:var(--ink-2)}
.group-h .gp{font:var(--head-weight) .95rem var(--display);color:var(--accent);text-transform:var(--head-case)}
.list-panel{border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);background:var(--panel)}

/* ---------- proyectos ---------- */
.projects{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:.9rem}
.project{padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.7rem;cursor:pointer;text-align:left;border:1px solid var(--line);background:var(--panel);border-radius:var(--r);box-shadow:var(--shadow);transition:border-color .15s,transform .15s}
.project:hover{border-color:var(--accent)}
.project h2{font-size:1.25rem}
.project p{color:var(--ink-2);font-size:.9rem}
.project .p-foot{display:flex;justify-content:space-between;gap:.6rem;align-items:center;font-size:.82rem;color:var(--ink-2);flex-wrap:wrap}
.crumbs{display:flex;align-items:center;gap:.3rem;font-size:.88rem;margin-bottom:.4rem}
.crumbs a{text-decoration:none}

/* ---------- pipeline ---------- */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(205px,1fr);gap:.8rem;overflow-x:auto;padding-bottom:.6rem;scroll-snap-type:x proximity}
.col{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;min-height:16rem;scroll-snap-align:start}
.col-h{display:flex;justify-content:space-between;align-items:baseline;padding:.75rem .85rem .5rem;gap:.5rem}
.col-h h3{font-size:.95rem}
.col-h small{color:var(--ink-3);font-size:.78rem}
.col.won .col-h h3{color:var(--done)} .col.lost .col-h h3{color:var(--ink-3)}
.col-body{display:flex;flex-direction:column;gap:.5rem;padding:0 .55rem .7rem;flex:1}
.col.drop{outline:2px dashed var(--accent);outline-offset:-4px}
.opp{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:.7rem .75rem;display:flex;flex-direction:column;gap:.35rem;cursor:grab;box-shadow:var(--shadow);text-align:left}
.opp:hover{border-color:var(--ink-3)}
.opp.dragging{opacity:.5}
.opp b{font-size:.95rem;line-height:1.25}
.opp .next{font-size:.8rem;color:var(--ink-2)}
.opp .next.late{color:var(--brake);font-weight:600}
.opp .row{display:flex;justify-content:space-between;align-items:center;gap:.4rem}
.col-add{margin:0 .55rem .6rem;justify-content:center;border-style:dashed;background:transparent;color:var(--ink-2)}
.summary{display:flex;gap:1.6rem;flex-wrap:wrap;margin-bottom:1rem}
.summary div{display:flex;flex-direction:column}
.summary b{font:700 1.6rem/1 var(--display)}
.summary span{font-size:.78rem;color:var(--ink-2)}

/* ---------- tablas ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);box-shadow:var(--shadow)}
table{border-collapse:collapse;width:100%;min-width:640px}
th,td{text-align:left;padding:.65rem .9rem;border-bottom:1px solid var(--line);font-size:.9rem;vertical-align:top}
th{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);font-weight:600;background:var(--panel-2)}
tr:last-child td{border-bottom:0}
tbody tr{cursor:pointer}
tbody tr:hover td{background:var(--panel-2)}

/* ---------- calendario ---------- */
.rounds{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr));gap:.6rem}
.round{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:.8rem .9rem;display:flex;flex-direction:column;gap:.2rem}
.round .rn{display:flex;justify-content:space-between;font-size:.75rem;color:var(--ink-3);font-weight:600}
.round b{font:var(--head-weight) 1.25rem/1.05 var(--display);text-transform:var(--head-case)}
.round .where{font-size:.85rem;color:var(--ink-2)}
.round .dates{font-size:.85rem}
.round .note{font-size:.8rem;color:var(--ink-2);border-top:1px solid var(--line);padding-top:.35rem;margin-top:.25rem}
.round.past{opacity:.55}
.round.now{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.milestones{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));gap:.6rem}
.ms{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:.75rem .9rem}
.ms small{color:var(--ink-3);font-size:.78rem}
.ms b{display:block;margin:.15rem 0}

/* ---------- marca ---------- */
.links{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr));gap:.6rem}
.link{display:flex;justify-content:space-between;align-items:center;gap:.8rem;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:.85rem 1rem;text-decoration:none;color:var(--ink)}
.link:hover{border-color:var(--accent)}
.link small{display:block;color:var(--ink-3);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}
.link b{font-weight:600}
.link svg{color:var(--ink-3)}
.metrics{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:.6rem}
.metric{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:.8rem 1rem}
.metric b{display:block;font:700 1.7rem/1.1 var(--display)}
.metric span{font-size:.8rem;color:var(--ink-2)}

/* ---------- panel lateral (detalle) ---------- */
.scrim{position:fixed;inset:0;background:rgba(5,8,10,.45);z-index:30;animation:fade .15s ease-out}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(520px,100vw);z-index:31;background:var(--panel);border-left:1px solid var(--line);box-shadow:-12px 0 40px rgba(0,0,0,.18);display:flex;flex-direction:column;animation:slide .22s cubic-bezier(.2,.8,.2,1);padding-top:env(safe-area-inset-top,0px)}
.drawer-h{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid var(--line)}
.drawer-h h2{font-size:1.2rem}
.drawer-b{flex:1;overflow-y:auto;padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:1rem}
.drawer-f{display:flex;justify-content:space-between;gap:.6rem;padding:.8rem 1.2rem calc(.8rem + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:var(--panel-2)}
.cl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.15rem}
.cl li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.6rem;align-items:center;padding:.35rem .2rem;border-radius:var(--r-sm)}
.cl li:hover{background:var(--panel-2)}
.cl li.done span{color:var(--ink-3);text-decoration:line-through}
.cl-add{display:flex;gap:.5rem}
.meta-line{font-size:.78rem;color:var(--ink-3)}
@keyframes slide{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@media (max-width:640px){.drawer{width:100vw;border-left:0}}

/* ---------- panel de salidas: letras que giran ---------- */
:root[data-look="salidas"] .sector h1,:root[data-look="salidas"] .page-head h1{display:inline-flex;flex-wrap:wrap;gap:3px}
:root[data-look="salidas"] .flap{display:inline-block;background:#1c1c1c;color:var(--ink);padding:.08em .14em;border-radius:2px;box-shadow:inset 0 -1px 0 #000,inset 0 1px 0 #2a2a2a;position:relative;line-height:1.1;min-width:.8em;text-align:center}
:root[data-look="salidas"] .flap::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#000}
:root[data-look="salidas"] .flap.sp{background:transparent;box-shadow:none;min-width:.35em}
:root[data-look="salidas"] .flip .flap{animation:flip .38s cubic-bezier(.3,.7,.3,1) both;animation-delay:calc(var(--i)*18ms)}
@keyframes flip{0%{transform:rotateX(90deg);opacity:.2}60%{transform:rotateX(-12deg);opacity:1}100%{transform:none}}
:root[data-look="salidas"] .task{border-bottom-color:#1f1f1f}
:root[data-look="salidas"] .t-title{text-transform:uppercase;letter-spacing:.03em;font-weight:600;font-size:.92rem}
:root[data-look="salidas"] .t-date{font-family:var(--display);font-size:.78rem;color:var(--accent)}

/* ---------- torre de cronometraje ---------- */
:root[data-look="crono"] .task{border-bottom-color:#1b2026}
:root[data-look="crono"] .task:nth-child(even){background:#0c1014}
:root[data-look="crono"] .task:hover{background:#161b21}
:root[data-look="crono"] .t-title{text-transform:uppercase;letter-spacing:.03em;font-size:.9rem}
:root[data-look="crono"] .t-date{font-weight:600;color:var(--ink)}
:root[data-look="crono"] .panel,:root[data-look="crono"] .list-panel{border-color:#1f262d}

/* ---------- esqueleto de carga ---------- */
.skel{background:linear-gradient(90deg,var(--panel-2),var(--sunk),var(--panel-2));background-size:200% 100%;animation:sk 1.2s linear infinite;border-radius:var(--r-sm);height:1rem}
@keyframes sk{to{background-position:-200% 0}}
.toast{position:fixed;left:50%;bottom:calc(5rem + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--panel);padding:.55rem .9rem;border-radius:var(--r-sm);font-size:.88rem;z-index:40;animation:fade .15s ease-out}
@media (min-width:861px){.toast{bottom:1.4rem}}

/* ---------- contenido ---------- */
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;text-align:center;padding:1.6rem 1rem;border:2px dashed var(--line);border-radius:var(--r);background:var(--panel);cursor:pointer;transition:border-color .15s,background .15s}
.drop:hover,.drop.over{border-color:var(--accent);background:var(--accent-soft)}
.drop svg{width:2rem;height:2rem;color:var(--accent)}
.drop b{font-size:1.05rem}
.drop small{color:var(--ink-2)}
.drop input{position:absolute;width:1px;height:1px;opacity:0}
.up-opts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:.6rem;margin-top:.7rem}
@media (max-width:640px){.up-opts{grid-template-columns:minmax(0,1fr)}}
.uploads{list-style:none;margin:.7rem 0 0;padding:0;display:flex;flex-direction:column;gap:.35rem}
.uploads li{display:grid;grid-template-columns:minmax(0,1fr) 8rem auto;gap:.7rem;align-items:center;font-size:.85rem;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:.45rem .7rem}
.uploads li span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uploads li.err{color:var(--brake)}
.media{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(160px,45%),1fr));gap:.7rem}
.m-card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;cursor:pointer;text-align:left;padding:0;box-shadow:var(--shadow)}
.m-card:hover{border-color:var(--accent)}
.m-thumb{aspect-ratio:4/5;background:var(--sunk);position:relative;display:grid;place-items:center;overflow:hidden}
.m-thumb img,.m-thumb video{width:100%;height:100%;object-fit:cover;display:block}
.m-thumb .play{position:absolute;inset:auto auto .5rem .5rem;background:rgba(0,0,0,.6);color:#fff;border-radius:999px;padding:.25rem .5rem;font-size:.72rem;display:flex;align-items:center;gap:.25rem}
.m-thumb .play svg{width:.8rem;height:.8rem}
.m-body{padding:.6rem .7rem;display:flex;flex-direction:column;gap:.3rem}
.m-body b{font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-body small{color:var(--ink-2);font-size:.76rem}
.st-nuevo{background:var(--accent-soft);color:var(--accent)}
.st-en-edicion{background:var(--warn-soft);color:var(--warn)}
.st-listo{background:var(--ok-soft);color:var(--done)}
.st-publicado{background:var(--panel-2);color:var(--ink-3);border:1px solid var(--line)}
.preview{border-radius:var(--r-sm);overflow:hidden;background:var(--sunk);display:grid;place-items:center;max-height:52vh}
.preview img,.preview video{max-width:100%;max-height:52vh;display:block}

/* ---------- noticias ---------- */
.news{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.news li{border-bottom:1px solid var(--line)}
.news li:last-child{border-bottom:0}
.news a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.9rem;align-items:start;padding:.8rem 1rem;color:var(--ink);text-decoration:none}
.news a:hover{background:var(--panel-2)}
.news img{width:96px;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-sm);background:var(--sunk)}
.news b{display:block;font-size:.97rem;line-height:1.3}
.news p{color:var(--ink-2);font-size:.85rem;margin-top:.2rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news .when{font-size:.78rem;color:var(--ink-3);white-space:nowrap}
.lvl{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:.12rem .45rem;border-radius:999px;margin-right:.4rem;vertical-align:1px}
.lvl-3{background:var(--accent);color:var(--accent-ink)}
.lvl-2{background:var(--warn-soft);color:var(--warn)}
.lvl-1{background:var(--panel-2);color:var(--ink-2);border:1px solid var(--line)}
@media (max-width:640px){.news a{grid-template-columns:minmax(0,1fr)}.news img{width:100%}}

@media (max-width:640px){.seg{max-width:100%;overflow-x:auto;scrollbar-width:none}.seg button{white-space:nowrap}.page-head .toolbar{width:100%}}

/* ---------- acceso ---------- */
.login{max-width:440px;margin:8vh auto;padding:2rem 1.6rem;display:flex;flex-direction:column;gap:1rem;text-align:center;align-items:center}
.login .brand-num{font-size:3.4rem}
.login-who{display:flex;flex-direction:column;gap:.5rem;width:100%}
.login-who .btn{justify-content:flex-start;padding:.7rem .9rem;font-size:1rem}
.login-code{display:flex;gap:.5rem;width:100%}
.login-code .input{font-size:1.4rem;letter-spacing:.3em;text-align:center}
.login-msg{color:var(--brake);font-weight:500}
.linkish{background:none;border:0;padding:0;color:inherit;text-decoration:underline;cursor:pointer;font:inherit}