#scwco-app{
  --scwco-amarillo:#ffcc00;
  --scwco-negro:#111;
  --scwco-gris:#444;
  --scwco-borde:#ddd;
  --scwco-bg:#fafafa;
  --scwco-ok:#1a7f4e;
  --scwco-warn:#d35400;
  --scwco-err:#c0392b;
  --scwco-shadow:rgba(0,0,0,.08);
  color:var(--scwco-negro);
  max-width:1120px;
  margin:28px auto;
  background:#fff;
  border:1px solid var(--scwco-borde);
  border-radius:12px;
  box-shadow:0 6px 18px var(--scwco-shadow);
  padding:22px;
/*  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; */
  line-height:1.45}

#scwco-app,#scwco-app *{
  box-sizing:border-box}

#scwco-app button{
  font:inherit}

#scwco-app .scwco-h2{
  margin:0 0 8px;
  font-size:clamp(22px,3vw,30px);
  border:0;
  padding:0;
  text-align:center}

#scwco-app .scwco-sub{
  color:#666;
  margin:0 auto 16px;
  text-align:center;
  max-width:900px;
  font-size:15px}

#scwco-app .scwco-grid{
  display:grid;
  gap:14px;
  grid-template-columns:repeat(12,1fr)}

#scwco-app .scwco-col-12{
  grid-column:span 12}

#scwco-app .scwco-col-6{
  grid-column:span 6}

#scwco-app .scwco-col-4{
  grid-column:span 4}

#scwco-app .scwco-card{
  border:1px solid var(--scwco-borde);
  border-radius:10px;
  padding:14px;
  background:#fff;
  box-shadow:0 2px 8px rgba(17,17,17,.04)}

#scwco-app .scwco-card h4{
  margin:0 0 8px;
  font-size:18px;
  border-bottom:4px solid #ffc919;
  display:inline-block}

#scwco-app label{
  display:flex;
  flex-direction:column;
  font-weight:700;
  font-size:13px;
  line-height:16px;
  color:#333;
  align-items:flex-start}

#scwco-app input,#scwco-app select{
  font:inherit;
  margin-top:0;
  height:34px;
  border:1px solid var(--scwco-borde);
  border-radius:8px;
  padding:8px 10px;
  font-size:14px;
  background:#fff;
  width:100%}

#scwco-app input:focus,#scwco-app select:focus{
  outline:0;
  border-color:var(--scwco-amarillo);
  box-shadow:0 0 0 3px rgba(255,204,0,.15)}

#scwco-app input[disabled]{
  background:#f3f3f3;
  color:#777;
  cursor:not-allowed;
  border-style:dashed}

#scwco-app .scwco-inline{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap}

#scwco-app .scwco-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  align-items:center;
  margin:10px 0 8px;
  position:relative}

#scwco-app .scwco-btn{
  border:1px solid var(--scwco-borde);
  background:#eeeeee;
  border-radius:8px;
  padding:6px 12px;
  cursor:pointer;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:6px;
  transition:filter .2s,box-shadow .2s,transform .2s;
  line-height:18px;
  text-decoration:none}

#scwco-app .scwco-btn[disabled]{
  opacity:.55;
  cursor:not-allowed}

#scwco-app .scwco-btn--primary{
  background:var(--scwco-amarillo);
  border-color:var(--scwco-amarillo);
  padding:9px 18px;
  box-shadow:0 3px 0 #d9ad00}

#scwco-app .scwco-btn--wa{
  background:#25d366;
  border-color:#25d366;
  color:#fff}

#scwco-app .scwco-btn:hover{
  filter:brightness(.98);
  transform:translateY(-1px)}

#scwco-app .scwco-btn:focus-visible,#scwco-app input:focus-visible,#scwco-app select:focus-visible,#scwco-app summary:focus-visible{
  outline:3px solid rgba(255,204,0,.45);
  outline-offset:2px}

#scwco-app .scwco-badge{
  display:none;
  align-items:center;
  gap:6px;
  background:#fff8e1;
  color:#8a5a00;
  border:1px solid #ffe08a;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px}

#scwco-app .scwco-badge.scwco-show{
  display:inline-flex}

#scwco-app .scwco-info{
  background:#f5f9ff;
  border:1px solid #cfe0ff;
  color:#174ea6;
  border-radius:10px;
  padding:5px 10px}

#scwco-app .scwco-reco-box{
  border-radius:10px;
  padding:10px 12px;
  margin-top:8px;
  border:1px solid #d7d7d7;
  background:#f7f7f7;
  color:#333}

#scwco-app .scwco-reco-box.scwco-reco-saving{
  background:#eaf8ee;
  border-color:#b9e2c3;
  color:#1a7f4e}

#scwco-app .scwco-reco-box.scwco-reco-format{
  background:#fff6e8;
  border-color:#ffd59a;
  color:#a85b00}

#scwco-app .scwco-reco-box.scwco-reco-neutral{
  background:#f3f4f6;
  border-color:#d6d9de;
  color:#555}

#scwco-app .scwco-reco-actions{
  margin:.5rem 0 0;
  display:flex;
  gap:8px;
  flex-wrap:wrap}

#scwco-app .scwco-reco-mini{
  font-size:12px;
  opacity:.9}

#scwco-app .scwco-warn-text{
  color:var(--scwco-warn);
  font-size:12px;
  margin-top:2px;
  min-height:2px;
  line-height:16px}

#scwco-app .scwco-err-text{
  color:var(--scwco-err);
  font-size:12px;
  margin-top:2px;
  min-height:2px}

#scwco-app .scwco-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px}

#scwco-app .scwco-preview{
  background:#f9f9f9;
  border:1px dashed var(--scwco-borde);
  border-radius:10px;
  padding:10px}

#scwco-app .scwco-summary-actions{
  margin-top:12px;
  padding-top:10px;
  border-top:1px dashed #ddd}

#scwco-app .scwco-summary-actions .scwco-btn{
  flex:1 1 190px;
  justify-content:center}

#scwco-app .scwco-reco-box p{
  margin:.2rem 0}

#scwco-app .scwco-muted{
  color:#777}

#scwco-app .scwco-neutral{
  color:#666}

#scwco-app .scwco-positive{
  color:var(--scwco-ok);
  font-weight:700}

#scwco-app .scwco-negative{
  color:var(--scwco-err);
  font-weight:700}

#scwco-app .scwco-preview-empty{
  min-height:92px;
  display:grid;
  place-items:center;
  padding:12px;
  color:#7a828d;
  text-align:center;
  font-size:13px}

#scwco-app .scwco-preview-empty i{
  display:block;
  margin-bottom:5px;
  font-size:22px;
  color:#b1b7c0}

#scwco-app .scwco-preview-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
  flex-wrap:wrap}

#scwco-app .scwco-preview-title{
  font-weight:700}

#scwco-app .scwco-preview-right{
  margin-left:auto;
  display:flex;
  align-items:center;
  flex-wrap:wrap}

#scwco-app .scwco-toggleWrap{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-weight:600;
  white-space:nowrap;
  flex-direction:row}

#scwco-app .scwco-toggleWrap input{
  width:16px;
  height:16px}

#scwco-app .scwco-resumen{
  background:linear-gradient(145deg,#fff,#f8fafc);
  border:1px solid #dfe3e8;
  border-radius:10px;
  padding:14px}

#scwco-app .scwco-resumen p{
  margin:.2rem 0}

#scwco-app .scwco-tabla-wrap{
  overflow-x:auto}

#scwco-app .scwco-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid var(--scwco-borde);
  border-radius:10px;
  overflow:hidden;
  background:#fff}

#scwco-app .scwco-table thead th{
  background:var(--scwco-amarillo);
  padding:6px 8px;
  text-align:center}

#scwco-app .scwco-table td{
  padding:6px;
  border-top:1px solid var(--scwco-borde);
  text-align:center}

#scwco-app .scwco-table tbody tr:nth-child(even) td{
  background:#fafafa}

#scwco-app .scwco-tipo-original{
  background:#fffbe6 !important;
  font-weight:700}

#scwco-app .scwco-tipo-mas-grande{
  background:#fff1f0 !important;
  color:#c0392b}

#scwco-app .scwco-tipo-mas-pequena{
  background:#e7f9ec !important;
  color:#1a7f4e}

#scwco-app .scwco-sugerencia-activa{
  outline:2px solid var(--scwco-amarillo) !important;
  background:#fffde6 !important}

#scwco-app .scwco-banner{
  display:none;
  margin:0;
  background:#fff8e1;
  border:1px solid #ffe7a1;
  border-radius:10px;
  padding:5px 10px;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  word-break:break-word}

#scwco-app .scwco-banner .scwco-link{
  color:#0b57d0;
  cursor:pointer;
  text-decoration:underline}

#scwco-app .scwco-saved-list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:12px}

#scwco-app .scwco-saved{
  border:1px solid #dfe3e8;
  border-radius:13px;
  padding:14px;
  background:#fff;
  box-shadow:0 3px 12px rgba(17,17,17,.055);
  display:flex;
  flex-direction:column;
  gap:11px}

#scwco-app .scwco-saved-head{
  display:flex;
  gap:10px;
  align-items:flex-start}

#scwco-app .scwco-saved-index{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#fff3b5;
  color:#705900;
  font-size:12px;
  font-weight:800}

#scwco-app .scwco-saved-title{
  min-width:0;
  flex:1}

#scwco-app .scwco-saved h5{
  margin:0 0 3px;
  font-size:15px;
  line-height:1.3;
  overflow-wrap:anywhere}

#scwco-app .scwco-saved small{
  color:#6a7280}

#scwco-app .scwco-saved-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px}

#scwco-app .scwco-saved-tag{
  padding:4px 8px;
  border-radius:999px;
  background:#f1f3f5;
  color:#4e5661;
  font-size:11px;
  font-weight:700}

#scwco-app .scwco-saved-details{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px}

#scwco-app .scwco-saved-detail{
  padding:8px 9px;
  border:1px solid #e6e8eb;
  border-radius:8px;
  background:#fafbfc}

#scwco-app .scwco-saved-detail span{
  display:block;
  color:#737b86;
  font-size:10px;
  margin-bottom:2px}

#scwco-app .scwco-saved-detail strong{
  display:block;
  font-size:13px;
  overflow-wrap:anywhere}

#scwco-app .scwco-saved-price{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:10px 11px;
  border:1px solid #bfe4cb;
  border-radius:9px;
  background:#eef9f2;
  color:#196b43}

#scwco-app .scwco-saved-price.scwco-pending{
  border-color:#e0e3e7;
  background:#f5f6f8;
  color:#646c77}

#scwco-app .scwco-saved-price span{
  font-size:11px}

#scwco-app .scwco-saved-price strong{
  font-size:17px;
  white-space:nowrap}

#scwco-app .scwco-saved-body{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:10px;
  align-items:start}

#scwco-app .scwco-saved-body .scwco-saveimgwrap{
  margin:0}

#scwco-app .scwco-saved-body>.scwco-saved-details:only-child{
  grid-column:1 / -1}

#scwco-app .scwco-saved-body .scwco-saveimgwrap img{
  width:72px;
  height:72px;
  max-height:none;
  object-fit:cover}

#scwco-app .scwco-saved .scwco-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:auto}

#scwco-app .scwco-totals{
  margin:12px 0;
  padding:15px;
  border:1px solid #e0b800;
  border-radius:13px;
  background:linear-gradient(135deg,#fff8d7,#fff1a8)}

#scwco-app .scwco-budget-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:14px;
  flex-wrap:wrap;
  padding-bottom:12px;
  border-bottom:1px solid rgba(126,99,0,.18)}

#scwco-app .scwco-budget-head span{
  display:block;
  color:#705900;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase}

#scwco-app .scwco-budget-total{
  display:block;
  margin-top:2px;
  font-size:28px;
  line-height:1;
  color:#171717}

#scwco-app .scwco-budget-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:12px}

#scwco-app .scwco-budget-stat{
  padding:8px 9px;
  border-radius:8px;
  background:rgba(255,255,255,.66)}

#scwco-app .scwco-budget-stat span{
  display:block;
  color:#756516;
  font-size:10px}

#scwco-app .scwco-budget-stat strong{
  display:block;
  font-size:14px}

#scwco-app .scwco-budget-materials{
  margin-top:10px;
  color:#574a0c;
  font-size:12px}

#scwco-app .scwco-budget-note{
  margin:9px 0 0;
  color:#756516;
  font-size:11px}

#scwco-app .scwco-budget-icon{
  font-size:28px;
  color:#806700}

#scwco-app .scwco-toast{
  position:fixed;
  right:16px;
  bottom:16px;
  background:#111;
  color:#fff;
  padding:12px 14px;
  border-radius:10px;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
  opacity:0;
  transform:translateY(10px);
  pointer-events:none;
  transition:.25s;
  z-index:9999}

#scwco-app .scwco-toast.scwco-show{
  opacity:1;
  transform:translateY(0)}

#scwco-app .scwco-propViewport{
  max-width:100%;
  max-height:260px;
  border:1px solid var(--scwco-borde);
  border-radius:8px;
  overflow:hidden}

#scwco-app #scwco-propImg{
  max-width:100%;
  display:block}

#scwco-app .scwco-saveimgwrap{
  margin-top:6px;
  display:flex;
  gap:8px;
  align-items:center}

#scwco-app .scwco-saveimgwrap img{
  max-height:52px;
  border-radius:6px;
  border:1px solid var(--scwco-borde)}

#scwco-app .scwco-material-row{
  background:#f0f0f0;
  border:3px dotted #ffc919;
  border-radius:10px;
  padding:8px}

#scwco-app .scwco-material-grid{
  margin:0}

#scwco-app .scwco-material-row label{
  margin-bottom:0}

#scwco-app .scwco-design-row{
  display:grid;
  grid-template-columns:minmax(320px,2fr) minmax(190px,.95fr) minmax(140px,.9fr) minmax(150px,.9fr);
  gap:10px;
  align-items:start}

#scwco-app .scwco-design-field{
  min-width:0}

#scwco-app .scwco-design-top{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0}

#scwco-app .scwco-design-top-grid{
  display:grid;
  grid-template-columns:minmax(140px,1fr) 26px minmax(140px,1fr);
  gap:10px;
  align-items:start}

#scwco-app .scwco-design-times{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  font-weight:700;
  padding-bottom:8px;
  color:#555}

#scwco-app .scwco-checkcard{
  min-height:34px;
  border:1px solid var(--scwco-borde);
  border-radius:8px;
  padding:8px 10px;
  background:#fafafa;
  width:100%;
  justify-content:center}

#scwco-app .scwco-checkcard input{
  width:16px;
  height:16px;
  margin:0}

#scwco-app .scwco-margin-tools{
  gap:8px;
  flex-wrap:wrap}

#scwco-app .scwco-design-messages{
  margin-top:6px}

#scwco-app .scwco-design-margin{
  display:flex;
  flex-direction:column;
  align-items:stretch}

#scwco-app .scwco-btn--margin{
  margin-top:6px;
  width:100%;
  justify-content:center}

#scwco-app .scwco-design-margin .scwco-warn-text{
  margin-top:4px}

#scwco-app .scwco-design-banner-row{
  width:100%;
  margin-top:8px}

#scwco-app #scwco-banner-restore{
  width:100%;
  margin-top:0}

#scwco-app .scwco-advanced-box{
  margin-top:4px;
  padding:12px;
  border:1px dashed #d9d9d9;
  border-radius:10px;
  background:#fafafa}

#scwco-app #scwco-btnCalcular.scwco-attn{
  position:relative;
  background:linear-gradient(135deg,#ff9800,#ff5722);
  color:#fff;
  box-shadow:0 0 0 0 rgba(255,87,34,.6);
  animation:scwco-pulseCalc 1s ease-in-out infinite,scwco-glowCalc 1.5s ease-in-out infinite;
  transform-origin:center}

#scwco-app #scwco-btnCalcular.scwco-attn::after{
  content:"¡Cambios!";
  position:absolute;
  top:-10px;
  right:-10px;
  background:#ff1744;
  color:#fff;
  font-size:10px;
  padding:2px 6px;
  border-radius:999px;
  box-shadow:0 0 8px rgba(0,0,0,.25);
  white-space:nowrap}

#scwco-app #scwco-btnCalcular.scwco-attn:hover{
  transform:scale(1.05);
  box-shadow:0 0 0 0 rgba(255,87,34,.6),0 6px 16px rgba(0,0,0,.35)}

@keyframes scwco-pulseCalc{
  0%{
  transform:scale(1.2);
  box-shadow:0 0 0 0 rgba(255,87,34,.6)}

50%{
  transform:scale(1.03);
  box-shadow:0 0 0 10px rgba(255,87,34,0)}

100%{
  transform:scale(1);
  box-shadow:0 0 0 0 rgba(255,87,34,0)}

}

@keyframes scwco-glowCalc{
  0%{
  filter:brightness(1)}

50%{
  filter:brightness(1.15)}

100%{
  filter:brightness(1)}

}

.scwco-canvas-box{
  font-size:12px;
  line-height:10px}

@media (max-width:980px){
  #scwco-app .scwco-split{
  grid-template-columns:1fr}

#scwco-app .scwco-col-6,#scwco-app .scwco-col-4{
  grid-column:span 12}

#scwco-app .scwco-design-row{
  grid-template-columns:1fr 1fr}

#scwco-app .scwco-design-top{
  grid-column:1 / -1}

#scwco-app .scwco-design-check,#scwco-app .scwco-design-margin,#scwco-app .scwco-design-qty{
  grid-column:span 1}

}

@media (max-width:720px){
  #scwco-app .scwco-table,#scwco-app .scwco-table thead,#scwco-app .scwco-table tbody,#scwco-app .scwco-table th,#scwco-app .scwco-table td,#scwco-app .scwco-table tr{
  display:block}

#scwco-app .scwco-table thead{
  display:none}

#scwco-app .scwco-table tbody tr{
  border:1px solid var(--scwco-borde);
  border-radius:10px;
  margin-bottom:10px;
  overflow:hidden}

#scwco-app .scwco-table tbody td{
  border:none;
  border-top:1px solid #eee;
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px}

#scwco-app .scwco-table tbody td::before{
  content:attr(data-label);
  font-weight:700;
  color:#333}

}

@media (max-width:640px){
  #scwco-app .scwco-design-row{
  grid-template-columns:1fr}

#scwco-app .scwco-design-top-grid{
  grid-template-columns:minmax(120px,1fr) 20px minmax(120px,1fr);
  gap:8px}

#scwco-app .scwco-design-times{
  display:flex;
  align-items:center;
  justify-content:center;
  padding-bottom:0}

#scwco-app .scwco-design-check,#scwco-app .scwco-design-margin,#scwco-app .scwco-design-qty{
  grid-column:auto}

#scwco-app .scwco-material-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))}

#scwco-app .scwco-material-grid .scwco-col-4{
  grid-column:span 1 !important}

#scwco-app .scwco-material-grid .scwco-col-4:first-child{
  grid-column:1 / -1 !important}

}

#scwco-app .scwco-feedback-overlay{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(13,18,24,.62);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease,visibility .22s ease;
  backdrop-filter:blur(2px)}

#scwco-app .scwco-feedback-overlay.scwco-show{
  opacity:1;
  visibility:visible;
  pointer-events:auto}

#scwco-app .scwco-feedback-card{
  width:min(420px,100%);
  padding:28px 24px;
  border-radius:18px;
  background:#fff;
  color:#17202a;
  text-align:center;
  box-shadow:0 24px 70px rgba(0,0,0,.32);
  transform:translateY(10px) scale(.97);
  transition:transform .22s ease}

#scwco-app .scwco-feedback-overlay.scwco-show .scwco-feedback-card{
  transform:translateY(0) scale(1)}

#scwco-app .scwco-feedback-icon{
  width:62px;
  height:62px;
  margin:0 auto 14px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#e9f8ef;
  color:var(--scwco-ok);
  font-size:30px}

#scwco-app .scwco-feedback-title{
  margin:0 0 5px;
  font-size:21px;
  font-weight:800}

#scwco-app .scwco-feedback-detail{
  margin:0;
  color:#5d6672;
  font-size:14px}

#scwco-app .scwco-feedback-dismiss{
  display:block;
  margin-top:14px;
  color:#8a92a3;
  font-size:10px}

/* Acerca el control de proporción a los campos de medida. */
#scwco-app .scwco-design-row{
  row-gap:8px}

#scwco-app .scwco-design-banner-row{
  margin-top:0}

#scwco-app .scwco-design-banner-row[hidden]{
  display:none}

#scwco-app #scwco-banner-restore{
  margin-top:6px}

#scwco-app .scwco-design-check{
  margin-top:-4px}

/* Controles compactos y claros */
#scwco-app .scwco-checkcard-copy{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px}

#scwco-app .scwco-checkcard-copy>i{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#eee8ff;
  color:var(--scwco-purple);
  font-size:13px}

#scwco-app .scwco-checkcard-copy>span,
#scwco-app .scwco-checkcard-copy strong,
#scwco-app .scwco-checkcard-copy small{
  display:block}

#scwco-app .scwco-checkcard-copy strong{
  color:#282e42;
  font-size:11px;
  line-height:1.25}

#scwco-app .scwco-checkcard-copy small{
  margin-top:2px;
  color:#737c91;
  font-size:9px;
  font-weight:500;
  line-height:1.25}

#scwco-app .scwco-preview-head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:8px;
  flex-wrap:nowrap}

#scwco-app .scwco-preview-title{
  white-space:nowrap}

#scwco-app .scwco-preview-right{
  min-width:0;
  margin-left:0;
  justify-content:flex-end;
  flex-wrap:nowrap}

#scwco-app .scwco-preview-measures-toggle{
  max-width:100%;
  padding:4px 7px;
  border:1px solid #ddd5f5;
  border-radius:999px;
  background:#f6f2ff;
  color:#5b3e93;
  font-size:9px;
  line-height:1;
  letter-spacing:-.01em}

#scwco-app .scwco-preview-measures-toggle input{
  width:12px;
  height:12px;
  flex:0 0 12px;
  margin:0}

#scwco-app .scwco-preview-measures-toggle span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap}

#scwco-app .scwco-saved--just-added{
  animation:scwcoSavedReveal 2.2s ease both;
  outline:3px solid rgba(101,39,220,.2);
  outline-offset:4px}

@keyframes scwcoSavedReveal{
  0%,28%{transform:translateY(0);box-shadow:0 0 0 8px rgba(101,39,220,.16),0 14px 38px rgba(65,35,126,.2)}
  100%{transform:translateY(0);box-shadow:0 7px 20px rgba(43,33,82,.055)}}

@media (max-width:420px){
  #scwco-app .scwco-preview-head{gap:5px}
  #scwco-app .scwco-preview-title{font-size:11px}
  #scwco-app .scwco-preview-measures-toggle{padding:3px 5px;font-size:7.5px}
  #scwco-app .scwco-preview-measures-toggle input{width:11px;height:11px;flex-basis:11px}
}

/* =====================================================
   Flujo final: calcular, optimizar/guardar y pedir
   ===================================================== */
#scwco-app .scwco-field-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:5px}

#scwco-app .scwco-optional-badge,
#scwco-app .scwco-result-file em{
  display:inline-flex;
  align-items:center;
  min-height:18px;
  padding:2px 7px;
  border:1px solid #efd579;
  border-radius:999px;
  background:var(--scwco-amarillo-soft);
  color:#766000;
  font-size:8px;
  font-style:normal;
  font-weight:850;
  letter-spacing:.04em;
  line-height:1;
  text-transform:uppercase}

#scwco-app .scwco-result-savebar{
  display:grid;
  grid-template-columns:minmax(190px,.75fr) minmax(360px,1.55fr) auto;
  align-items:end;
  gap:12px;
  margin-top:16px;
  padding:15px;
  border:1px solid #e6cf70;
  border-radius:13px;
  background:linear-gradient(135deg,#fffdf4,#fff9dc)}

#scwco-app .scwco-result-savebar[data-disabled="true"]{
  border-color:#e0e4ec;
  background:#f8f9fc}

#scwco-app .scwco-result-savebar-copy{
  display:flex;
  align-items:center;
  gap:10px;
  align-self:center}

#scwco-app .scwco-result-savebar-copy>i{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#ffdd4d;
  color:#443600;
  font-size:17px}

#scwco-app .scwco-result-savebar-copy strong,
#scwco-app .scwco-result-savebar-copy small{
  display:block}

#scwco-app .scwco-result-savebar-copy strong{
  color:#25230f;
  font-size:12px}

#scwco-app .scwco-result-savebar-copy small{
  margin-top:2px;
  color:#77715a;
  font-size:9px;
  line-height:1.35}

#scwco-app .scwco-result-save-fields{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:9px}

#scwco-app .scwco-result-save-fields label>span{
  min-height:20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  margin-bottom:4px;
  font-size:9px;
  font-weight:750}

#scwco-app .scwco-result-save-fields input{
  width:100%}

#scwco-app .scwco-result-save-fields input[type="file"]{
  padding:7px;
  font-size:9px;
  font-weight:550}

#scwco-app .scwco-result-savebar>.scwco-saveimgwrap{
  grid-column:2;
  margin:0}

#scwco-app .scwco-result-savebar>#scwco-btnSaveCalc{
  min-width:150px;
  min-height:44px}

#scwco-app .scwco-summary-actions .scwco-btn{
  flex:1 1 190px}

#scwco-app .scwco-budget-panel{
  width:100%}

#scwco-app .scwco-totals{
  margin:0 0 15px}

#scwco-app .scwco-budget-order{
  width:100%;
  margin-top:13px}

#scwco-app .scwco-budget-order .fa-whatsapp{
  color:#128c4b;
  font-size:18px}

#scwco-app .scwco-saved .scwco-row{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr auto;
  gap:8px}

#scwco-app .scwco-saved .scwco-row .scwco-btn[data-order-saved]:first-child{
  border-color:#0aaa50;
  background:linear-gradient(135deg,#18bd60,#079746);
  color:#fff}

@media (max-width:980px){
  #scwco-app .scwco-result-savebar{
    grid-template-columns:1fr auto}
  #scwco-app .scwco-result-savebar-copy,
  #scwco-app .scwco-result-save-fields,
  #scwco-app .scwco-result-savebar>.scwco-saveimgwrap{
    grid-column:1}
  #scwco-app .scwco-result-savebar-copy{
    grid-column:1/-1}
  #scwco-app .scwco-result-savebar>#scwco-btnSaveCalc{
    grid-column:2;
    grid-row:2}
}

@media (max-width:640px){
  #scwco-app .scwco-stepper{
    grid-template-columns:1fr auto 1fr auto 1fr}
  #scwco-app .scwco-result-savebar{
    grid-template-columns:1fr;
    padding:12px}
  #scwco-app .scwco-result-save-fields{
    grid-template-columns:1fr}
  #scwco-app .scwco-result-savebar-copy,
  #scwco-app .scwco-result-save-fields,
  #scwco-app .scwco-result-savebar>.scwco-saveimgwrap,
  #scwco-app .scwco-result-savebar>#scwco-btnSaveCalc{
    grid-column:1;
    grid-row:auto}
  #scwco-app .scwco-result-savebar>#scwco-btnSaveCalc{
    width:100%}
  #scwco-app .scwco-saved .scwco-row{
    grid-template-columns:1fr 1fr}
}

#scwco-app .scwco-result-layout{
  display:grid;
  gap:12px}

#scwco-app .scwco-result-hero{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  color:#1b1b1b;
  background:linear-gradient(135deg,#fff4b8,#ffcc00);
  border:1px solid #e5b800;
  border-radius:12px}

#scwco-app .scwco-result-hero-copy{
  min-width:0}

#scwco-app .scwco-result-eyebrow{
  display:block;
  font-size:11px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
  opacity:.7}

#scwco-app .scwco-result-value{
  display:block;
  font-size:25px;
  line-height:1.1;
  font-weight:850}

#scwco-app .scwco-result-caption{
  font-size:13px}

#scwco-app .scwco-result-metrics{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px}

#scwco-app .scwco-result-metric{
  padding:10px 11px;
  border:1px solid #e2e5e9;
  border-radius:9px;
  background:#fff}

#scwco-app .scwco-result-metric span{
  display:block;
  margin-bottom:4px;
  color:#6a7280;
  font-size:12px}

#scwco-app .scwco-result-metric strong{
  display:block;
  font-size:14px;
  overflow-wrap:anywhere}

#scwco-app .scwco-result-callout{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:11px 12px;
  border-radius:9px;
  background:#edf7ff;
  border:1px solid #c9e5fb;
  color:#174d74;
  font-size:13px}

#scwco-app .scwco-result-callout i{
  margin-top:2px}

#scwco-app .scwco-result-price{
  padding:11px 12px;
  border-radius:9px;
  background:#f6f7f9;
  border:1px solid #e2e5e9;
  font-size:13px}

#scwco-app .scwco-results-heading{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-end;
  flex-wrap:wrap;
  margin-bottom:8px}

#scwco-app .scwco-results-heading h4{
  margin:0}

#scwco-app .scwco-results-heading p{
  margin:0;
  color:#68707b;
  font-size:12px}

body{
  margin:0;
  background:#f5f6f8}

#scwco-app .scwco-helper{
  display:block;
  margin-top:4px;
  color:#68707b;
  font-size:12px;
  font-weight:400}

#scwco-app .scwco-section-gap{
  margin-top:12px}

#scwco-app .scwco-column-toggles{
  gap:18px;
  margin:6px 0 0}

#scwco-app .scwco-recommendation-note{
  margin-top:8px}

#scwco-app .scwco-advanced-label{
  font-weight:400}

#scwco-app .scwco-rotation-label{
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  font-weight:400}

#scwco-app .scwco-action-buttons{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:8px}

#scwco-app .scwco-action-note{
  display:block;
  margin-top:6px;
  color:#666}

#scwco-app .scwco-save-preview-note{
  font-size:11px;
  color:#666}

#scwco-app .scwco-saved-intro{
  margin:0}

#scwco-app .scwco-saved-footer{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px}

#scwco-app #scwco-propCanvasWrap{
  margin-top:10px;
  display:none}

#scwco-app #scwco-saveImgPreviewWrap,#scwco-app #scwco-savedTotals{
  display:none}

#scwco-app .scwco-empty{
  min-height:126px;
  display:grid;
  place-items:center;
  text-align:center;
  color:#68707b}

#scwco-app .scwco-empty i{
  display:block;
  font-size:28px;
  margin-bottom:8px;
  color:#b1b7c0}

#scwco-app .scwco-btn--primary:active{
  transform:translateY(2px);
  box-shadow:0 1px 0 #d9ad00}

#scwco-app .scwco-action-card[data-disabled="true"]{
  opacity:.72}

#scwco-app .scwco-action-card[data-disabled="true"]::after{
  content:"Calcula primero para habilitar estas acciones";
  display:block;
  margin-top:10px;
  color:#68707b;
  font-size:12px;
  text-align:center}

#scwco-app [aria-invalid="true"]{
  border-color:var(--scwco-err);
  box-shadow:0 0 0 3px rgba(192,57,43,.12)}

#scwco-app .scwco-btn.scwco-loading{
  cursor:wait;
  opacity:.75}

@media (prefers-reduced-motion:reduce){
  #scwco-app *,#scwco-app *::before,#scwco-app *::after{
  animation-duration:.01ms !important;
  animation-iteration-count:1 !important;
  transition-duration:.01ms !important}

}

@media (max-width:640px){
  #scwco-app{
  margin:0;
  padding:14px;
  border:0;
  border-radius:0;
  box-shadow:none}

#scwco-app .scwco-actions{
  position:sticky;
  bottom:0;
  z-index:20;
  margin:6px -8px -8px;
  padding:10px;
  background:rgba(255,255,255,.96);
  border-top:1px solid var(--scwco-borde);
  backdrop-filter:blur(8px)}

#scwco-app #scwco-btnCalcular{
  flex:1;
  justify-content:center}

#scwco-app .scwco-result-metrics{
  grid-template-columns:1fr}

#scwco-app .scwco-budget-stats{
  grid-template-columns:1fr 1fr}

#scwco-app .scwco-saved-details{
  grid-template-columns:1fr 1fr}

}

body{
  background:linear-gradient(180deg,#f8f9ff 0,#f3f5fb 100%)}

#scwco-app{
  --scwco-amarillo:#6527dc;
  --scwco-negro:#12172a;
  --scwco-gris:#4f5870;
  --scwco-borde:#e1e5ef;
  --scwco-bg:#f7f8fc;
  --scwco-ok:#12a150;
  --scwco-warn:#f08a00;
  --scwco-err:#e5484d;
  --scwco-purple:#6527dc;
  --scwco-purple-dark:#4c17bd;
  --scwco-purple-soft:#f2ecff;
  --scwco-blue:#1769e8;
  max-width:1480px;
  margin:0 auto;
  padding:24px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--scwco-negro)}

#scwco-app .scwco-hero{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:24px;
  padding:18px 22px}

#scwco-app .scwco-brand-mark{
  width:68px;
  height:58px;
  position:relative;
  display:grid;
  place-items:center;
  border:3px solid var(--scwco-purple);
  border-radius:13px;
  color:var(--scwco-purple);
  font-size:22px;
  font-weight:900;
  letter-spacing:-.06em}

#scwco-app .scwco-brand-mark::after{
  content:"";
  position:absolute;
  right:-12px;
  bottom:8px;
  width:21px;
  height:14px;
  border:3px solid currentColor;
  border-left:0;
  border-radius:0 6px 6px 0;
  background:#fff}

#scwco-app .scwco-hero-copy{
  min-width:0}

#scwco-app .scwco-kicker{
  display:block;
  margin-bottom:3px;
  color:#767f96;
  font-size:11px;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase}

#scwco-app .scwco-h2{
  margin:0;
  text-align:left;
  font-size:clamp(28px,3.4vw,46px);
  line-height:1.05;
  letter-spacing:-.045em}

#scwco-app .scwco-h2 span{
  color:var(--scwco-purple)}

#scwco-app .scwco-sub{
  max-width:720px;
  margin:9px 0 0;
  text-align:left;
  color:#59627a;
  font-size:14px}

#scwco-app .scwco-benefits{
  display:grid;
  grid-template-columns:repeat(3,minmax(110px,1fr));
  border:1px solid var(--scwco-borde);
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.85);
  box-shadow:0 8px 28px rgba(33,24,72,.05)}

#scwco-app .scwco-benefits>div{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:74px;
  padding:12px 15px;
  border-left:1px solid var(--scwco-borde)}

#scwco-app .scwco-benefits>div:first-child{
  border-left:0}

#scwco-app .scwco-benefits i{
  font-size:25px;
  color:var(--scwco-purple)}

#scwco-app .scwco-benefits>div:first-child i{
  color:#ff8a00}

#scwco-app .scwco-benefits>div:last-child i{
  color:#0eae55}

#scwco-app .scwco-benefits span{
  color:#6c7488;
  font-size:10px;
  line-height:1.35}

#scwco-app .scwco-benefits strong{
  display:block;
  color:#171c2e;
  font-size:12px}

#scwco-app .scwco-stepper{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  align-items:center;
  gap:14px;
  margin:10px 0 18px;
  padding:13px 20px;
  border:1px solid var(--scwco-borde);
  border-radius:15px;
  background:#fff;
  box-shadow:0 8px 28px rgba(38,31,78,.06)}

#scwco-app .scwco-step{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  min-width:0}

#scwco-app .scwco-step>span{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border:1px solid #d9deea;
  border-radius:50%;
  background:#fff;
  font-weight:850}

#scwco-app .scwco-step--active>span{
  color:#fff;
  border-color:var(--scwco-purple);
  background:linear-gradient(145deg,#7a3bf0,#5520cb);
  box-shadow:0 7px 16px rgba(101,39,220,.28)}

#scwco-app .scwco-step strong,#scwco-app .scwco-step small{
  display:block;
  white-space:nowrap}

#scwco-app .scwco-step strong{
  font-size:12px}

#scwco-app .scwco-step small{
  margin-top:1px;
  color:#778096;
  font-size:10px}

#scwco-app .scwco-stepper>i{
  color:#8d95a7}

#scwco-app .scwco-workspace{
  display:grid;
  grid-template-columns:minmax(330px,390px) minmax(0,1fr);
  gap:18px;
  align-items:stretch}

#scwco-app .scwco-card,#scwco-app #scwco-recommendations{
  border:1px solid var(--scwco-borde);
  border-radius:17px;
  padding:20px;
  background:#fff;
  box-shadow:0 8px 30px rgba(37,31,72,.055)}

#scwco-app .scwco-card h4,#scwco-app .scwco-results-heading h4{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 18px;
  padding:0;
  border:0;
  color:#181d30;
  font-size:18px}

#scwco-app .scwco-section-number{
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  border-radius:8px;
  color:var(--scwco-purple);
  background:var(--scwco-purple-soft);
  font-size:13px;
  font-weight:900}

#scwco-app label{
  color:#252b40;
  font-size:12px}

#scwco-app input,#scwco-app select{
  height:44px;
  border-color:#d9deea;
  border-radius:9px;
  color:#1d2336;
  font-weight:650}

#scwco-app input:focus,#scwco-app select:focus{
  border-color:var(--scwco-purple);
  box-shadow:0 0 0 3px rgba(101,39,220,.11)}

#scwco-app input[disabled]{
  color:#5a6280;
  background:#f4f1ff}

#scwco-app .scwco-input-panel .scwco-grid{
  gap:12px}

#scwco-app .scwco-input-modes{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  margin-bottom:16px;
  padding:3px;
  border:1px solid #e1e5ee;
  border-radius:10px;
  background:#f7f8fb}

#scwco-app .scwco-mode-btn{
  position:relative;
  min-height:36px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#555e73;
  font-size:11px;
  font-weight:750;
  cursor:pointer}

#scwco-app .scwco-mode-btn i{
  margin-right:6px}

#scwco-app .scwco-mode-btn--active{
  background:#fff4c7;
  color:#4c3d00;
  box-shadow:0 2px 7px rgba(42,35,73,.08)}

#scwco-app .scwco-mode-btn::after{
  content:attr(data-tooltip);
  position:absolute;
  z-index:40;
  top:calc(100% + 9px);
  left:50%;
  width:220px;
  padding:9px 10px;
  border-radius:8px;
  background:#202538;
  color:#fff;
  box-shadow:0 8px 22px rgba(16,19,32,.22);
  font-size:10px;
  font-weight:500;
  line-height:1.4;
  text-align:left;
  opacity:0;
  visibility:hidden;
  transform:translate(-50%,-4px);
  transition:.16s ease;
  pointer-events:none}

#scwco-app .scwco-mode-btn:hover::after,#scwco-app .scwco-mode-btn:focus-visible::after{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0)}

#scwco-app .scwco-mode-btn:first-child::after{
  left:0;
  transform:translateY(-4px)}

#scwco-app .scwco-mode-btn:first-child:hover::after,#scwco-app .scwco-mode-btn:first-child:focus-visible::after{
  transform:none}

#scwco-app .scwco-mode-btn:last-child::after{
  right:0;
  left:auto;
  transform:translateY(-4px)}

#scwco-app .scwco-mode-btn:last-child:hover::after,#scwco-app .scwco-mode-btn:last-child:focus-visible::after{
  transform:none}

#scwco-app .scwco-material-row{
  padding:0;
  border:0;
  background:transparent}

#scwco-app .scwco-input-panel .scwco-material-grid{
  grid-template-columns:1fr 1fr}

#scwco-app .scwco-input-panel .scwco-material-grid>.scwco-col-4{
  grid-column:span 1}

#scwco-app .scwco-input-panel .scwco-material-grid>.scwco-col-4:first-child{
  grid-column:1/-1}

#scwco-app .scwco-select-info{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:9px;
  width:100%}

#scwco-app .scwco-select-info i{
  color:#65708a;
  font-size:16px}

#scwco-app .scwco-material-area{
  grid-column:1/-1;
  order:3;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:12px 13px;
  border-radius:9px;
  background:linear-gradient(135deg,#f4efff,#f0edfb);
  color:#4f5870;
  font-size:11px}

#scwco-app .scwco-material-area strong{
  color:var(--scwco-purple);
  font-size:12px}

#scwco-app .scwco-material-dimensions{
  display:none;
  grid-column:1/-1;
  grid-template-columns:1fr 1fr;
  gap:10px;
  order:2}

#scwco-app .scwco-material-dimensions.scwco-custom-visible{
  display:grid}

#scwco-app .scwco-design-row{
  grid-template-columns:1fr;
  gap:12px}

#scwco-app .scwco-design-top{
  order:1}

#scwco-app .scwco-field-group-title{
  font-size:12px;
  color:#252b40}

#scwco-app .scwco-input-suffix{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  width:100%;
  height:44px;
  margin-top:0;
  padding-right:11px;
  border:1px solid #d9deea;
  border-radius:9px;
  background:#fff;
  overflow:hidden}

#scwco-app .scwco-input-suffix:focus-within{
  border-color:var(--scwco-purple);
  box-shadow:0 0 0 3px rgba(101,39,220,.11)}

#scwco-app .scwco-input-suffix input{
  height:42px;
  margin:0;
  padding-right:4px;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:transparent}

#scwco-app .scwco-input-suffix input:focus{
  box-shadow:none}

#scwco-app .scwco-input-suffix>span{
  color:#6c7488;
  font-size:10px;
  font-weight:650;
  white-space:nowrap}

#scwco-app .scwco-design-times{
  padding-top:19px;
  font-size:18px}

#scwco-app .scwco-design-check{
  order:2}

#scwco-app .scwco-design-qty{
  order:3}

#scwco-app .scwco-design-margin{
  order:4}

#scwco-app .scwco-checkcard{
  justify-content:flex-start;
  min-height:42px;
  border-color:#e0e4ee;
  background:#f8f9fc}

#scwco-app .scwco-checkcard{
  flex-direction:row;
  justify-content:space-between;
  align-items:center}

#scwco-app .scwco-checkcard input{
  order:2;
  margin-left:auto}

#scwco-app .scwco-checkcard span{
  order:1}

#scwco-app .scwco-margin-control{
  display:grid;
  grid-template-columns:minmax(110px,1fr) auto;
  gap:10px;
  width:100%}

#scwco-app .scwco-margin-control .scwco-btn--margin{
  width:auto;
  min-height:44px;
  margin:0;
  padding:7px 12px;
  white-space:nowrap}

#scwco-app .scwco-margin-control .scwco-btn--margin i{
  color:#ff9d00}

#scwco-app #scwco-warn-margen strong{
  color:#8a4b00;
  font-weight:900}

#scwco-app .scwco-checkcard input,#scwco-app .scwco-toggleWrap input{
  accent-color:var(--scwco-purple)}

#scwco-app #scwco-btnToggleAdvanced{
  width:100%;
  justify-content:space-between;
  color:var(--scwco-purple);
  background:#fff;
  border-color:#cbb9f8}

#scwco-app .scwco-advanced-chevron{
  margin-left:auto}

#scwco-app .scwco-advanced-box{
  border-color:#dcd3f4;
  background:#faf9fe}

#scwco-app .scwco-input-panel .scwco-advanced-box .scwco-col-6{
  grid-column:span 12}

#scwco-app .scwco-actions{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin:2px 0 0}

#scwco-app .scwco-btn{
  min-height:40px;
  justify-content:center;
  border-color:#d8ddea;
  border-radius:9px;
  background:#fff;
  color:#252b40}

#scwco-app .scwco-btn--primary{
  min-height:48px;
  border-color:var(--scwco-purple);
  background:linear-gradient(135deg,#7937ed,#5920d0);
  color:#fff;
  box-shadow:0 8px 18px rgba(101,39,220,.23)}

#scwco-app .scwco-btn--wa{
  border-color:#0aaa50;
  background:linear-gradient(135deg,#18bd60,#079746);
  color:#fff}

#scwco-app .scwco-btn--margin{
  color:#9a5500;
  border-color:#ffd59a;
  background:#fff9ee}

#scwco-app .scwco-badge{
  justify-content:center}

#scwco-app .scwco-result-panel{
  min-width:0;
  container-type:inline-size;
  scroll-margin-top:90px}

#scwco-app .scwco-result-panel--updated{
  animation:scwcoResultReveal 2.2s ease both;
  outline:3px solid rgba(101,39,220,.2);
  outline-offset:4px}

@keyframes scwcoResultReveal{
  0%,28%{box-shadow:0 0 0 8px rgba(101,39,220,.14),0 18px 42px rgba(65,35,126,.18)}
  100%{box-shadow:0 10px 28px rgba(35,30,72,.07)}}

#scwco-app .scwco-split{
  grid-template-columns:minmax(290px,.82fr) minmax(420px,1.25fr);
  gap:16px}

#scwco-app .scwco-resumen,#scwco-app .scwco-preview{
  min-height:510px;
  padding:16px;
  border:1px solid #e0e5ef;
  border-radius:13px;
  background:#fff}

#scwco-app .scwco-result-hero{
  display:block;
  padding:22px 20px 20px;
  border-color:#bfe5cd;
  background:linear-gradient(145deg,#f8fcfa,#f0faf4);
  color:#17261d;
  text-align:center}

#scwco-app .scwco-result-hero-copy{
  display:grid;
  justify-items:center;
  gap:5px}

#scwco-app .scwco-result-eyebrow{
  color:#30394b;
  font-size:14px;
  font-weight:650;
  letter-spacing:0;
  text-transform:none;
  opacity:1}

#scwco-app .scwco-result-value{
  color:#0aa14d;
  font-size:36px;
  line-height:1.05;
  letter-spacing:-.035em}

#scwco-app .scwco-result-caption{
  color:#263047;
  font-size:15px;
  font-weight:650}

#scwco-app .scwco-result-hero-price{
  display:grid;
  justify-items:center;
  gap:4px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid #b9dfc7}

#scwco-app .scwco-result-hero-price>span{
  color:#4e586c;
  font-size:12px;
  font-weight:700}

#scwco-app .scwco-result-hero-price>strong{
  color:#151b2e;
  font-size:28px;
  line-height:1.15;
  letter-spacing:-.025em}

#scwco-app .scwco-result-hero-price>small{
  color:#606b7d;
  font-size:11px;
  line-height:1.45}

#scwco-app .scwco-result-hero-price.is-loading>strong,#scwco-app .scwco-result-hero-price.is-muted>strong{
  color:#687287;
  font-size:21px}

#scwco-app .scwco-result-metric{
  padding:6px;
  border-color:#e4e8f0;
  border-radius:10px;
  background:#fafbfe;
  text-align:center}

#scwco-app .scwco-result-metric strong{
  font-size:12px;
  line-height: 14px;
  }

#scwco-app .scwco-result-callout{
  border-color:#cce9d7;
  background:#f1faf4;
  color:#17683b}

#scwco-app .scwco-result-callout--smart{
  line-height:1.55}

#scwco-app .scwco-result-callout--smart>i{
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  flex:0 0 27px;
  border-radius:50%;
  background:#d9f3e3;
  color:#0b9144;
  font-size:15px}

#scwco-app .scwco-result-price{
  padding:0;
  border:1px solid #ddd5f5;
  border-radius:10px;
  background:#f8f5ff;
  overflow:hidden}

#scwco-app .scwco-result-price summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  color:#5422b8;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  list-style:none}

#scwco-app .scwco-result-price summary::-webkit-details-marker{
  display:none}

#scwco-app .scwco-result-price summary i{
  transition:transform .2s ease}

#scwco-app .scwco-result-price[open] summary i{
  transform:rotate(180deg)}

#scwco-app .scwco-result-price-body{
  display:grid;
  gap:6px;
  padding:0 14px 14px;
  color:#434c60;
  font-size:12px}

#scwco-app .scwco-preview-head{
  margin-bottom:12px}

#scwco-app .scwco-preview-title{
  font-weight:800;
  color:#20263a}

#scwco-app .scwco-preview-stage{
  display:grid;
  grid-template-columns:28px auto;
  grid-template-rows:25px auto;
  justify-content:center;
  align-items:center;
  margin:8px auto 0}

#scwco-app .scwco-preview-stage .scwco-canvas-box{
  grid-column:2;
  grid-row:2}

#scwco-app .scwco-preview-dimension{
  display:flex;
  align-items:center;
  gap:6px;
  color:#59627a;
  font-size:10px;
  white-space:nowrap}

#scwco-app .scwco-preview-dimension span{
  display:block;
  background:#b9bfd0}

#scwco-app .scwco-preview-dimension--width{
  grid-column:2;
  grid-row:1;
  justify-content:center}

#scwco-app .scwco-preview-dimension--width span{
  width:28px;
  height:1px}

#scwco-app .scwco-preview-dimension--height{
  grid-column:1;
  grid-row:2;
  justify-content:center;
  writing-mode:vertical-rl;
  transform:rotate(180deg)}

#scwco-app .scwco-preview-dimension--height span{
  width:1px;
  height:28px}

#scwco-app .scwco-canvas-box{
  border-color:#d7dbea !important;
  background:#fafbfe !important}

#scwco-app .scwco-roll-continuation{
  position:absolute;
  z-index:5;
  right:7px;
  bottom:7px;
  left:7px;
  display:grid;
  grid-template-columns:32px 1fr;
  gap:9px;
  align-items:center;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:10px;
  background:linear-gradient(135deg,rgba(41,17,89,.93),rgba(101,39,220,.92));
  color:#fff;
  box-shadow:0 -12px 24px rgba(40,19,83,.18);
  backdrop-filter:blur(5px);
  pointer-events:none}

#scwco-app .scwco-roll-continuation::before{
  content:"";
  position:absolute;
  right:0;
  bottom:100%;
  left:0;
  height:34px;
  background:linear-gradient(to bottom,transparent,rgba(80,34,166,.18))}

#scwco-app .scwco-roll-continuation>i{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:50%;
  background:rgba(255,255,255,.16);
  font-size:18px;
  animation:scwco-roll-pulse 1.8s ease-in-out infinite}

#scwco-app .scwco-roll-continuation strong,#scwco-app .scwco-roll-continuation small{
  display:block}

#scwco-app .scwco-roll-continuation strong{
  font-size:12px;
  line-height:1.3}

#scwco-app .scwco-roll-continuation small{
  margin-top:2px;
  color:#ede7ff;
  font-size:9px;
  line-height:1.35}

@keyframes scwco-roll-pulse{
  50%{
  transform:translateY(3px);
  opacity:.72}

}

#scwco-app #scwco-recommendations{
  margin-top:18px}

#scwco-app .scwco-results-heading{
  align-items:center;
  margin-bottom:13px}

#scwco-app .scwco-results-heading h4{
  margin:0}

#scwco-app .scwco-suggestion-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px}

#scwco-app .scwco-suggestion-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
  padding:16px;
  border:1px solid #cfe7d8;
  border-radius:13px;
  background:linear-gradient(145deg,#f7fcf9,#f0faf4);
  color:#176a3c}

#scwco-app .scwco-suggestion-card--large{
  border-color:#cbdcff;
  background:linear-gradient(145deg,#f8faff,#f0f5ff);
  color:#145dcc}

#scwco-app .scwco-suggestion-card--units{
  border-color:#ffd7b3;
  background:linear-gradient(145deg,#fffaf5,#fff4e9);
  color:#dc6200}

#scwco-app .scwco-suggestion-head{
  display:flex;
  align-items:flex-start;
  gap:10px}

#scwco-app .scwco-suggestion-head i{
  font-size:28px;
  line-height:1}

#scwco-app .scwco-suggestion-head strong,#scwco-app .scwco-suggestion-head small{
  display:block}

#scwco-app .scwco-suggestion-head small{
  margin-top:2px;
  color:#616a7f;
  font-size:10px}

#scwco-app .scwco-suggestion-size{
  font-size:24px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.03em}

#scwco-app .scwco-suggestion-meta{
  color:#4f5870;
  font-size:11px}

#scwco-app .scwco-suggestion-card .scwco-btn{
  width:100%;
  margin-top:auto;
  border-color:#13984c;
  background:#13984c;
  color:#fff}

#scwco-app .scwco-suggestion-card--large .scwco-btn{
  border-color:#1769e8;
  background:#1769e8}

#scwco-app .scwco-suggestion-card--units .scwco-btn{
  border-color:#ed7200;
  background:#ed7200}

#scwco-app .scwco-suggestion-card .scwco-btn i{
  color:#fff}

#scwco-app .scwco-all-options{
  margin-top:14px;
  border:1px solid #e0e4ed;
  border-radius:11px;
  background:#fafbfe}

#scwco-app .scwco-all-options>summary{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:11px 14px;
  color:var(--scwco-purple);
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  list-style:none}

#scwco-app .scwco-all-options>summary::-webkit-details-marker{
  display:none}

#scwco-app .scwco-all-options[open]>summary i{
  transform:rotate(180deg)}

#scwco-app .scwco-all-options-content{
  padding:0 12px 12px}

#scwco-app .scwco-table{
  border-collapse:separate;
  border-spacing:0 8px;
  background:transparent}

#scwco-app .scwco-table thead th{
  border:0;
  background:transparent;
  color:#6e778e;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.05em}

#scwco-app .scwco-table td{
  border-top:1px solid #e3e7ef;
  border-bottom:1px solid #e3e7ef;
  background:#fff}

#scwco-app .scwco-table td:first-child{
  border-left:1px solid #e3e7ef;
  border-radius:10px 0 0 10px}

#scwco-app .scwco-table td:last-child{
  border-right:1px solid #e3e7ef;
  border-radius:0 10px 10px 0}

#scwco-app .scwco-table tbody tr:nth-child(even) td{
  background:#fafbfe}

#scwco-app .scwco-sugerencia-activa td{
  border-color:#9f7bea;
  background:#f6f1ff !important}

#scwco-app .scwco-bottom-grid{
  display:grid;
  grid-template-columns:minmax(360px,.8fr) minmax(0,1.35fr);
  gap:18px;
  align-items:start}

#scwco-app .scwco-action-card .scwco-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))}

#scwco-app .scwco-action-card .scwco-col-4{
  grid-column:span 1}

#scwco-app .scwco-action-card .scwco-col-4:last-child{
  grid-column:1/-1;
  grid-row:1}

#scwco-app .scwco-action-card .scwco-col-4:last-child .scwco-btn{
  width:100%;
  min-height:54px;
  font-size:16px}

#scwco-app .scwco-action-card[data-disabled="true"]{
  opacity:1}

#scwco-app .scwco-budget-panel h4 i{
  color:var(--scwco-purple)}

#scwco-app .scwco-saved-list{
  grid-template-columns:1fr}

#scwco-app .scwco-saved{
  --scwco-saved-accent:#6527dc;
  --scwco-saved-soft:#f4efff;
  position:relative;
  gap:0;
  padding:0;
  overflow:hidden;
  border:1px solid #ddd5f2;
  border-left:4px solid var(--scwco-saved-accent);
  box-shadow:0 7px 20px rgba(43,33,82,.055)}

#scwco-app .scwco-saved:nth-child(3n+2){
  --scwco-saved-accent:#1769e8;
  --scwco-saved-soft:#edf4ff;
  border-color:#cfddf7;
  border-left-color:var(--scwco-saved-accent)}

#scwco-app .scwco-saved:nth-child(3n){
  --scwco-saved-accent:#e56a00;
  --scwco-saved-soft:#fff3e8;
  border-color:#f3d6bc;
  border-left-color:var(--scwco-saved-accent)}

#scwco-app .scwco-saved-head{
  padding:13px 14px;
  background:linear-gradient(135deg,var(--scwco-saved-soft),#fff);
  border-bottom:1px solid rgba(95,76,143,.12)}

#scwco-app .scwco-saved-index{
  border-radius:50%;
  background:var(--scwco-saved-accent);
  color:#fff}

#scwco-app .scwco-saved-kicker{
  display:block;
  margin-bottom:2px;
  color:var(--scwco-saved-accent);
  font-size:9px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase}

#scwco-app .scwco-saved-tags{
  padding:11px 14px 0}

#scwco-app .scwco-saved-tag{
  background:var(--scwco-saved-soft);
  color:#514566}

#scwco-app .scwco-saved-body{
  padding:11px 14px}

#scwco-app .scwco-saved-price{
  margin:0 14px 11px}

#scwco-app .scwco-saved .scwco-row{
  margin:0;
  padding:0 14px 14px}

#scwco-app .scwco-saved .scwco-row .scwco-btn:first-child{
  border-color:var(--scwco-saved-accent);
  color:var(--scwco-saved-accent)}

#scwco-app .scwco-price-visibility{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 13px;
  border:1px solid #ddd5f5;
  border-radius:10px;
  background:#f8f5ff}

#scwco-app .scwco-price-visibility>span{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:#30374c;
  font-size:11px;
  line-height:1.45}

#scwco-app .scwco-price-visibility>span i{
  margin-top:1px;
  color:var(--scwco-purple);
  font-size:17px}

#scwco-app .scwco-price-visibility strong,#scwco-app .scwco-price-visibility small{
  display:block}

#scwco-app .scwco-price-visibility small{
  color:#6b748a}

#scwco-app .scwco-price-visibility input{
  width:18px;
  height:18px;
  flex:0 0 18px;
  accent-color:var(--scwco-purple)}

#scwco-app .scwco-totals{
  border-color:#d8cdf5;
  background:linear-gradient(135deg,#f8f5ff,#eee8ff)}

#scwco-app .scwco-budget-head span,#scwco-app .scwco-budget-materials,#scwco-app .scwco-budget-note{
  color:#5c4b85}

#scwco-app .scwco-budget-icon{
  color:var(--scwco-purple)}

#scwco-app .scwco-process-footer{
  margin-top:18px;
  padding:15px 20px;
  border:1px solid #e3dcf7;
  border-radius:14px;
  background:linear-gradient(90deg,#faf7ff,#f6f2ff);
  color:#3d3260}

#scwco-app .scwco-process-footer>strong{
  display:block;
  margin-bottom:9px;
  color:var(--scwco-purple);
  font-size:11px}

#scwco-app .scwco-process-footer>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px}

#scwco-app .scwco-process-footer span{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:11px}

#scwco-app .scwco-process-footer span i{
  color:var(--scwco-purple);
  font-size:18px}

#scwco-app .scwco-feedback-card{
  border-color:#9d7bea}

body.scwco-modal-open{
  overflow:hidden}

#scwco-app .scwco-image-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  opacity:0;
  transition:opacity .2s ease}

#scwco-app .scwco-image-modal[hidden]{
  display:none}

#scwco-app .scwco-image-modal.scwco-show{
  opacity:1}

#scwco-app .scwco-image-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(14,16,28,.68);
  backdrop-filter:blur(5px)}

#scwco-app .scwco-image-modal-card{
  position:relative;
  z-index:1;
  width:min(820px,100%);
  max-height:min(88vh,760px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid #e0e4ee;
  border-radius:18px;
  background:#fff;
  box-shadow:0 28px 80px rgba(12,10,25,.34);
  transform:translateY(12px) scale(.985);
  transition:transform .2s ease}

#scwco-app .scwco-image-modal.scwco-show .scwco-image-modal-card{
  transform:none}

#scwco-app .scwco-image-modal-head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:20px 22px 15px;
  border-bottom:1px solid #e7e9f0}

#scwco-app .scwco-image-modal-head h3{
  margin:0;
  color:#171c2e;
  font-size:22px}

#scwco-app .scwco-image-modal-head p{
  margin:4px 0 0;
  color:#687188;
  font-size:12px}

#scwco-app .scwco-modal-close{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border:1px solid #e0e4ed;
  border-radius:10px;
  background:#f7f8fb;
  color:#434b60;
  cursor:pointer}

#scwco-app .scwco-image-modal-body{
  min-height:0;
  overflow:auto;
  padding:18px 22px}

#scwco-app .scwco-image-dropzone{
  display:grid;
  place-items:center;
  gap:3px;
  width:100%;
  padding:22px;
  border:1px dashed #bba6ef;
  border-radius:12px;
  background:#faf8ff;
  color:#5a6278;
  text-align:center;
  cursor:pointer}

#scwco-app .scwco-image-dropzone>i{
  color:var(--scwco-purple);
  font-size:28px}

#scwco-app .scwco-image-dropzone strong{
  color:#292f43}

#scwco-app .scwco-image-dropzone span{
  font-size:10px}

#scwco-app .scwco-image-dropzone input{
  height:auto;
  margin-top:8px;
  padding:6px;
  background:#fff}

#scwco-app .scwco-image-modal #scwco-propCanvasWrap{
  margin-top:14px}

#scwco-app .scwco-image-modal .scwco-propViewport{
  max-height:52vh;
  border-radius:12px;
  background:#eef0f5}

#scwco-app .scwco-image-tip{
  display:flex;
  gap:9px;
  margin-top:13px;
  padding:11px 12px;
  border-radius:9px;
  background:#fff8df;
  color:#715d19;
  font-size:11px}

#scwco-app .scwco-image-tip i{
  color:#f0a000;
  font-size:16px}

#scwco-app .scwco-image-modal-footer{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:14px 22px;
  border-top:1px solid #e7e9f0;
  background:#fafbfc}

#scwco-app .scwco-image-modal-footer .scwco-btn--primary{
  min-height:42px}

@media (max-width:1120px){
  #scwco-app .scwco-hero{
  grid-template-columns:auto 1fr}

#scwco-app .scwco-benefits{
  grid-column:1/-1}

#scwco-app .scwco-workspace{
  grid-template-columns:340px minmax(0,1fr)}

#scwco-app .scwco-split{
  grid-template-columns:1fr}

#scwco-app .scwco-resumen,#scwco-app .scwco-preview{
  min-height:0}

}

@media (max-width:860px){
  #scwco-app{
  padding:16px}

#scwco-app .scwco-workspace,#scwco-app .scwco-bottom-grid{
  grid-template-columns:1fr}

#scwco-app .scwco-step div{
  display:none}

#scwco-app .scwco-stepper{
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr}

#scwco-app .scwco-step{
  justify-content:center}

#scwco-app .scwco-input-panel .scwco-design-row{
  grid-template-columns:1fr 1fr}

#scwco-app .scwco-input-panel .scwco-design-top{
  grid-column:1/-1}

#scwco-app .scwco-suggestion-cards{
  grid-template-columns:1fr}

#scwco-app .scwco-process-footer>div{
  flex-wrap:wrap;
  justify-content:flex-start}

}

@media (max-width:600px){
  #scwco-app{
  margin:0;
  padding:10px;
  background:#f7f8fc}

#scwco-app .scwco-hero{
  grid-template-columns:auto 1fr;
  gap:14px;
  padding:14px 8px}

#scwco-app .scwco-brand-mark{
  width:49px;
  height:44px;
  border-width:2px;
  border-radius:10px;
  font-size:17px}

#scwco-app .scwco-brand-mark::after{
  right:-8px;
  width:15px;
  height:10px;
  border-width:2px}

#scwco-app .scwco-kicker{
  display:none}

#scwco-app .scwco-h2{
  font-size:27px}

#scwco-app .scwco-sub{
  font-size:12px}

#scwco-app .scwco-benefits{
  grid-template-columns:repeat(3,1fr)}

#scwco-app .scwco-benefits>div{
  min-height:60px;
  justify-content:center;
  padding:8px;
  border-left:1px solid var(--scwco-borde)}

#scwco-app .scwco-benefits i{
  font-size:20px}

#scwco-app .scwco-benefits span{
  display:none}

#scwco-app .scwco-stepper{
  margin-bottom:12px;
  padding:9px 12px}

#scwco-app .scwco-step>span{
  width:31px;
  height:31px;
  flex-basis:31px;
  font-size:12px}

#scwco-app .scwco-card,#scwco-app #scwco-recommendations{
  padding:15px;
  border-radius:14px}

#scwco-app .scwco-card h4,#scwco-app .scwco-results-heading h4{
  font-size:16px}

#scwco-app .scwco-input-panel .scwco-design-row{
  grid-template-columns:1fr}

#scwco-app .scwco-input-panel .scwco-design-top{
  grid-column:auto}

#scwco-app .scwco-margin-control{
  grid-template-columns:1fr}

#scwco-app .scwco-margin-control .scwco-btn--margin{
  width:100%}

#scwco-app .scwco-image-modal{
  padding:8px;
  align-items:flex-end}

#scwco-app .scwco-image-modal-card{
  max-height:94vh;
  border-radius:17px 17px 8px 8px}

#scwco-app .scwco-image-modal-head,#scwco-app .scwco-image-modal-body{
  padding:15px}

#scwco-app .scwco-image-modal-footer{
  display:grid;
  grid-template-columns:1fr;
  padding:12px 15px}

#scwco-app .scwco-image-modal-footer .scwco-btn--primary{
  grid-row:1}

#scwco-app .scwco-actions{
  position:static;
  margin:2px 0 0;
  padding:0;
  border:0;
  background:transparent;
  backdrop-filter:none}

#scwco-app .scwco-split{
  grid-template-columns:1fr}

#scwco-app .scwco-preview{
  padding:10px;
  overflow:auto}

#scwco-app .scwco-action-card .scwco-grid{
  grid-template-columns:1fr}

#scwco-app .scwco-action-card .scwco-col-4,#scwco-app .scwco-action-card .scwco-col-4:last-child{
  grid-column:1}

#scwco-app .scwco-process-footer>div>i{
  display:none}

#scwco-app .scwco-process-footer span{
  width:calc(50% - 7px)}

}

/* Prioridad visual final de Sticker Center. */
#scwco-app{
  --scwco-amarillo:#ffcc00;
  --scwco-amarillo-dark:#d9ad00;
  --scwco-amarillo-soft:#fff8d7}

#scwco-app .scwco-stepper{
  grid-template-columns:1fr auto 1fr auto 1fr}

#scwco-app .scwco-design-margin{order:3}
#scwco-app .scwco-design-qty{order:4}

#scwco-app .scwco-btn--primary{
  border-color:#e2b500;
  background:linear-gradient(135deg,#ffda32,#ffca05);
  color:#2b2400;
  box-shadow:0 7px 16px rgba(192,151,0,.22)}

#scwco-app .scwco-btn--primary:hover{
  border-color:#cfa600;
  background:linear-gradient(135deg,#ffe052,#ffcc00);
  color:#211b00}

#scwco-app .scwco-btn--primary i{color:#4d3d00}

#scwco-app .scwco-saved .scwco-row [data-order-saved]{
  border-color:#0aaa50;
  background:linear-gradient(135deg,#18bd60,#079746);
  color:#fff}

#scwco-app .scwco-saved .scwco-row .scwco-btn[data-order-saved]:first-child i{color:#fff}

@media (max-width:640px){
  #scwco-app .scwco-stepper{
    grid-template-columns:1fr auto 1fr auto 1fr}
}

/* Guardado adaptable al ancho real del panel de resultado. */
#scwco-app .scwco-result-savebar{
  min-width:0;
  grid-template-columns:minmax(0,1fr);
  align-items:stretch;
  overflow:hidden}

#scwco-app .scwco-result-savebar-copy,
#scwco-app .scwco-result-save-fields,
#scwco-app .scwco-result-savebar>.scwco-saveimgwrap,
#scwco-app .scwco-result-savebar>#scwco-btnSaveCalc{
  min-width:0;
  grid-column:1;
  grid-row:auto}

#scwco-app .scwco-result-save-fields label,
#scwco-app .scwco-result-save-fields input{
  min-width:0;
  max-width:100%}

#scwco-app .scwco-result-save-fields{
  grid-template-columns:minmax(0,1fr)}

#scwco-app .scwco-result-savebar>#scwco-btnSaveCalc{
  width:100%;
  min-width:0}

@container (min-width:640px){
  #scwco-app .scwco-result-save-fields{
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
}

@container (min-width:760px){
  #scwco-app .scwco-result-savebar{
    grid-template-columns:minmax(180px,.72fr) minmax(0,1.55fr) minmax(145px,auto);
    align-items:end}
  #scwco-app .scwco-result-savebar-copy{
    grid-column:1;
    align-self:center}
  #scwco-app .scwco-result-save-fields,
  #scwco-app .scwco-result-savebar>.scwco-saveimgwrap{
    grid-column:2}
  #scwco-app .scwco-result-savebar>#scwco-btnSaveCalc{
    grid-column:3;
    width:auto;
    min-width:145px}
}

/* Presupuesto: subtotal a todo el ancho y cálculos en cuadrícula. */
#scwco-app .scwco-budget-panel>#scwco-savedTotals{
  width:100%}

#scwco-app .scwco-saved-list{
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch}

#scwco-app .scwco-saved{
  height:100%}

#scwco-app .scwco-saved .scwco-row{
  grid-template-columns:repeat(2,minmax(0,1fr))}

#scwco-app .scwco-saved .scwco-row .scwco-btn{
  min-width:0;
  width:100%;
  padding-inline:8px}

@media (max-width:1180px){
  #scwco-app .scwco-saved-list{
    grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:700px){
  #scwco-app .scwco-saved-list{
    grid-template-columns:minmax(0,1fr)}
}