/*
  ADN Producción · CP03
  Hoja compacta de Trabajo Técnico.

  Adaptación encapsulada del componente canónico de Trabajo Técnico.  Ningún
  selector sale de #technicalDetail / #detailLayer para no alterar el tablero,
  el panel contextual ni el Control de la Prenda heredado.
*/

#technicalDetail{
  --tt-blue:#123f67;
  --tt-blue-2:#1b5a8d;
  --tt-blue-soft:#eaf2f8;
  --tt-gold:#c99632;
  --tt-tech:#f3c44e;
  --tt-tech-soft:#fff7d6;
  --tt-tech-deep:#8a6200;
  --tt-ink:#1d2733;
  --tt-muted:#647386;
  --tt-line:#dce4ec;
  --tt-surface:#fff;
  --tt-surface-2:#f5f8fb;
  --tt-surface-3:#eef3f7;
  --tt-ok:#19754b;
  --tt-ok-bg:#e9f7f0;
  --tt-warn:#9a6611;
  --tt-warn-bg:#fff5da;
  --tt-danger:#b42318;
  --tt-danger-bg:#fff0ef;
  --tt-info:#175a8a;
  --tt-info-bg:#e9f4fb;
  --tt-shadow:0 16px 40px rgba(19,54,84,.12);
  --tt-shadow-sm:0 8px 22px rgba(19,54,84,.09);
  --tt-radius:16px;
  --tt-radius-sm:10px;
  color:var(--tt-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.45;
}

#technicalDetail *,
#technicalDetail *::before,
#technicalDetail *::after{box-sizing:border-box}

/* #boardView #detailLayer is hidden by the canonical board stylesheet.  The
   extra specificity here only reveals the technical surface when CP03 opens. */
#boardView #detailLayer.tt-open,
#boardView #detailLayer.cp03-open,
#boardView #detailLayer[data-detail="technical"],
#boardView #detailLayer[aria-hidden="false"]:has(#technicalDetail .tt-sheet),
#boardView #detailLayer[aria-hidden="false"]:has(#technicalDetail .tt-workspace),
#boardView #detailLayer:has(#technicalDetail .tt-sheet.is-open),
#boardView #detailLayer:has(#technicalDetail .tt-workspace.is-open),
#boardView #detailLayer:has(#technicalDetail .workspace.open){
  position:fixed;
  inset:0;
  z-index:1000;
  display:block;
  /* La corrección de usabilidad conserva esta capa como el único desplazamiento vertical de la
     Hoja.  Sidebars and checklist never create a second scrolling trap. */
  overflow-x:hidden;
  overflow-y:auto;
  background:#eef3f7;
}

#detailLayer.tt-open #physicalDetail,
#detailLayer.cp03-open #physicalDetail,
#detailLayer[data-detail="technical"] #physicalDetail{display:none!important}

#technicalDetail .tt-sheet,
#technicalDetail .tt-workspace,
#technicalDetail .workspace{
  width:100%;
  min-height:100dvh;
  height:auto;
  display:none;
  overflow:visible;
  color:var(--tt-ink);
  background:#eef3f7;
}

#technicalDetail .tt-sheet.is-open,
#technicalDetail .tt-sheet.open,
#technicalDetail .tt-workspace.is-open,
#technicalDetail .tt-workspace.open,
#technicalDetail .workspace.open{display:block}

/* Fixed, intentionally dense action header. */
#technicalDetail .tt-sheet__header,
#technicalDetail .tt-workspace__top,
#technicalDetail .workspace__top{
  position:sticky;
  top:0;
  z-index:12;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:14px 20px;
  color:#fff;
  background:linear-gradient(135deg,#0e3558 0%,var(--tt-blue) 65%,#1a5a8e 100%);
  border-bottom:4px solid var(--tt-gold);
  box-shadow:0 3px 12px rgba(13,52,87,.16);
}

#technicalDetail .tt-sheet__title,
#technicalDetail .tt-workspace__top>div:first-child,
#technicalDetail .workspace__top>div:first-child{min-width:0}

#technicalDetail .tt-sheet__header h1,
#technicalDetail .tt-sheet__header h2,
#technicalDetail .tt-workspace__top h1,
#technicalDetail .workspace__top h1{
  margin:0;
  color:#fff;
  font-size:1.2rem;
  line-height:1.2;
}

#technicalDetail .tt-sheet__header p,
#technicalDetail .tt-workspace__top p,
#technicalDetail .workspace__top p{
  margin:4px 0 0;
  color:rgba(255,255,255,.76);
  font-size:.82rem;
}

#technicalDetail .tt-sheet__actions,
#technicalDetail .tt-workspace__actions,
#technicalDetail .workspace__actions,
#technicalDetail .tt-action-bar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  justify-content:flex-end;
}

#technicalDetail .tt-button,
#technicalDetail .btn{
  min-height:38px;
  border:1px solid transparent;
  border-radius:10px;
  padding:9px 13px;
  font:inherit;
  font-weight:800;
  line-height:1.2;
  text-align:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,transform .14s ease;
}

#technicalDetail .tt-button:hover:not(:disabled),
#technicalDetail .btn:hover:not(:disabled){transform:translateY(-1px)}

#technicalDetail .tt-button:disabled,
#technicalDetail .btn:disabled{opacity:.48;cursor:not-allowed;transform:none}

#technicalDetail .tt-finish-gate{display:inline-grid;gap:2px}
#technicalDetail .tt-finish-gate small{max-width:145px;color:rgba(255,255,255,.76);font-size:.62rem;line-height:1.2;text-align:center}

#technicalDetail .tt-button--primary,
#technicalDetail .btn--primary{color:#fff;background:var(--tt-blue);box-shadow:0 6px 14px rgba(18,63,103,.18)}
#technicalDetail .tt-button--primary:hover:not(:disabled),
#technicalDetail .btn--primary:hover:not(:disabled){background:#0e3558}

#technicalDetail .tt-button--secondary,
#technicalDetail .btn--secondary{color:var(--tt-blue);background:rgba(255,255,255,.96);border-color:#c9d6e1}
#technicalDetail .tt-button--secondary:hover:not(:disabled),
#technicalDetail .btn--secondary:hover:not(:disabled){background:var(--tt-blue-soft)}

#technicalDetail .tt-button--gold,
#technicalDetail .btn--gold{color:#1f2730;background:var(--tt-gold);border-color:#b88220}
#technicalDetail .tt-button--tech,
#technicalDetail .btn--tech{color:#3c2c00;background:var(--tt-tech);border-color:#dfad28}
#technicalDetail .tt-button--danger,
#technicalDetail .btn--danger{color:#fff;background:var(--tt-danger)}
#technicalDetail .tt-button--danger-soft,
#technicalDetail .btn--danger-soft{color:var(--tt-danger);background:var(--tt-danger-bg);border-color:#f1bbb6}
#technicalDetail .tt-button--ghost,
#technicalDetail .btn--ghost{color:var(--tt-blue);background:transparent;border-color:transparent}
#technicalDetail .tt-button--small,
#technicalDetail .btn--small{min-height:31px;padding:7px 10px;border-radius:8px;font-size:.8rem}

/* Two-pane Hoja: the single document scrolls through the native detail
   layer.  This preserves its compact information column without hiding the
   last applicable step or Finalizar trabajo behind nested scrollbars. */
#technicalDetail .tt-sheet__body,
#technicalDetail .tt-workspace__body,
#technicalDetail .workspace__body{
  min-height:calc(100dvh - 84px);
  display:grid;
  grid-template-columns:282px minmax(0,1fr);
  align-items:start;
  overflow:visible;
}

#technicalDetail .tt-sheet__side,
#technicalDetail .tt-workspace__side,
#technicalDetail .workspace__side{
  min-width:0;
  overflow:visible;
  padding:18px;
  background:#fff;
  border-right:1px solid var(--tt-line);
}

#technicalDetail .tt-sheet__main,
#technicalDetail .tt-workspace__main,
#technicalDetail .workspace__main{
  min-width:0;
  overflow:visible;
  padding:18px 22px 92px;
  background:#eef3f7;
}

#technicalDetail .tt-work-summary,
#technicalDetail .work-summary-card{
  border:1px solid #ead27a;
  border-radius:14px;
  padding:14px;
  background:var(--tt-tech-soft);
}

#technicalDetail .tt-work-summary h2,
#technicalDetail .work-summary-card h2{margin:0;color:#5b4500;font-size:1rem}

#technicalDetail .tt-work-summary p,
#technicalDetail .work-summary-card p{margin:5px 0 0;color:#6f6134;font-size:.78rem}

#technicalDetail .tt-progress,
#technicalDetail .progress{height:8px;overflow:hidden;border-radius:999px;background:rgba(88,75,27,.14)}

#technicalDetail .tt-progress>span,
#technicalDetail .progress>span{display:block;width:var(--tt-progress,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--tt-gold),#e8b729)}

#technicalDetail .tt-big-progress,
#technicalDetail .big-progress{margin-top:13px}

#technicalDetail .tt-big-progress .tt-progress,
#technicalDetail .big-progress .progress{height:11px;background:rgba(93,74,11,.13)}

/* The procedure checklist and the physical/technical delivery balance are
   intentionally separate facts.  A completed checklist must never read as a
   delivered quantity, and a delivered quantity must never imply every step. */
#technicalDetail .tt-procedure-progress{
  margin-top:16px;
  border:1px solid #ead27a;
  border-radius:12px;
  padding:12px;
  background:var(--tt-tech-soft);
}

#technicalDetail .tt-procedure-progress .big-progress{margin-top:0}

#technicalDetail .tt-procedure-progress--pending{border-color:#e2c666;background:#fff9df}
#technicalDetail .tt-procedure-progress--none{border-color:#cbd9e5;background:#f6f9fb}
#technicalDetail .tt-procedure-progress--unavailable{border-color:#e6a39b;background:#fff4f2}
#technicalDetail .tt-procedure-progress--required{border-color:#e7bf73;background:#fff9e8}
#technicalDetail .tt-procedure-progress--readonly{border-color:#b8c8d6;background:#f3f7fa}
#technicalDetail .tt-procedure-state{display:grid;gap:4px;margin:0;color:#64562c;font-size:.76rem;line-height:1.35}
#technicalDetail .tt-procedure-progress--none .tt-procedure-state{color:#536273}
#technicalDetail .tt-procedure-progress--unavailable .tt-procedure-state{color:#7a342d}
#technicalDetail .tt-procedure-progress--readonly .tt-procedure-state{color:#536273}
#technicalDetail .tt-procedure-state strong{color:var(--tt-blue);font-size:.84rem}
#technicalDetail .tt-procedure-state b{color:inherit;font-size:.73rem}
#technicalDetail .tt-procedure-version{margin:8px 0 0;color:#536273;font-size:.72rem;font-weight:760}

#technicalDetail .tt-readonly-banner{
  display:grid;
  gap:4px;
  margin:0 0 14px;
  border:1px solid #b8c8d6;
  border-left:4px solid #617f96;
  border-radius:11px;
  padding:11px 13px;
  color:#42566a;
  background:#f2f6f9;
  font-size:.8rem;
  line-height:1.35;
}
#technicalDetail .tt-readonly-banner strong{color:#234d6a;font-size:.9rem}
#technicalDetail .tt-readonly-note{display:grid;gap:4px;margin-top:14px;border-top:1px solid var(--tt-line);padding-top:12px;color:#4f6070;font-size:.78rem;line-height:1.35}
#technicalDetail .tt-readonly-note>span{color:#234d6a;font-weight:850}
#technicalDetail .tt-readonly-note p{margin:0;white-space:pre-wrap}

/* Historical T with no procedure reference stays in the same Hoja.  This is
   a compact, required configuration block, not another technical surface. */
#technicalDetail .tt-procedure-decision{
  margin:0 0 14px;
  border:1px solid #e7bf73;
  border-left:4px solid var(--tt-gold);
  border-radius:12px;
  background:#fffaf0;
}

#technicalDetail .tt-procedure-decision__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

#technicalDetail .tt-procedure-decision__head h2{margin:0;color:var(--tt-blue);font-size:1rem}
#technicalDetail .tt-procedure-decision__head p{margin:5px 0 0;color:#5c6470;font-size:.79rem;line-height:1.4}
#technicalDetail .tt-procedure-decision__step{flex:0 0 auto;border-radius:999px;padding:4px 8px;color:#78510d;background:#fff0c6;font-size:.68rem;font-weight:850;white-space:nowrap}

#technicalDetail .tt-procedure-decision__actions{
  display:flex;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:9px;
}

#technicalDetail .tt-procedure-decision__actions .tt-field{flex:1 1 270px;margin:0}
#technicalDetail .tt-procedure-decision__actions .tt-field>span{display:block;margin-bottom:5px;color:#536273;font-size:.76rem;font-weight:850}
#technicalDetail .tt-procedure-decision__or{color:#68727c;font-size:.75rem;font-weight:750}
#technicalDetail .tt-procedure-decision .tt-field-hint{margin:10px 0 0;color:#5c6470;line-height:1.4}

#technicalDetail .tt-technical-balance{
  border:1px solid #cbd9e5;
  border-radius:12px;
  padding:12px;
  background:var(--tt-blue-soft);
}

#technicalDetail .tt-progress-stop{
  margin:9px 0 0;
  color:var(--tt-danger);
  font-size:.74rem;
  font-weight:800;
  line-height:1.35;
}

#technicalDetail .tt-progress-line,
#technicalDetail .big-progress__line{
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin-top:6px;
  color:#65582f;
  font-size:.75rem;
  font-weight:800;
}

#technicalDetail .tt-side-section,
#technicalDetail .side-section{margin-top:16px}

#technicalDetail .tt-side-section>h3,
#technicalDetail .side-section>h3{
  margin:0 0 8px;
  color:var(--tt-blue);
  font-size:.83rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

#technicalDetail .tt-info-list,
#technicalDetail .info-list,
#technicalDetail .tt-list-stack,
#technicalDetail .list-stack{display:grid;gap:8px}

#technicalDetail .tt-info-item,
#technicalDetail .info-item{
  padding:9px 10px;
  border:1px solid var(--tt-line);
  border-radius:9px;
  background:var(--tt-surface-2);
}

#technicalDetail .tt-info-item>span,
#technicalDetail .info-item>span{display:block;color:var(--tt-muted);font-size:.68rem;font-weight:850}

#technicalDetail .tt-info-item>strong,
#technicalDetail .info-item>strong{display:block;margin-top:2px;color:#2f3d4c;font-size:.8rem;overflow-wrap:anywhere}

/* Tabs and compact overview. */
#technicalDetail .tt-tabs,
#technicalDetail .workspace-tabs{
  position:sticky;
  top:-18px;
  z-index:5;
  display:flex;
  gap:5px;
  overflow:auto;
  margin:0 0 14px;
  padding:0 0 10px;
  background:#eef3f7;
  border-bottom:1px solid #d4dfe8;
}

#technicalDetail .tt-tabs>button,
#technicalDetail .workspace-tabs>button{
  flex:0 0 auto;
  border:0;
  border-bottom:3px solid transparent;
  padding:10px 12px;
  color:var(--tt-muted);
  background:transparent;
  font:inherit;
  font-weight:850;
  white-space:nowrap;
  cursor:pointer;
}

#technicalDetail .tt-tabs>button.active,
#technicalDetail .tt-tabs>button[aria-selected="true"],
#technicalDetail .workspace-tabs>button.active,
#technicalDetail .workspace-tabs>button[aria-selected="true"]{color:var(--tt-blue);border-bottom-color:var(--tt-gold)}

#technicalDetail .tt-checklist-head,
#technicalDetail .checklist-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

#technicalDetail .tt-checklist-head h2,
#technicalDetail .checklist-head h2{margin:0;color:var(--tt-blue);font-size:1.2rem}

#technicalDetail .tt-checklist-head p,
#technicalDetail .checklist-head p{margin:4px 0 0;color:var(--tt-muted);font-size:.8rem}

#technicalDetail .tt-checklist-search,
#technicalDetail .checklist-search{
  width:min(330px,100%);
  min-width:180px;
  min-height:42px;
  border:1px solid #cbd7e1;
  border-radius:10px;
  padding:9px 10px;
  color:var(--tt-ink);
  background:#fff;
  font:inherit;
  outline:0;
}

#technicalDetail .tt-checklist-search:focus,
#technicalDetail .checklist-search:focus{border-color:var(--tt-blue-2);box-shadow:0 0 0 3px rgba(27,90,141,.12)}

#technicalDetail .tt-legend,
#technicalDetail .checklist-legend{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:10px;
  margin:-3px 0 10px;
  color:var(--tt-muted);
  font-size:.7rem;
}

#technicalDetail .tt-legend span,
#technicalDetail .checklist-legend span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}

#technicalDetail .tt-legend i,
#technicalDetail .checklist-legend i{
  width:21px;
  height:21px;
  display:grid;
  place-items:center;
  border:1px solid #cbd6df;
  border-radius:6px;
  color:#536273;
  background:#fff;
  font-style:normal;
  font-weight:950;
}

#technicalDetail .tt-panel,
#technicalDetail .panel{
  overflow:hidden;
  border:1px solid var(--tt-line);
  border-radius:var(--tt-radius);
  background:var(--tt-surface);
  box-shadow:var(--tt-shadow-sm);
}

#technicalDetail .tt-panel__head,
#technicalDetail .panel__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 18px;
  border-bottom:1px solid var(--tt-line);
}

#technicalDetail .tt-panel__head h3,
#technicalDetail .panel__head h3{margin:0;color:var(--tt-blue);font-size:1rem}

#technicalDetail .tt-panel__body,
#technicalDetail .panel__body{padding:18px}

#technicalDetail .tt-procedure-intro,
#technicalDetail .procedure-intro{margin-bottom:13px}

#technicalDetail .tt-procedure-intro h3,
#technicalDetail .procedure-intro h3{margin:0 0 5px;color:var(--tt-blue);font-size:.98rem}

#technicalDetail .tt-procedure-intro p,
#technicalDetail .procedure-intro p{margin:0;color:var(--tt-muted);font-size:.82rem}

#technicalDetail .tt-notice,
#technicalDetail .notice{
  padding:11px 13px;
  border:1px solid #cfe0ec;
  border-radius:11px;
  color:#24465d;
  background:var(--tt-info-bg);
  font-size:.87rem;
}

#technicalDetail .tt-notice strong,
#technicalDetail .notice strong{color:var(--tt-blue)}
#technicalDetail .tt-notice--tech,
#technicalDetail .notice--tech{color:#5f4900;background:var(--tt-tech-soft);border-color:#ecd783}
#technicalDetail .tt-notice--warn,
#technicalDetail .notice--warn{color:#6e4b0c;background:var(--tt-warn-bg);border-color:#ebcf8d}
#technicalDetail .tt-notice--danger,
#technicalDetail .notice--danger{color:#84231b;background:var(--tt-danger-bg);border-color:#efc0bb}

/* Procedure sections and their deliberately single-row controls. */
#technicalDetail .tt-check-section,
#technicalDetail .check-section{
  overflow:hidden;
  margin-bottom:11px;
  border:1px solid var(--tt-line);
  border-radius:13px;
  background:#fff;
  box-shadow:0 5px 14px rgba(20,48,70,.05);
}

#technicalDetail .tt-check-section__head,
#technicalDetail .check-section__head{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  border:0;
  padding:13px 15px;
  color:inherit;
  background:#f8fafb;
  text-align:left;
  font:inherit;
  cursor:pointer;
}

#technicalDetail .tt-check-section__head strong,
#technicalDetail .check-section__head strong{color:var(--tt-blue);font-size:.9rem}

#technicalDetail .tt-check-section__head small,
#technicalDetail .check-section__head small{display:block;margin-top:2px;color:var(--tt-muted);font-size:.71rem}

#technicalDetail .tt-section-progress,
#technicalDetail .section-progress{
  padding:5px 8px;
  border:1px solid var(--tt-line);
  border-radius:999px;
  color:#536273;
  background:#fff;
  font-size:.72rem;
  font-weight:900;
  white-space:nowrap;
}

#technicalDetail .tt-check-section__body,
#technicalDetail .check-section__body{padding:0 12px 10px}

#technicalDetail .tt-step,
#technicalDetail .check-step{
  min-height:43px;
  display:grid;
  grid-template-columns:26px minmax(260px,1.65fr) auto minmax(170px,.9fr) minmax(88px,max-content);
  gap:8px;
  align-items:center;
  border-top:1px solid var(--tt-line);
  padding:7px 2px;
}

#technicalDetail .tt-step:first-child,
#technicalDetail .check-step:first-child{border-top:0}

#technicalDetail .tt-step-number,
#technicalDetail .step-number{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:7px;
  color:#526170;
  background:var(--tt-surface-3);
  font-size:.67rem;
  font-weight:950;
}

#technicalDetail .tt-step__text,
#technicalDetail .check-step__text{min-width:0;color:#283746;font-size:.81rem;font-weight:710;line-height:1.28;overflow-wrap:anywhere}

#technicalDetail .tt-step--readonly,
#technicalDetail .check-step.tt-step--readonly{background:#f8fafb}
#technicalDetail .tt-step-readonly-status{
  display:inline-flex;
  min-height:27px;
  align-items:center;
  justify-content:center;
  border:1px solid #c7d3dd;
  border-radius:7px;
  padding:3px 7px;
  color:#445b6e;
  background:#eef3f6;
  font-size:.7rem;
  font-weight:850;
  white-space:nowrap;
}
#technicalDetail .tt-step-readonly-note{display:grid;gap:2px;min-width:0;margin:0;color:#5d6b77;font-size:.72rem;line-height:1.28}
#technicalDetail .tt-step-readonly-note b{color:#435d73;font-size:.68rem}
#technicalDetail .tt-step-readonly-note span{overflow-wrap:anywhere}

#technicalDetail .tt-step-statuses,
#technicalDetail .step-statuses{display:grid;grid-template-columns:repeat(4,27px);gap:4px;margin:0}

#technicalDetail .tt-step-controls{display:grid;gap:4px;justify-items:start}
#technicalDetail .tt-novelty-resolve{
  min-height:25px;
  border:1px solid #d9bd5d;
  border-radius:6px;
  padding:4px 7px;
  color:#78520a;
  background:#fff9df;
  font:inherit;
  font-size:.69rem;
  font-weight:850;
  line-height:1.1;
  cursor:pointer;
}
#technicalDetail .tt-novelty-resolve:hover{border-color:#ba9a31;background:#fff2bd}

#technicalDetail .tt-step-status,
#technicalDetail .step-status{
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  margin:0;
  border:1px solid #cbd6df;
  border-radius:6px;
  padding:0;
  color:#526170;
  background:#fff;
  font:inherit;
  font-size:.78rem;
  font-weight:950;
  line-height:1;
  cursor:pointer;
}

/* A PARE EL PROCESO row deliberately exposes only the domain-valid action.
   It stays inline with comment/evidence while its resolution remains visible. */
#technicalDetail .tt-step--stop{align-items:start;background:#fffaf8}
#technicalDetail .tt-stop-controls{min-width:0;padding-top:1px}
#technicalDetail .tt-stop-action,
#technicalDetail .tt-stop-resolved{
  min-height:29px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #d78a82;
  border-radius:7px;
  padding:5px 8px;
  color:#8b2b23;
  background:#fff2ef;
  font:inherit;
  font-size:.72rem;
  font-weight:850;
  line-height:1.15;
  text-align:center;
}

#technicalDetail .tt-stop-action{cursor:pointer}
#technicalDetail .tt-stop-action:hover{border-color:#ba5e55;background:#ffe7e2}
#technicalDetail .tt-stop-action--resolve{color:#78520a;border-color:#d9bd5d;background:#fff9df}
#technicalDetail .tt-stop-resolved{color:#27704a;border-color:#9bc9ad;background:#eff9f2}
#technicalDetail .tt-stop-state{
  grid-column:2 / -1;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:6px;
  margin:0;
  color:#70413c;
  font-size:.7rem;
  line-height:1.3;
}

#technicalDetail .tt-stop-state strong{color:#8b2b23;white-space:nowrap}
#technicalDetail .tt-stop-state--neutral{color:#566b7c}
#technicalDetail .tt-stop-state--neutral strong{color:#435d73}
#technicalDetail .tt-step--stop.tt-step--readonly .tt-step-readonly-note{grid-column:3 / 5}

#technicalDetail .tt-step-status:hover,
#technicalDetail .step-status:hover{border-color:#aebdca;background:#f4f7f9}

#technicalDetail .tt-step-status.active[data-status="pending"],
#technicalDetail .tt-step-status.active[data-status="pendiente"],
#technicalDetail .tt-step-status.is-active[data-status="pending"],
#technicalDetail .tt-step-status.is-active[data-status="pendiente"],
#technicalDetail .step-status.active[data-status="pending"],
#technicalDetail .step-status.active[data-status="pendiente"],
#technicalDetail .step-status.is-active[data-status="pending"],
#technicalDetail .step-status.is-active[data-status="pendiente"]{color:var(--tt-blue);background:#edf3f7;border-color:#9eb6c8}

#technicalDetail .tt-step-status.active[data-status="done"],
#technicalDetail .tt-step-status.active[data-status="hecho"],
#technicalDetail .tt-step-status.is-active[data-status="done"],
#technicalDetail .tt-step-status.is-active[data-status="hecho"],
#technicalDetail .step-status.active[data-status="done"],
#technicalDetail .step-status.active[data-status="hecho"],
#technicalDetail .step-status.is-active[data-status="done"],
#technicalDetail .step-status.is-active[data-status="hecho"]{color:var(--tt-ok);background:var(--tt-ok-bg);border-color:#8ec9ac}

#technicalDetail .tt-step-status.active[data-status="na"],
#technicalDetail .tt-step-status.active[data-status="no_aplica"],
#technicalDetail .tt-step-status.is-active[data-status="na"],
#technicalDetail .tt-step-status.is-active[data-status="no_aplica"],
#technicalDetail .step-status.active[data-status="na"],
#technicalDetail .step-status.active[data-status="no_aplica"],
#technicalDetail .step-status.is-active[data-status="na"],
#technicalDetail .step-status.is-active[data-status="no_aplica"]{color:#56616d;background:#edf1f4;border-color:#b8c3cc}

#technicalDetail .tt-step-status.active[data-status="novelty"],
#technicalDetail .tt-step-status.active[data-status="con_novedad"],
#technicalDetail .tt-step-status.is-active[data-status="novelty"],
#technicalDetail .tt-step-status.is-active[data-status="con_novedad"],
#technicalDetail .step-status.active[data-status="novelty"],
#technicalDetail .step-status.active[data-status="con_novedad"],
#technicalDetail .step-status.is-active[data-status="novelty"],
#technicalDetail .step-status.is-active[data-status="con_novedad"]{color:var(--tt-danger);background:var(--tt-danger-bg);border-color:#e69d96}

#technicalDetail .tt-step-comment,
#technicalDetail .step-comment{
  width:100%;
  min-width:0;
  height:31px;
  border:1px solid #ced9e2;
  border-radius:7px;
  padding:5px 8px;
  color:var(--tt-ink);
  background:#fff;
  font:inherit;
  font-size:.75rem;
  outline:0;
}

#technicalDetail .tt-step-comment::placeholder,
#technicalDetail .step-comment::placeholder{color:#9aa6b1}

#technicalDetail .tt-step-comment:disabled,
#technicalDetail .step-comment:disabled{color:#768391;background:#f2f5f7}

#technicalDetail .tt-step-comment.is-dirty,
#technicalDetail .step-comment.is-dirty,
#technicalDetail textarea[data-technical-general-note].is-dirty{border-color:#d1a92d;background:#fffdf4}

#technicalDetail .tt-step-file,
#technicalDetail .tt-step-file-button,
#technicalDetail .step-file-button,
#technicalDetail .step-file-readonly{
  position:relative;
  width:auto;
  min-width:88px;
  height:31px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:2px;
  border:1px solid #c9d6e1;
  border-radius:7px;
  padding:0 8px;
  color:var(--tt-blue);
  background:#fff;
  font:inherit;
  font-size:.78rem;
  font-weight:900;
  cursor:pointer;
}

#technicalDetail .tt-step-file-label,
#technicalDetail .step-file-label{white-space:nowrap;font-size:.72rem;line-height:1}

#technicalDetail .tt-step-file:hover,
#technicalDetail .tt-step-file-button:hover,
#technicalDetail .step-file-button:hover{background:var(--tt-blue-soft)}

#technicalDetail .tt-step-file.has-files,
#technicalDetail .tt-step-file-button.has-files,
#technicalDetail .step-file-button.has-files,
#technicalDetail .step-file-readonly.has-files{color:#665000;background:var(--tt-tech-soft);border-color:#dfc65b}
#technicalDetail .tt-step-file-readonly{cursor:default}

#technicalDetail .tt-step-file-count,
#technicalDetail .step-file-count{
  position:absolute;
  top:-6px;
  right:-5px;
  min-width:16px;
  height:16px;
  display:grid;
  place-items:center;
  padding:0 4px;
  border-radius:999px;
  color:#fff;
  background:var(--tt-blue);
  box-shadow:0 1px 4px rgba(0,0,0,.18);
  font-size:.58rem;
  font-weight:950;
}

#technicalDetail .tt-step-evidence{min-width:88px;display:grid;gap:5px;justify-items:start}
#technicalDetail .tt-step-evidence-list{width:100%;display:grid;gap:4px}
#technicalDetail .tt-step-evidence-item{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:4px;
  border:1px solid #d8e0e6;
  border-radius:7px;
  padding:4px 5px;
  color:#4a5a68;
  background:#f8fafb;
  font-size:.66rem;
}
#technicalDetail .tt-step-evidence-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#technicalDetail .tt-step-evidence-item .tt-evidence-remove{min-height:23px;padding:3px 5px;font-size:.64rem}

/* The ordinary novelty editor is deliberately an inline continuation of its
   checklist row.  It never relies on a blur/focus loop to create a record. */
#technicalDetail .tt-novelty-editor{
  grid-column:2 / -1;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  border:1px solid #e1ba76;
  border-radius:9px;
  padding:8px 9px;
  background:#fffaf0;
}
#technicalDetail .tt-novelty-editor p{display:grid;gap:2px;min-width:0;margin:0;color:#6d5121;font-size:.7rem;line-height:1.25}
#technicalDetail .tt-novelty-editor p strong{font-size:.73rem}
#technicalDetail .tt-novelty-editor__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}
#technicalDetail .tt-novelty-editor__actions .tt-button{min-height:29px;padding:5px 8px;font-size:.7rem}

#technicalDetail .tt-step-status:focus-visible,
#technicalDetail .step-status:focus-visible,
#technicalDetail .tt-step-file:focus-visible,
#technicalDetail .tt-step-file-button:focus-visible,
#technicalDetail .step-file-button:focus-visible,
#technicalDetail .tt-step-comment:focus,
#technicalDetail .step-comment:focus,
#technicalDetail .tt-evidence-remove:focus-visible,
#technicalDetail .tt-novelty-editor__actions .tt-button:focus-visible,
#technicalDetail .tt-button:focus-visible,
#technicalDetail .btn:focus-visible{outline:3px solid rgba(27,90,141,.23);outline-offset:1px;border-color:var(--tt-blue-2)}

/* Inline attachment and general-evidence surfaces. */
#technicalDetail .tt-file-input,
#technicalDetail .tt-visually-hidden,
#technicalDetail .sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  margin:-1px!important;
  padding:0!important;
  white-space:nowrap!important;
  border:0!important;
}

#technicalDetail .tt-file-chip,
#technicalDetail .file-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  max-width:100%;
  border:1px solid #cdd9e2;
  border-radius:999px;
  padding:5px 8px;
  color:#334555;
  background:#f7f9fb;
  font-size:.7rem;
}

#technicalDetail .tt-file-chip span,
#technicalDetail .file-chip span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

#technicalDetail .tt-file-chip button,
#technicalDetail .file-chip button{border:0;padding:0;color:var(--tt-blue-2);background:transparent;font:inherit;font-weight:850;cursor:pointer}

#technicalDetail .tt-dropzone,
#technicalDetail .dropzone{
  box-sizing:border-box;
  width:100%;
  display:grid;
  gap:3px;
  border:2px dashed #c8d5df;
  border-radius:12px;
  padding:18px;
  color:var(--tt-muted);
  background:#f8fafb;
  text-align:center;
  transition:.15s;
  cursor:pointer;
}

#technicalDetail .tt-dropzone.dragover,
#technicalDetail .dropzone.dragover{color:#5d4808;background:var(--tt-tech-soft);border-color:var(--tt-gold)}

#technicalDetail .tt-dropzone strong,
#technicalDetail .dropzone strong{display:block;margin-bottom:3px;color:var(--tt-blue)}

#technicalDetail .tt-files-grid,
#technicalDetail .files-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;margin-top:12px;min-width:0}

/* General evidence is a single vertical flow in the side column.  Keeping the
   picker and every linked file in normal document flow prevents the old overlap
   at desktop widths while the outer detail layer remains the only scroller. */
#technicalDetail .tt-evidence-general{min-width:0;display:grid;gap:10px;align-content:start}
#technicalDetail .tt-evidence-general>h3{margin-bottom:0}
#technicalDetail .tt-evidence-general .tt-evidence-list{margin-top:0}
#technicalDetail .tt-evidence-row{min-width:0;grid-template-columns:minmax(0,1fr) auto}
#technicalDetail .tt-evidence-row strong,
#technicalDetail .tt-evidence-row small{overflow-wrap:anywhere}
#technicalDetail .tt-evidence-remove{
  min-height:28px;
  border:1px solid #d7a49f;
  border-radius:7px;
  padding:4px 7px;
  color:#8b2b23;
  background:#fff6f4;
  font:inherit;
  font-size:.7rem;
  font-weight:850;
  line-height:1;
  cursor:pointer;
}
#technicalDetail .tt-evidence-remove:hover{border-color:#ba5e55;background:#ffe9e5}
#technicalDetail .tt-evidence-remove:disabled{opacity:.62;cursor:wait}

#technicalDetail .tt-file-row,
#technicalDetail .file-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid var(--tt-line);
  border-radius:10px;
  padding:11px 12px;
  background:#fff;
}

#technicalDetail .tt-file-row strong,
#technicalDetail .file-row strong{display:block;color:var(--tt-blue);font-size:.83rem}

#technicalDetail .tt-file-row small,
#technicalDetail .file-row small{display:block;margin-top:3px;color:var(--tt-muted);font-size:.7rem;overflow-wrap:anywhere}

#technicalDetail .tt-file-row__actions,
#technicalDetail .file-row__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}

/* General forms, action menus and confirmations. */
#technicalDetail .tt-field{min-width:0}
#technicalDetail .tt-field>label{display:block;margin-bottom:5px;color:#536273;font-size:.76rem;font-weight:850}

#technicalDetail .tt-field input,
#technicalDetail .tt-field textarea,
#technicalDetail .tt-field select,
#technicalDetail .tt-general-notes,
#technicalDetail textarea[data-technical-general-note]{
  width:100%;
  border:1px solid #c9d6e1;
  border-radius:9px;
  padding:9px 10px;
  color:var(--tt-ink);
  background:#fff;
  font:inherit;
  outline:0;
}

#technicalDetail .tt-field:has(>input[type="checkbox"]){
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--tt-ink);
  font-size:.88rem;
  font-weight:750;
}

#technicalDetail .tt-field>input[type="checkbox"]{
  width:16px;
  min-width:16px;
  height:16px;
  min-height:16px;
  margin:0;
  padding:0;
  accent-color:var(--tt-blue-2);
}

#technicalDetail .tt-field textarea,
#technicalDetail .tt-general-notes,
#technicalDetail textarea[data-technical-general-note]{min-height:86px;resize:vertical}

#technicalDetail .tt-field input:focus,
#technicalDetail .tt-field textarea:focus,
#technicalDetail .tt-field select:focus,
#technicalDetail .tt-general-notes:focus,
#technicalDetail textarea[data-technical-general-note]:focus{border-color:var(--tt-blue-2);box-shadow:0 0 0 3px rgba(27,90,141,.12)}

#technicalDetail .tt-action-bar{
  position:sticky;
  bottom:0;
  z-index:6;
  margin:18px -22px -52px;
  padding:12px 22px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);
  border-top:1px solid var(--tt-line);
  box-shadow:0 -8px 22px rgba(20,49,73,.08);
}

#detailLayer .tt-menu,
#detailLayer .tt-overflow-menu,
#technicalDetail .tt-menu,
#technicalDetail .tt-overflow-menu{
  position:absolute;
  z-index:30;
  min-width:210px;
  overflow:hidden;
  border:1px solid var(--tt-line);
  border-radius:12px;
  padding:6px;
  color:var(--tt-ink);
  background:#fff;
  box-shadow:var(--tt-shadow);
}

#detailLayer .tt-menu[hidden],
#detailLayer .tt-overflow-menu[hidden],
#technicalDetail .tt-menu[hidden],
#technicalDetail .tt-overflow-menu[hidden]{display:none!important}

#detailLayer .tt-menu button,
#detailLayer .tt-overflow-menu button,
#technicalDetail .tt-menu button,
#technicalDetail .tt-overflow-menu button{
  width:100%;
  display:block;
  border:0;
  border-radius:8px;
  padding:9px 10px;
  color:var(--tt-ink);
  background:transparent;
  text-align:left;
  font:inherit;
  font-size:.84rem;
  cursor:pointer;
}

#detailLayer .tt-menu button:hover,
#detailLayer .tt-overflow-menu button:hover,
#technicalDetail .tt-menu button:hover,
#technicalDetail .tt-overflow-menu button:hover{background:var(--tt-blue-soft);color:var(--tt-blue)}

#detailLayer .tt-modal,
#detailLayer dialog.tt-modal,
#technicalDetail .tt-modal,
#technicalDetail dialog.tt-modal,
#technicalDetail dialog.modal{
  width:min(720px,calc(100% - 28px));
  max-height:calc(100dvh - 28px);
  overflow:hidden;
  border:0;
  border-radius:16px;
  padding:0;
  color:var(--tt-ink);
  background:#fff;
  box-shadow:0 30px 80px rgba(10,31,48,.28);
}

/* The adapter renders its confirmations as a temporary section inside the
   native detail host (not as another browser dialog).  Give that section the
   canonical modal layer rather than letting it flow beneath the checklist. */
#technicalDetail:has(> .tt-modal)::before{
  content:'';
  position:fixed;
  inset:0;
  z-index:1001;
  background:rgba(8,28,44,.58);
  backdrop-filter:blur(2px);
}

#technicalDetail> .tt-modal{
  position:fixed;
  z-index:1002;
  top:50%;
  left:50%;
  display:flex;
  flex-direction:column;
  width:min(720px,calc(100% - 28px));
  max-height:calc(100dvh - 28px);
  transform:translate(-50%,-50%);
}

#detailLayer .tt-modal::backdrop,
#technicalDetail .tt-modal::backdrop,
#technicalDetail dialog.modal::backdrop{background:rgba(8,28,44,.58);backdrop-filter:blur(2px)}

#detailLayer .tt-modal__head,
#technicalDetail .tt-modal__head,
#technicalDetail .modal__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:17px 20px;
  border-bottom:1px solid var(--tt-line);
  background:#fff;
}

#detailLayer .tt-modal__head h2,
#technicalDetail .tt-modal__head h2,
#technicalDetail .modal__head h2{margin:0;color:var(--tt-blue);font-size:1.08rem}

#detailLayer .tt-modal__close,
#technicalDetail .tt-modal__close,
#technicalDetail .modal__close{
  width:34px;
  height:34px;
  border:0;
  border-radius:10px;
  padding:0;
  color:var(--tt-blue);
  background:#eef3f7;
  font-size:1.15rem;
  cursor:pointer;
}

#detailLayer .tt-modal__body,
#technicalDetail .tt-modal__body,
#technicalDetail .modal__body{overflow:auto;padding:18px 20px;background:#fff}

#detailLayer .tt-modal__actions,
#technicalDetail .tt-modal__actions,
#technicalDetail .modal__actions{
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:9px;
  padding:13px 20px;
  border-top:1px solid var(--tt-line);
  background:#f7f9fb;
}

#detailLayer .tt-modal-error,
#technicalDetail .tt-modal-error,
#technicalDetail .modal-error{
  display:none;
  margin-bottom:12px;
  border:1px solid #efb8b2;
  border-radius:9px;
  padding:10px 12px;
  color:#7f241d;
  background:var(--tt-danger-bg);
  font-size:.83rem;
  font-weight:750;
}

#detailLayer .tt-modal-error.show,
#technicalDetail .tt-modal-error.show,
#technicalDetail .modal-error.show{display:block}

/* Compact action dialogs remain inside the same technical sheet.  The
   continuity form can grow to more than one new T without widening the Hoja
   or sending the person to a legacy detail surface. */
#technicalDetail> .tt-modal--continuity{width:min(860px,calc(100% - 28px))}

#technicalDetail .tt-dialog-metrics{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:0 0 14px;
}

#technicalDetail .tt-dialog-metrics span{
  display:inline-flex;
  align-items:baseline;
  gap:5px;
  border:1px solid var(--tt-line);
  border-radius:999px;
  padding:6px 10px;
  color:var(--tt-muted);
  background:var(--tt-surface-2);
  font-size:.76rem;
}

#technicalDetail .tt-dialog-metrics strong{color:var(--tt-blue);font-size:.9rem}

#technicalDetail .tt-modal-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:0 0 13px;
}

#technicalDetail .tt-field-hint{
  display:block;
  margin:5px 0 0;
  color:var(--tt-muted);
  font-size:.72rem;
  line-height:1.35;
}

#technicalDetail .tt-inline-check{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin:12px 0 0;
  color:var(--tt-ink);
  font-size:.82rem;
  font-weight:700;
}

#technicalDetail .tt-inline-check input,
#technicalDetail .tt-inheritance input{
  width:16px;
  min-width:16px;
  height:16px;
  margin:1px 0 0;
  accent-color:var(--tt-blue-2);
}

#technicalDetail .tt-continuity-list{display:grid;gap:12px}

#technicalDetail .tt-continuity-card{
  border:1px solid #cbd8e2;
  border-radius:12px;
  padding:13px;
  background:var(--tt-surface-2);
}

#technicalDetail .tt-continuity-card__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin:0 0 12px;
}

#technicalDetail .tt-continuity-card__head strong{display:block;color:var(--tt-blue);font-size:.9rem}
#technicalDetail .tt-continuity-card__head small{display:block;margin-top:2px;color:var(--tt-muted);font-size:.72rem}

#technicalDetail .tt-continuity-card__head .tt-button{
  min-height:30px;
  padding:6px 9px;
  font-size:.74rem;
}

#technicalDetail .tt-field--wide{grid-column:span 2}

#technicalDetail .tt-continuity-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}

#technicalDetail .tt-inheritance{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  margin:0;
  border:1px solid #d4dee6;
  border-radius:9px;
  padding:9px 10px 10px;
  color:var(--tt-ink);
  background:#fff;
}

#technicalDetail .tt-inheritance legend{
  padding:0 4px;
  color:var(--tt-muted);
  font-size:.72rem;
  font-weight:850;
}

#technicalDetail .tt-inheritance label{
  display:inline-flex;
  align-items:flex-start;
  gap:6px;
  font-size:.76rem;
  font-weight:700;
}

#technicalDetail .tt-inheritance label.is-required{color:var(--tt-muted)}
#technicalDetail .tt-inheritance input:disabled{opacity:.72;cursor:not-allowed}

#technicalDetail .tt-inheritance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
#technicalDetail .tt-inheritance .is-required{grid-column:1 / -1}
#technicalDetail .tt-inheritance-selection{min-width:0;border-top:1px solid #e1e8ed;padding-top:9px}
#technicalDetail .tt-inheritance-selection>strong{display:block;margin-bottom:6px;color:#536273;font-size:.72rem}
#technicalDetail .tt-inheritance-choices{display:grid;gap:5px;max-height:128px;overflow:auto;padding-right:3px}
#technicalDetail .tt-inheritance-choice{display:grid!important;grid-template-columns:auto minmax(0,1fr);gap:7px;align-items:start;border:1px solid #e0e7ec;border-radius:7px;padding:6px 7px;background:#fbfcfd}
#technicalDetail .tt-inheritance-choice b,#technicalDetail .tt-inheritance-choice small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#technicalDetail .tt-inheritance-choice b{color:#334555;font-size:.72rem}
#technicalDetail .tt-inheritance-choice small{margin-top:2px;color:var(--tt-muted);font-size:.66rem;font-weight:600}
#technicalDetail .tt-inheritance-empty{margin:0;color:var(--tt-muted);font-size:.72rem;line-height:1.35}

#technicalDetail .tt-add-continuity{margin-top:13px}

/* At 1024px the Hoja remains a two-pane desktop view and retains every inline
   control.  Columns tighten rather than hiding evidence or comment fields. */
@media (max-width:1120px) and (min-width:761px){
  #technicalDetail .tt-sheet__body,
  #technicalDetail .tt-workspace__body,
  #technicalDetail .workspace__body{grid-template-columns:240px minmax(0,1fr)}

  #technicalDetail .tt-sheet__side,
  #technicalDetail .tt-workspace__side,
  #technicalDetail .workspace__side{padding:15px}

  #technicalDetail .tt-sheet__main,
  #technicalDetail .tt-workspace__main,
  #technicalDetail .workspace__main{padding:16px 16px 48px}

  #technicalDetail .tt-step,
  #technicalDetail .check-step{grid-template-columns:26px minmax(180px,1.35fr) auto minmax(135px,.8fr) minmax(82px,max-content);gap:6px}

  #technicalDetail .tt-step__text,
  #technicalDetail .check-step__text{font-size:.78rem}

  #technicalDetail .tt-step-statuses,
  #technicalDetail .step-statuses{grid-template-columns:repeat(4,25px);gap:3px}

  #technicalDetail .tt-step-status,
  #technicalDetail .step-status{width:25px;height:25px}

  #technicalDetail .tt-step-comment,
  #technicalDetail .step-comment{padding-right:7px;padding-left:7px;font-size:.72rem}

  #technicalDetail .tt-action-bar{margin-right:-16px;margin-bottom:-48px;margin-left:-16px;padding-right:16px;padding-left:16px}
}

@media (max-width:900px) and (min-width:761px){
  #technicalDetail .tt-sheet__header,
  #technicalDetail .tt-workspace__top,
  #technicalDetail .workspace__top{gap:12px;padding:12px 14px}

  #technicalDetail .tt-sheet__header h1,
  #technicalDetail .tt-workspace__top h1,
  #technicalDetail .workspace__top h1{font-size:1.05rem}

  #technicalDetail .tt-sheet__actions .tt-button,
  #technicalDetail .tt-sheet__actions .btn,
  #technicalDetail .tt-workspace__actions .tt-button,
  #technicalDetail .tt-workspace__actions .btn,
  #technicalDetail .workspace__actions .tt-button,
  #technicalDetail .workspace__actions .btn{min-height:34px;padding:7px 9px;font-size:.78rem}

  #technicalDetail .tt-sheet__body,
  #technicalDetail .tt-workspace__body,
  #technicalDetail .workspace__body{grid-template-columns:212px minmax(0,1fr)}

  #technicalDetail .tt-step,
  #technicalDetail .check-step{grid-template-columns:24px minmax(145px,1.2fr) auto minmax(112px,.7fr) minmax(78px,max-content);gap:5px}

  #technicalDetail .tt-step-file,
  #technicalDetail .tt-step-file-button,
  #technicalDetail .step-file-button,
  #technicalDetail .step-file-readonly{min-width:78px;padding-right:6px;padding-left:6px}

  #technicalDetail .tt-step--stop{grid-template-columns:24px minmax(145px,1.2fr) auto minmax(112px,.7fr) minmax(78px,max-content)}
}

@media (max-width:760px){
  #boardView #detailLayer.tt-open,
  #boardView #detailLayer.cp03-open,
  #boardView #detailLayer[data-detail="technical"],
  #boardView #detailLayer[aria-hidden="false"]:has(#technicalDetail .tt-sheet),
  #boardView #detailLayer[aria-hidden="false"]:has(#technicalDetail .tt-workspace),
  #boardView #detailLayer:has(#technicalDetail .tt-sheet.is-open),
  #boardView #detailLayer:has(#technicalDetail .tt-workspace.is-open),
  #boardView #detailLayer:has(#technicalDetail .workspace.open){overflow-x:hidden;overflow-y:auto}

  #technicalDetail .tt-sheet,
  #technicalDetail .tt-workspace,
  #technicalDetail .workspace{height:auto;min-height:100dvh;overflow:visible}

  #technicalDetail .tt-sheet__header,
  #technicalDetail .tt-workspace__top,
  #technicalDetail .workspace__top{position:relative;grid-template-columns:1fr;padding:12px}

  #technicalDetail .tt-sheet__actions,
  #technicalDetail .tt-workspace__actions,
  #technicalDetail .workspace__actions{justify-content:flex-start}

  #technicalDetail .tt-sheet__body,
  #technicalDetail .tt-workspace__body,
  #technicalDetail .workspace__body{display:block;overflow:visible}

  #technicalDetail .tt-sheet__side,
  #technicalDetail .tt-workspace__side,
  #technicalDetail .workspace__side{overflow:visible;border-right:0;border-bottom:1px solid var(--tt-line);padding:14px}

  #technicalDetail .tt-sheet__main,
  #technicalDetail .tt-workspace__main,
  #technicalDetail .workspace__main{overflow:visible;padding:14px 14px 78px}

  #technicalDetail .tt-tabs,
  #technicalDetail .workspace-tabs{top:0;margin-right:-14px;margin-left:-14px;padding:0 14px 10px}

  #technicalDetail .tt-checklist-head,
  #technicalDetail .checklist-head{display:block}

  #technicalDetail .tt-checklist-search,
  #technicalDetail .checklist-search{width:100%;margin-top:10px}

  #technicalDetail .tt-legend,
  #technicalDetail .checklist-legend{justify-content:flex-start}

  #technicalDetail .tt-step,
  #technicalDetail .check-step{grid-template-columns:24px minmax(0,1fr) auto;gap:7px}

  #technicalDetail .tt-step__text,
  #technicalDetail .check-step__text{grid-column:2;grid-row:1;font-size:.8rem}

  #technicalDetail .tt-step-statuses,
  #technicalDetail .step-statuses{grid-column:3;grid-row:1}

  #technicalDetail .tt-step-controls{grid-column:3;grid-row:1}
  #technicalDetail .tt-step-controls .tt-step-statuses{grid-column:auto;grid-row:auto}

  #technicalDetail .tt-step-comment,
  #technicalDetail .step-comment{grid-column:2;grid-row:2}

  #technicalDetail .tt-step--stop .tt-stop-controls{grid-column:3;grid-row:1}
  #technicalDetail .tt-step--stop .tt-stop-state{grid-column:2 / -1;grid-row:3;grid-template-columns:1fr}

  #technicalDetail .tt-step-file,
  #technicalDetail .tt-step-file-button,
  #technicalDetail .step-file-button,
  #technicalDetail .step-file-readonly{grid-column:3;grid-row:2}

  #technicalDetail .tt-step-evidence{grid-column:3;grid-row:2;min-width:78px;justify-items:end}
  #technicalDetail .tt-step-evidence-list{max-width:min(220px,100%)}

  #technicalDetail .tt-novelty-editor{grid-column:2 / -1;grid-row:3;grid-template-columns:1fr}
  #technicalDetail .tt-novelty-editor__actions{justify-content:flex-start}

  #technicalDetail .tt-action-bar{position:fixed;right:0;bottom:0;left:0;margin:0;padding:10px 12px;justify-content:stretch}

  #technicalDetail .tt-action-bar .tt-button,
  #technicalDetail .tt-action-bar .btn{flex:1 1 145px}

  #technicalDetail .tt-file-row,
  #technicalDetail .file-row{grid-template-columns:1fr}

  #technicalDetail .tt-file-row__actions,
  #technicalDetail .file-row__actions{justify-content:flex-start}

  #technicalDetail .tt-modal-grid{grid-template-columns:1fr}

  #technicalDetail .tt-field--wide{grid-column:auto}

  #technicalDetail .tt-inheritance{display:grid;grid-template-columns:1fr}

  #detailLayer .tt-modal,
  #detailLayer dialog.tt-modal,
  #technicalDetail .tt-modal,
  #technicalDetail dialog.tt-modal,
  #technicalDetail dialog.modal{width:min(calc(100% - 20px),720px);max-height:calc(100dvh - 20px)}
}

@media print{
  #detailLayer #technicalDetail .tt-sheet__header,
  #detailLayer #technicalDetail .tt-workspace__top,
  #detailLayer #technicalDetail .workspace__top,
  #detailLayer #technicalDetail .tt-sheet__side,
  #detailLayer #technicalDetail .tt-workspace__side,
  #detailLayer #technicalDetail .workspace__side,
  #detailLayer #technicalDetail .tt-tabs,
  #detailLayer #technicalDetail .workspace-tabs,
  #detailLayer #technicalDetail .tt-action-bar{display:none!important}

  #detailLayer #technicalDetail .tt-sheet,
  #detailLayer #technicalDetail .tt-workspace,
  #detailLayer #technicalDetail .workspace,
  #detailLayer #technicalDetail .tt-sheet__body,
  #detailLayer #technicalDetail .tt-workspace__body,
  #detailLayer #technicalDetail .workspace__body{display:block!important;height:auto!important;overflow:visible!important}

  #detailLayer #technicalDetail .tt-sheet__main,
  #detailLayer #technicalDetail .tt-workspace__main,
  #detailLayer #technicalDetail .workspace__main{padding:0!important;overflow:visible!important;background:#fff}
}
