/* Espacios · Mantenimiento — portal conceptual de Alphyx para el sitio de Estudio Espacios (v11).
 * Hoja aislada: no carga ni depende de ../../assets/styles.css ni de la hoja de Estudio Espacios; todas las clases
 * llevan el prefijo mt-. Identidad del cliente (papel, tinta y bronce; display sans ligera, lectura en serif, datos en
 * monoespaciada) con la densidad de una herramienta. Un color, un significado: bronce = marca y selección; estados con
 * color + icono + texto (recibida gris, en revisión pizarra, en trabajo ámbar, publicada verde); prioridad alta en óxido.
 * El foco es un anillo de tinta que no significa ningún estado. Movimiento en mantenimiento.js. */
:root {
  --papel: #f6f6f3;
  --papel-2: #ecebe6;
  --hoja: #ffffff;
  --tinta: #151616;
  --tinta-2: #4f5256;
  --linea: #d4d3cd;
  --linea-2: #e4e3dd;
  --bronce: #6f5320;
  --bronce-t: #efe4cf;
  --noche: #121314;
  --st-recibida: #4f5256; --st-recibida-bg: #ecebe6;
  --st-revision: #22435e; --st-revision-bg: #e1e9f0;
  --st-trabajo: #7a4108; --st-trabajo-bg: #f6e7d2;
  --st-publicada: #255235; --st-publicada-bg: #e0ede3;
  --alta: #8c2f1b;
  --display: "Segoe UI Variable Display", "SF Pro Display", "Helvetica Neue", "Segoe UI", system-ui, Arial, sans-serif;
  --sans: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, "Noto Serif", Georgia, serif;
  --mono: ui-monospace, "Cascadia Mono", Consolas, "SFMono-Regular", Menlo, monospace;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --r: 10px;
  color-scheme: light;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: 16px;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; overflow-x: clip; }
h1, h2, h3, h4, p, figure, ol, ul, dl, dd, fieldset { margin: 0; }
ol, ul { padding: 0; list-style: none; }
fieldset { border: 0; padding: 0; min-width: 0; }
img, svg, picture { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--tinta); outline-offset: 3px; }
.mt-demo-bar :focus-visible, .mt-footer :focus-visible { outline-color: #f1f0ec; }
.mt-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.mt-ico { width: 20px; height: 20px; flex: none; }
.mt-mono { font-family: var(--mono); font-size: .92em; letter-spacing: -.01em; }
.mt-serif { font-family: var(--serif); font-size: 17px; line-height: 1.55; color: var(--tinta-2); }
.mt-skip { position: fixed; left: 12px; top: 10px; z-index: 200; display: inline-flex; align-items: center; min-height: 48px; padding: 12px 18px; background: var(--tinta); color: var(--papel); font-weight: 600; transform: translateY(-200%); }
.mt-skip:focus { transform: none; }
html.mt-js .mt-nojs-only { display: none; }
html:not(.mt-js) .mt-js-only { display: none; }

/* ——— Barra de la demo ——— */
.mt-demo-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 24px; padding: 6px clamp(16px, 3vw, 32px); background: var(--noche); color: #f1f0ec; font-size: 14px; }
.mt-demo-back { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.mt-demo-back .mt-ico { width: 18px; height: 18px; }
.mt-demo-label { font-weight: 600; }
.mt-demo-note { color: #c9c8c2; margin-left: auto; }

/* ——— Estructura ——— */
.mt-app { display: grid; grid-template-columns: 1fr; min-height: 100vh; }
.mt-side { background: var(--hoja); border-bottom: 1px solid var(--linea); padding: 16px clamp(16px, 3vw, 32px); display: grid; gap: 14px; }
.mt-brand { display: inline-flex; flex-direction: column; justify-content: center; min-height: 48px; text-decoration: none; }
.mt-brand-mark { font: 400 21px/1.1 var(--display); letter-spacing: -.02em; }
.mt-brand-sub { font: 500 14px/1.3 var(--sans); color: var(--bronce); }
.mt-nav ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.mt-nav a { position: relative; display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 10px; border-radius: 8px; text-decoration: none; font-weight: 500; font-size: 15px; line-height: 1.2; color: var(--tinta-2); }
.mt-nav a:hover { background: var(--papel); color: var(--tinta); }
.mt-nav a[aria-current="page"] { background: var(--bronce-t); color: var(--tinta); box-shadow: inset 3px 0 0 var(--bronce); }
.mt-nav-n { margin-left: auto; min-width: 24px; padding: 1px 7px; border-radius: 99px; background: var(--tinta); color: #fff; font: 600 13px/1.5 var(--mono); text-align: center; }
.mt-nav-n:empty { display: none; }
.mt-side-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-size: 14px; color: var(--tinta-2); }
.mt-side-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 600; color: var(--tinta); text-underline-offset: 3px; }
.mt-user { display: flex; align-items: center; gap: 10px; }
.mt-user b { display: block; color: var(--tinta); font-weight: 600; }
.mt-av { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--papel-2); font: 600 13px/1 var(--mono); color: var(--tinta); }
.mt-by b { color: var(--tinta); }
.mt-main { padding: 20px clamp(16px, 3.4vw, 48px) 72px; min-width: 0; }
.mt-main:focus { outline: none; }
.mt-top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; padding-bottom: 14px; margin-bottom: 28px; border-bottom: 1px solid var(--linea); }
.mt-top-t { font: 600 15px/1.4 var(--sans); }
.mt-top-s { font-size: 14px; color: var(--tinta-2); }
.mt-noscript { margin-bottom: 24px; padding: 14px 16px; border: 1px solid var(--linea); background: var(--hoja); border-radius: var(--r); }
.mt-view + .mt-view { margin-top: 72px; padding-top: 40px; border-top: 1px solid var(--linea); }
html.mt-js .mt-view { display: none; }
html.mt-js .mt-view.is-active { display: block; }
html.mt-js .mt-view + .mt-view { margin-top: 0; padding-top: 0; border-top: 0; }
@media (min-width: 1100px) {
  .mt-app { grid-template-columns: 252px minmax(0, 1fr); background: linear-gradient(90deg, var(--hoja) 251px, var(--linea) 251px 252px, var(--papel) 252px); }
  .mt-side { position: sticky; top: 0; align-self: start; min-height: 100vh; border-bottom: 0; border-right: 1px solid var(--linea); padding: 22px 16px; grid-template-rows: auto auto 1fr; align-content: start; }
  .mt-nav ul { grid-template-columns: 1fr; gap: 2px; }
  .mt-side-foot { align-self: end; flex-direction: column; align-items: flex-start; padding-top: 20px; border-top: 1px solid var(--linea-2); }
  .mt-main { padding-top: 26px; }
}
@media (min-width: 768px) and (max-width: 1099px) {
  /* Seis secciones en una fila de columnas iguales (icono sobre el texto): caben desde 768 px sin desbordar. */
  .mt-nav ul { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .mt-nav a { flex-direction: column; justify-content: center; gap: 2px; text-align: center; padding: 6px 4px; font-size: 13px; }
  .mt-nav a[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--bronce); }
  .mt-nav-n { position: absolute; top: 4px; right: 6px; margin: 0; font-size: 11px; min-width: 20px; padding: 0 5px; }
}
@media (max-width: 767px) {
  .mt-nav a { flex-direction: column; justify-content: center; gap: 2px; text-align: center; font-size: 13px; padding: 6px 4px; }
  .mt-nav a[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--bronce); }
  .mt-nav-n { position: absolute; top: 4px; right: 4px; margin: 0; font-size: 11px; min-width: 20px; padding: 0 5px; }
  .mt-by { display: none; }
  .mt-demo-note { margin-left: 0; }
}

/* ——— Tipografía y piezas comunes ——— */
.mt-vh { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 32px; margin-bottom: 28px; }
.mt-vh-t { max-width: 720px; }
.mt-kicker { font: 500 14px/1.4 var(--sans); color: var(--bronce); }
.mt-h { margin-top: 4px; font: 300 clamp(38px, 5vw, 64px)/1 var(--display); letter-spacing: -.04em; }
.mt-h:focus { outline: none; }
.mt-h:focus-visible { outline: 3px solid var(--tinta); }
.mt-lede { margin-top: 14px; font-family: var(--serif); font-size: clamp(17px, 1.5vw, 19px); line-height: 1.5; color: var(--tinta-2); max-width: 60ch; }
.mt-h3 { font: 400 22px/1.2 var(--display); letter-spacing: -.02em; }
.mt-h4 { margin: 26px 0 10px; font: 600 15px/1.3 var(--sans); }
.mt-note { font-size: 14px; color: var(--tinta-2); }
.mt-link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; color: var(--tinta); text-decoration: underline; text-decoration-color: var(--bronce); text-underline-offset: 4px; }
.mt-link-ico { width: 18px; height: 18px; }
.mt-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 18px; border: 1px solid var(--tinta); border-radius: 8px; background: var(--hoja); color: var(--tinta); font-weight: 600; font-size: 15px; line-height: 1.2; text-decoration: none; }
.mt-btn:hover { background: var(--papel-2); }
.mt-btn--primary { background: var(--tinta); color: #fff; }
.mt-btn--primary:hover { background: #2c2e2f; }
.mt-btn--quiet { border-color: var(--linea); }
.mt-btn .mt-ico { width: 18px; height: 18px; }
.mt-state { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px 3px 6px; border-radius: 99px; font-size: 13px; font-weight: 600; line-height: 1.4; white-space: nowrap; }
.mt-state-ico { width: 16px; height: 16px; stroke-width: 2; }
.mt-state--recibida { color: var(--st-recibida); background: var(--st-recibida-bg); }
.mt-state--revision { color: var(--st-revision); background: var(--st-revision-bg); }
.mt-state--trabajo { color: var(--st-trabajo); background: var(--st-trabajo-bg); }
.mt-state--publicada { color: var(--st-publicada); background: var(--st-publicada-bg); }
.mt-prio { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; font-weight: 600; color: var(--tinta-2); }
.mt-prio-ico { width: 15px; height: 15px; stroke-width: 2.2; }
.mt-prio--alta { color: var(--alta); }
.mt-folio { font: 500 13px/1.4 var(--mono); color: var(--tinta-2); }
.mt-tag { display: inline-block; padding: 1px 8px; border: 1px solid var(--bronce); border-radius: 4px; font: 600 12px/1.5 var(--mono); color: var(--bronce); }
.mt-tag--s { border-color: var(--tinta-2); color: var(--tinta-2); }
.mt-bar { display: block; height: 6px; margin-top: 10px; border-radius: 3px; background: var(--papel-2); overflow: hidden; }
.mt-bar i { display: block; height: 100%; background: var(--bronce); transform-origin: left; }
.mt-bar--lg { height: 10px; border-radius: 5px; }
.mt-big { font: 300 44px/1 var(--display); letter-spacing: -.03em; color: var(--tinta); font-variant-numeric: tabular-nums; }
.mt-of { font: 400 16px/1.2 var(--sans); letter-spacing: 0; color: var(--tinta-2); }
.mt-roll { display: inline-flex; }
.mt-roll-c { display: inline-block; height: 1em; line-height: 1; overflow: hidden; vertical-align: top; }
.mt-roll-s { display: flex; flex-direction: column; }
.mt-roll-s > span { display: block; height: 1em; line-height: 1; }
.mt-empty { padding: 14px; border: 1px dashed var(--linea); border-radius: 8px; font-size: 14px; color: var(--tinta-2); }
.mt-empty--lg { padding: 22px; font-family: var(--serif); font-size: 17px; }
.mt-why-l { display: inline-block; margin-right: 6px; font: 600 12px/1.4 var(--mono); color: var(--bronce); text-transform: lowercase; }

/* Filtros y segmentados */
.mt-filters { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-bottom: 14px; }
.mt-filter-g { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.mt-filter-l { margin-right: 4px; font: 500 13px/1.3 var(--mono); color: var(--tinta-2); }
.mt-seg { min-height: 44px; padding: 8px 14px; border: 1px solid var(--linea); border-radius: 99px; background: var(--hoja); font-size: 14px; font-weight: 500; color: var(--tinta-2); }
.mt-seg:hover { border-color: var(--tinta-2); color: var(--tinta); }
.mt-seg[aria-pressed="true"] { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.mt-count { margin-bottom: 18px; font: 500 13px/1.4 var(--mono); color: var(--tinta-2); }

/* ——— Estado ——— */
.mt-status { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 18px 20px; margin-bottom: 18px; border-radius: var(--r); background: var(--hoja); border: 1px solid var(--linea); }
.mt-pulse { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--st-publicada-bg); color: var(--st-publicada); }
.mt-pulse .mt-ico { width: 24px; height: 24px; }
.mt-status-t { font-size: 19px; }
.mt-status-t b { font-weight: 600; color: var(--st-publicada); }
.mt-status-sim { margin-left: 6px; padding: 2px 8px; border: 1px dashed var(--tinta-2); border-radius: 4px; font: 500 12px/1.5 var(--mono); color: var(--tinta-2); vertical-align: 2px; }
.mt-status-d { font-size: 14px; color: var(--tinta-2); }
.mt-status-v { margin-left: auto; display: grid; justify-items: end; font-size: 13px; color: var(--tinta-2); }
.mt-status-v b { font: 400 30px/1 var(--display); letter-spacing: -.02em; color: var(--tinta); }
.mt-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1px; margin-bottom: 40px; background: var(--linea); border: 1px solid var(--linea); border-radius: var(--r); overflow: hidden; }
.mt-fact { position: relative; padding: 16px 18px 18px; background: var(--hoja); }
.mt-fact dt { margin: 26px 0 8px; font: 500 13px/1.3 var(--mono); color: var(--tinta-2); }
.mt-fact dd { display: grid; gap: 4px; font-size: 16px; }
.mt-fact small { font-size: 13px; color: var(--tinta-2); }
.mt-fact-ico { position: absolute; top: 16px; left: 18px; color: var(--bronce); }
.mt-estado-grid { display: grid; gap: 40px; }
@media (min-width: 1100px) { .mt-estado-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } .mt-now { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: end; } }
.mt-plano .mt-note { margin: 6px 0 16px; }
/* El plano: cada página es un espacio; «Todo el sitio» es el muro que los contiene. */
.mt-plano-grid { position: relative; display: grid; grid-template-columns: 1.3fr 1fr; grid-template-areas: "portada proyectos" "ficha estudio" "sitio sitio"; gap: 0; border: 3px solid var(--tinta); background: var(--hoja); }
.mt-room { position: relative; display: grid; align-content: start; gap: 2px; min-height: 118px; padding: 14px 16px; border: 0; border-right: 1.5px solid var(--tinta); border-bottom: 1.5px solid var(--tinta); background: rgba(255,255,255,0); text-align: left; font: inherit; color: inherit; }
.mt-room--portada { grid-area: portada; } .mt-room--proyectos { grid-area: proyectos; border-right: 0; } .mt-room--ficha { grid-area: ficha; } .mt-room--estudio { grid-area: estudio; border-right: 0; }
.mt-room--sitio { grid-area: sitio; min-height: 72px; border-right: 0; border-bottom: 0; background: repeating-linear-gradient(135deg, var(--papel) 0 6px, var(--hoja) 6px 12px); grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; }
.mt-room--sitio .mt-room-n { grid-row: span 2; }
button.mt-room:hover { background: var(--bronce-t); }
.mt-room::after { content: ""; position: absolute; width: 22px; height: 22px; border: 1.5px solid var(--tinta); border-width: 1.5px 0 0 1.5px; border-radius: 22px 0 0 0; bottom: -1.5px; right: 18px; background: var(--hoja); }
.mt-room--proyectos::after, .mt-room--estudio::after, .mt-room--sitio::after { display: none; }
.mt-room-n { font: 300 40px/1 var(--display); color: var(--tinta-2); font-variant-numeric: tabular-nums; }
.mt-room-n.has-open { color: var(--bronce); }
.mt-room-name { font-weight: 600; }
.mt-room-s { font: 500 12px/1.3 var(--mono); color: var(--tinta-2); }
.mt-recent-list { margin: 14px 0 6px; border-top: 1px solid var(--linea); }
.mt-recent-list li { display: grid; gap: 2px; padding: 12px 0; border-bottom: 1px solid var(--linea-2); }
.mt-recent-d { font-size: 12px; color: var(--tinta-2); }
.mt-recent-t { font-size: 15px; }
.mt-now .mt-pic { border-radius: var(--r); overflow: hidden; border: 1px solid var(--linea); box-shadow: 0 20px 50px rgba(21,22,22,.10); }
.mt-now img { width: 100%; height: auto; }
.mt-now figcaption { margin-top: 12px; font-family: var(--serif); font-size: 17px; color: var(--tinta-2); }

/* ——— Solicitudes ——— */
.mt-sol-layout { display: grid; gap: 24px; align-items: start; }
.mt-board { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.mt-col { min-width: 0; padding: 12px; border-radius: var(--r); background: var(--papel-2); }
.mt-col-h { display: flex; align-items: center; gap: 6px; margin: 2px 2px 12px; font: 600 15px/1.3 var(--sans); }
.mt-col--recibida .mt-col-h { color: var(--st-recibida); } .mt-col--revision .mt-col-h { color: var(--st-revision); } .mt-col--trabajo .mt-col-h { color: var(--st-trabajo); } .mt-col--publicada .mt-col-h { color: var(--st-publicada); }
.mt-col-n { margin-left: auto; min-width: 26px; padding: 0 7px; border-radius: 99px; background: var(--hoja); font: 600 13px/1.7 var(--mono); color: var(--tinta); text-align: center; }
.mt-cards { display: grid; gap: 10px; }
.mt-card { position: relative; display: grid; gap: 6px; padding: 12px 14px 14px; border-radius: 8px; background: var(--hoja); border: 1px solid var(--linea-2); box-shadow: 0 1px 0 rgba(21,22,22,.04); }
.mt-card-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.mt-card-t { font: 500 16px/1.3 var(--sans); }
.mt-card-t a { display: flex; align-items: center; min-height: 44px; text-decoration: none; }
.mt-card-t a:hover { text-decoration: underline; text-decoration-color: var(--bronce); text-underline-offset: 3px; }
.mt-card-meta { font-size: 13px; color: var(--tinta-2); }
.mt-card-state { justify-self: start; }
.mt-card--publicada { background: #fbfbf9; }
@media (min-width: 1100px) {
  .mt-sol-layout.has-panel { grid-template-columns: minmax(0, 1fr) minmax(360px, 400px); }
  .mt-sol-layout.has-panel .mt-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1099px) { .mt-sol-layout.has-panel .mt-board { display: none; } .mt-board { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .mt-board { grid-template-columns: 1fr; } }
.mt-panel { padding: 18px 22px 24px; border-radius: var(--r); background: var(--hoja); border: 1px solid var(--linea); box-shadow: 0 24px 60px rgba(21,22,22,.10); }
@media (min-width: 1100px) { .mt-panel { position: sticky; top: 20px; } }
.mt-back { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; margin: 0 0 6px -4px; padding-right: 8px; font-weight: 600; font-size: 15px; text-underline-offset: 3px; }
.mt-back .mt-ico { width: 18px; height: 18px; }
.mt-panel-t { margin: 4px 0 16px; font: 400 26px/1.15 var(--display); letter-spacing: -.02em; }
.mt-panel-t:focus { outline: none; }
.mt-panel-t:focus-visible { outline: 3px solid var(--tinta); }
.mt-kv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; padding: 14px 0; border-block: 1px solid var(--linea-2); }
.mt-kv dt { font: 500 12px/1.3 var(--mono); color: var(--tinta-2); }
.mt-kv dd { margin-top: 3px; font-size: 15px; }
.mt-panel-d { margin: 16px 0; }
.mt-track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin: 18px 0; counter-reset: t; }
.mt-track-s { position: relative; display: grid; justify-items: center; gap: 6px; padding-top: 2px; font-size: 12px; font-weight: 600; text-align: center; color: var(--tinta-2); }
.mt-track-s::before { content: ""; position: absolute; top: 17px; left: calc(-50% + 20px); right: calc(50% + 20px); height: 2px; background: var(--linea); }
.mt-track-s:first-child::before { display: none; }
.mt-track-s.is-done::before, .mt-track-s.is-now::before { background: var(--tinta); }
.mt-track-ico { width: 34px; height: 34px; padding: 7px; border-radius: 50%; border: 1.5px solid var(--linea); background: var(--hoja); stroke-width: 2; }
.mt-track-s.is-done .mt-track-ico { border-color: var(--tinta); }
.mt-track-s.is-now { color: var(--tinta); }
.mt-track-s.is-now .mt-track-ico { border-color: var(--tinta); background: var(--tinta); color: #fff; }
.mt-panel .mt-btn--primary { width: 100%; }
.mt-panel .mt-note { margin-top: 8px; }
.mt-done { display: flex; align-items: center; gap: 8px; padding: 12px; border-radius: 8px; background: var(--st-publicada-bg); color: var(--st-publicada); font-weight: 600; }
.mt-hist { display: grid; gap: 8px; }
.mt-hist li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 14px; }
.mt-hist .mt-mono { min-width: 92px; color: var(--tinta-2); }
.mt-hist-n { font-size: 13px; color: var(--tinta-2); }
/* Formulario de nueva solicitud */
.mt-form fieldset { margin-top: 18px; }
.mt-form legend { margin-bottom: 8px; font: 600 15px/1.3 var(--sans); }
.mt-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.mt-opts--col { flex-direction: column; }
.mt-opt { position: relative; display: inline-flex; }
.mt-opt input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.mt-opt span { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 9px 14px; border: 1px solid var(--linea); border-radius: 8px; background: var(--hoja); font-size: 14px; font-weight: 500; cursor: pointer; }
.mt-opts--col .mt-opt span { width: 100%; }
.mt-opt input:checked + span { border-color: var(--tinta); background: var(--tinta); color: #fff; }
.mt-opt input:focus-visible + span { outline: 3px solid var(--tinta); outline-offset: 2px; }
.mt-opt .mt-prio-ico { color: currentColor; }
.mt-preview { margin: 20px 0 16px; padding: 12px 14px; border-radius: 8px; border: 1px solid var(--linea-2); font-size: 14px; color: var(--tinta-2); }
.mt-preview b { color: var(--tinta); }
.mt-form-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.mt-form-actions .mt-btn--primary { width: auto; flex: 1 1 200px; }

/* ——— Plan ——— */
.mt-plan-head { max-width: 560px; margin-bottom: 22px; }
.mt-big-l { display: flex; align-items: baseline; gap: 6px; }
.mt-checklist { display: grid; gap: 0; max-width: 820px; border-top: 1px solid var(--linea); }
.mt-task { border-bottom: 1px solid var(--linea); }
.mt-check { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; min-height: 56px; padding: 14px 6px; cursor: pointer; }
div.mt-check { cursor: default; }
/* La casilla nativa (invisible) cubre toda la fila: al recibir el foco, el navegador desplaza la fila entera a la vista. */
.mt-check input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.mt-check:hover { background: var(--hoja); }
.mt-box { display: grid; place-items: center; width: 28px; height: 28px; margin-top: 1px; border: 1.8px solid var(--tinta-2); border-radius: 6px; background: var(--hoja); color: #fff; }
.mt-box svg { width: 22px; height: 22px; }
.mt-box-check { stroke-dasharray: 1; stroke-dashoffset: 1; }
.mt-task.is-done .mt-box { background: var(--st-publicada); border-color: var(--st-publicada); }
.mt-task.is-done .mt-box-check { stroke-dashoffset: 0; }
.mt-check input:focus-visible ~ .mt-box { outline: 3px solid var(--tinta); outline-offset: 3px; }
.mt-task-body { display: grid; gap: 4px; }
.mt-task-t { justify-self: start; font-size: 16px; font-weight: 500; background: linear-gradient(var(--tinta-2), var(--tinta-2)) no-repeat 0 55% / 0% 1px; }
.mt-task.is-done .mt-task-t { color: var(--tinta-2); background-size: 100% 1px; }
.mt-task-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--tinta-2); }
.mt-task-st { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: var(--st-publicada); }
.mt-task-st--pend { color: var(--tinta-2); }
.mt-task-ico { width: 15px; height: 15px; stroke-width: 2.2; }

/* ——— Bitácora ——— */
.mt-truth { display: flex; gap: 10px; align-items: flex-start; max-width: 760px; margin-bottom: 18px; padding: 12px 14px; border-left: 3px solid var(--bronce); background: var(--hoja); font-size: 14px; color: var(--tinta-2); }
.mt-truth-ico { color: var(--bronce); }
.mt-timeline { position: relative; max-width: 820px; margin-top: 10px; }
.mt-timeline::before { content: ""; position: absolute; left: 17px; top: 8px; bottom: 8px; width: 2px; background: var(--linea); }
.mt-entry { position: relative; display: grid; grid-template-columns: 36px 1fr; gap: 16px; padding-bottom: 28px; overflow: hidden; }
.mt-entry-dot { position: relative; z-index: 1; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--papel); border: 1.5px solid var(--tinta); }
.mt-entry-dot .mt-ico { width: 18px; height: 18px; }
.mt-entry--version .mt-entry-dot { background: var(--tinta); color: #fff; }
.mt-entry--sesion .mt-entry-dot { border-color: var(--bronce); color: var(--bronce); background: var(--bronce-t); }
.mt-entry-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 6px; font-size: 13px; color: var(--tinta-2); }
.mt-entry-t { margin: 6px 0 6px; font: 400 22px/1.2 var(--display); letter-spacing: -.02em; }
.mt-entry-que { display: grid; gap: 4px; margin-bottom: 8px; }
.mt-entry-que li { position: relative; padding-left: 16px; font-size: 15px; }
.mt-entry-que li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 6px; height: 1.5px; background: var(--tinta-2); }
.mt-entry-why { font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--tinta-2); }

/* ——— Antes y después ——— */
.mt-cmp-grid { display: grid; gap: 28px; align-items: start; }
@media (min-width: 1100px) { .mt-cmp-grid { grid-template-columns: minmax(0, 1fr) 300px; } }
.mt-cmp { min-width: 0; }
.mt-cmp-cap { margin-bottom: 10px; }
.mt-cmp-label { display: block; font-weight: 600; }
.mt-cmp-hint { font-size: 14px; color: var(--tinta-2); }
.mt-cmp-frame { position: relative; overflow: hidden; border-radius: var(--r); border: 1px solid var(--linea); background: var(--papel-2); box-shadow: 0 26px 60px rgba(21,22,22,.12); aspect-ratio: 1440 / 900; touch-action: pan-y; }
.mt-cmp--celular .mt-cmp-frame { aspect-ratio: 390 / 844; max-width: 340px; margin-inline: auto; border-radius: 26px; border: 8px solid var(--tinta); }
.mt-cmp-frame:has(.mt-cmp-range:focus-visible) { outline: 3px solid var(--tinta); outline-offset: 4px; }
.mt-cmp-a, .mt-cmp-b { position: absolute; inset: 0; }
.mt-cmp-b { clip-path: inset(0 0 0 var(--pos, 50%)); }
.mt-cmp .mt-pic, .mt-cmp img { width: 100%; height: 100%; }
.mt-cmp img { object-fit: cover; object-position: top center; }
.mt-cmp-handle { position: absolute; top: 0; bottom: 0; left: var(--pos, 50%); width: 0; pointer-events: none; }
.mt-cmp-handle::before { content: ""; position: absolute; top: 0; bottom: 0; left: -1px; width: 2px; background: #fff; box-shadow: 0 0 0 1px rgba(21,22,22,.35); }
/* Asa: una hoja de albanene que se desliza sobre la captura. */
.mt-cmp-grip { position: absolute; top: 50%; left: 0; display: grid; place-items: center; width: 48px; height: 48px; margin: -24px 0 0 -24px; border-radius: 50%; background: rgba(255,255,255,.92); border: 1.5px solid var(--tinta); color: var(--tinta); box-shadow: 0 8px 24px rgba(21,22,22,.25); }
.mt-cmp-frame:has(.mt-cmp-range:focus-visible) .mt-cmp-grip { background: var(--tinta); color: #fff; }
/* Extremos («Solo v5» / «Solo v6»): el asa se apoya dentro del marco y la etiqueta del lado que no se ve se retira. */
.mt-cmp-frame.is-v5-only .mt-cmp-grip { margin-left: -56px; }
.mt-cmp-frame.is-v6-only .mt-cmp-grip { margin-left: 8px; }
.mt-cmp-frame.is-v5-only .mt-cmp-tag--b, .mt-cmp-frame.is-v6-only .mt-cmp-tag--a { visibility: hidden; }
.mt-cmp-tag { position: absolute; top: 12px; padding: 4px 9px; border-radius: 4px; background: rgba(18,19,20,.86); color: #fff; font: 600 12px/1.4 var(--mono); pointer-events: none; }
.mt-cmp-tag--a { left: 12px; }
.mt-cmp-tag--b { right: 12px; }
.mt-cmp--celular .mt-cmp-tag-x { display: none; }
@media (max-width: 640px) { .mt-cmp-tag-x { display: none; } }
@media (max-width: 1099px) { [data-view-body="solicitudes"]:has(.has-panel) :is(.mt-filters, .mt-count) { display: none; } }
.mt-cmp--celular .mt-cmp-fc { max-width: 340px; margin-inline: auto; }
.mt-cmp-range { scroll-margin-top: 72px; position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; -webkit-appearance: none; appearance: none; }
.mt-cmp-range::-webkit-slider-thumb { -webkit-appearance: none; width: 1px; height: 100vh; }
/* Pulgar nativo de 1 px: el valor coincide con la posición del puntero (el objetivo táctil es todo el marco). */
.mt-cmp-fc { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; margin-top: 12px; font-size: 14px; color: var(--tinta-2); }
.mt-cmp-steps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.mt-cmp-steps .mt-btn { flex: 1 1 auto; }
.mt-cmp-list { display: grid; gap: 10px; margin-top: 12px; }
.mt-cmp-list li { position: relative; padding-left: 18px; font-family: var(--serif); font-size: 16px; line-height: 1.5; color: var(--tinta-2); }
.mt-cmp-list li::before { content: ""; position: absolute; left: 0; top: .62em; width: 8px; height: 8px; border-radius: 50%; background: var(--bronce); }
.mt-credit { margin-top: 22px; font-size: 13px; color: var(--tinta-2); }
.mt-credit-l { font-size: 14px; }
.mt-pairs { display: grid; gap: 44px; }
.mt-pair-imgs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 12px 0; }
.mt-pair--celular .mt-pair-imgs { grid-template-columns: repeat(2, minmax(0, 180px)); }
.mt-pair-imgs .mt-pic { border: 1px solid var(--linea); border-radius: 6px; overflow: hidden; }
.mt-pair-imgs img { width: 100%; height: auto; }
.mt-pair-imgs figcaption { margin-top: 6px; font-size: 12px; color: var(--tinta-2); }
@media (max-width: 640px) { .mt-pair--escritorio .mt-pair-imgs { grid-template-columns: 1fr; } }

/* ——— Propuestas ——— */
.mt-props { display: grid; gap: 18px; }
@media (min-width: 900px) { .mt-props { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mt-prop { display: grid; grid-template-rows: auto 1fr; overflow: hidden; border-radius: var(--r); background: var(--hoja); border: 1px solid var(--linea); }
.mt-prop--pospuesta { background: #fbfbf9; }
.mt-prop-sketch { height: 150px; padding: 18px; background: var(--papel-2); border-bottom: 1px solid var(--linea); }
.mt-prop-b { display: grid; align-content: start; gap: 10px; padding: 18px 20px 20px; }
.mt-prop-t { font: 400 24px/1.15 var(--display); letter-spacing: -.02em; }
.mt-prop-need { font-size: 14px; color: var(--tinta-2); }
.mt-prop-st { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--tinta-2); }
.mt-prop-st .mt-ico { width: 18px; height: 18px; }
.mt-prop-st--ok { color: var(--st-publicada); }
.mt-prop-st--later { color: var(--st-trabajo); }
.mt-prop-acts { display: flex; flex-wrap: wrap; gap: 8px; }
/* Bocetos propios (HTML y CSS) */
.mt-sk { position: relative; height: 100%; border: 1.5px solid var(--tinta-2); background: var(--hoja); }
.mt-sk--encuadre .mt-sk-arcos { position: absolute; inset: 22% 8% 0; display: flex; gap: 6%; align-items: flex-end; }
.mt-sk--encuadre .mt-sk-arcos i { flex: 1; height: 88%; border: 1.5px solid var(--tinta-2); border-bottom: 0; border-radius: 999px 999px 0 0; }
.mt-sk-frame { position: absolute; left: 4%; right: 4%; height: 42%; padding: 2px 6px; border: 2px dashed; font: 600 11px/1.3 var(--mono); }
.mt-sk-frame--hoy { top: 4%; border-color: var(--tinta-2); color: var(--tinta-2); }
.mt-sk-frame--nuevo { top: 30%; border-color: var(--bronce); color: var(--bronce); text-align: right; }
.mt-sk--materiales { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 6px; }
.mt-sk--materiales span { display: flex; align-items: flex-end; padding: 4px 6px; background: var(--c); font: 600 11px/1.2 var(--mono); color: var(--tinta); }
.mt-sk--plano { display: grid; grid-template-columns: 1fr 1fr 1.2fr; grid-template-rows: 1fr 1fr; gap: 0; }
.mt-sk-r { border: 1px solid var(--tinta-2); }
.mt-sk-r1 { grid-row: span 2; } .mt-sk-r2.is-on { background: var(--bronce-t); outline: 2px solid var(--bronce); outline-offset: -3px; }
.mt-sk-photo { grid-column: 3; grid-row: 1 / span 2; display: grid; place-items: center; margin: 8px; background: repeating-linear-gradient(135deg, var(--papel-2) 0 8px, #dcdad3 8px 16px); font: 600 11px/1.2 var(--mono); color: var(--tinta-2); }
.mt-sk--idioma { padding: 14px 16px; display: grid; align-content: start; gap: 10px; }
.mt-sk-lang { justify-self: end; padding: 2px 8px; border: 1px solid var(--tinta-2); border-radius: 99px; font: 600 11px/1.4 var(--mono); color: var(--tinta-2); }
.mt-sk-lang b { color: var(--tinta); }
.mt-sk-l { height: 10px; background: var(--papel-2); border-radius: 3px; }
.mt-sk-l--s { width: 60%; }

/* ——— Pie ——— */
.mt-footer { background: var(--noche); color: #d9d8d2; }
.mt-footer-in { display: grid; gap: 14px; padding: 36px clamp(16px, 3.4vw, 48px) 44px; max-width: 1100px; font-size: 14px; }
.mt-footer b { color: #fff; }
.mt-footer-links { display: flex; flex-wrap: wrap; gap: 4px 22px; }
.mt-footer-links a { display: inline-flex; align-items: center; min-height: 44px; color: #fff; text-underline-offset: 3px; }
.mt-footer-small { color: #b9b8b2; }
@media (min-width: 1100px) { .mt-footer-in { margin-left: 252px; } }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }
@media print { .mt-demo-bar, .mt-side, .mt-skip { display: none; } }