:root{
  --paper:#F2F1EC;
  --paper-raised:#FFFFFF;
  --paper-sunken:#EAE8E0;
  --ink:#23262B;
  --ink-soft:#5B6169;
  --ink-faint:#8A8F96;
  --line:#D8D6CE;
  --line-strong:#C3C0B5;
  --accent:#2B5F82;
  --accent-soft:#E4EEF3;
  --accent-ink:#14384D;
  --good:#4F7A44;      --good-soft:#E4EDDF;
  --warn:#A8791F;      --warn-soft:#F3E9D3;
  --bad:#A6503A;       --bad-soft:#F2E1DB;
  --done:#7C8188;      --done-soft:#E7E6E1;
  --grid-line: rgba(43,95,130,0.07);
  --shadow: 0 1px 2px rgba(35,38,43,0.06), 0 4px 14px rgba(35,38,43,0.05);
  --radius: 3px;
}

:root[data-theme="dark"]{
  --paper:#101623;
  --paper-raised:#182233;
  --paper-sunken:#0B111C;
  --ink:#E7E9F0;
  --ink-soft:#A6ADBF;
  --ink-faint:#6E7690;
  --line:#26304A;
  --line-strong:#37436A;
  --accent:#6BA6CE;
  --accent-soft:#1F3542;
  --accent-ink:#CFE7F5;
  --good:#8FBB7E;      --good-soft:#26311F;
  --warn:#D6AA53;      --warn-soft:#3A2E14;
  --bad:#D28D77;       --bad-soft:#3A241D;
  --done:#9CA1A8;      --done-soft:#2A2D31;
  --grid-line: rgba(107,166,206,0.08);
  --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 4px 18px rgba(0,0,0,0.35);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;}
body{
  background:
    linear-gradient(var(--grid-line) 1px, transparent 1px) 0 0/28px 28px,
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px) 0 0/28px 28px,
    var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', system-ui, sans-serif;
  font-size:14px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{margin:0;text-wrap:balance;}
.mono{font-family:'IBM Plex Mono', ui-monospace, monospace;}
.num{font-variant-numeric:tabular-nums;}
a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;}
button, input, select{font-family:inherit;font-size:13px;}

.shell{max-width:1320px;margin:0 auto;padding:24px 32px 64px;}

.masthead{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  padding-bottom:16px;margin-bottom:8px;border-bottom:2px solid var(--ink);
}
.kicker{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:500;}
.masthead h1{font-family:'Big Shoulders Display',sans-serif;font-weight:700;font-size:34px;}

.session{display:flex;align-items:center;gap:12px;font-size:12.5px;color:var(--ink-soft);}
.session button.link{
  appearance:none;border:none;background:none;color:var(--accent);cursor:pointer;
  font-size:12.5px;padding:0;font-family:inherit;
}

.tabs{display:flex;gap:2px;margin:18px 0 22px;border-bottom:1px solid var(--line);}
.tab{
  appearance:none;border:none;background:none;cursor:pointer;
  padding:9px 16px;font-size:12.5px;font-weight:500;letter-spacing:.03em;
  text-transform:uppercase;color:var(--ink-soft);
  border-bottom:2px solid transparent;margin-bottom:-1px;
}
.tab:hover{color:var(--ink);}
.tab.active{color:var(--accent);border-bottom-color:var(--accent);}
.view{display:none;}
.view.active{display:block;}

.badge{
  display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:99px;white-space:nowrap;
}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.badge.en_curso{background:var(--good-soft);color:var(--good);}
.badge.esperando_admin,.badge.esperando_cliente{background:var(--warn-soft);color:var(--warn);}
.badge.parado{background:var(--bad-soft);color:var(--bad);}
.badge.terminado,.badge.hecho{background:var(--done-soft);color:var(--done);}
.badge.pendiente{background:var(--paper-sunken);color:var(--ink-soft);}

.priority{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;}
.priority::before{content:"";width:8px;height:8px;border-radius:2px;background:currentColor;flex:none;}
.priority.alta{color:var(--bad);}
.priority.media{color:var(--warn);}
.priority.baja{color:var(--ink-faint);}
.priority.sin{color:var(--ink-faint);font-weight:400;text-transform:none;}

.lanes{display:flex;flex-direction:column;gap:22px;}
.lane-head{display:flex;align-items:baseline;justify-content:space-between;padding:0 2px 8px;border-bottom:2px solid var(--ink);margin-bottom:10px;}
.lane-head h2{font-family:'Big Shoulders Display',sans-serif;font-weight:600;font-size:16px;letter-spacing:.02em;text-transform:uppercase;}
.lane-head .n{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--ink-faint);}
.lane-scroll{overflow-x:auto;padding-bottom:6px;margin:0 -4px;}
.lane-row{display:flex;gap:14px;min-width:max-content;padding:0 4px;}
.lane-empty{font-size:11.5px;color:var(--ink-faint);padding:8px 2px;font-style:italic;}

.card{
  display:block;width:236px;flex:0 0 236px;text-align:left;background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius);
  padding:10px 11px;box-shadow:var(--shadow);color:var(--ink);cursor:pointer;
}
.card:hover{border-color:var(--accent);text-decoration:none;}
.card .code{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--accent);font-weight:500;}
.card .name{display:block;font-size:12.5px;font-weight:500;line-height:1.35;margin:4px 0;}
.card .meta{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--ink-soft);margin-top:4px;}
.card .stale.warn2{color:var(--bad);font-weight:600;}

.panel{background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 24px;}

.ficha-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--line);}
.ficha-head h2{font-family:'Big Shoulders Display',sans-serif;font-size:26px;font-weight:700;}
.ficha-head .code{font-family:'IBM Plex Mono',monospace;color:var(--accent);font-size:13px;display:block;margin-bottom:2px;}

.stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px;}
.stat{background:var(--paper-sunken);border-radius:var(--radius);padding:11px 13px;}
.stat .k{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);margin-bottom:4px;}
.stat .v{font-size:15px;font-weight:600;}

table{width:100%;border-collapse:collapse;font-size:12.5px;}
th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);font-weight:600;padding:6px 10px;border-bottom:1px solid var(--line-strong);}
td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:middle;}
tr:last-child td{border-bottom:none;}
.table-wrap{overflow-x:auto;}
h3.sub{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);margin:22px 0 10px;font-weight:600;}
h3.sub:first-of-type{margin-top:0;}

.persona-layout{display:grid;grid-template-columns:230px 1fr;gap:20px;align-items:start;}
.persona-list{display:flex;flex-direction:column;gap:4px;}
.persona-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 11px;border-radius:var(--radius);border:1px solid transparent;background:none;width:100%;color:var(--ink);cursor:pointer;text-align:left;}
.persona-item:hover{background:var(--paper-sunken);}
.persona-item.active{background:var(--accent-soft);border-color:var(--accent);}
.persona-item .pname{font-size:12.5px;font-weight:500;}
.persona-item .prole{font-size:10.5px;color:var(--ink-faint);display:block;}
.count-chip{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:500;background:var(--paper-sunken);color:var(--ink-soft);border-radius:99px;padding:1px 7px;}
.persona-item.active .count-chip{background:var(--accent);color:var(--paper-raised);}

select{background:var(--paper-sunken);border:1px solid var(--line-strong);border-radius:var(--radius);padding:7px 10px;color:var(--ink);}
.picker-row{display:flex;align-items:center;gap:10px;margin-bottom:18px;flex-wrap:wrap;}
.picker-row label{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);}

button.btn{
  appearance:none;border:1px solid var(--accent);background:var(--accent);color:var(--paper-raised);
  border-radius:var(--radius);padding:7px 14px;font-size:12.5px;font-weight:500;cursor:pointer;
}
button.btn.ghost{background:none;color:var(--accent);}
button.btn:hover{opacity:.9;}

.subtabs{display:inline-flex;border:1px solid var(--line-strong);border-radius:99px;padding:2px;gap:2px;margin-bottom:16px;}
.subtab{appearance:none;border:none;cursor:pointer;background:none;font-size:11px;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-faint);padding:5px 12px;border-radius:99px;}
.subtab.active{background:var(--accent);color:var(--paper-raised);}

.email-shell{max-width:560px;}
.email-toolbar{display:flex;align-items:center;gap:8px;background:var(--paper-sunken);border:1px solid var(--line-strong);border-bottom:none;border-radius:var(--radius) var(--radius) 0 0;padding:9px 13px;}
.email-toolbar .dot{width:9px;height:9px;border-radius:50%;background:var(--line-strong);}
.email-toolbar .path{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--ink-faint);margin-left:4px;}
.email-card{border:1px solid var(--line-strong);border-radius:0 0 var(--radius) var(--radius);background:var(--paper-raised);}
.email-meta{padding:16px 20px;border-bottom:1px solid var(--line);}
.email-meta .row{font-size:11.5px;color:var(--ink-soft);margin-bottom:3px;}
.email-meta .row b{color:var(--ink-faint);font-weight:500;min-width:44px;display:inline-block;}
.email-subject{font-size:16px;font-weight:600;margin-top:6px;font-family:'Big Shoulders Display',sans-serif;letter-spacing:.01em;}
.email-body{padding:18px 20px 22px;}
.email-body p{margin:0 0 12px;font-size:13px;}
.encargo-line{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:12.5px;}
.encargo-line:last-child{border-bottom:none;}
.encargo-line .obra{font-size:10.5px;color:var(--ink-faint);font-family:'IBM Plex Mono',monospace;}
.encargo-line .due{font-size:11px;color:var(--ink-soft);white-space:nowrap;}
.email-sign{margin-top:14px;font-size:11px;color:var(--ink-faint);}

.notice{background:var(--accent-soft);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--radius);padding:10px 14px;margin-bottom:20px;font-size:12.5px;color:var(--accent-ink);}
.notice.error{background:var(--bad-soft);border-left-color:var(--bad);color:var(--bad);}

.loading{display:flex;align-items:center;gap:10px;color:var(--ink-faint);font-size:12.5px;padding:40px 0;}
.spinner{width:14px;height:14px;border-radius:50%;border:2px solid var(--line-strong);border-top-color:var(--accent);animation:spin .7s linear infinite;}
@media (prefers-reduced-motion: reduce){.spinner{animation:none;}}
@keyframes spin{to{transform:rotate(360deg);}}

footer{margin-top:40px;padding-top:16px;border-top:1px solid var(--line);font-size:11px;color:var(--ink-faint);}

/* ---------- ajustes (esquina) ---------- */
.settings-fab{position:fixed;right:18px;bottom:18px;z-index:40;}
.settings-btn{
  appearance:none;cursor:pointer;width:38px;height:38px;border-radius:50%;
  background:var(--paper-raised);border:1px solid var(--line-strong);color:var(--ink-soft);
  box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;
  transition:color .15s ease, border-color .15s ease;
}
.settings-btn:hover{color:var(--accent);border-color:var(--accent);}
.settings-menu{
  position:absolute;right:0;bottom:48px;min-width:210px;
  background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:12px;display:flex;flex-direction:column;gap:12px;
}
.settings-menu[hidden]{display:none;}
.settings-menu .row{display:flex;flex-direction:column;gap:6px;}
.settings-menu .label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);}
.settings-menu a{font-size:12.5px;}
.link-btn{appearance:none;border:none;background:none;cursor:pointer;color:var(--accent);font-size:12.5px;padding:0;text-align:left;font-family:inherit;}
.link-btn:hover{text-decoration:underline;}
.theme-toggle{display:inline-flex;border:1px solid var(--line-strong);border-radius:99px;padding:2px;gap:2px;align-self:flex-start;}
.theme-opt{
  appearance:none;border:none;cursor:pointer;background:none;
  font-size:11px;letter-spacing:.03em;color:var(--ink-faint);padding:5px 11px;border-radius:99px;
}
.theme-opt.active{background:var(--accent);color:var(--paper-raised);}

/* ---------- informe (impresión / PDF) ---------- */
#print-report{display:none;}
@media print{
  body{background:#fff;}
  .shell, .settings-fab{display:none !important;}
  #print-report{display:block;color:#111;font-family:'IBM Plex Sans', system-ui, sans-serif;padding:24px;}
  #print-report h1{font-family:'Big Shoulders Display',sans-serif;font-size:24px;margin:0 0 4px;}
  #print-report .informe-fecha{font-size:11px;color:#555;margin:0 0 22px;}
  #print-report .informe-fase{margin-bottom:18px;break-inside:avoid;}
  #print-report .informe-fase h2{font-family:'Big Shoulders Display',sans-serif;font-size:15px;text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid #999;padding-bottom:4px;margin:0 0 10px;}
  #print-report .informe-proyecto{margin-bottom:12px;break-inside:avoid;}
  #print-report .informe-proyecto h3{font-size:13px;margin:0 0 3px;}
  #print-report .informe-estado{font-size:10px;text-transform:uppercase;color:#555;font-weight:400;}
  #print-report .informe-meta{font-size:11px;color:#444;margin:0 0 4px;}
  #print-report ul{margin:0;padding-left:18px;font-size:11.5px;}
  #print-report li{margin-bottom:2px;}
}

/* ---------- responsive ---------- */
@media (max-width: 900px){
  .shell{padding:20px 18px 48px;}
  .stat-row{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width: 640px){
  .shell{padding:16px 14px 40px;}
  .masthead{flex-direction:column;align-items:flex-start;gap:6px;padding-bottom:12px;}
  .masthead h1{font-size:26px;}
  .tabs{overflow-x:auto;flex-wrap:nowrap;}
  .tab{flex:0 0 auto;padding:9px 12px;}
  .card{width:210px;flex:0 0 210px;}
  .persona-layout{grid-template-columns:1fr;}
  .ficha-head{flex-direction:column;align-items:flex-start;gap:10px;}
  .settings-fab{right:12px;bottom:12px;}
  .settings-menu{min-width:180px;}
}
