/* Configuratore del preventivo: regole estratte dal foglio di stile precedente, caricate solo su preventivo.html.
   Le parti comuni (pulsanti, campi, colori) arrivano da site.css. */
.conf { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: clamp(28px, 4vw, 56px); align-items: start; }
.conf-form { display: grid; gap: 28px; }
.step { border: 1px solid var(--line); border-radius: 4px; padding: clamp(18px, 3vw, 30px); margin: 0; display: grid; gap: 22px; min-width: 0; }
.step legend { display: flex; align-items: center; gap: 12px; padding: 0 8px; font: 700 20px/1 var(--display); font-stretch: 108%; color: var(--ink); }
.step legend .n { width: 30px; height: 30px; border-radius: 50%; background: var(--green); color: #fff; display: grid; place-items: center; font: 600 14px/1 var(--mono); }
.model-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.model-card { position: relative; display: grid; gap: 6px; padding: 10px; border: 1px solid var(--line); border-radius: 4px; cursor: pointer; transition: border-color .25s, box-shadow .25s, transform .2s; }
.model-card input { position: absolute; opacity: 0; pointer-events: none; }
.model-card .frame { aspect-ratio: 4 / 3; border-radius: 2px; }
.model-card .mc-name { font-weight: 700; color: var(--ink); }
.model-card .mc-sum { font-size: 13px; line-height: 1.4; color: var(--muted); }
.model-card:has(input:checked) { border-color: var(--green); box-shadow: 0 0 0 2px var(--green) inset; }
.model-card:has(input:focus-visible) { outline: 2px solid var(--green); outline-offset: 3px; }
@media (hover: hover) {
  .model-card:hover { border-color: var(--green); }
}
.model-card:active { transform: scale(.98); }
.flabel { font: 500 12px/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.range-field label output { color: var(--green); font-weight: 600; margin-left: 6px; letter-spacing: 0; }
input[type=range] { width: 100%; accent-color: var(--green); height: 28px; }
.range-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--muted); }
.range-row input { width: 110px; }
.pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pill input { position: absolute; opacity: 0; pointer-events: none; }
.pill span { display: inline-block; padding: 10px 16px; border: 1px solid var(--line); border-radius: 999px; font-weight: 600; font-size: 14px; color: var(--ink); cursor: pointer; transition: background .25s, color .25s, border-color .25s; }
.pill input:checked + span { background: var(--green); border-color: var(--green); color: #fff; }
.pill input:focus-visible + span { outline: 2px solid var(--green); outline-offset: 2px; }
.sw-grid { display: flex; flex-wrap: wrap; gap: 12px 10px; }
.sw-opt { width: 76px; display: grid; justify-items: center; gap: 6px; font-size: 12px; line-height: 1.25; text-align: center; color: var(--ink); cursor: pointer; }
.sw-opt input { position: absolute; opacity: 0; pointer-events: none; }
.sw-opt img { width: 56px; height: 56px; border-radius: 9px; object-fit: cover; border: 2px solid var(--green); box-sizing: border-box; transition: box-shadow .25s, transform .25s; }
.sw-opt input:checked + img { box-shadow: 0 0 0 3px var(--paper), 0 0 0 5px var(--green); transform: scale(1.05); }
.sw-opt input:focus-visible + img { outline: 2px solid var(--green); outline-offset: 4px; }
.hint { font-size: 13px; color: var(--muted); }
.conf-summary { position: sticky; top: calc(var(--header-h) + 64px); }
.sum-card { border-radius: 4px; background: var(--mist); padding: 26px; display: grid; gap: 16px; }
.sum-title { font-size: 26px; }
.sum-svg { width: 100%; height: auto; display: block; background: var(--paper); border-radius: 2px; }
.sum-list { margin: 0; display: grid; }
.sum-list > div { display: grid; grid-template-columns: 120px 1fr; gap: 10px; padding: 9px 6px; border-bottom: 1px solid var(--line); border-radius: 2px; }
.sum-list dt { font: 500 11px/1.6 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.sum-list dd { margin: 0; color: var(--ink); font-size: 15px; font-variant-numeric: tabular-nums; }
.sum-actions { display: grid; gap: 10px; }
.sum-actions .btn { justify-content: center; }
@media (max-width: 1080px) {
  .conf { grid-template-columns: 1fr; }
  .conf-summary { position: static; }
}
@media (max-width: 560px) {
  .model-grid { grid-template-columns: 1fr 1fr; }
  .sum-list > div { grid-template-columns: 1fr; gap: 2px; }
}
.conf-form .two { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.pill, .sw-opt { position: relative; }
.model-card input, .pill input, .sw-opt input { inset: 0; width: 100%; height: 100%; margin: 0; }
.conf-bar { display: none; }
@media (max-width: 1080px) {
  .conf-bar { position: fixed; z-index: 41; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 10px 10px 18px; border-radius: 999px; background: rgba(255,255,255,.97); color: var(--ink); box-shadow: 0 14px 34px -14px rgba(0,0,0,.35), 0 0 0 1px var(--line); opacity: 0; visibility: hidden; transform: translateY(calc(100% + 24px)); transition: transform .55s var(--ease), opacity .35s ease, visibility 0s linear .55s; }
  .conf-bar.is-on { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .conf-bar .cb-txt { display: grid; min-width: 0; line-height: 1.2; }
  .conf-bar .cb-name { font-weight: 700; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .conf-bar .cb-dim { font: 500 12px/1.4 var(--mono); color: var(--muted); font-variant-numeric: tabular-nums; }
  .conf-bar .btn { padding: 12px 18px; flex: none; min-height: 44px; border-radius: 999px; }
  .conf-bar-on .to-top { opacity: 0; visibility: hidden; }
  .conf-bar-on .cookie { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
  .conf-summary { scroll-margin-top: 90px; }
}
@media (max-width: 760px) {
  .conf { gap: 28px; }
  .conf-form { gap: 18px; }
  .step { padding: 16px 14px 20px; gap: 18px; }
  .step legend { font-size: 18px; padding: 0 6px; }
  .step legend .n { width: 26px; height: 26px; font-size: 13px; }
  .model-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .model-card { padding: 8px; gap: 8px; }
  .model-card .mc-name { font-size: 15px; line-height: 1.2; }
  .model-card .mc-sum { display: none; }
  input[type=range] { height: 40px; }
  .range-row { gap: 6px 10px; font-size: 12.5px; line-height: 1.4; }
  .range-row input { width: 96px; }
  .range-row span { flex: 1 1 160px; }
  .pill span { padding: 11px 16px; min-height: 44px; display: inline-flex; align-items: center; }
  .sw-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 8px; }
  .sw-opt { width: auto; font-size: 11.5px; }
  .sw-opt img { width: 52px; height: 52px; }
  .conf-form .two { grid-template-columns: 1fr; gap: 18px; }
  .sum-card { padding: 20px 16px; }
  .sum-title { font-size: 22px; }
  .sum-actions .btn { min-height: 52px; }
}
@media (max-width: 430px) {
  .sw-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.sw-opt span { max-width: 100%; overflow-wrap: break-word; }
.field .sw-opt, .field .pill { font-family: var(--body); text-transform: none; letter-spacing: 0; }
.field .sw-opt { font-size: 12.5px; line-height: 1.3; color: var(--ink); }
.field .pill { font-size: 14px; }
.trust { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13.5px; color: var(--text); text-decoration: none; padding: 12px 14px; background: var(--paper); border-radius: 4px; transition: box-shadow .3s; }
.trust .stars svg { width: 15px; height: 15px; }
.trust strong { color: var(--ink); }
@media (hover: hover) {
  .trust:hover { box-shadow: 0 0 0 1px var(--green) inset; }
}
.trust:active { transform: scale(.98); }
.pill span { transition: background .25s, color .25s, border-color .25s, transform .2s var(--ease); }
.pill:active span { transform: scale(.95); }
.sw-opt:active img { transform: scale(.9); }
@media (max-width: 1080px) {
  .conf-bar { background: rgba(255,255,255,.97); color: var(--ink); box-shadow: 0 14px 34px -14px rgba(0,0,0,.35), 0 0 0 1px var(--line); }
  .conf-bar .cb-name { color: var(--ink); }
  .conf-bar .cb-dim { color: var(--muted); }
}
.model-card .mc-visual { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 3px; background: var(--mist); overflow: hidden; }
.mc-art { display: block; width: 100%; height: 100%; }
.mc-art .w { fill: #e4e4e4; stroke: var(--ink); stroke-width: 1.2; }
.mc-art .gr { stroke: var(--muted); stroke-width: 1.2; }
.mc-art .p { fill: var(--muted); opacity: .28; }
.mc-art .g { fill: none; stroke: var(--green); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; opacity: .9; }
.mc-art .s { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linecap: round; }
.mc-art .t { stroke-width: 1.4; }
.model-card .mc-photo { position: absolute; right: 6px; bottom: 6px; width: 27%; aspect-ratio: 1; border-radius: 3px; overflow: hidden; box-shadow: 0 0 0 2px #fff, 0 4px 12px -4px rgba(0,0,0,.35); }
.model-card .mc-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.model-card .mc-cap { font-size: 13px; line-height: 1.35; color: var(--green-dark); font-weight: 600; }
.model-card:has(input:checked) .mc-visual { background: #eaf4ee; }
.js .model-card .mc-photo { inset: 0; right: 0; bottom: 0; width: auto; aspect-ratio: auto; border-radius: 3px; z-index: 1; transform-origin: calc(100% - 6px) calc(100% - 6px); box-shadow: 0 0 0 0 #fff; transition: transform .8s cubic-bezier(.34, 1.3, .64, 1), border-radius .75s, box-shadow .75s; }
.js .model-card.is-on .mc-photo { transform: scale(.27) rotate(-4deg); border-radius: 10px; box-shadow: 0 0 0 7px #fff, 0 16px 40px -12px rgba(0,0,0,.5); }
.js .mc-art .w { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform .5s cubic-bezier(.22, 1, .36, 1); }
.js .mc-art .gr { transform-box: fill-box; transform-origin: 0 50%; transform: scaleX(0); transition: transform .5s ease; }
.js .mc-art path.s, .js .mc-art path.g { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .7s ease-in-out; }
.js .mc-art circle.s { opacity: 0; transition: opacity .3s; }
.js .model-card.is-on .mc-art .w { transform: none; transition-delay: .25s; }
.js .model-card.is-on .mc-art .gr { transform: none; transition-delay: .3s; }
.js .model-card.is-on .mc-art circle.s { opacity: 1; transition-delay: .6s; }
.js .model-card.is-on .mc-art path.s { stroke-dashoffset: 0; transition-delay: .6s; }
.js .model-card.is-on .mc-art path.g { stroke-dashoffset: 0; transition-delay: 1s; transition-duration: .8s; }
@media (prefers-reduced-motion: reduce) {
  .js .model-card .mc-photo, .js .mc-art * { transition: none !important; }
}
.sum-svg.is-anim .cv-roof, .sum-svg.is-anim .cv-beam { transform-box: fill-box; transform-origin: 0 50%; animation: cv-grow-x .7s cubic-bezier(.22, 1, .36, 1) backwards; }
.sum-svg.is-anim .cv-beam { animation-delay: .12s; }
.sum-svg.is-anim .cv-raf { animation: cv-drop .45s cubic-bezier(.34, 1.56, .64, 1) backwards; animation-delay: calc(.55s + var(--i) * .07s); }
.sum-svg.is-anim .cv-sup { stroke-dasharray: 1; animation: cv-draw .6s ease-in-out backwards; animation-delay: calc(.9s + var(--i) * .1s); }
.sum-svg.is-anim .cv-pin { animation: cv-fade .3s ease backwards; animation-delay: calc(.9s + var(--i) * .1s); }
.sum-svg.is-anim .cv-col { transform-box: fill-box; transform-origin: 50% 0; animation: cv-grow-y .6s cubic-bezier(.22, 1, .36, 1) backwards; animation-delay: calc(.9s + var(--i) * .1s); }
.sum-svg.is-anim .cv-led { animation: cv-fade .6s ease backwards 1.4s; }
.sum-svg.is-anim .cv-dim { transform-box: fill-box; transform-origin: 50% 50%; animation: cv-grow-x .6s cubic-bezier(.22, 1, .36, 1) backwards 1.25s; }
.sum-svg.is-anim .cv-txt { animation: cv-fade .5s ease backwards 1.55s; }
@keyframes cv-grow-x {from { transform: scaleX(0); }}
@keyframes cv-grow-y {from { transform: scaleY(0); }}
@keyframes cv-drop {from { opacity: 0; transform: translateY(-14px); }}
@keyframes cv-draw {from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; }}
@keyframes cv-fade {from { opacity: 0; }}
.swatch-list img, .sw-opt img { box-shadow: 0 0 0 1px rgba(0,0,0,.16), inset 0 0 0 1px rgba(0,0,0,.06), 0 6px 14px -8px rgba(0,0,0,.35); }
.model-card { transition: border-color .25s, box-shadow .35s, transform .35s cubic-bezier(.22, 1, .36, 1); }
.model-card.is-on { transform: translateY(-3px); box-shadow: 0 0 0 2px var(--green) inset, 0 16px 34px -18px rgba(0, 80, 40, .45); }
.model-card .mc-visual::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease .15s; background-image: linear-gradient(rgba(0,140,74,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(0,140,74,.09) 1px, transparent 1px); background-size: 14px 14px; }
.model-card.is-on .mc-visual::before { opacity: 1; }
.js .mc-art .pg { opacity: 0; transform: translateX(-34px); transition: opacity .35s ease, transform .9s cubic-bezier(.22, 1, .36, 1); }
.js .model-card.is-on .mc-art .pg { opacity: 1; transform: none; transition-delay: 1.45s; }
.js .model-card.is-on .mc-art .pg .p { animation: mc-walk .3s ease-in-out 1.45s 3 alternate; }
@keyframes mc-walk {to { transform: translateY(-2px); }}
@media (prefers-reduced-motion: reduce) {
  .model-card, .model-card.is-on, .js .mc-art .pg { transition: none !important; animation: none !important; }
}
.sum-list .chip { display: inline-block; width: 14px; height: 14px; border-radius: 50%; margin-right: 8px; vertical-align: -2px; box-shadow: 0 0 0 1px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.4); transition: background-color .4s ease; }
.sum-list dd:has(.chip) { display: flex; align-items: center; gap: 10px; }
.sum-list .chip { flex: 0 0 16px; width: 16px; height: 16px; margin: 0; padding: 0; }
.mc-art .w rect { fill: #ececec; stroke: var(--ink); stroke-width: 1.2; }
.mc-art .w .hx line { stroke: var(--muted); stroke-width: .7; opacity: .7; }
.mc-art .gb { fill: none; stroke: var(--green); stroke-width: 11; stroke-linecap: round; stroke-linejoin: round; opacity: .16; }
.mc-art .g { stroke-width: 3.2; }
.mc-art .sh { fill: #1d3b2c; opacity: .16; }
.mc-art .p { fill: var(--muted); opacity: .32; }
.js .mc-art .w { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform .3s ease; }
.js .model-card.is-on .mc-art .w { transform: none; transition: transform .55s cubic-bezier(.22, 1, .36, 1) .25s; }
.js .mc-art path.gb { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .3s ease; }
.js .model-card.is-on .mc-art path.gb { stroke-dashoffset: 0; transition: stroke-dashoffset .9s ease-in-out 1.05s; }
.js .mc-art path.s, .js .mc-art path.g { transition-duration: .3s; }
.js .model-card.is-on .mc-art path.s { transition-duration: .7s; }
.js .model-card.is-on .mc-art path.g { transition-duration: .85s; }
.js .mc-art .sh { transform-box: fill-box; transform-origin: 50% 50%; transform: scaleX(0); opacity: 0; transition: transform .3s ease, opacity .3s ease; }
.js .model-card.is-on .mc-art .sh { transform: none; opacity: .16; transition: transform .9s cubic-bezier(.22, 1, .36, 1) 1.7s, opacity .9s ease 1.7s; }
.js .mc-art .pg { transition: opacity .25s ease, transform .3s ease; }
.js .model-card.is-on .mc-art .pg { transition: opacity .4s ease 1.5s, transform 1s cubic-bezier(.22, 1, .36, 1) 1.5s; }
@media (prefers-reduced-motion: reduce) {
  .js .mc-art .w, .js .mc-art path.gb, .js .mc-art .sh { transition: none !important; }
}
.sum-actions .btn.wa { background: #fff; color: var(--green-dark); border: 1.5px solid var(--green); }
.sum-actions .btn.wa svg { width: 20px; height: 20px; color: #1fa855; }
@media (hover: hover) {
  .sum-actions .btn.wa:hover { background: #eaf6ef; }
}
.sum-mini { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sum-mini .btn { padding-inline: 10px; gap: 8px; font-size: 12px; }
.sum-mini .btn svg { width: 17px; height: 17px; flex: none; }
.print-head, .print-foot { display: none; }
@media print {
  @page {size: A4; margin: 14mm;}
  #smooth-wrapper, #smooth-content { position: static !important; transform: none !important; height: auto !important; overflow: visible !important; }
  .site-header, .site-footer, .page-hero, .faq, .faq-section, .quick-bar, .to-top, .cookie, .conf-bar, .lang-tip, .lightbox, .drawer, .skip, .conf-form, .sum-actions, .trust, .form-status, .sum-card .hint { display: none !important; }
  main > *:not(:has(.conf)) { display: none !important; }
  .conf > :not(.conf-summary) { display: none !important; }
  main > :has(.conf) { padding: 0 !important; margin: 0 !important; }
  .conf { display: block !important; }
  .conf-summary { position: static !important; width: 100% !important; max-width: none !important; }
  .sum-card { background: #fff !important; padding: 0 !important; box-shadow: none !important; }
  [data-reveal], .sum-card * { opacity: 1 !important; transform: none !important; visibility: visible !important; }
  .print-head { display: flex !important; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 12px; margin-bottom: 8px; border-bottom: 2px solid #008C4A; }
  .print-head img { width: 190px; height: auto; }
  .print-head .ph-co { display: grid; text-align: right; font-size: 10.5px; line-height: 1.45; color: #2F2F2F; }
  .print-foot { display: block !important; font-size: 10px; color: #4C4C4C; border-top: 1px solid #ddd; padding-top: 8px; word-break: break-all; }
  .sum-svg { border: 1px solid #e3e3e3; }
  .sum-list > div { break-inside: avoid; }
}
.sum-mini .btn { white-space: normal; line-height: 1.2; text-align: center; min-height: 52px; }
.sw-dot { display: block; width: 56px; height: 56px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(0,0,0,.16), inset 0 0 0 1px rgba(255,255,255,.25), 0 6px 14px -8px rgba(0,0,0,.35); transition: box-shadow .25s, transform .25s; }
.sw-any { background: conic-gradient(#af2b1e, #e6d690, #2f4538, #0e294b, #5e2129, #af2b1e); }
.sw-opt input:checked + .sw-dot { box-shadow: 0 0 0 3px var(--paper), 0 0 0 5px var(--green); transform: scale(1.05); }
@media (max-width: 760px) {
  .sw-dot { width: 52px; height: 52px; }
}
.ral-pal { margin-top: 14px; padding: 14px; border-radius: 4px; background: var(--mist); overflow: hidden; }
.ral-pal .hint { margin: 0 0 10px; }
.ral-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 12px 8px; }
.ral-opt { position: relative; display: grid; justify-items: center; gap: 6px; text-align: center; cursor: pointer; }
.ral-opt input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ral-dot { width: 40px; height: 40px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(0,0,0,.16), inset 0 0 0 1px rgba(255,255,255,.25); transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), box-shadow .25s; }
.ral-n { font-size: 12px; line-height: 1.25; color: var(--ink); }
.ral-n small { display: block; font: 500 10px/1.4 var(--mono); letter-spacing: .06em; color: var(--muted); }
.ral-opt input:checked + .ral-dot { box-shadow: 0 0 0 3px var(--mist), 0 0 0 5px var(--green); transform: scale(1.1); }
.ral-opt input:focus-visible + .ral-dot { outline: 2px solid var(--green); outline-offset: 4px; }
@media (hover: hover) {
  .ral-opt:hover .ral-dot { transform: scale(1.08); }
}
.ral-opt, .ral-opt .ral-n { font: 400 12.5px/1.25 var(--body); text-transform: none; letter-spacing: 0; color: var(--ink); }
.ral-opt .ral-n small { font: 500 10.5px/1.5 var(--mono); letter-spacing: .04em; text-transform: none; color: var(--muted); }
.sum-side { margin-top: -6px; }
.sum-svg.is-anim .sd-w { transform-box: fill-box; transform-origin: 50% 100%; animation: cv-grow-y .5s cubic-bezier(.22, 1, .36, 1) backwards .1s; }
.sum-svg.is-anim .sd-s { stroke-dasharray: 1; animation: cv-draw .6s ease-in-out backwards .45s; }
.sum-svg.is-anim .sd-g { stroke-dasharray: 1; animation: cv-draw .8s ease-in-out backwards .8s; }
.sum-svg.is-anim .sd-pin, .sum-svg.is-anim .sd-col { animation: cv-fade .4s ease backwards 1s; }
.sum-svg.is-anim .sd-p { animation: cv-fade .5s ease backwards 1.4s; }
.sum-svg.is-anim .sd-dim { transform-box: fill-box; transform-origin: 0 50%; animation: cv-grow-x .6s cubic-bezier(.22, 1, .36, 1) backwards 1.3s; }
.sum-svg.is-anim .sd-txt { animation: cv-fade .5s ease backwards 1.6s; }
.sum-svg.is-anim .cv-door { animation: cv-fade .5s ease backwards .05s; }
.sum-svg.is-anim .cv-sh, .sum-svg.is-anim .sd-sh { transform-box: fill-box; transform-origin: 50% 50%; animation: cv-grow-x .8s cubic-bezier(.22, 1, .36, 1) backwards 1.2s; }
.sum-svg.is-anim .cv-sweep { animation: cv-sweep 1.1s cubic-bezier(.45, 0, .2, 1) 1.75s; }
@keyframes cv-sweep {0% { opacity: 0; transform: none; } 15% { opacity: .75; } 85% { opacity: .75; } 100% { opacity: 0; transform: translateX(var(--w)); }}
.sum-svg.is-anim .sd-r { stroke-dasharray: 1; animation: cv-draw .7s ease-in-out backwards .6s; }
.sum-svg.is-anim .sd-f { transform-box: fill-box; transform-origin: 50% 50%; animation: sd-pop .45s cubic-bezier(.34, 1.56, .64, 1) backwards 1.15s; }
.sum-svg.is-anim .sd-gl { stroke-dasharray: .14 1.3; animation: sd-glint 1.1s ease-in-out 1.9s; }
@keyframes sd-pop {from { opacity: 0; transform: scale(.3); }}
@keyframes sd-glint {0% { opacity: 0; stroke-dashoffset: .14; } 15% { opacity: .9; } 85% { opacity: .9; } 100% { opacity: 0; stroke-dashoffset: -1.16; }}
.mc-art .f { fill: var(--ink); }
.mc-art .fw { fill: #fff; }
.mc-art .gl { fill: none; stroke: #fff; stroke-width: 1.6; stroke-linecap: round; opacity: 0; }
.js .mc-art .f, .js .mc-art .fw { opacity: 0; transform-box: fill-box; transform-origin: 50% 50%; transform: scale(.3); transition: opacity .2s ease, transform .2s ease; }
.js .model-card.is-on .mc-art .f, .js .model-card.is-on .mc-art .fw { opacity: 1; transform: none; transition: opacity .3s ease 1.3s, transform .45s cubic-bezier(.34, 1.56, .64, 1) 1.3s; }
.js .model-card.is-on .mc-art .gl { stroke-dasharray: .14 1.3; animation: sd-glint 1.1s ease-in-out 2.1s; }
@media (prefers-reduced-motion: reduce) {
  .js .mc-art .f, .js .mc-art .fw { transition: none !important; }
  .js .model-card.is-on .mc-art .gl, .sum-svg.is-anim .cv-sweep, .sum-svg.is-anim .sd-gl { animation: none !important; }
}
.sum-svg.is-anim .d3-w, .model-card.is-on .d3-w { animation: cv-fade .45s ease backwards; }
.sum-svg.is-anim .d3-door, .model-card.is-on .d3-door { animation: cv-fade .45s ease backwards .15s; }
.sum-svg.is-anim .d3-e, .model-card.is-on .d3-e { stroke-dasharray: 1; animation: cv-draw .55s ease-in-out backwards .3s; }
.sum-svg.is-anim .d3-r, .model-card.is-on .d3-r { stroke-dasharray: 1; animation: cv-draw .6s cubic-bezier(.65, 0, .35, 1) backwards; animation-delay: calc(.45s + var(--i) * .07s); }
.sum-svg.is-anim .d3-s, .model-card.is-on .d3-s { stroke-dasharray: 1; animation: cv-draw .55s ease-in-out backwards; animation-delay: calc(.75s + var(--i) * .1s); }
.sum-svg.is-anim .d3-g, .model-card.is-on .d3-g { animation: d3-lay .7s cubic-bezier(.22, 1, .36, 1) backwards 1.05s; }
.sum-svg.is-anim .d3-f, .model-card.is-on .d3-f { animation: cv-fade .35s ease backwards 1.35s; }
.sum-svg.is-anim .d3-sh, .model-card.is-on .d3-sh { animation: cv-fade .8s ease backwards 1.4s; }
.sum-svg.is-anim .d3-led, .model-card.is-on .d3-led { animation: cv-fade .6s ease backwards 1.6s; }
.sum-svg.is-anim .d3-gl, .model-card.is-on .d3-gl { stroke-dasharray: .16 1.3; animation: sd-glint 1.1s ease-in-out 1.9s; }
@keyframes d3-lay {from { opacity: 0; transform: translateY(-10px); }}
.mc-art.mc-3d { background: transparent; }
@media (prefers-reduced-motion: reduce) {
  .sum-svg [class^="d3-"], .model-card [class^="d3-"] { animation: none !important; }
}
.sum-svg.is-anim .d3-w, .model-card.is-on .d3-w { animation-duration: .3s; }
.sum-svg.is-anim .d3-door, .model-card.is-on .d3-door { animation: cv-fade .3s ease backwards .08s; }
.sum-svg.is-anim .d3-e, .model-card.is-on .d3-e { animation-duration: .4s; animation-delay: .18s; }
.sum-svg.is-anim .d3-r, .model-card.is-on .d3-r { animation-duration: .42s; animation-delay: calc(.26s + var(--i) * .045s); }
.sum-svg.is-anim .d3-s, .model-card.is-on .d3-s { animation-duration: .4s; animation-delay: calc(.45s + var(--i) * .06s); }
.sum-svg.is-anim .d3-g, .model-card.is-on .d3-g { animation-duration: .5s; animation-delay: .62s; }
.sum-svg.is-anim .d3-f, .model-card.is-on .d3-f { animation-delay: .8s; }
.sum-svg.is-anim .d3-sh, .model-card.is-on .d3-sh { animation-duration: .5s; animation-delay: .85s; }
.sum-svg.is-anim .d3-led, .model-card.is-on .d3-led { animation-delay: .95s; }
.sum-svg.is-anim .d3-gl, .model-card.is-on .d3-gl { animation-duration: .9s; animation-delay: 1.05s; }
.d3-leaf { transform-box: fill-box; transform-origin: 0 50%; }
.sum-svg.is-anim .d3-leaf, .model-card.is-on .d3-leaf { animation: d3-open 1.9s cubic-bezier(.4, 0, .2, 1) .7s; }
.sum-svg.is-anim .d3-man, .model-card.is-on .d3-man { animation: d3-walk 1.3s cubic-bezier(.35, .05, .3, 1) backwards .85s; }
.sum-svg.is-anim .d3-leg, .model-card.is-on .d3-leg { animation: d3-step .24s ease-in-out 1.1s 4 alternate; }
.sum-svg.is-anim .d3-leg2, .model-card.is-on .d3-leg2, .sum-svg.is-anim .d3-arm, .model-card.is-on .d3-arm { animation-direction: alternate-reverse; }
.sum-svg.is-anim .d3-arm, .model-card.is-on .d3-arm { animation: d3-swing .24s ease-in-out 1.1s 4 alternate-reverse; }
.sum-svg.is-anim .d3-arm2, .model-card.is-on .d3-arm2 { animation-direction: alternate; }
.d3-plant { transform-box: fill-box; transform-origin: 50% 100%; }
.sum-svg.is-anim .d3-plant, .model-card.is-on .d3-plant { animation: d3-grow .5s cubic-bezier(.34, 1.56, .64, 1) backwards .35s; }
@keyframes d3-open {0% { transform: none; } 16% { transform: scaleX(.08); } 72% { transform: scaleX(.08); } 100% { transform: none; }}
@keyframes d3-walk {0% { opacity: 0; transform: translate(var(--wx), var(--wy)); } 16% { opacity: 1; transform: translate(var(--wx), var(--wy)); } 100% { opacity: 1; transform: none; }}
@keyframes d3-step {from { transform: rotate(14deg); } to { transform: rotate(-14deg); }}
@keyframes d3-swing {from { transform: rotate(12deg); } to { transform: rotate(-12deg); }}
@keyframes d3-grow {from { transform: scale(0); }}
@media (prefers-reduced-motion: reduce) {
  .sum-svg .d3-leaf, .sum-svg .d3-man, .sum-svg .d3-leg, .sum-svg .d3-arm, .sum-svg .d3-plant, .model-card .d3-leaf, .model-card .d3-man, .model-card .d3-leg, .model-card .d3-arm, .model-card .d3-plant { animation: none !important; }
}
.sum-svg.is-anim .d3-leaf, .model-card.is-on .d3-leaf { animation: d3-open2 1.9s cubic-bezier(.4, 0, .2, 1) .6s; }
.sum-svg.is-anim .d3-man, .model-card.is-on .d3-man { animation: d3-walk 1.25s cubic-bezier(.3, .1, .25, 1) backwards .78s; }
.sum-svg.is-anim .d3-leg, .model-card.is-on .d3-leg { animation: d3-step .25s ease-in-out .98s 4 alternate; }
.sum-svg.is-anim .d3-leg2, .model-card.is-on .d3-leg2 { animation-direction: alternate-reverse; }
.sum-svg.is-anim .d3-arm, .model-card.is-on .d3-arm { animation: d3-swing .25s ease-in-out .98s 4 alternate-reverse; }
.sum-svg.is-anim .d3-arm2, .model-card.is-on .d3-arm2 { animation-direction: alternate; }
.sum-svg.is-anim .d3-bob, .model-card.is-on .d3-bob { animation: d3-bob .125s ease-in-out .98s 8 alternate; }
@keyframes d3-open2 {0% { transform: none; filter: none; } 16% { transform: scaleX(.1); filter: brightness(.6); } 72% { transform: scaleX(.1); filter: brightness(.6); } 100% { transform: none; filter: none; }}
@keyframes d3-bob {to { transform: translateY(-3px); }}
@keyframes d3-step {from { transform: rotate(17deg); } to { transform: rotate(-17deg); }}
@keyframes d3-swing {from { transform: rotate(15deg); } to { transform: rotate(-15deg); }}
@media (prefers-reduced-motion: reduce) {
  .sum-svg .d3-bob, .model-card .d3-bob { animation: none !important; }
}
.sum-svg.is-anim .cv-bg { animation: cv-fade .35s ease backwards; }
.sum-svg.is-anim .d3-man, .model-card.is-on .d3-man { animation: d3-walk 1.5s cubic-bezier(.45, .05, .25, 1) backwards .8s; }
.sum-svg.is-anim .d3-leg, .model-card.is-on .d3-leg { animation: d3-lift .3s ease-in-out 1.05s 4 alternate; }
.sum-svg.is-anim .d3-leg2, .model-card.is-on .d3-leg2 { animation: d3-lift .3s ease-in-out 1.35s 3 alternate; }
.sum-svg.is-anim .d3-arm, .model-card.is-on .d3-arm { animation: d3-swing2 .3s ease-in-out 1.05s 4 alternate; }
.sum-svg.is-anim .d3-arm2, .model-card.is-on .d3-arm2 { animation-direction: alternate-reverse; }
.sum-svg.is-anim .d3-bob, .model-card.is-on .d3-bob { animation: d3-bob2 .3s ease-in-out 1.05s 4 alternate; }
.sum-svg.is-anim .d3-leaf, .model-card.is-on .d3-leaf { animation: d3-open2 2.1s cubic-bezier(.4, 0, .2, 1) .6s; }
@keyframes d3-lift {0%, 100% { transform: none; } 50% { transform: translateY(-7px) scaleY(.94); }}
@keyframes d3-swing2 {from { transform: rotate(5deg); } to { transform: rotate(-5deg); }}
@keyframes d3-bob2 {0%, 100% { transform: none; } 50% { transform: translateY(-2px); }}
.sum-view { position: relative; border-radius: 2px; overflow: hidden; }
.sum-view.has-3d { aspect-ratio: 400 / 190; background: #eef0ee; }
.sum-view-3d.has-3d { aspect-ratio: 16 / 11; }
.sum-view.has-3d > .sum-svg { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
.sum-view-3d .v3d-badge, .sum-view-3d .v3d-hint { display: none; }
.v3d-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity .7s ease; }
.v3d-canvas.is-on { opacity: 1; }
.sum-view-3d .v3d-canvas { cursor: grab; }
.v3d-ov { position: absolute; inset: 0; pointer-events: none; font: 500 10px/1.2 var(--mono); }
.v3d-tl, .sum-view-3d.has-3d .v3d-badge { position: absolute; left: 12px; top: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font: 500 10px/1.2 var(--mono); }
.v3d-tr { position: absolute; right: 12px; top: 9px; font-size: 11px; color: var(--ink); font-variant-numeric: tabular-nums; }
.v3d-dim { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.v3d-dim line { stroke: var(--green); stroke-width: 1.3; }
.v3d-len { position: absolute; transform: translateX(-50%); font-size: 12px; font-weight: 600; color: var(--green); font-variant-numeric: tabular-nums; }
.sum-view-3d.has-3d .v3d-badge { display: block; z-index: 1; left: 10px; top: 10px; padding: 5px 9px 4px; border-radius: 999px; background: rgba(255, 255, 255, .84); color: var(--ink); box-shadow: 0 2px 10px -4px rgba(0, 0, 0, .25); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sum-view-3d.has-3d .v3d-hint { display: inline-flex; position: absolute; z-index: 1; right: 10px; bottom: 10px; align-items: center; gap: 6px; padding: 6px 11px 6px 9px; border-radius: 999px; background: rgba(255, 255, 255, .88); box-shadow: 0 4px 14px -6px rgba(0, 0, 0, .3); color: var(--ink); font: 600 12px/1 var(--body); pointer-events: none; transition: opacity .5s ease, transform .5s ease; }
.v3d-hint svg { width: 15px; height: 15px; color: var(--green); }
.sum-view-3d.is-used .v3d-hint { opacity: 0; transform: translateY(6px); }
@media (hover: hover) {
  .sum-view-3d.has-3d:hover .v3d-hint { box-shadow: 0 6px 18px -6px rgba(0, 0, 0, .35); }
}
.model-card .mc-visual .v3d-canvas { border-radius: 3px; }
.model-card .mc-visual.has-3d .mc-art { opacity: 0; }
@media print {
  .sum-view.has-3d { border: 1px solid #e3e3e3; }
  .v3d-hint { display: none !important; }
}
@media (min-width: 1081px) {
  .conf-summary { max-height: calc(100vh - var(--header-h) - 84px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(0, 0, 0, .22) transparent; border-radius: 4px; }
  .conf-summary::-webkit-scrollbar { width: 6px; }
  .conf-summary::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, .2); border-radius: 3px; }
}
@media print {
  .conf-summary { max-height: none !important; overflow: visible !important; }
}
.sum-view-3d.has-3d::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(120% 90% at 50% 45%, transparent 62%, rgba(40, 36, 30, .09)); }
.sum-view-3d.has-3d .v3d-hint svg { animation: v3d-spin 1.4s cubic-bezier(.65, 0, .35, 1) 2.2s 2 both; }
@keyframes v3d-spin {0%, 15% { transform: rotate(0); } 100% { transform: rotate(-360deg); }}
.v3d-canvas:focus { outline: none; }
.v3d-canvas:focus-visible { outline: 2px solid var(--green); outline-offset: -2px; }
@media (prefers-reduced-motion: reduce) {
  .sum-view-3d .v3d-hint svg { animation: none; }
}
.sum-empty { display: none; }
html.conf-empty .sum-empty { display: grid; justify-items: center; gap: 8px; text-align: center; padding: 34px 18px; margin: 14px 0 4px; border: 1.5px dashed rgba(0, 140, 74, .35); border-radius: 6px; background: #f3f8f5; color: var(--muted); font-size: 14px; line-height: 1.45; }
html.conf-empty .sum-empty strong { color: var(--ink); font-size: 17px; }
html.conf-empty .sum-empty svg { width: 26px; height: 26px; color: var(--green); transform: rotate(-90deg); animation: sg-nudge 1.6s ease-in-out infinite; }
@media (max-width: 1080px) {
  html.conf-empty .sum-empty svg { transform: none; }
}
html.conf-empty .conf-summary .sum-title, html.conf-empty .conf-summary .sum-view, html.conf-empty .conf-summary .sum-list, html.conf-empty .conf-summary .hint { display: none; }
html.conf-empty .conf-form .step:not(:first-of-type) { opacity: .45; transition: opacity .4s ease; }
.model-grid.nudge { animation: sg-shake .5s ease; }
@keyframes sg-nudge {50% { translate: -5px 0; }}
@keyframes sg-shake {20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); }}
@media (prefers-reduced-motion: reduce) {
  html.conf-empty .sum-empty svg, .model-grid.nudge { animation: none; }
}
.wa-dlg { border: 0; border-radius: 16px; padding: 0; width: min(420px, calc(100vw - 32px)); box-shadow: 0 24px 60px rgba(0,0,0,.25); }
.wa-dlg::backdrop { background: rgba(15,30,22,.45); }
.wa-dlg form { padding: 22px 22px 18px; display: grid; gap: 12px; }
.wa-dlg h3 { margin: 0; font-size: 1.15rem; }
.wa-dlg p { margin: 0; color: var(--text); font-size: .95rem; }
.wa-dlg label { display: grid; gap: 6px; font-weight: 600; font-size: .9rem; color: var(--ink); }
.wa-dlg textarea { font: inherit; font-weight: 400; padding: 12px 14px; border: 1px solid #cfd6d2; border-radius: 10px; resize: vertical; min-height: 84px; }
.wa-dlg textarea:focus { outline: 2px solid var(--green); border-color: var(--green); }
.wa-dlg input { font: inherit; font-weight: 400; padding: 12px 14px; border: 1px solid #cfd6d2; border-radius: 10px; }
.wa-dlg input:focus { outline: 2px solid var(--green); border-color: var(--green); }
.wa-act { display: flex; gap: 10px; justify-content: flex-end; margin-top: 4px; flex-wrap: wrap; }