/* Tribe: sistema visual (fase 3b, RV-01). Variables de color para tema claro y oscuro. */
:root{
  --bg:#f3f5fa;--bg-a:#edf1fb;--bg-b:#f5f4f7;--bg-c:#f8f2ee;
  --panel:rgba(255,255,255,.55);--panel-line:rgba(255,255,255,.9);
  --card:#fff;--ink:#1d2433;--muted:#5f6779;--faint:#687083;--line:#e5e8f0;--line-soft:#edf0f5;--field:#f7f8fb;
  --accent:#3d6fe6;--accent-ink:#2c5bd0;--accent-soft:#eaf0fd;--onaccent:#fff;
  --navy:#1e3a9e;--teal:#4fbfb6;--lavender:#93aef5;--sky:#5ab4e5;--track:#edf0f6;
  --ok:#1b7a43;--warn:#8a5a00;--danger:#b3261e;--okbg:#e7f5ec;--warnbg:#fdf3e1;--dangerbg:#fbe9e7;
  --shadow:0 1px 2px rgba(22,34,70,.04),0 10px 28px rgba(22,34,70,.05);
  --r-panel:28px;--r-card:20px;--r-ctl:12px;
  --land-a:#ffe1d3;--land-b:#e4defe;--land-c:#d4f1ec;--land-d:#dceaff;--land-ink:#1b1f3b;--shot-shadow:0 2px 6px rgba(22,34,70,.06),0 30px 60px -18px rgba(22,34,70,.28);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0f1320;--bg-a:#10162a;--bg-b:#121725;--bg-c:#171621;
  --panel:rgba(255,255,255,.03);--panel-line:rgba(255,255,255,.06);
  --card:#182033;--ink:#e8ecf5;--muted:#a7b0c4;--faint:#8590a8;--line:#2a3349;--line-soft:#222b40;--field:#121a2b;
  --accent:#7ea2ff;--accent-ink:#9db8ff;--accent-soft:#1f2b4d;--onaccent:#0f1320;
  --navy:#5876e0;--teal:#5fd0c6;--lavender:#a9bdf8;--sky:#6cc3f0;--track:#253049;
  --ok:#7bd69a;--warn:#f0c26b;--danger:#ff8a80;--okbg:#15301f;--warnbg:#33290f;--dangerbg:#3a1a17;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 28px rgba(0,0,0,.25);
  --land-a:#3a2420;--land-b:#2a2547;--land-c:#173532;--land-d:#1b2a47;--land-ink:#0b0e18;--shot-shadow:0 2px 6px rgba(0,0,0,.4),0 30px 60px -18px rgba(0,0,0,.7);
}}
:root[data-theme="dark"]{
  --bg:#0f1320;--bg-a:#10162a;--bg-b:#121725;--bg-c:#171621;
  --panel:rgba(255,255,255,.03);--panel-line:rgba(255,255,255,.06);
  --card:#182033;--ink:#e8ecf5;--muted:#a7b0c4;--faint:#8590a8;--line:#2a3349;--line-soft:#222b40;--field:#121a2b;
  --accent:#7ea2ff;--accent-ink:#9db8ff;--accent-soft:#1f2b4d;--onaccent:#0f1320;
  --navy:#5876e0;--teal:#5fd0c6;--lavender:#a9bdf8;--sky:#6cc3f0;--track:#253049;
  --ok:#7bd69a;--warn:#f0c26b;--danger:#ff8a80;--okbg:#15301f;--warnbg:#33290f;--dangerbg:#3a1a17;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 28px rgba(0,0,0,.25);
  --land-a:#3a2420;--land-b:#2a2547;--land-c:#173532;--land-d:#1b2a47;--land-ink:#0b0e18;--shot-shadow:0 2px 6px rgba(0,0,0,.4),0 30px 60px -18px rgba(0,0,0,.7);
}

/* Base */
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;min-height:100vh;font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--ink);background:var(--bg);background-image:linear-gradient(135deg,var(--bg-a) 0%,var(--bg-b) 55%,var(--bg-c) 100%);
  -webkit-font-smoothing:antialiased}
a{color:var(--accent-ink);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:26px;line-height:1.25;font-weight:600;letter-spacing:-.01em;margin:0}
h2{font-size:19px;line-height:1.3;font-weight:500;margin:0 0 16px}
h3{font-size:16px;font-weight:600;margin:0 0 8px}
p{margin:0 0 12px}
code{font:14px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--field);border-radius:6px;padding:2px 6px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.muted{color:var(--muted)}
.faint{color:var(--faint)}
.empty{color:var(--faint)}
.danger-text{color:var(--danger)}

/* Barra superior */
.topbar{position:sticky;top:0;z-index:5;background:var(--card);border-bottom:1px solid var(--line)}
@supports ((backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px))){.topbar{background:color-mix(in srgb,var(--card) 80%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}}
.topbar-in{max-width:1240px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:19px;letter-spacing:-.01em;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand-img{display:block;flex:none;object-fit:contain}
.brand .mark{width:32px;height:32px;border-radius:10px;background:var(--accent);color:var(--onaccent);display:inline-flex;align-items:center;justify-content:center}
.menu{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.menu form{margin:0}
.menu a,.menu button.link{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;color:var(--muted);font-weight:500;font-size:15px;text-decoration:none}
.menu a:hover,.menu button.link:hover{background:var(--accent-soft);color:var(--accent-ink);text-decoration:none}
.menu a[aria-current="page"]{background:var(--accent-soft);color:var(--accent-ink)}

/* Contenedores */
.shell{max-width:1240px;margin:0 auto;padding:28px 24px 48px}
.panel{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--r-panel);padding:28px;box-shadow:var(--shadow)}
.card,.plan{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r-card);padding:28px;box-shadow:var(--shadow);margin:0 0 20px}
.panel > .card:last-child{margin-bottom:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px;margin:0 0 20px}
.grid > .card{margin:0}
.grid.stats{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.settings-grid{display:block;columns:2 420px;column-gap:20px}
.settings-grid > .card{break-inside:avoid;margin:0 0 20px;display:inline-block;width:100%}
.stack{display:flex;flex-direction:column;gap:20px}

/* Encabezado de página */
.page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 24px}
.page-title{display:flex;align-items:center;gap:14px;min-width:0}
.page-title p{margin:4px 0 0}
.icon-chip{flex:none;width:44px;height:44px;border-radius:14px;background:var(--accent-soft);color:var(--accent);display:inline-flex;align-items:center;justify-content:center}
.icon{flex:none;vertical-align:middle}
.head-actions{display:flex;gap:10px;flex-wrap:wrap}

/* Cifras (stat) */
.stat{display:flex;flex-direction:column;gap:6px;min-height:150px}
.stat-label{color:var(--ink);font-size:17px;font-weight:500}
.stat-value{overflow-wrap:break-word;hyphens:auto;font-size:46px;line-height:1.05;font-weight:700;letter-spacing:-.02em;margin:14px 0 6px}
.stat-value small{font-size:20px;font-weight:500;color:var(--faint);letter-spacing:0}
.stat-value.text{font-size:30px;letter-spacing:-.01em}
.stat-note{color:var(--faint);font-size:15px}

/* Progreso, leyenda y chips */
.progress{display:block;width:100%;height:12px}
.progress .track{fill:var(--track)}
.progress .fill{fill:var(--accent)}
.legend{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-direction:column;gap:12px}
.legend li{display:flex;gap:10px;align-items:center;color:var(--ink)}
.dot{flex:none}
.c-accent{fill:var(--accent)}.c-navy{fill:var(--navy)}.c-teal{fill:var(--teal)}.c-lavender{fill:var(--lavender)}.c-sky{fill:var(--sky)}
.chip{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 12px;font-size:13px;font-weight:600;background:var(--accent-soft);color:var(--accent-ink)}
.chip.ok{background:var(--okbg);color:var(--ok)}
.chip.warn{background:var(--warnbg);color:var(--warn)}
.chip.muted{background:var(--track);color:var(--muted)}

/* Listas de proyectos */
.cards{list-style:none;padding:0;margin:0 0 20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:20px}
.cards .card{margin:0;display:flex;flex-direction:column;gap:6px;transition:transform .15s ease,box-shadow .15s ease}
.cards .card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(22,34,70,.05),0 16px 36px rgba(22,34,70,.08)}
.cards .card a{color:var(--ink);font-size:18px;font-weight:600}
.cards .archived{opacity:.75}
.section-title{font-size:17px;font-weight:600;color:var(--muted);margin:28px 0 14px}

/* Formularios */
.form{display:flex;flex-direction:column;gap:18px;margin:0}
.form label{display:flex;flex-direction:column;gap:6px;font-weight:500;font-size:15px}
.form small{color:var(--faint);font-weight:400;font-size:14px}
.form .check,label.check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400}
.form > button{align-self:flex-start}
fieldset{border:1px solid var(--line);border-radius:var(--r-ctl);padding:12px 16px;margin:0;display:flex;flex-direction:column;gap:8px}
legend{font-weight:500;font-size:15px;padding:0 6px}
input,select{font:inherit;color:var(--ink);background:var(--field);border:1px solid var(--line);border-radius:var(--r-ctl);padding:11px 14px;max-width:100%;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
input[type="color"]{padding:3px;width:48px;height:44px}
input[type="checkbox"]{margin-top:5px;accent-color:var(--accent);width:16px;height:16px}
input[type="file"]{padding:9px}
button,.button{font:inherit;font-weight:500;font-size:15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:var(--r-ctl);padding:10px 18px;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s}
button:hover,.button:hover{border-color:var(--accent);text-decoration:none}
button.primary,.button.primary{background:var(--accent);border-color:var(--accent);color:var(--onaccent)}
button.primary:hover,.button.primary:hover{filter:brightness(1.07)}
button.danger{border-color:var(--danger);color:var(--danger);background:transparent}
button.link{border:0;background:none;padding:0;color:var(--accent-ink);font-weight:500}
.inline{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0}

/* Avisos */
.notice{border-radius:var(--r-ctl);padding:12px 16px;margin:0 0 20px}
.notice p:last-child{margin:0}
.notice ul{margin:0;padding-left:18px}
.notice.ok{background:var(--okbg);color:var(--ok)}
.notice.warn{background:var(--warnbg);color:var(--warn)}
.notice.error{background:var(--dangerbg);color:var(--danger)}
.notice h2{color:inherit}

/* Listas varias */
.assignees,.history,.sessions{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-direction:column}
.assignees li,.sessions li,.history li{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid var(--line)}
.assignees li:last-child,.sessions li:last-child,.history li:last-child{border-bottom:0}
.history time{color:var(--faint);font-size:14px;min-width:130px;font-variant-numeric:tabular-nums}
.codes{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.swatch{flex:none;vertical-align:middle}
.logo{max-height:56px;max-width:160px;object-fit:contain;background:#fff;border-radius:12px;padding:4px}
.qr{background:#fff;padding:10px;border-radius:14px;margin:8px 0 16px}
.secret{word-break:break-all}
.actions{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
details{align-self:stretch;border-top:1px solid var(--line);padding-top:4px;margin-top:8px}
details summary{cursor:pointer;padding:10px 0;font-weight:500}
details[open] summary{margin-bottom:8px}
details .form{padding-bottom:12px}
ol{padding-left:20px}
ol li{margin-bottom:6px}

/* Idiomas */
/* Selector de idioma: un solo botón con globo y lista desplegable (Fase 5b-2). */
.lang-menu{position:relative;display:inline-block}
.lang-menu summary{list-style:none;display:inline-flex;align-items:center;gap:6px;cursor:pointer;border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:999px;padding:6px 12px;font-size:14px;font-weight:500;user-select:none}
.lang-menu summary::-webkit-details-marker{display:none}
.lang-menu summary:hover,.lang-menu[open] summary{border-color:var(--accent);color:var(--ink)}
.lang-menu summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.lang-menu[open] summary .icon:last-child{transform:rotate(180deg)}
.lang-list{position:absolute;right:0;top:calc(100% + 6px);z-index:50;min-width:190px;max-height:min(480px,75vh);overflow:auto;margin:0;padding:6px;list-style:none;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 32px rgba(15,23,42,.18)}
.lang-list li{margin:0}
.lang-list form{margin:0}
.lang-list a,.lang-list button{display:block;width:100%;text-align:left;border:0;background:none;color:var(--ink);font:inherit;font-size:14px;padding:8px 12px;border-radius:8px;cursor:pointer}
.lang-list a:hover,.lang-list button:hover{background:var(--accent-soft);text-decoration:none}
.lang-list [aria-current="true"]{color:var(--accent-ink);font-weight:600;background:var(--accent-soft)}

/* Pantallas de invitado */
.guest{max-width:480px;margin:0 auto;padding:40px 20px 48px}
.guest-head{display:flex;flex-direction:column;align-items:center;gap:18px;margin-bottom:24px}
.guest .card{padding:32px}
.guest h1{margin-bottom:20px}
.guest .after{text-align:center;margin:16px 0 0}
.guest .form > button.primary{align-self:stretch;padding:12px 18px}

/* Portada */
.landing{max-width:1100px;margin:0 auto;padding:20px 24px 48px}
.landing .top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.hero{padding:56px 40px;text-align:center}
.hero h1{font-size:40px;line-height:1.15;letter-spacing:-.02em;max-width:760px;margin:0 auto 16px}
.hero .lead{color:var(--muted);font-size:18px;max-width:620px;margin:0 auto 32px}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px;max-width:720px;margin:0 auto;text-align:left}
.plan{margin:0}
.plan h2{margin:0 0 6px}
.cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap;justify-content:center}
footer{margin-top:32px;color:var(--faint);font-size:14px;text-align:center}

/* Móvil */
@media (max-width:640px){
  .topbar-in{padding:10px 16px}
  .shell{padding:16px 16px 32px}
  .panel{padding:16px;border-radius:22px}
  .card,.plan{padding:20px;border-radius:18px}
  .grid,.cards{gap:14px}
  .grid.stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.stats > .stat:first-child{grid-column:1/-1}
  .menu{width:100%;gap:0;justify-content:space-between}
  .menu a,.menu button.link{padding:8px 8px;font-size:14px;gap:6px}
  .stat{min-height:120px}
  .stat-value{font-size:30px}
  .stat-value.text{font-size:22px}
  .stat-label{font-size:15px}
  .hero{padding:32px 8px}
  .hero h1{font-size:30px}
  .landing{padding:16px}
  .guest .card{padding:22px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* RV-02 (skill de diseño): accesibilidad, indicador de plan y portada */
.skip{position:absolute;left:16px;top:-60px;z-index:20;background:var(--accent);color:var(--onaccent);padding:10px 16px;border-radius:var(--r-ctl);font-weight:600}
.skip:focus{top:12px;text-decoration:none}
.plan-pill{margin-right:auto;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:5px 6px 5px 12px;font-size:13px;font-weight:500;color:var(--muted);background:var(--card)}
.plan-pill b{background:var(--accent-soft);color:var(--accent-ink);border-radius:999px;padding:2px 9px;font-variant-numeric:tabular-nums}
.plan-pill:hover{text-decoration:none;border-color:var(--accent)}
.button.big{padding:13px 24px;font-size:16px}
.center{text-align:center}
.icon-chip.small{width:32px;height:32px;border-radius:10px}
.land-nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.land-nav a{padding:8px 14px;border-radius:999px;color:var(--muted);font-weight:500;font-size:15px}
.land-nav a:hover{background:var(--accent-soft);color:var(--accent-ink);text-decoration:none}
.donut{width:100%;max-width:120px}
.donut .ring{stroke:var(--track)}
.s-accent{stroke:var(--accent)}.s-navy{stroke:var(--navy)}.s-teal{stroke:var(--teal)}.s-lavender{stroke:var(--lavender)}.s-sky{stroke:var(--sky)}
.legend.small{gap:6px;margin:0;font-size:12px;align-self:stretch}
.legend.small .dot{width:9px;height:9px}
.land-section{padding:40px 0}
.land-title{font-size:30px;font-weight:600;letter-spacing:-.02em;text-align:center;margin:0 0 28px}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:20px}
.feature{margin:0;display:flex;flex-direction:column;gap:10px}
.feature h3{margin:6px 0 0;font-size:17px}
.feature p{margin:0;font-size:15px}
.plans .plan{display:flex;flex-direction:column;gap:10px}
.plans .plan h3{font-size:18px;font-weight:600;margin:0}
.plans .plan .button{margin-top:auto;align-self:stretch}
.plan.featured{border:2px solid var(--accent)}
.price{margin:0}
.price b{font-size:40px;letter-spacing:-.02em}
.billing{margin:0;color:var(--muted);font-size:14px;background:var(--accent-soft);border-radius:10px;padding:8px 12px}
.checks{list-style:none;padding:0;margin:6px 0 14px;display:flex;flex-direction:column;gap:10px}
.checks li{display:flex;gap:10px;align-items:center}
.checks .icon{color:var(--accent)}
.plans + .faint{margin-top:20px}
@media (max-width:640px){
  .land-title{font-size:24px}
}

/* Consola de administración (fase 3c) */
.search{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.search label{display:flex;flex-direction:column;gap:6px;font-weight:500;font-size:15px}
.search .grow{flex:1 1 260px}
.search input{width:100%}
.table-wrap{overflow-x:auto;position:relative}
.table{width:100%;border-collapse:collapse;font-size:15px}
.table th{text-align:left;font-weight:600;color:var(--muted);font-size:13px;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.table td{padding:12px;border-bottom:1px solid var(--line-soft);vertical-align:top}
.table tr:last-child td{border-bottom:0}
.table .num{text-align:right;font-variant-numeric:tabular-nums}
.table code{font-size:12px}
.pager{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.brand .chip{margin-left:4px}

/* Fase 4: pestañas del proyecto, Plan de Tareas, Kanban, Gantt y Dashboard */
.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}
textarea{font:inherit;color:var(--ink);background:var(--field);border:1px solid var(--line);border-radius:var(--r-ctl);padding:11px 14px;max-width:100%;resize:vertical}
textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.chip.danger{background:var(--dangerbg);color:var(--danger)}
.chip.info{background:var(--accent-soft);color:var(--accent-ink)}
.c-danger{fill:var(--danger)}.c-muted{fill:var(--faint)}
.s-danger{stroke:var(--danger)}.s-muted{stroke:var(--faint)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 24px;padding:6px;background:var(--card);border:1px solid var(--line-soft);border-radius:999px;box-shadow:var(--shadow);width:fit-content;max-width:100%}
.tabs a{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;color:var(--muted);font-weight:500;font-size:15px}
.tabs a:hover{background:var(--accent-soft);color:var(--accent-ink);text-decoration:none}
.tabs a[aria-current="page"]{background:var(--accent);color:var(--onaccent)}
.cutoff{margin:-8px 0 16px;font-size:14px}
.people{display:flex;flex-wrap:wrap;gap:4px 12px}
.person{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.legend.row{flex-direction:row;flex-wrap:wrap;gap:8px 18px;margin-top:16px}
.legend-num{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:600}
.donut-row{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.donut-row .donut{max-width:150px;flex:none}
.donut-row .legend{flex:1 1 200px;margin:0}
.stage-bars{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.stage-bars li{display:grid;grid-template-columns:minmax(90px,130px) 1fr 32px;gap:12px;align-items:center}
.stage-name{font-size:15px}
svg.stack{width:100%;height:14px;display:block}
.stack .track-fill{fill:var(--track)}
.issue-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.issue-list li{display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid var(--line-soft);padding-bottom:10px}
.issue-list li:last-child{border-bottom:0;padding-bottom:0}
/* Plan de Tareas */
.filters{align-items:flex-end}
.filters .check{align-self:center;padding-bottom:4px}
.table th a{color:inherit}
.table.tasks td{font-size:14px}
.task-title{min-width:220px}
.task-title b{display:block;font-weight:600}
.task-title .chip{margin:4px 6px 0 0}
.task-title small,.table td small{display:block;margin-top:4px}
.table tr.incoherent td{background:var(--warnbg)}
.table tr.overdue td:first-child{box-shadow:inset 3px 0 0 var(--danger)}
.row-actions{white-space:nowrap}
.row-actions form{display:inline;margin:0 0 0 12px}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:18px}
.task-form{max-width:860px}
.pager{align-items:center}
/* Kanban */
.kanban{display:grid;grid-template-columns:repeat(4,minmax(240px,1fr));gap:16px;overflow-x:auto;padding-bottom:6px}
.kanban-col{background:var(--track);border-radius:var(--r-card);padding:14px;min-height:200px;border:2px solid transparent;transition:border-color .15s}
.kanban-col.drop-target{border-color:var(--accent)}
.kanban-col h2{font-size:16px;font-weight:600;display:flex;justify-content:space-between;align-items:center;margin:0 0 12px}
.kanban-col .count{background:var(--card);border-radius:999px;padding:1px 10px;font-size:13px;color:var(--muted)}
.kanban-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;min-height:40px}
.kanban-card{background:var(--card);border:1px solid var(--line-soft);border-left:4px solid var(--accent);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow);font-size:14px}
.kanban-card[draggable="true"]{cursor:grab}
.kanban-card.type-resource{border-left-color:var(--teal)}
.kanban-card.type-defect{border-left-color:var(--danger)}
.kanban-card.overdue{border-color:var(--danger);background:var(--dangerbg)}
.kanban-card.dragging{opacity:.5}
.kanban-card.saving{opacity:.7}
.kanban-card h3{font-size:15px;margin:0;font-weight:600}
.kanban-top,.kanban-meta{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px}
.kanban-desc{color:var(--muted);margin:0}
.stage-form select{padding:6px 10px;font-size:13px}
.stage-form button{padding:6px 12px;font-size:13px}
.kanban-empty{font-size:14px;margin:8px 0 0}
/* Gantt */
.gantt-tools{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:0 0 16px}
.segmented{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px}
.segmented a{padding:6px 14px;border-radius:999px;color:var(--muted);font-weight:500;font-size:14px}
.segmented a[aria-current="page"]{background:var(--accent);color:var(--onaccent);text-decoration:none}
.gantt-card{padding:16px}
.gantt-scroll{overflow-x:auto;border:1px solid var(--line-soft);border-radius:var(--r-ctl)}
svg.gantt{display:block;font-size:13px}
.g-weekend{fill:var(--field)}
.g-grid{stroke:var(--line-soft)}
.g-axis,.g-row{stroke:var(--line)}
.g-head{fill:var(--faint);font-size:11px}
.g-month{fill:var(--muted);font-size:12px;font-weight:600}
.g-label{fill:var(--ink)}
.g-num{fill:var(--faint);font-weight:600}
.g-bar{stroke:transparent;stroke-width:2}
.g-bar.g-overdue{stroke:var(--danger);stroke-dasharray:4 2}
.g-off{fill:var(--faint);font-size:12px}
.g-today{stroke:var(--danger);stroke-width:2}
.g-key-overdue{display:inline-block;width:14px;height:14px;border:2px dashed var(--danger);border-radius:3px}
@media (max-width:640px){
  .tabs{border-radius:var(--r-card);width:100%}
  .tabs a{padding:8px 12px;font-size:14px}
  .kanban{grid-template-columns:repeat(4,minmax(78vw,1fr))}
  .stage-bars li{grid-template-columns:90px 1fr 28px}
}
.chip{white-space:nowrap}
.table.tasks td.date{white-space:nowrap}
.row-actions button.danger-text{color:var(--danger)}
/* Importación (HU-16) */
.wizard{list-style:none;display:flex;gap:10px;flex-wrap:wrap;padding:0;margin:0 0 20px}
.wizard li{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;background:var(--card);border:1px solid var(--line-soft);color:var(--muted);font-weight:500;font-size:14px}
.wizard li span{display:inline-flex;width:26px;height:26px;border-radius:50%;align-items:center;justify-content:center;background:var(--track);font-size:13px}
.wizard li.current{color:var(--accent-ink);border-color:var(--accent)}
.wizard li.current span{background:var(--accent);color:var(--onaccent)}
.wizard li.done span{background:var(--okbg);color:var(--ok)}
.map-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:16px;margin:0 0 18px}
.map-grid label{display:flex;flex-direction:column;gap:6px;font-weight:500;font-size:15px}
.map-grid small{color:var(--faint);font-weight:400}
.table.sample td{font-size:13px;color:var(--muted);white-space:nowrap}
.table tr.skipped td{color:var(--faint)}
.steps-help{margin:0 0 18px;padding-left:20px;display:flex;flex-direction:column;gap:8px;color:var(--muted)}
.import-preview small{display:block}
/* Ajustes de la revisión de la fase 4 */
.board-hint{margin:0 0 24px}
.grid.stats.compact{grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),230px))}
.compact .stat{min-height:0;padding:18px 20px;gap:2px}
.compact .stat-label{font-size:15px}
.compact .stat-value{font-size:30px;margin:6px 0 2px}
.compact .stat-value small{font-size:16px}
.compact .stat-value.text{font-size:22px}
.compact .stat-note{font-size:13px}
.theme-switch{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:999px;margin:0 4px}
.theme-switch button{border:0;background:transparent;color:var(--muted);padding:6px;border-radius:999px;line-height:0}
.theme-switch button:hover{color:var(--accent-ink);background:var(--accent-soft)}
.theme-switch button[aria-pressed="true"]{background:var(--accent);color:var(--onaccent)}
.g-task{cursor:default;outline:none}
.g-task:focus-visible .g-bar,.g-task:hover .g-bar{filter:brightness(1.1);stroke:var(--ink);stroke-width:1.5}
.gantt-tip{position:fixed;z-index:20;max-width:320px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 28px rgba(22,34,70,.18);padding:10px 14px;font-size:13px;pointer-events:none}
.gantt-tip[hidden]{display:none}
.gantt-tip b{display:block;font-size:14px;margin-bottom:2px}
.gantt-tip .tip-meta{color:var(--faint);display:block;margin-bottom:6px}
.gantt-tip p{margin:0;white-space:pre-line}
.g-key{stroke:var(--danger);stroke-width:2;stroke-dasharray:6 4}
.g-key-label{fill:var(--danger);font-size:11px;font-weight:600}
.key-dates{list-style:none;padding:0;margin:0 0 14px;display:flex;flex-direction:column;gap:8px}
.key-dates li{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.key-dates form{margin:0}
.g-key-swatch{display:inline-block;width:16px;border-top:2px dashed var(--danger);vertical-align:middle}

/* Fase 5a: portada y acceso con capturas reales de la app (sensación visual pedida por el líder). */
.landing{max-width:1180px}
.land-nav .button.primary{color:var(--onaccent);margin-left:6px}
.land-nav .button.primary:hover{background:var(--accent-ink);color:var(--onaccent)}
.shot{display:block}
.shot img{display:block;width:100%;height:auto;border-radius:18px;border:1px solid var(--line);box-shadow:var(--shot-shadow);background:var(--card)}
.hero-stage{text-align:center;padding:56px 0 24px}
.hero-copy{max-width:820px;margin:0 auto}
.eyebrow{display:inline-block;margin:0 0 20px;padding:6px 14px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);font-weight:600;font-size:14px;letter-spacing:.01em}
.hero-copy h1{font-size:60px;line-height:1.04;letter-spacing:-.035em;font-weight:700;margin:0 0 22px}
.hero-copy .lead{color:var(--muted);font-size:20px;max-width:620px;margin:0 auto 30px}
.hero-copy .cta{justify-content:center;margin:0 0 12px}
.collage{position:relative;margin:56px auto 0;max-width:1040px;padding:0}
.collage .glow{position:absolute;inset:8% -6% 4% -6%;border-radius:48px;background:radial-gradient(40% 55% at 15% 40%,var(--land-a),transparent 70%),radial-gradient(45% 60% at 85% 35%,var(--land-b),transparent 70%),radial-gradient(50% 55% at 50% 95%,var(--land-c),transparent 70%),radial-gradient(60% 70% at 50% 40%,var(--land-d),transparent 75%);z-index:0}
.collage .main-shot{position:relative;z-index:1;width:86%;margin:0 auto}
.collage .float-shot{position:absolute;z-index:2;width:36%;top:58%}
.collage .float-shot.left{left:-3%;transform:rotate(-4deg)}
.collage .float-shot.right{right:-3%;top:50%;transform:rotate(3deg)}
.collage figcaption{position:relative;z-index:1;text-align:center;font-size:13px;margin-top:190px}
.collage .float-shot img{border-radius:14px}
.land-section{padding:72px 0 40px}
.land-title{font-size:40px;font-weight:700;letter-spacing:-.03em;margin:0 0 48px}
.tour{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:center;margin:0 0 72px}
.tour.flip{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.tour.flip .tour-copy{order:2}
.tour-copy h3{font-size:30px;letter-spacing:-.02em;margin:16px 0 10px}
.tour-copy p{font-size:18px;margin:0;max-width:420px}
.tour-shot{border-radius:32px;padding:44px 0 44px 44px;overflow:hidden;background:var(--land-a)}
.tour.flip .tour-shot{padding:44px 44px 44px 0}
.tour.flip .tour-shot .shot img{border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}
.tour:not(.flip) .tour-shot .shot img{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}
.tone-b .tour-shot{background:var(--land-b)}
.tone-c .tour-shot{background:var(--land-c)}
.tone-d .tour-shot{background:var(--land-d)}
.link-band{display:flex;flex-direction:row;gap:18px;align-items:center;max-width:760px;margin:0 auto}
.link-band h3{margin:0 0 4px}
.final-cta{text-align:center;margin:56px 0 24px;padding:64px 24px;border-radius:32px;background:radial-gradient(50% 80% at 20% 30%,var(--land-a),transparent 70%),radial-gradient(50% 80% at 80% 70%,var(--land-b),transparent 70%),var(--land-d)}
.final-cta h2{font-size:38px;letter-spacing:-.03em;margin:0 0 24px}
.final-cta .cta{justify-content:center;margin:0 0 10px}
.final-cta .cta-note{max-width:640px;margin:-8px auto 28px;font-size:17px;line-height:1.6;color:var(--muted);font-weight:400;text-wrap:pretty}
/* Espacio reservado para el banner de Adsterra (D5-26). Medidas finales cuando lleguen los códigos. */
.ad-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;margin:24px auto 8px;width:100%;max-width:728px;min-height:90px;border:1px dashed var(--line);border-radius:12px;color:var(--faint);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.ad-slot small{text-transform:none;letter-spacing:0;font-size:11px}
.shell > .ad-slot{margin:0 auto 20px}
.shell > .panel + .ad-slot{margin:20px auto 0}
.guest.split{max-width:none;min-height:100vh;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.guest.split .guest-main{padding:40px 24px 48px;display:flex;flex-direction:column;align-items:center}
.guest.split .guest-main > *{width:100%;max-width:440px}
.guest-art{position:relative;overflow:hidden;padding:64px 0 64px 56px;display:flex;flex-direction:column;justify-content:center;gap:28px;background:radial-gradient(60% 50% at 20% 20%,var(--land-a),transparent 70%),radial-gradient(60% 60% at 90% 80%,var(--land-b),transparent 70%),var(--land-d)}
.guest-art p{margin:0;font-size:30px;font-weight:700;letter-spacing:-.03em;line-height:1.15;max-width:420px;color:var(--ink)}
.guest-art .shot{width:118%}
.guest-art .shot img{border-top-right-radius:0;border-bottom-right-radius:0}
@media (max-width:980px){
  .hero-copy h1{font-size:44px}
  .tour,.tour.flip{grid-template-columns:1fr;gap:24px;margin-bottom:56px}
  .tour.flip .tour-copy{order:0}
  .guest.split{grid-template-columns:1fr}
  .guest-art{display:none}
}
@media (max-width:640px){
  .hero-stage{padding:28px 0 8px}
  .hero-copy h1{font-size:34px}
  .hero-copy .lead{font-size:17px}
  .collage{margin-top:32px;padding-bottom:0}
  .collage .main-shot{width:100%}
  .collage .glow{inset:4% 0 0 0}
  .collage .float-shot{display:none}
  .collage figcaption{margin-top:16px}
  .land-section{padding:48px 0 24px}
  .land-title{font-size:28px;margin-bottom:28px}
  .tour-copy h3{font-size:24px}
  .tour-shot{padding:24px 0 24px 24px;border-radius:24px}
  .tour.flip .tour-shot{padding:24px 24px 24px 0}
  .final-cta{padding:40px 16px}
  .final-cta h2{font-size:28px}
  .final-cta .cta-note{font-size:15px}
  .lang-menu summary span{display:none}
  .land-nav .button.primary{display:none}
}

/* Fase 5a: vista del cliente y links para compartir (HU-24 a HU-26). */
.client-tag{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--muted);font-size:14px}
.client-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;padding:16px 4px 0}
.made-with{display:inline-flex;align-items:center;gap:6px;color:var(--faint)}
.made-with:hover{color:var(--accent-ink)}
.share-new{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin:0 0 18px}
.share-new label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500}
.share-new .grow{flex:1 1 200px}
.share-url{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--okbg);border-radius:var(--r-ctl);padding:12px 14px;margin:0 0 18px}
.share-url input{flex:1 1 260px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}
.share-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.share-list li{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;border:1px solid var(--line-soft);border-radius:var(--r-ctl);padding:12px 14px}
.share-list .share-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.share-list .share-meta small{color:var(--faint)}
.share-list .share-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.share-list .share-actions select{width:auto}
.share-list li.off{opacity:.7}

/* Fase 5b: plan y pagos con PayPal. */
.test-mode{letter-spacing:.04em}
.paypal-env{margin:4px 0}
.paypal-env legend{display:flex;gap:8px;align-items:center;font-weight:600}
.paypal-tests{margin:14px 0 22px;gap:10px;flex-wrap:wrap}

/* Fase 5b-5 (pedido del líder): en móvil, recuadros del panel de proyectos y fechas clave del Gantt centrados. */
@media (max-width:640px){
  .grid.stats.compact{grid-template-columns:minmax(0,340px);justify-content:center}
  .grid.stats.compact .stat{text-align:center;align-items:center}
  .grid.stats.compact .stat .progress{width:100%}
  .key-dates-card{text-align:center}
  .key-dates-card .key-dates li{justify-content:center}
  .key-dates-card .search{flex-direction:column;align-items:center}
  .key-dates-card .search label{width:100%;max-width:340px;align-items:center}
  .key-dates-card .search .grow{flex:0 0 auto}
  .key-dates-card .search input{text-align:center}
}
@media (max-width:640px){
  .ad-slot{max-width:320px;min-height:50px}
}