/* Стили калькуляторов для общего расчёта (calc.php): объединение <style> страниц calculator_souvenirs, _outdoor, _solvent, calculator (23.10.2026).
   Расхождения между страницами косметические (7 из 59 селекторов), при совпадении имён побеждает «Фреза / Лазер» (последняя).
   Меняешь стиль карточки на странице - поправь и здесь. */

/* ===== calculator_souvenirs.php ===== */
    .inp{ width:100%; padding:.6rem .875rem; border:1px solid transparent; border-radius:.75rem; font-size:.875rem; line-height:1.2; background:#f1f5f9; outline:none; transition: all .2s ease; }
    .inp:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .field > .label{ font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.35rem; }
    .col-title{ font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.5rem; }
    .btn{ padding:.5rem 1rem; border-radius:.75rem; font-size:.875rem; font-weight:500; transition: all .2s; }
    .btn-sky{ background:#6366f1; color:#fff; border:1px solid #6366f1; } .btn-sky:hover{ background:#4f46e5; border-color:#4f46e5; transform: translateY(-1px); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.4); }
    .btn-ghost{ border:1px solid transparent; background:#f8fafc; color:#475569; } .btn-ghost:hover{ background:#f1f5f9; color:#1e293b; transform: translateY(-1px); }
    .btn-rose{ background:#fef2f2; color:#e11d48; border:1px solid transparent; } .btn-rose:hover{ background:#ffe4e6; color:#be123c; }
    .btn-icon{ padding:.5rem; width:2.5rem; height:2.5rem; display:inline-flex; align-items:center; justify-content:center; }
    .btn-icon svg{ width:1.25rem; height:1.25rem; }
    
    .chip{ display:flex; align-items:center; gap:.6rem; padding:.4rem .875rem; border:1px solid transparent;
      border-radius:1rem; font-size:.8rem; font-weight:500; height:36px; background:#f1f5f9; color:rgb(71 85 105);
      transition: all .2s ease; cursor:pointer; }
    .chip:hover{ transform: scale(1.02); background:#e2e8f0; }
    .chip[aria-pressed="true"]{ background:#6366f1; color:#fff; transform: scale(1.02); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.3); }

    /* Кастомный дропдаун */
    .dd-btn{ width:100%; text-align:left; padding:.6rem .875rem; border:1px solid transparent; border-radius:.75rem; background:#f1f5f9; display:flex; justify-content:space-between; align-items:center; cursor:pointer; transition: all .2s ease; }
    .dd-btn:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .dd-panel{ position:absolute; z-index:50; width:100%; margin-top:.35rem; background:#fff; border:1px solid #f1f5f9; border-radius:.75rem; box-shadow:0 10px 25px -5px rgb(0 0 0 / 0.1); overflow:hidden; }
    .dd-item{ padding:.6rem .875rem; cursor:pointer; display:flex; justify-content:space-between; align-items:center; transition: background .2s; }
    .dd-item:hover{ background:#f8fafc; color:#6366f1; }

    /* Переключатель-сегмент (как фреза/лазер) */
    .segment-ctrl { display: flex; background: #f1f5f9; border: 1px solid transparent; border-radius: 1rem; overflow: hidden; height: 42px; padding: 0.2rem; gap: 0.2rem; }
    .segment-btn { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all 0.2s; color: #64748b; border: none; background: transparent; border-radius: 0.8rem; }
    .segment-btn:hover { color: #0f172a; background: #e2e8f0; }
    .segment-btn[aria-pressed="true"] { background: #fff; color: #6366f1; font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
    
    /* Кнопки размеров */
    .size-btn { padding: 0.25rem 0.75rem; background: #f1f5f9; border: 1px solid transparent; font-size: 10px; font-weight: 700; border-radius: 0.75rem; color: #475569; text-transform: uppercase; transition: all 0.2s ease; cursor: pointer; }
    .size-btn:hover { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.05); border-color: #c7d2fe; color: #4f46e5; transform: translateY(-1px); }
    .size-btn.is-active { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border-color: #818cf8; color: #4f46e5; transform: scale(1.05); }

    .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

    .only-print{ display:none; }
    @media (min-width: 768px){
      .v-sep{ position: relative; padding-left:1.25rem; }
      .v-sep::before{ content:""; position:absolute; left:0; top:.25rem; bottom:.25rem; width:1px; background: #e2e8f0; }
    }
    @media print{
      body{ background:#fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
      nav, .no-print, .lg\:col-span-2, .grid > aside > .not-export { display:none !important; }
      #exportArea{ display:block !important; width:100% !important; }
      .only-print{ display:block !important; }
    }
    
    /* card enter/leave */
    .pos-card{ transition: opacity .2s ease; opacity:1; }
    .pos-card.is-fading{ opacity:0; }
    .pos-card.is-collapsing{
      overflow:hidden;
      transition: height .25s ease, padding .25s ease, border-width .25s ease, opacity .1s linear;
    }

/* ===== calculator_outdoor.php ===== */

    .inp{ width:100%; padding:.6rem .875rem; border:1px solid transparent; border-radius:.75rem; font-size:.875rem; line-height:1.2; background:#f1f5f9; outline:none; transition: all .2s ease; }
    .inp:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .field > .label{ font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.35rem; }
    .col-title{ font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.5rem; }
    .btn{ padding:.5rem 1rem; border-radius:.75rem; font-size:.875rem; font-weight:500; transition: all .2s; }
    .btn-sky{ background:#6366f1; color:#fff; border:1px solid transparent; } .btn-sky:hover{ background:#4f46e5; border-color:transparent; transform: translateY(-1px); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.4); }
    .btn-ghost{ border:1px solid transparent; background:#f8fafc; color:#475569; } .btn-ghost:hover{ background:#f1f5f9; color:#1e293b; transform: translateY(-1px); }
    .btn-rose{ background:#fef2f2; color:#e11d48; border:1px solid transparent; } .btn-rose:hover{ background:#ffe4e6; color:#be123c; }
    .btn-icon{ padding:.5rem; width:2.5rem; height:2.5rem; display:inline-flex; align-items:center; justify-content:center; }
    .btn-icon svg{ width:1.25rem; height:1.25rem; }
    .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

    @media (min-width: 768px){
      .v-sep{ position: relative; padding-left:1.25rem; }
      .v-sep::before{ content:""; position:absolute; left:0; top:.25rem; bottom:.25rem; width:1px; background: #e2e8f0; }
    }
    .only-print{ display:none; }
    @media print{
      body{ background:#fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
      nav, .no-print, .lg\:col-span-2, .grid > aside > .not-export { display:none !important; }
      #exportArea{ display:block !important; width:100% !important; }
      .only-print{ display:block !important; }
    }

    /* segmented control (единый стиль, как в сувенирах) */
    .segment-ctrl { display: flex; background: #f1f5f9; border: 1px solid transparent; border-radius: 1rem; overflow: hidden; min-height: 42px; padding: 0.2rem; gap: 0.2rem; }
    .segment-btn { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all 0.2s; color: #64748b; border: none; background: transparent; border-radius: 0.8rem; padding: 0 .5rem; }
    .segment-btn:hover { color: #0f172a; background: #e2e8f0; }
    .segment-btn[aria-pressed="true"] { background: #fff; color: #6366f1; font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }

    /* segmented control with thumb */
    .seg{ display:flex; width:100%; gap:.25rem; border:1px solid transparent; border-radius:1rem; padding:.2rem; background:#f1f5f9; min-height:42px; position:relative; overflow:hidden; }
    .seg-btn{ flex:1; text-align:center; appearance:none; border:0; padding:.35rem .5rem; border-radius:0.8rem; font-size:.85rem; font-weight:500; line-height:1.1; position:relative; z-index:1; transition: color .2s ease; color:#64748b;}
    .seg-btn:hover { color:#0f172a; }
    .seg-btn[aria-pressed="true"] { color: #6366f1; font-weight: 600; }
    .seg-thumb{ position:absolute; top:4px; bottom:4px; left:4px; background:#fff; border-radius:.8rem; transition: transform .25s ease, width .25s ease; will-change: transform, width; z-index:0; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }

    /* chip */
    .chip{ display:flex; align-items:center; gap:.6rem; padding:.4rem .875rem; border:1px solid transparent; border-radius:1rem; font-size:.8rem; font-weight:500; height:36px; background:#f1f5f9; color:rgb(71 85 105); transition: all .2s ease; cursor:pointer; }
    .chip:hover{ transform: scale(1.02); background:#e2e8f0; }
    .chip[aria-pressed="true"]{ background:#6366f1; color:#fff; transform: scale(1.02); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.3); }

    /* card enter/leave */
    .pos-card{ transition: opacity .2s ease; opacity:1; }
    .pos-card.is-fading{ opacity:0; }
    .pos-card.is-collapsing{ overflow:hidden; transition: height .25s ease, padding .25s ease, border-width .25s ease, opacity .1s linear; }

    /* dropdown */
    .dd-btn{ width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:.5rem; border:1px solid transparent; border-radius:.75rem; padding:.6rem .875rem; font-size:.875rem; background:#f1f5f9; transition: all .2s ease; cursor:pointer; }
    .dd-btn:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .dd-panel{ position:absolute; left:0; right:0; margin-top:.35rem; background:#fff; border:1px solid #f1f5f9; border-radius:.75rem; box-shadow:0 10px 25px -5px rgb(0 0 0 / 0.1); overflow:hidden; z-index:50; }
    .dd-item{ padding:.6rem .875rem; font-size:.875rem; display:flex; align-items:center; justify-content:space-between; cursor:pointer; transition: background .2s; }
    .dd-item:hover{ background:#f8fafc; color:#6366f1; }
    
    /* Кнопки размеров */
    .size-btn { padding: 0.25rem 0.75rem; background: #f1f5f9; border: 1px solid transparent; font-size: 10px; font-weight: 700; border-radius: 0.75rem; color: #475569; text-transform: uppercase; transition: all 0.2s ease; cursor: pointer; }
    .size-btn:hover { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.05); border-color: #c7d2fe; color: #4f46e5; transform: translateY(-1px); }
    .size-btn.is-active { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border-color: #818cf8; color: #4f46e5; transform: scale(1.05); }

/* ===== calculator_solvent.php ===== */

    .inp{ width:100%; padding:.6rem .875rem; border:1px solid transparent; border-radius:.75rem; font-size:.875rem; line-height:1.2; background:#f1f5f9; outline:none; transition: all .2s ease; }
    .inp:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .field > .label{ font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.35rem; }
    .col-title{ font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.5rem; }
    .btn{ padding:.5rem 1rem; border-radius:.75rem; font-size:.875rem; font-weight:500; transition: all .2s; }
    .btn-sky{ background:#6366f1; color:#fff; border:1px solid transparent; } .btn-sky:hover{ background:#4f46e5; border-color:transparent; transform: translateY(-1px); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.4); }
    .btn-ghost{ border:1px solid transparent; background:#f8fafc; color:#475569; } .btn-ghost:hover{ background:#f1f5f9; color:#1e293b; transform: translateY(-1px); }
    .btn-rose{ background:#fef2f2; color:#e11d48; border:1px solid transparent; } .btn-rose:hover{ background:#ffe4e6; color:#be123c; }
    .btn-icon{ padding:.5rem; width:2.5rem; height:2.5rem; display:inline-flex; align-items:center; justify-content:center; }
    .btn-icon svg{ width:1.25rem; height:1.25rem; }
    .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

    /* предупреждение: изделие меньше 1 м² (округление до 1 м²/шт) */
    .warn-min-area{ margin:.5rem 0; padding:.6rem .875rem; border:2px solid #ef4444; background:#fef2f2; border-radius:.75rem; color:#dc2626; font-weight:700; font-size:1.05rem; line-height:1.35; }

    @media (min-width: 768px){
      .v-sep{ position: relative; padding-left:1.25rem; }
      .v-sep::before{ content:""; position:absolute; left:0; top:.25rem; bottom:.25rem; width:1px; background: #e2e8f0; }
    }
    .only-print{ display:none; }
    @media print{
      body{ background:#fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
      nav, .no-print, .lg\:col-span-2, .grid > aside > .not-export { display:none !important; }
      #exportArea{ display:block !important; width:100% !important; }
      .only-print{ display:block !important; }
    }

    /* segmented control (единый стиль, как в сувенирах) */
    .segment-ctrl { display: flex; background: #f1f5f9; border: 1px solid transparent; border-radius: 1rem; overflow: hidden; height: 42px; padding: 0.2rem; gap: 0.2rem; }
    .segment-btn { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all 0.2s; color: #64748b; border: none; background: transparent; border-radius: 0.8rem; }
    .segment-btn:hover { color: #0f172a; background: #e2e8f0; }
    .segment-btn[aria-pressed="true"] { background: #fff; color: #6366f1; font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }

    /* segmented control with thumb */
    .seg{ display:flex; width:100%; gap:.25rem; border:1px solid transparent; border-radius:1rem; padding:.2rem; background:#f1f5f9; min-height:42px; position:relative; overflow:hidden; }
    .seg-btn{ flex:1; text-align:center; appearance:none; border:0; padding:.35rem .5rem; border-radius:0.8rem; font-size:.85rem; font-weight:500; line-height:1.1; position:relative; z-index:1; transition: color .2s ease; color:#64748b;}
    .seg-btn:hover { color:#0f172a; }
    .seg-btn[aria-pressed="true"] { color: #6366f1; font-weight: 600; }
    .seg-thumb{ position:absolute; top:4px; bottom:4px; left:4px; background:#fff; border-radius:.8rem; transition: transform .25s ease, width .25s ease; will-change: transform, width; z-index:0; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }

    /* chip */
    .chip{ display:flex; align-items:center; gap:.6rem; padding:.4rem .875rem; border:1px solid transparent; border-radius:1rem; font-size:.8rem; font-weight:500; height:36px; background:#f1f5f9; color:rgb(71 85 105); transition: all .2s ease; cursor:pointer; }
    .chip:hover{ transform: scale(1.02); background:#e2e8f0; }
    .chip[aria-pressed="true"]{ background:#6366f1; color:#fff; transform: scale(1.02); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.3); }

    /* chip-split layout */
    .chip-split {
      display: flex;
      align-items: center;
      width: 100%;
      height: 36px;
      background: #f1f5f9;
      border-radius: 1rem;
      padding: 0;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      vertical-align: middle;
      border: 1px solid transparent;
      overflow: hidden;
      cursor: pointer;
    }
    .chip-split:not(.is-active):hover {
      transform: scale(1.02);
      background: #e2e8f0;
    }
    .chip-split.is-active {
      padding: 2px;
      background: #f1f5f9;
      transform: none;
    }
    .chip-split-left {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      flex: 1 0 100%;
      height: 100%;
      padding: 0 0 0 .875rem;
      font-size: .8rem;
      font-weight: 500;
      color: rgb(71 85 105);
      border-radius: 1rem;
      cursor: pointer;
      border: 0;
      background: transparent;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      white-space: nowrap;
    }
    .chip-split-left.is-active {
      flex: 1 1 50%;
      justify-content: center;
      padding: 0;
      background: #6366f1;
      color: #fff;
      border-radius: .85rem;
      box-shadow: 0 2px 4px rgba(99, 102, 241, 0.2);
    }
    .chip-split-right {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 0%;
      max-width: 0;
      opacity: 0;
      padding: 0;
      margin: 0;
      overflow: hidden;
      pointer-events: none;
      height: 100%;
      font-size: .8rem;
      font-weight: 500;
      color: rgb(71 85 105);
      border-radius: .85rem;
      cursor: pointer;
      border: 0;
      background: transparent;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      white-space: nowrap;
    }
    .chip-split-right.is-active {
      flex: 1 1 50%;
      max-width: 50%;
      opacity: 1;
      padding: 0 .875rem;
      pointer-events: auto;
    }
    .chip-split-right:hover:not([aria-pressed="true"]) {
      background: #e2e8f0;
      color: #0f172a;
    }
    .chip-split-right[aria-pressed="true"] {
      background: #4f46e5;
      color: #fff;
      box-shadow: 0 2px 4px rgba(79, 70, 229, 0.2);
    }
    .chip-split-divider {
      width: 0px;
      height: 0px;
      background: #cbd5e1;
      margin: 0;
      align-self: center;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      opacity: 0;
    }
    .chip-split-divider.is-active {
      width: 1px;
      height: 18px;
      margin: 0 2px;
      opacity: 1;
    }
    /* chip-split: состояние ошибки (плоттер включён, длина реза не заполнена) */
    .chip-split.is-error { border-color: #fca5a5; background: #fef2f2; }
    .chip-split.is-error .chip-split-left.is-active { background: #ef4444; box-shadow: 0 2px 4px rgba(239,68,68,0.25); }
    .chip-split.is-error .chip-split-right.is-active { background: #fff; box-shadow: inset 0 0 0 1px #fca5a5; border-radius: .85rem; }
    .chip-split.is-error .chip-split-right.is-active input { color: #dc2626; }
    .chip-split.is-error .chip-split-right.is-active input::placeholder { color: #f87171; }

    /* подсказка под полем (напр. длина реза плоттера) */
    .field-hint { display:flex; align-items:center; gap:.4rem; margin-top:.4rem; padding:.4rem .625rem; font-size:.75rem; font-weight:600; line-height:1.3; color:#dc2626; background:#fef2f2; border:1px solid #fecaca; border-radius:.75rem; }
    .field-hint svg { width:14px; height:14px; flex:0 0 auto; }

    /* card enter/leave */
    .pos-card{ transition: opacity .2s ease; opacity:1; }
    .pos-card.is-fading{ opacity:0; }
    .pos-card.is-collapsing{ overflow:hidden; transition: height .25s ease, padding .25s ease, border-width .25s ease, opacity .1s linear; }

    /* dropdown */
    .dd-btn{ width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:.5rem; border:1px solid transparent; border-radius:.75rem; padding:.6rem .875rem; font-size:.875rem; background:#f1f5f9; transition: all .2s ease; cursor:pointer; }
    .dd-btn:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .dd-panel{ position:absolute; left:0; right:0; margin-top:.35rem; background:#fff; border:1px solid #f1f5f9; border-radius:.75rem; box-shadow:0 10px 25px -5px rgb(0 0 0 / 0.1); overflow:hidden; z-index:50; }
    .dd-item{ padding:.6rem .875rem; font-size:.875rem; display:flex; align-items:center; justify-content:space-between; cursor:pointer; transition: background .2s; }
    .dd-item:hover{ background:#f8fafc; color:#6366f1; }
    
    /* Кнопки размеров */
    .size-btn { padding: 0.25rem 0.75rem; background: #f1f5f9; border: 1px solid transparent; font-size: 10px; font-weight: 700; border-radius: 0.75rem; color: #475569; text-transform: uppercase; transition: all 0.2s ease; cursor: pointer; }
    .size-btn:hover { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.05); border-color: #c7d2fe; color: #4f46e5; transform: translateY(-1px); }
    .size-btn.is-active { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border-color: #818cf8; color: #4f46e5; transform: scale(1.05); }

    /* UV white slider panel */
    .uv-white-panel {
      max-height: 0;
      opacity: 0;
      overflow: hidden;
      padding: 0;
      margin: 0;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      border-radius: 1rem;
      background: #f8fafc;
      border: 1px solid transparent;
    }
    .uv-white-panel.is-active {
      max-height: 120px;
      opacity: 1;
      padding: 0.75rem 1rem;
      margin-top: 0.5rem;
      border-color: #e2e8f0;
    }

/* ===== calculator.php ===== */

    .inp{ width:100%; padding:.6rem .875rem; border:1px solid transparent; border-radius:.75rem; font-size:.875rem; line-height:1.2; background:#f1f5f9; outline:none; transition: all .2s ease; }
    .inp:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .field > .label{ font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.35rem; }
    .col-title{ font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.025em; color:rgb(100 116 139); margin-bottom:.5rem; }
    .btn{ padding:.5rem 1rem; border-radius:.75rem; font-size:.875rem; font-weight:500; transition: all .2s; }
    .btn-sky{ background:#6366f1; color:#fff; border:1px solid transparent; } .btn-sky:hover{ background:#4f46e5; border-color:transparent; transform: translateY(-1px); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.4); }
    .btn-ghost{ border:1px solid transparent; background:#f8fafc; color:#475569; } .btn-ghost:hover{ background:#f1f5f9; color:#1e293b; transform: translateY(-1px); }
    .btn-rose{ background:#fef2f2; color:#e11d48; border:1px solid transparent; } .btn-rose:hover{ background:#ffe4e6; color:#be123c; }
    .btn-icon{ padding:.5rem; width:2.5rem; height:2.5rem; display:inline-flex; align-items:center; justify-content:center; }
    .btn-icon svg{ width:1.25rem; height:1.25rem; }
    .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

    @media (min-width: 768px){
      .v-sep{ position: relative; padding-left:1.25rem; }
      .v-sep::before{ content:""; position:absolute; left:0; top:.25rem; bottom:.25rem; width:1px; background: #e2e8f0; }
    }
    .only-print{ display:none; }
    @media print{
      body{ background:#fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
      nav, .no-print, .lg\:col-span-2, .grid > aside > .not-export { display:none !important; }
      #exportArea{ display:block !important; width:100% !important; }
      .only-print{ display:block !important; }
    }

    /* segmented control (единый стиль, как в сувенирах) */
    .segment-ctrl { display: flex; background: #f1f5f9; border: 1px solid transparent; border-radius: 1rem; overflow: hidden; height: 42px; padding: 0.2rem; gap: 0.2rem; }
    .segment-btn { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all 0.2s; color: #64748b; border: none; background: transparent; border-radius: 0.8rem; }
    .segment-btn:hover { color: #0f172a; background: #e2e8f0; }
    .segment-btn[aria-pressed="true"] { background: #fff; color: #6366f1; font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }

    /* segmented control with thumb */
    .seg{ display:flex; width:100%; gap:.25rem; border:1px solid transparent; border-radius:1rem; padding:.2rem; background:#f1f5f9; min-height:42px; position:relative; overflow:hidden; }
    .seg-btn{ flex:1; text-align:center; appearance:none; border:0; padding:.35rem .5rem; border-radius:0.8rem; font-size:.85rem; font-weight:500; line-height:1.1; position:relative; z-index:1; transition: color .2s ease; color:#64748b;}
    .seg-btn:hover { color:#0f172a; }
    .seg-btn[aria-pressed="true"] { color: #6366f1; font-weight: 600; }
    .seg-thumb{ position:absolute; top:4px; bottom:4px; left:4px; background:#fff; border-radius:.8rem; transition: transform .25s ease, width .25s ease; will-change: transform, width; z-index:0; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }

    /* chip */
    .chip{ display:flex; align-items:center; gap:.6rem; padding:.4rem .875rem; border:1px solid transparent; border-radius:1rem; font-size:.8rem; font-weight:500; height:36px; background:#f1f5f9; color:rgb(71 85 105); transition: all .2s ease; cursor:pointer; }
    .chip:hover{ transform: scale(1.02); background:#e2e8f0; }
    .chip[aria-pressed="true"]{ background:#6366f1; color:#fff; transform: scale(1.02); box-shadow: 0 4px 6px -1px rgba(99, 102, 241, 0.3); }

    /* card enter/leave */
    .pos-card{ transition: opacity .2s ease; opacity:1; }
    .pos-card.is-fading{ opacity:0; }
    .pos-card.is-collapsing{ overflow:hidden; transition: height .25s ease, padding .25s ease, border-width .25s ease, opacity .1s linear; }

    /* dropdown */
    .dd-btn{ width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:.5rem; border:1px solid transparent; border-radius:.75rem; padding:.6rem .875rem; font-size:.875rem; background:#f1f5f9; transition: all .2s ease; cursor:pointer; }
    .dd-btn:focus{ background:#fff; border-color:#818cf8; box-shadow: 0 0 0 3px rgba(129,140,248,0.15); }
    .dd-panel{ position:absolute; left:0; right:0; margin-top:.35rem; background:#fff; border:1px solid #f1f5f9; border-radius:.75rem; box-shadow:0 10px 25px -5px rgb(0 0 0 / 0.1); overflow:hidden; z-index:50; }
    .dd-item{ padding:.6rem .875rem; font-size:.875rem; display:flex; align-items:center; justify-content:space-between; cursor:pointer; transition: background .2s; }
    .dd-item:hover{ background:#f8fafc; color:#6366f1; }
    
    /* Кнопки размеров */
    .size-btn { padding: 0.25rem 0.75rem; background: #f1f5f9; border: 1px solid transparent; font-size: 10px; font-weight: 700; border-radius: 0.75rem; color: #475569; text-transform: uppercase; transition: all 0.2s ease; cursor: pointer; }
    .size-btn:hover { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.05); border-color: #c7d2fe; color: #4f46e5; transform: translateY(-1px); }
    .size-btn.is-active { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border-color: #818cf8; color: #4f46e5; transform: scale(1.05); }

    /* UV white slider panel (стиль из сольвента) */
    .uv-white-panel {
      max-height: 0;
      opacity: 0;
      overflow: hidden;
      padding: 0;
      margin: 0;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      border-radius: 1rem;
      background: #f8fafc;
      border: 1px solid transparent;
    }
    .uv-white-panel.is-active {
      max-height: 120px;
      opacity: 1;
      padding: 0.75rem 1rem;
      margin-top: 0.5rem;
      border-color: #e2e8f0;
    }

    /* предупреждение: площадь УФ с белым меньше 1 м² (округление до 1 м²) */
    .warn-min-area{ margin:.5rem 0; padding:.6rem .875rem; border:2px solid #ef4444; background:#fef2f2; border-radius:.75rem; color:#dc2626; font-weight:700; font-size:1.05rem; line-height:1.35; }

/* ===== calculator_stands.php: карточка стенда (23.10.2026) ===== */
    /* Карточка стенда: слева схема (она и есть стенд), справа строки «подпись → контролы» */
    .stand-body{ display:grid; grid-template-columns: 170px 1fr; gap:1.25rem; align-items:start; }
    .stand-fig{ position:sticky; top:1rem; background:#f8fafc; border-radius:1rem; padding:.75rem; }
    .stand-fig .cap{ margin-top:.5rem; font-size:.75rem; color:#64748b; text-align:center; line-height:1.3; }
    .stand-fig .cap b{ display:block; font-size:.875rem; color:#0f172a; font-weight:600; }
    .frm-row{ display:grid; grid-template-columns: 6.5rem 1fr; gap:.75rem; align-items:center; padding:.45rem 0; border-top:1px solid #f1f5f9; }
    .frm-row:first-child{ border-top:0; padding-top:0; }
    .frm-label{ font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:#64748b; }
    .frm-ctl{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .5rem; min-width:0; }
    .frm-sep{ width:1px; align-self:stretch; background:#e2e8f0; margin:0 .25rem; }
    /* переключатели - те же .segment-ctrl, что у всех видов (владелец 23.10.2026: «одинаковые, крупные»);
       в строке карточки растягиваются на свободное место, соседи - той же высоты 42 px */
    .stand-body .frm-ctl > .segment-ctrl, .stand-body .frm-ctl > div > .segment-ctrl{ flex:1 1 12rem; }
    .stand-body .segment-btn{ padding:0 .75rem; white-space:nowrap; }
    .stand-body .segment-btn:disabled{ opacity:.4; pointer-events:none; }
    /* «таблетка» переключателей и скорости движения - общие, assets/css/motion.css */
    /* схема стенда (директива x-stand): прямоугольники перетекают, рамка багета плавно утолщается */
    .stand-svg{ width:100%; height:auto; aspect-ratio:1; display:block; overflow:visible; transition:opacity .2s ease; }
    .stand-svg .sv-board{ fill:#f8fafc; stroke:#94a3b8; stroke-width:1.5; rx:4px; }
    .stand-svg .sv-board[data-edge="alu"]{ stroke:#64748b; stroke-width:5; }
    .stand-svg .sv-panel{ fill:#e2e8f0; stroke:#cbd5e1; stroke-width:1; rx:2px; }
    .stand-svg .sv-cell{ fill:#c7d2fe; stroke:#6366f1; stroke-width:1; rx:2px; }
    .stepper{ display:inline-flex; align-items:center; background:#f1f5f9; border-radius:1rem; padding:.2rem; height:42px; }
    .stepper button{ width:2.25rem; height:100%; border-radius:.8rem; font-size:1rem; color:#475569; }
    .stepper button:hover{ background:#fff; color:#4f46e5; }
    .stepper input{ width:3rem; text-align:center; background:transparent; font-size:.875rem; font-weight:600; outline:none; -moz-appearance:textfield; appearance:textfield; }
    .stepper input::-webkit-inner-spin-button, .stepper input::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; }
    .mm-inp{ width:5.5rem; height:42px; padding:0 .75rem; border-radius:.75rem; background:#f1f5f9; font-size:.875rem; outline:none; border:1px solid transparent; }
    .mm-inp:focus, .stepper input:focus-visible{ background:#fff; border-color:#818cf8; }
    .segment-btn:focus-visible, .stepper button:focus-visible, .size-btn:focus-visible, .chip:focus-visible{ outline:2px solid #818cf8; outline-offset:1px; }
    .chip.sm{ min-height:30px; padding:.25rem .7rem; }
    @media (max-width: 640px){
      .stand-body{ grid-template-columns: 1fr; }
      .stand-fig{ position:static; display:flex; align-items:center; gap:.75rem; }
      .stand-fig > .stand-svg{ flex:0 0 96px; width:96px; }
      .stand-fig .cap{ margin-top:0; text-align:left; }
      .frm-row{ grid-template-columns: 1fr; gap:.35rem; }
    }
    /* в общем файле .size-btn - 10px заглавными (от «Фрезы»); в карточке стенда - как на её странице */
    .stand-body .size-btn{ font-size:12px; text-transform:none; }