:root { --fondo:#f6f5f3; --tarjeta:#fff; --texto:#1d1d1f; --suave:#666; --borde:#ddd; --marca:#c2541f; --aviso:#fff4e5; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, "Segoe UI", sans-serif; background:var(--fondo); color:var(--texto); line-height:1.45; }
header { background:#2b2b2e; color:#fff; padding:12px 16px; display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
header a { color:#fff; text-decoration:none; }
header .marca { font-weight:700; margin-right:auto; }
header form { margin:0; }
main { max-width:1200px; margin:0 auto; padding:16px; }
h1 { font-size:1.4rem; margin:.2em 0 .6em; }
a { color:var(--marca); }
.tarjeta { background:var(--tarjeta); border:1px solid var(--borde); border-radius:8px; padding:16px; margin-bottom:16px; }
.tabla { overflow-x:auto; }
table { border-collapse:collapse; width:100%; font-size:.92rem; }
th, td { border-bottom:1px solid var(--borde); padding:8px; text-align:left; vertical-align:top; }
th { background:#f0eeea; white-space:nowrap; }
td.num, th.num { text-align:right; white-space:nowrap; }
.boton, button { display:inline-block; background:var(--marca); color:#fff; border:0; border-radius:6px; padding:10px 16px; font-size:1rem; cursor:pointer; text-decoration:none; min-height:44px; }
.boton.secundario, button.secundario { background:#fff; color:var(--texto); border:1px solid #999; }
button.enlace { background:none; color:#fff; padding:0; min-height:0; text-decoration:underline; }
input, select { font-size:1rem; padding:8px; border:1px solid #999; border-radius:6px; max-width:100%; }
td input, td select { width:100%; min-width:90px; }
label { display:block; font-weight:600; margin-top:10px; }
.aviso { background:var(--aviso); border-left:4px solid #e08a00; padding:8px 12px; margin:8px 0; }
.etiqueta { background:var(--aviso); border-radius:4px; padding:2px 6px; font-size:.8rem; }
.errorlist { color:#b00020; margin:4px 0; padding-left:18px; }
.mensaje { background:#e7f5e9; border-left:4px solid #2e7d32; padding:8px 12px; margin-bottom:12px; }
.suave { color:var(--suave); font-size:.9rem; }
.acciones { display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; }
.rejilla { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:0 16px; }
form input:not([type=checkbox]):not([type=hidden]), form select, form textarea { width:100%;  min-height:44px; font-size:1rem; padding:8px; border:1px solid #999; border-radius:6px; }
.tarjeta form input[type=checkbox] { width:22px; height:22px; margin-right:8px; vertical-align:middle; }
td input:not([type=checkbox]), td select { min-width:90px; }
header a, header button.enlace { min-height:44px; display:inline-flex; align-items:center; }
.tabla td a { display:inline-flex; align-items:center; min-height:44px; padding:0 6px; }
.etapas { list-style:none; margin:0 0 16px; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.etapas li { background:var(--tarjeta); border:1px solid var(--borde); border-radius:6px; padding:8px 12px; }
.etapas li.actual { background:var(--aviso); border-color:var(--marca); font-weight:700; }
.etapas li.suave { background:transparent; }
td .acciones { margin:0; flex-wrap:nowrap; white-space:nowrap; align-items:center; }
header nav { display:contents; }
main a:not(.boton) { display:inline-flex; align-items:center; min-height:44px; }
main { overflow-wrap:anywhere; }
th, td { overflow-wrap:normal; }
/* Menú: dos enlaces a la vista y el resto en un desplegable nativo, sin JS. */
header .boton { padding:0 14px; display:inline-flex; align-items:center; white-space:nowrap; }
header .marca { white-space:nowrap; }
@media (max-width:700px) { header { flex-wrap:nowrap; gap:8px; padding:12px; } header .largo { display:none; } }
.menu { position:relative; }
.menu summary { list-style:none; cursor:pointer; font-size:1.4rem; min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center; border-radius:6px; }
.menu summary::-webkit-details-marker { display:none; }
.menu[open] summary { background:#444; }
.menu > div { position:absolute; right:0; top:100%; z-index:10; background:#2b2b2e; border-radius:0 0 8px 8px; padding:8px 16px; min-width:210px; display:flex; flex-direction:column; box-shadow:0 8px 20px rgba(0,0,0,.3); }
.menu > div span { color:#aaa; font-size:.85rem; border-top:1px solid #555; margin-top:8px; padding-top:10px; }
.materiales th:nth-child(4), .materiales td:nth-child(4) { min-width:220px; }
/* La lista de materiales usa todo el ancho de la pantalla (monitores ultrawide). */
main:has(table.materiales) { max-width:none; }
.taller { list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.taller a.boton-grande, .paso { display:flex; justify-content:space-between; align-items:center; gap:12px; background:var(--tarjeta); border:1px solid var(--borde); border-radius:8px; padding:16px; min-height:72px; }
main a.boton-grande { display:flex; text-decoration:none; color:var(--texto); font-size:1.1rem; }
.paso form { margin:0; }
.paso button { min-height:56px; min-width:160px; font-size:1.1rem; }
.paso.hecho { background:#e7f5e9; border-color:#2e7d32; }
.migas { margin:0 0 12px; color:var(--suave); }
main .migas a:not(.boton) { display:inline; min-height:0; }
.carpetas { list-style:none; margin:0 0 16px; padding:0; display:grid; gap:12px; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); }
main .carpetas a:not(.boton) { display:flex; flex-direction:column; align-items:flex-start; gap:4px; height:100%; background:var(--tarjeta); border:1px solid var(--borde); border-radius:10px; padding:16px; text-decoration:none; color:var(--texto); }
.carpetas a:hover { border-color:var(--marca); box-shadow:0 2px 8px rgba(0,0,0,.08); }
.carpetas .icono { font-size:2rem; line-height:1; }
.archivos { list-style:none; padding:0; margin:0 0 8px; }
.archivos li { display:flex; gap:12px; align-items:center; flex-wrap:wrap; padding:4px 0; }
.archivos form { margin:0; }
.archivos button, .subir button { min-height:36px; padding:4px 12px; }
.subir { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.subir input[type=file] { width:auto !important; flex:1 1 200px; }
/* Etapas navegables: cada una es un enlace; en pantallas chicas la fila se desliza. */
.etapas li { padding:0; }
.etapas li a { padding:8px 12px; text-decoration:none; color:var(--texto); }
.etapas li.elegida { border-color:var(--marca); box-shadow:inset 0 -3px 0 var(--marca); }
.panel h2 { margin-top:0; }
.panel .navegar { justify-content:space-between; margin-bottom:0; }
.pasos { list-style:none; padding:0; margin:0 0 12px; }
.grupo h3 { margin:16px 0 4px; }
.documento table { margin-bottom:16px; }
.firmas { display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-top:64px; }
.firmas p { border-top:1px solid var(--texto); padding-top:6px; text-align:center; }
@media (max-width:700px) {
  .etapas { flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; }
  .etapas li { flex:none; white-space:nowrap; }
  .firmas { gap:16px; }
}
@media print { header, .noimprimir, .mensaje { display:none !important; } body { background:#fff; } .documento { padding:0; } }
details.interno, details.solicitud { margin:16px 0; }
details.interno summary { cursor:pointer; color:var(--suave); min-height:44px; display:flex; align-items:center; }
details.solicitud summary { list-style:none; text-align:center; }
details.solicitud summary::-webkit-details-marker { display:none; }
details.solicitud form { margin-top:8px; }
.panel textarea { width:100%; font:inherit; padding:8px; border:1px solid #999; border-radius:6px; }