﻿/* style-block-1 */
:root{--bg:#f4f7fb;--card:#fff;--text:#10253f;--muted:#54657a;--accent:#1b6fe6;--accent-dark:#134d9c;--border:#d3deed;--danger:#d92332;--ok:#17803d;--ok-bg:#eaf8ef}
    *{box-sizing:border-box}
    [hidden]{display:none !important}
    body{margin:0;font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;background:radial-gradient(circle at top right,#e8f0ff 0,var(--bg) 45%);color:var(--text)}
    .wrap{max-width:1320px;margin:28px auto 48px;padding:0 16px}
    h1{margin:0 0 8px;font-size:clamp(1.45rem,2.9vw,2.05rem)}
    .note{margin:0 0 12px;color:var(--muted)}
    .note-sm{margin:4px 0 0;color:var(--muted);font-size:.88rem}
    .card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:0 10px 24px rgba(16,37,63,.06);margin-bottom:14px}
    .upload-card{position:relative;overflow:hidden}
    .steps{display:none}
    .step{border:1px solid var(--border);border-radius:12px;background:linear-gradient(150deg,#f8fbff 0,#edf4ff 100%);padding:10px;display:flex;align-items:flex-start;gap:10px}
    .step-no{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#1b6fe6;color:#fff;font-weight:700;font-size:.85rem;flex:none}
    .step-title{font-size:.9rem;font-weight:700;margin:0 0 2px}
    .step-sub{font-size:.82rem;color:var(--muted);margin:0}
    .section-label{display:none}
    .controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:12px}
    .controls-files{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
    .param-field{border:1px solid var(--border);border-radius:10px;padding:9px;background:#fbfdff}
    .field-help{display:none}
    .legend-box{border:1px solid var(--border);border-radius:12px;background:#f9fbff;padding:8px;margin:6px 0 8px}
    .legend-title{display:none}
    .legend-items{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
    .legend-item{display:inline-flex;align-items:center;gap:6px;border:1px solid #d8e5f7;background:#fff;padding:4px 7px;border-radius:999px;font-size:.78rem;color:#365271}
    .legend-dot{width:10px;height:10px;border-radius:50%;display:inline-block}
    .dot-green{background:#1c8f4f}
    .dot-red{background:#d32f3f}
    .dot-orange{background:#d9891f}
    .dot-blue{background:#1b6fe6}
    .dot-gray{background:#7f8a98}
    .history-card{padding-top:12px}
    .quick-settings{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:2px 0 10px}
    .quick-settings label{margin:0;font-size:.87rem;color:#23466f;font-weight:700}
    .quick-settings select{
      min-width:230px;
      padding:7px 9px;
      border:1px solid var(--border);
      border-radius:9px;
      background:#fff;
      color:var(--text);
      font-size:.88rem;
    }

/* zoom-sync-button-refresh */
#sidebarSyncBtn{
      display:inline-flex !important;
      align-items:center !important;
      justify-content:center !important;
      gap:0 !important;
      background:#ffffff !important;
      border:1px solid #c7d5e6 !important;
      color:#1f4f7c !important;
      box-shadow:none !important;
      font-size:0 !important;
      line-height:0 !important;
    }

#sidebarSyncBtn:hover{
      background:#f4f9ff !important;
      border-color:#aac2dc !important;
      color:#1a4670 !important;
      box-shadow:none !important;
      transform:none !important;
      filter:none !important;
    }

#sidebarSyncBtn.active{
      background:#45a06b !important;
      border-color:#2f8d53 !important;
      color:#ffffff !important;
      box-shadow:none !important;
    }

#sidebarSyncBtn.active:hover{
      background:#3b925f !important;
      border-color:#2a7f4a !important;
      color:#ffffff !important;
      box-shadow:none !important;
    }

#sidebarSyncBtn.blocked,
#sidebarSyncBtn:disabled{
      background:#ffffff !important;
      border-color:#d4dfeb !important;
      color:#7f97b3 !important;
      box-shadow:none !important;
      cursor:not-allowed !important;
    }

#sidebarSyncBtn.blocked:hover,
#sidebarSyncBtn:disabled:hover{
      background:#ffffff !important;
      border-color:#d4dfeb !important;
      color:#7f97b3 !important;
      box-shadow:none !important;
      transform:none !important;
      filter:none !important;
    }

#sidebarSyncBtn::before{
      content:none !important;
      display:none !important;
    }

#sidebarSyncBtn .sidebar-sync-btn-icon{
      display:block !important;
      width:20px !important;
      height:20px !important;
      fill:none !important;
      stroke:currentColor !important;
      stroke-width:2.05 !important;
      stroke-linecap:round !important;
      stroke-linejoin:round !important;
      pointer-events:none !important;
      flex:0 0 auto !important;
    }

    .lang-globe-btn,
    .header-download-btn{
      width:44px;
      min-width:44px;
      height:40px;
      min-height:40px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border:1px solid #cdd6e3;
      border-radius:12px;
      background:#f4f6f9;
      color:#5d6d83;
      padding:0;
    }

    .lang-globe-btn svg,
    .header-download-btn svg{
      width:20px;
      height:20px;
      fill:none;
      stroke:currentColor;
      stroke-width:1.8;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

    .lang-globe-btn:hover,
    .header-download-btn:hover{
      background:#e8edf5;
      color:#32455f;
    }

    .lang-globe-btn:focus-visible,
    .header-download-btn:focus-visible{
      outline:2px solid rgba(69,113,167,.45);
      outline-offset:2px;
    }

    .header-download-btn:disabled{
      opacity:.56;
      cursor:not-allowed;
    }

    #exportBtnMobile{
      display:none;
    }

    .sidebar-export-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
    }

    .sidebar-export-btn-icon{
      width:18px;
      height:18px;
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
      flex:none;
    }

    .language-modal-backdrop{
      position:fixed;
      inset:0;
      z-index:180;
      display:flex;
      align-items:stretch;
      justify-content:stretch;
      background:rgba(13,20,31,.52);
      backdrop-filter:blur(3px);
      -webkit-backdrop-filter:blur(3px);
    }

    .language-modal-backdrop[hidden]{
      display:none !important;
    }

    .language-modal{
      position:relative;
      width:100%;
      height:100%;
      padding:22px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:#f2f3f3;
    }

    .language-modal-close{
      position:absolute;
      top:16px;
      right:16px;
      width:44px;
      min-width:44px;
      height:44px;
      min-height:44px;
      border:1px solid #cdd6e3;
      border-radius:999px;
      background:#f7f9fc;
      color:#5d6d83;
      padding:0;
      font-size:1.9rem;
      line-height:1;
      font-weight:300;
    }

    .language-modal-close:hover{
      background:#ebf0f7;
      color:#2f4664;
    }

    .language-modal-options{
      width:min(520px,100%);
      display:grid;
      gap:12px;
    }

    .language-modal-option{
      width:100%;
      min-height:58px;
      border:1px solid #cdd6e3;
      border-radius:14px;
      background:#ffffff;
      color:#334d6f;
      font-size:1.16rem;
      font-weight:700;
      letter-spacing:.01em;
    }

    .language-modal-option.active,
    .language-modal-option[aria-pressed="true"]{
      background:#5f7fa2;
      border-color:#5f7fa2;
      color:#ffffff;
    }

    .language-modal-option:hover{
      background:#eef3fa;
    }

    .language-modal-option.active:hover,
    .language-modal-option[aria-pressed="true"]:hover{
      background:#547396;
    }

    body.language-modal-open{
      overflow:hidden !important;
    }

    @media (max-width:1024px){
      .language-modal{
        padding:18px;
      }

      .language-modal-close{
        top:14px;
        right:14px;
      }

      .language-modal-option{
        min-height:54px;
        font-size:1.08rem;
      }
    }
    .quick-pill{font-size:.79rem;color:var(--muted);background:#eef4ff;border:1px solid #d2e0f4;border-radius:999px;padding:4px 8px}
    .advanced-settings{margin-bottom:10px}
    .advanced-settings summary{cursor:pointer;color:#355b89;font-size:.86rem;font-weight:700;user-select:none}
    .advanced-settings[open] summary{margin-bottom:8px}
    .load-state{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
    .state-chip{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:5px 10px;
      border-radius:999px;
      border:1px solid #d2deef;
      background:#f8fbff;
      color:#3a5574;
      font-size:.82rem;
      font-weight:700;
    }
    .state-chip.ok{background:#eef9f2;border-color:#b8e3c8;color:#19643b}
    .state-chip.missing{background:#fff4f4;border-color:#f3ced1;color:#a52a36}
    .pairing-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 10px}
    .pairing-info{font-size:.8rem;color:#516c8f;background:#f3f8ff;border:1px solid #d5e3f5;border-radius:999px;padding:4px 9px}
    .progress-wrap{display:flex;align-items:center;gap:8px;margin:0 0 8px}
    .progress-track{flex:1;min-width:180px;height:8px;border-radius:999px;background:#eaf0fa;overflow:hidden;border:0;box-shadow:none}
    .progress-bar{height:100%;width:0;background:linear-gradient(90deg,#2e83ef 0,#1b6fe6 100%);transition:width .18s ease}
    .progress-text{font-size:.8rem;color:#4b6788;min-width:98px;text-align:right}
    label{display:block;font-size:.92rem;color:var(--muted);margin-bottom:6px}
    input[type="number"]{width:100%;padding:8px;border:1px solid var(--border);border-radius:8px;background:#fff}
    .upload-control{display:flex;flex-direction:column;gap:6px}
    .file-input-hidden{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
    .drop-zone{
      position:relative;
      min-height:124px;
      padding:14px;
      border:2px dashed #b6cceb;
      border-radius:14px;
      background:linear-gradient(145deg,#f8fbff 0,#eef5ff 100%);
      display:flex;
      flex-direction:column;
      justify-content:center;
      gap:7px;
      cursor:pointer;
      transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,transform .14s ease;
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.65);
    }
    .drop-zone:hover{
      border-color:#5f98e9;
      background:linear-gradient(145deg,#f5f9ff 0,#e9f2ff 100%);
      transform:translateY(-1px);
    }
    .drop-zone:focus-visible{
      outline:none;
      border-color:#2b7bef;
      box-shadow:0 0 0 3px rgba(43,123,239,.2);
    }
    .drop-zone.is-dragging{
      border-color:#1b6fe6;
      background:linear-gradient(145deg,#eef5ff 0,#deebff 100%);
      box-shadow:0 0 0 3px rgba(27,111,230,.22),0 8px 22px rgba(27,111,230,.18);
      transform:translateY(-1px) scale(1.005);
    }
    .drop-zone.has-files{
      border-color:#6ca8f7;
      background:linear-gradient(145deg,#f4f9ff 0,#e7f1ff 100%);
    }
    .drop-zone-title{font-size:.96rem;font-weight:700;color:var(--text)}
    .drop-zone-subtitle{font-size:.84rem;color:var(--muted)}
    .drop-zone-list{font-size:.84rem;color:#284361;line-height:1.35;word-break:break-word}
    .drop-zone-list .count{display:inline-block;margin-right:6px;font-weight:700;color:#1c5cc0}
    .global-drop-overlay{
      position:absolute;
      inset:10px;
      border-radius:14px;
      border:1px solid rgba(27,111,230,.2);
      background:rgba(240,247,255,.9);
      backdrop-filter:blur(3px);
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:10px;
      padding:10px;
      opacity:0;
      pointer-events:none;
      transform:translateY(6px);
      transition:opacity .16s ease,transform .16s ease;
      z-index:8;
    }
    .global-drop-overlay.visible{
      opacity:1;
      pointer-events:auto;
      transform:translateY(0);
    }
    .global-drop-side{
      border:2px dashed #9dc0ef;
      border-radius:12px;
      background:linear-gradient(150deg,#f7fbff 0,#eaf3ff 100%);
      display:flex;
      flex-direction:column;
      justify-content:center;
      align-items:center;
      text-align:center;
      padding:12px;
      gap:4px;
      color:#21456e;
      font-size:.88rem;
      transition:border-color .14s ease,box-shadow .14s ease,background .14s ease,transform .14s ease;
      user-select:none;
    }
    .global-drop-side .title{font-weight:700;font-size:.96rem;color:#0f3d76}
    .global-drop-side .desc{font-size:.82rem;color:#4b6988}
    .global-drop-side.is-active{
      border-color:#1b6fe6;
      background:linear-gradient(150deg,#f2f8ff 0,#dceaff 100%);
      box-shadow:0 0 0 3px rgba(27,111,230,.2),0 10px 22px rgba(27,111,230,.16);
      transform:translateY(-1px);
    }
    .actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
    .progress-wrap{
      display:flex;
      align-items:center;
      gap:10px;
      min-width:min(320px,100%);
      flex:1 1 320px;
      padding:0;
      border:0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
    }
    .progress-wrap-results{
      margin:0 0 12px;
      padding:0;
      border-radius:0;
      background:transparent;
    }
    button{border:0;background:var(--accent);color:#fff;padding:10px 14px;border-radius:9px;cursor:pointer;font-weight:600}
    button:hover{filter:brightness(.96)}
    button:disabled{background:#8fb3ec;cursor:wait}
    .btn-secondary{background:#4f6f96}
    .btn-tertiary{background:#6f7d90}
    .btn-small{padding:7px 10px;font-size:.85rem;border-radius:8px}
    #status{color:var(--muted);font-size:.92rem}
    .progress-text{
      min-width:84px;
      text-align:right;
      font-size:.82rem;
      font-weight:700;
      color:#436588;
      white-space:nowrap;
    }
    .warn{color:var(--danger);font-size:.9rem;margin:6px 0 0}
    .preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:12px}
    .preview-card{border:1px solid var(--border);border-radius:10px;padding:10px;background:#fff}
    .preview-title{font-size:.95rem;font-weight:700}
    .preview-meta{font-size:.85rem;color:var(--muted);margin:4px 0 8px}
    .preview-file-select{width:100%;padding:7px 8px;border:1px solid var(--border);border-radius:8px;background:#fff;margin-bottom:8px;font-size:.87rem}
    .preview-nav{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}
    .preview-page-label{font-size:.87rem;color:var(--muted);min-width:92px;text-align:center}
    .preview-canvas-wrap{border:1px solid var(--border);border-radius:8px;background:#f8fbff;min-height:240px;display:flex;align-items:center;justify-content:center;overflow:auto;padding:8px}
    .preview-canvas{width:100%;height:auto;display:block;border-radius:6px;background:#fff}
    .preview-placeholder{color:var(--muted);font-size:.9rem;text-align:center}
    .run-block{border:1px solid var(--border);border-radius:12px;background:#fff;padding:12px;margin-bottom:14px}
    .run-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:8px}
    .run-title{margin:0;font-size:1rem}
    .run-sub{margin:0;color:var(--muted);font-size:.88rem}
    .run-filter{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 10px}
    .run-filter-label{font-size:.82rem;color:var(--muted);font-weight:700}
    .run-filter-btn{
      border:1px solid #b9cbe6;
      background:#fff;
      color:#1f4e8f;
      padding:5px 10px;
      border-radius:999px;
      font-size:.78rem;
      font-weight:700;
      cursor:pointer;
    }
    .run-filter-btn:hover{background:#eef4ff;border-color:#82a8df}
    .run-filter-btn.active{background:#1b6fe6;color:#fff;border-color:#1b6fe6}
    .metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:10px 0 14px}
    .metric{border:1px solid var(--border);border-radius:10px;padding:10px;background:#fdfefe}
    .metric .k{color:var(--muted);font-size:.85rem;margin-bottom:4px}
    .metric .v{font-size:1.2rem;font-weight:700}
    .category-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 12px}
    .category-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:#fff;font-size:.83rem;color:var(--muted)}
    .category-chip .value{font-weight:700;color:var(--text)}
    .category-chip.cat-identical{border-color:#b8e3c8;background:#eef9f2}
    .category-chip.cat-minor{border-color:#ffe0a6;background:#fff8eb}
    .category-chip.cat-critical{border-color:#f3b6bd;background:#fff1f3}
    .result{border:1px solid var(--border);border-radius:10px;padding:12px;margin-top:10px;background:#fff}
    .result-header{margin-bottom:8px;font-size:.95rem;color:var(--muted)}
    .result-header.with-badge{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
    .result-meta{display:flex;flex-direction:column;gap:4px}
    .direction-confidence{font-size:.83rem;color:#425e7d}
    .result-interpretation{font-size:.84rem;color:#24476f}
    .cat-badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:.79rem;font-weight:700;letter-spacing:.01em}
    .cat-badge.cat-identical{background:#e0f4e8;color:#14683a;border:1px solid #a8d7ba}
    .cat-badge.cat-minor{background:#fff2d8;color:#956200;border:1px solid #f1d296}
    .cat-badge.cat-critical{background:#fde4e7;color:#a21f2f;border:1px solid #f0bcc4}
    .imgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
    .imgbox{border:1px solid var(--border);border-radius:8px;padding:8px;background:#f9fbff}
    .imgbox h3{margin:0 0 8px;font-size:.9rem;color:var(--muted)}
    .img-actions{margin-bottom:8px}
    .img-action-btn{padding:7px 10px;font-size:.86rem;border-radius:8px;background:#2b7bef}
    .marker-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:4px 0 10px}
    .marker-label{font-size:.83rem;color:var(--muted);font-weight:600}
    .marker-btn{border:1px solid #b9cbe6;background:#fff;color:#1f4e8f;padding:5px 8px;border-radius:999px;font-size:.78rem;font-weight:700;cursor:pointer}
    .marker-btn:hover{background:#eef4ff;border-color:#82a8df}
    .result-canvas{width:100%;height:auto;display:block;border-radius:6px;background:#fff;cursor:grab}
    .ok-row{border:1px solid #bce8cc;background:var(--ok-bg);border-radius:10px;padding:12px;display:flex;align-items:center;gap:10px;color:var(--ok);font-weight:700;font-size:.95rem}
    .ok-check{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--ok);color:#fff}
    .zoom-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px}
    .zoom-modal[hidden]{display:none}
    .zoom-backdrop{position:absolute;inset:0;background:rgba(7,18,32,.72);backdrop-filter:blur(2px)}
    .zoom-panel{position:relative;width:min(96vw,1450px);height:min(94vh,960px);background:#fff;border-radius:14px;border:1px solid var(--border);box-shadow:0 20px 40px rgba(0,0,0,.25);display:flex;flex-direction:column;overflow:hidden;z-index:1}
    .zoom-toolbar{display:flex;align-items:center;gap:8px;padding:10px;border-bottom:1px solid var(--border);flex-wrap:wrap;background:#f7faff}
    .zoom-title{margin-right:auto;font-size:.95rem;font-weight:700}
    .zoom-btn{background:#2b7bef;padding:8px 10px;border-radius:8px;font-size:.85rem;min-width:38px}
    .zoom-close{background:var(--accent-dark)}
    .zoom-range{width:170px;accent-color:var(--accent)}
    .zoom-value{min-width:56px;text-align:center;color:var(--muted);font-weight:600;font-size:.9rem}
    .layer-group{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
    .layer-item{display:flex;align-items:center;gap:4px;font-size:.86rem;color:var(--muted);background:#fff;border:1px solid var(--border);border-radius:7px;padding:4px 8px}
    .layer-item input{accent-color:var(--accent)}
    .diff-opacity{display:flex;align-items:center;gap:7px;font-size:.86rem;color:var(--muted)}
    .zoom-content{flex:1;overflow:auto;background:linear-gradient(135deg,#f4f8ff 0,#f7f8fb 100%);padding:12px}
    .blend-stage{width:max-content;min-width:100%;display:flex;justify-content:center;align-items:flex-start}
    .blend-canvas{display:block;width:auto;max-width:none;height:auto;border-radius:8px;background:#fff;border:1px solid #d7e3f6;box-shadow:0 8px 24px rgba(16,37,63,.08)}
    .zoom-hint{color:var(--muted);font-size:.85rem;margin-left:2px}
    .pairing-hint{margin:6px 0 0;color:var(--muted);font-size:.82rem}
    .color-hint{margin:4px 0 0;color:#3f5a78;font-size:.84rem}
    .text-diff-panel{border:1px solid var(--border);border-radius:10px;background:#fdfefe;padding:10px;margin:0 0 10px}
    .text-diff-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:8px}
    .text-diff-title{font-weight:700;font-size:.92rem}
    .text-diff-count{font-size:.85rem;color:var(--muted)}
    .text-diff-list{display:flex;flex-direction:column;gap:6px;max-height:220px;overflow:auto}
    .text-diff-item{display:flex;align-items:flex-start;gap:8px;border:1px solid var(--border);background:#fff;border-radius:8px;padding:7px 9px;color:var(--text);font-size:.86rem;text-align:left}
    .text-diff-item:hover{background:#f4f8ff}
    .text-diff-item-side-a{border-color:rgba(220,45,57,.34);background:rgba(255,244,246,.8)}
    .text-diff-item-side-b{border-color:rgba(28,180,95,.34);background:rgba(241,251,245,.8)}
    .text-diff-item-side-a:hover{background:rgba(255,238,242,.95)}
    .text-diff-item-side-b:hover{background:rgba(235,249,240,.95)}
    .text-diff-side{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      font-weight:760;
      min-width:24px;
      padding:2px 8px;
      border-radius:999px;
      text-align:center;
      font-size:.74rem;
      line-height:1.2;
      border:1px solid transparent;
    }
    .text-diff-side-a{color:#8c202d;background:rgba(220,45,57,.14);border-color:rgba(220,45,57,.35)}
    .text-diff-side-b{color:#14673d;background:rgba(28,180,95,.16);border-color:rgba(28,180,95,.35)}
    .text-diff-content{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;flex:1}
    .text-diff-page{font-size:.73rem;font-weight:700;color:#5e7290;letter-spacing:.01em}
    .text-diff-preview{
      display:inline-block;
      max-width:100%;
      overflow-wrap:anywhere;
      line-height:1.28;
      border-radius:7px;
      padding:2px 6px;
      font-weight:600;
    }
    .text-diff-preview-a{background:rgba(220,45,57,.14);color:#84222a}
    .text-diff-preview-b{background:rgba(28,180,95,.16);color:#14673d}
    .text-diff-empty{font-size:.85rem;color:var(--muted);line-height:1.3}
    .swipe-control{display:flex;align-items:center;gap:7px;font-size:.86rem;color:var(--muted)}
    .swipe-value{min-width:46px;text-align:center}
    .preview-details{margin-bottom:14px}
    .preview-details > summary{
      cursor:pointer;
      list-style:none;
      font-size:1.03rem;
      font-weight:700;
      color:#1e4778;
      user-select:none;
    }
    .preview-details > summary::-webkit-details-marker{display:none}
    .preview-details > summary::before{
      content:"+";
      display:inline-block;
      width:18px;
      text-align:center;
      margin-right:6px;
      color:#1b6fe6;
      font-weight:700;
    }
    .preview-details[open] > summary::before{content:"-"}
    .preview-details-body{margin-top:10px}
    .empty-results{
      border:1px dashed #c2d3eb;
      border-radius:10px;
      background:#f8fbff;
      color:#4a6484;
      font-size:.9rem;
      padding:14px;
      text-align:center;
      margin-bottom:8px;
    }
    @media (max-width:860px){
      .controls-files{grid-template-columns:1fr}
    }

/* style-block-2 */
    :root{
      --bg:#edf4fb;
      --text:#102a48;
      --muted:#5c7391;
      --accent:#0e8dff;
      --accent-dark:#0a6fdd;
      --border:#c9ddef;
      --danger:#d63a50;
      --ok:#178758;
      --ok-bg:#edfbf3;
    }

    body{
      font-family:"Space Grotesk","Avenir Next","Trebuchet MS",sans-serif;
      background:
        radial-gradient(900px 520px at 10% -6%, #d8ecff 0%, transparent 58%),
        radial-gradient(760px 460px at 96% 2%, #dbf4ea 0%, transparent 54%),
        linear-gradient(180deg, #edf4fb 0%, #f7fbff 100%);
      letter-spacing:.01em;
      color:var(--text);
    }

    .wrap{max-width:1360px;margin:28px auto 54px}
    h1{font-size:clamp(1.75rem,3.1vw,2.35rem);font-weight:700}
    .note{font-size:.96rem;color:#3f5d7d}
    .note-sm{color:var(--muted)}

    .card,.run-block{
      border-radius:20px;
      border:1px solid var(--border);
      box-shadow:0 16px 42px rgba(10,40,80,.12);
      background:rgba(255,255,255,.84);
      backdrop-filter:blur(8px);
    }
    .run-block{background:#fff;border-radius:16px;animation:rise .26s ease both}
    @keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

    .upload-card{
      background:
        linear-gradient(180deg, rgba(255,255,255,.86) 0%, rgba(255,255,255,.72) 100%),
        linear-gradient(130deg, #f8fbff 0%, #eef6ff 58%, #e9f8f2 100%);
    }

    .quick-settings label{font-weight:700;color:#244d7f}
    .quick-settings select{border-radius:11px;min-width:250px}
    .quick-pill{background:#eaf6ff;border-color:#c4e1ff;color:#2d5f92}

    .advanced-settings{
      border-radius:14px;
      border:1px solid var(--border);
      background:#fbfdff;
    }
    .advanced-settings summary{color:#2d5d91}

    label{font-weight:600;font-size:.88rem;color:#3f5e81}
    input[type="number"],select{
      border:1px solid #b9d2ea;
      border-radius:11px;
      padding:10px 12px;
      transition:border-color .15s ease, box-shadow .15s ease;
      font:inherit;
      font-size:.9rem;
    }
    input[type="number"]:focus,select:focus{
      outline:none;
      border-color:var(--accent);
      box-shadow:0 0 0 4px rgba(14,141,255,.14);
    }
    input[type="range"]{accent-color:var(--accent)}

    .state-chip{
      border-radius:999px;
      border-color:#c7ddf4;
      background:#f2f8ff;
      color:#36597f;
      font-weight:700;
      box-shadow:0 6px 16px rgba(38,84,131,.1);
    }
    .state-chip.ok{background:#ebfaf3;border-color:#b2e7d2;color:#11724f}
    .state-chip.missing{background:#fff2f4;border-color:#f3c7cf;color:#a32c3d}
    .pairing-info{background:#f3f8ff;border-color:#d1e4fb;color:#4a6a8f;font-weight:600}

    .progress-track{height:10px;background:#e7eef8;border-color:#d0dced}
    .progress-bar{background:linear-gradient(90deg,#0e8dff 0%,#10b8d2 100%)}
    .progress-text{color:#456485;font-weight:600}

    .drop-zone{
      min-height:132px;
      border:2px dashed #a7c8e9;
      border-radius:16px;
      background:linear-gradient(160deg,#fbfdff 0%,#f0f7ff 100%);
      transition:border-color .16s ease, box-shadow .16s ease, transform .14s ease;
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.72);
    }
    .drop-zone:hover{
      border-color:#66abed;
      transform:translateY(-1px);
      box-shadow:0 12px 30px rgba(30,90,160,.12), inset 0 0 0 1px rgba(255,255,255,.8);
    }
    .drop-zone:focus-visible{
      border-color:var(--accent);
      box-shadow:0 0 0 4px rgba(14,141,255,.18);
    }
    .drop-zone.is-dragging{
      border-color:var(--accent);
      background:linear-gradient(160deg,#eff7ff 0%,#def0ff 100%);
      box-shadow:0 0 0 4px rgba(14,141,255,.17), 0 12px 30px rgba(11,66,126,.17);
    }
    .drop-zone.has-files{background:linear-gradient(160deg,#f2f9ff 0%,#e8f4ff 100%)}
    .drop-zone-title{font-size:1rem;color:#11335e}
    .drop-zone-subtitle{color:#527094}
    .drop-zone-list{color:#2a4b70}
    .drop-zone-list .count{color:#0e69d6}

    .global-drop-overlay{
      border-radius:16px;
      border-color:rgba(14,141,255,.25);
      background:rgba(246,251,255,.9);
      backdrop-filter:blur(4px);
    }
    .global-drop-side{
      border-color:#a4c8ef;
      border-radius:13px;
      background:linear-gradient(160deg,#fbfdff 0%,#ecf5ff 100%);
      color:#2b517e;
    }
    .global-drop-side .title{color:#124680}
    .global-drop-side .desc{color:#4f6f93}
    .global-drop-side.is-active{
      border-color:var(--accent);
      box-shadow:0 0 0 3px rgba(14,141,255,.19), 0 10px 24px rgba(17,81,147,.16);
    }

    button{
      border-radius:11px;
      padding:10px 15px;
      font:inherit;
      font-size:.88rem;
      font-weight:700;
      background:linear-gradient(135deg,#0e8dff 0%,#0a6fdd 100%);
      box-shadow:0 10px 22px rgba(15,105,195,.26);
      transition:transform .14s ease,box-shadow .14s ease,filter .14s ease;
    }
    button:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(15,105,195,.3);filter:brightness(1.01)}
    button:disabled{background:linear-gradient(135deg,#9fb9d8 0%,#88a8cb 100%);box-shadow:none;transform:none}
    .btn-secondary{background:linear-gradient(135deg,#466e98 0%,#3c5f86 100%)}
    .btn-tertiary{background:linear-gradient(135deg,#7388a4 0%,#627991 100%)}

    .run-filter-btn,.marker-btn,.text-diff-item{
      box-shadow:none;
      transform:none;
    }
    .run-filter-btn{
      border:1px solid #c4d8f0;
      color:#275384;
      background:#fff;
      font-size:.76rem;
    }
    .run-filter-btn:hover{background:#f1f7ff;border-color:#91bbed}
    .run-filter-btn.active{background:linear-gradient(135deg,#0e8dff 0%,#0a6fdd 100%);color:#fff;border-color:transparent}

    #status{color:#48678c;font-size:.87rem;font-weight:600}
    .warn{font-weight:600}

    .legend-box{
      border-radius:14px;
      border-color:var(--border);
      background:#f8fbff;
    }
    .legend-item{
      border-color:#d6e3f4;
      background:#fff;
      color:#365374;
      font-weight:600;
    }
    .dot-green{background:#1ea566}
    .dot-red{background:#dc3d52}
    .dot-orange{background:#d18a1c}
    .dot-blue{background:#0e8dff}

    .preview-details{border-radius:18px}
    .preview-details > summary{color:#1f4b81}
    .preview-details > summary::before{color:var(--accent)}
    .preview-card{
      border-color:var(--border);
      border-radius:16px;
      box-shadow:0 10px 24px rgba(26,66,106,.09);
      background:#fff;
    }
    .preview-title{color:#12365f}
    .preview-page-label{color:#4f6e92;font-weight:600}
    .preview-canvas-wrap{border-color:var(--border);border-radius:12px;background:#f6faff}

    .empty-results{
      border:1px dashed #bcd3ec;
      border-radius:14px;
      background:#f6fbff;
      color:#4a6789;
      font-weight:500;
    }

    .run-title{color:#113a66}
    .run-sub{color:#567293}
    .metric{border-color:var(--border);border-radius:14px;background:#fff}
    .metric .k{color:#5d7798;font-weight:600}
    .metric .v{color:#10355f}

    .category-chip{border-color:var(--border);color:#526f91;font-weight:600}
    .category-chip .value{color:#14395f}
    .category-chip.cat-identical{border-color:#bde6d2;background:#edf9f3}
    .category-chip.cat-minor{border-color:#f5ddab;background:#fff8eb}
    .category-chip.cat-critical{border-color:#f3c5cd;background:#fff2f4}

    .text-diff-panel{
      border-color:var(--border);
      border-radius:14px;
      background:#fff;
    }
    .text-diff-title{color:#1a466f}
    .text-diff-count{color:#5a7596;font-weight:600}
    .text-diff-item{
      border-color:var(--border);
      border-radius:10px;
      font-size:.84rem;
    }
    .text-diff-item:hover{background:#f3f8ff}

    .result{
      border-color:var(--border);
      border-radius:16px;
      background:#fff;
      box-shadow:0 10px 24px rgba(28,67,107,.08);
    }
    .result-header{color:#4f6c8d}
    .direction-confidence{color:#3f6085;font-weight:600}
    .result-interpretation{color:#285279;font-weight:600}
    .cat-badge{font-size:.76rem}
    .cat-badge.cat-identical{background:#e2f8ec;color:#136d44;border-color:#a8dfbe}
    .cat-badge.cat-minor{background:#fff1d6;color:#8f6100;border-color:#f2d197}
    .cat-badge.cat-critical{background:#ffe4e8;color:#99253a;border-color:#f2bcc6}
    .imgbox{border-color:var(--border);border-radius:14px;background:#f8fbff}
    .imgbox h3{color:#4d6d92}
    .img-action-btn{background:linear-gradient(135deg,#168eff 0%,#0a72e2 100%);box-shadow:0 8px 18px rgba(15,104,188,.23)}
    .result-canvas{border-radius:9px;border:1px solid #d7e4f5}
    .ok-row{border-color:#b5e8d2;background:var(--ok-bg);border-radius:13px;color:var(--ok)}
    .marker-label{color:#5a7697}
    .marker-btn{
      border-color:#c2d7f1;
      color:#225183;
      background:#fff;
      font-size:.75rem;
    }
    .marker-btn:hover{background:#eff6ff}

    .zoom-backdrop{background:rgba(11,30,53,.66);backdrop-filter:blur(3px)}
    .zoom-panel{
      border-radius:20px;
      border-color:#c8dbef;
      box-shadow:0 30px 80px rgba(7,24,43,.32);
      background:#fff;
    }
    .zoom-toolbar{
      background:linear-gradient(180deg,#f7fbff 0%,#eef6ff 100%);
      border-bottom-color:#d4e2f3;
    }
    .zoom-title{color:#1a4574}
    .zoom-btn{
      border-radius:9px;
      background:linear-gradient(135deg,#188fff 0%,#0c74e4 100%);
      box-shadow:0 8px 18px rgba(18,101,182,.22);
    }
    .zoom-close{background:linear-gradient(135deg,#3e628a 0%,#365679 100%)}
    .zoom-value,.zoom-hint{color:#536f90;font-weight:600}
    .layer-item{
      border-color:var(--border);
      border-radius:8px;
      color:#547194;
      font-weight:600;
    }
    .diff-opacity,.swipe-control{color:#536f90;font-weight:600}
    .zoom-content{
      background:linear-gradient(140deg,#f0f6ff 0%,#f6f9fd 42%,#eef6f3 100%);
    }
    .blend-canvas{
      border-color:#d4e3f5;
      border-radius:10px;
      box-shadow:0 12px 32px rgba(17,45,76,.14);
    }

    @media (max-width:920px){
      .quick-settings select{min-width:0;width:100%}
      .controls-files{grid-template-columns:1fr}
      .progress-text{min-width:84px}
    }

/* style-block-3 */
:root{
      --bg:#e9eff8;
      --text:#0f1f33;
      --muted:#586b84;
      --accent:#0a84ff;
      --accent-dark:#0066d6;
      --border:#dbe6f5;
      --danger:#d6455d;
      --ok:#1f9d62;
      --ok-bg:#ecfbf3;
      --workspace-wrap-max:1880px;
      --workspace-gap:18px;
      --workspace-left-col:clamp(268px, 17vw, 320px);
      --workspace-right-col:clamp(224px, 14vw, 280px);
      --workspace-main-lift:122px;
    }

    html,body{
      height:100%;
    }

    body{
      overflow:hidden;
      font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",sans-serif;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
      background:
        radial-gradient(700px 420px at -6% -10%, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 62%),
        radial-gradient(760px 480px at 103% -14%, rgba(200,225,255,.72) 0%, rgba(200,225,255,0) 58%),
        linear-gradient(180deg, #edf2f9 0%, #e8eef7 100%);
      color:var(--text);
      letter-spacing:.005em;
    }

    .wrap{
      max-width:min(calc(100vw - 32px), var(--workspace-wrap-max));
      height:100dvh;
      margin:0 auto;
      padding:26px 0 18px;
      display:grid;
      grid-template-rows:auto minmax(0,1fr);
      overflow:hidden;
    }

    h1{
      font-size:clamp(1.72rem,2.8vw,2.26rem);
      font-weight:700;
      letter-spacing:-.01em;
      margin-bottom:6px;
    }

    .note{
      color:#475d79;
      font-size:.95rem;
      margin-bottom:14px;
    }

    .card,
    .run-block{
      background:rgba(255,255,255,.58);
      border:1px solid rgba(255,255,255,.62);
      border-radius:20px;
      box-shadow:
        0 24px 60px rgba(18,44,78,.14),
        inset 0 1px 0 rgba(255,255,255,.85);
      backdrop-filter:blur(24px) saturate(165%);
      -webkit-backdrop-filter:blur(24px) saturate(165%);
    }

    .run-block{
      border-radius:16px;
      background:rgba(255,255,255,.68);
    }

    .upload-card{
      background:
        linear-gradient(180deg, rgba(255,255,255,.63) 0%, rgba(255,255,255,.46) 100%),
        linear-gradient(135deg, rgba(232,241,252,.9) 0%, rgba(225,239,255,.85) 52%, rgba(229,245,238,.8) 100%);
    }

    .drop-zone,
    .preview-card,
    .imgbox,
    .metric,
    .text-diff-panel,
    .param-field,
    .advanced-settings{
      background:rgba(255,255,255,.72);
      border:1px solid rgba(193,210,230,.72);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
    }

    .drop-zone{
      border-style:solid;
      border-color:rgba(175,198,223,.9);
      border-radius:17px;
    }

    .drop-zone:hover{
      border-color:rgba(132,170,207,.95);
      box-shadow:
        0 14px 28px rgba(30,68,111,.13),
        inset 0 1px 0 rgba(255,255,255,.94);
      transform:translateY(-1px);
    }

    .drop-zone.is-dragging{
      border-color:rgba(10,132,255,.95);
      box-shadow:
        0 0 0 3px rgba(10,132,255,.16),
        0 16px 28px rgba(14,72,134,.2);
    }

    .state-chip,
    .pairing-info,
    .legend-item,
    .run-filter-btn,
    .marker-btn,
    .layer-item{
      background:rgba(255,255,255,.78);
      border:1px solid rgba(189,205,224,.85);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.93);
    }

    .state-chip.ok{
      background:rgba(234,251,242,.84);
      border-color:rgba(161,219,188,.9);
      color:#107148;
    }

    .state-chip.missing{
      background:rgba(255,240,243,.9);
      border-color:rgba(238,188,198,.95);
      color:#a63043;
    }

    button{
      border-radius:12px;
      font-weight:600;
      letter-spacing:.005em;
      background:linear-gradient(180deg,#2293ff 0%, #0a84ff 48%, #0069de 100%);
      box-shadow:
        0 10px 20px rgba(9,92,177,.3),
        inset 0 1px 0 rgba(255,255,255,.35);
    }

    button:hover{
      filter:brightness(1.02);
      transform:translateY(-1px);
      box-shadow:
        0 14px 24px rgba(9,92,177,.34),
        inset 0 1px 0 rgba(255,255,255,.42);
    }

    button:disabled{
      background:linear-gradient(180deg,#b7c9dc 0%, #9eb5cf 100%);
      box-shadow:none;
    }

    .btn-secondary{
      background:linear-gradient(180deg,#758ea8 0%, #607a97 100%);
      box-shadow:0 9px 18px rgba(66,89,116,.24), inset 0 1px 0 rgba(255,255,255,.28);
    }

    .btn-tertiary{
      background:linear-gradient(180deg,#8e9fb4 0%, #73859c 100%);
      box-shadow:0 9px 18px rgba(66,89,116,.24), inset 0 1px 0 rgba(255,255,255,.28);
    }

    .run-filter-btn{
      color:#2d4f73;
      box-shadow:none;
      transform:none;
    }

    .run-filter-btn:hover{
      background:rgba(235,245,255,.95);
      border-color:rgba(144,182,218,.9);
      box-shadow:none;
      transform:none;
    }

    .run-filter-btn.active{
      color:#fff;
      border-color:transparent;
      background:linear-gradient(180deg,#2293ff 0%, #0a84ff 48%, #0069de 100%);
    }

    input[type="number"],
    select{
      border:1px solid rgba(179,198,220,.92);
      border-radius:12px;
      background:rgba(255,255,255,.9);
    }

    input[type="number"]:focus,
    select:focus{
      border-color:rgba(10,132,255,.95);
      box-shadow:0 0 0 4px rgba(10,132,255,.15);
    }

    .progress-track{
      border:0;
      background:rgba(233,241,250,.88);
      box-shadow:none;
    }

    .progress-bar{
      background:linear-gradient(90deg,#0a84ff 0%, #38b0ff 100%);
    }

    .legend-box,
    .empty-results{
      background:rgba(247,251,255,.76);
      border-color:rgba(189,207,229,.85);
    }

    .result{
      background:rgba(255,255,255,.75);
    }

    .cat-badge{
      font-weight:600;
      border-width:1px;
      border-style:solid;
    }

    .cat-badge.cat-identical{background:rgba(227,248,236,.92)}
    .cat-badge.cat-minor{background:rgba(255,242,218,.94)}
    .cat-badge.cat-critical{background:rgba(255,228,232,.94)}

    .zoom-backdrop{
      background:rgba(14,25,40,.45);
      backdrop-filter:blur(8px);
      -webkit-backdrop-filter:blur(8px);
    }

    .zoom-panel{
      background:rgba(255,255,255,.83);
      border:1px solid rgba(201,219,240,.9);
      border-radius:22px;
      backdrop-filter:blur(26px) saturate(150%);
      -webkit-backdrop-filter:blur(26px) saturate(150%);
      box-shadow:
        0 30px 80px rgba(7,24,43,.3),
        inset 0 1px 0 rgba(255,255,255,.8);
    }

    .zoom-toolbar{
      background:rgba(247,251,255,.8);
      border-bottom:1px solid rgba(203,220,240,.85);
    }

    .zoom-content{
      background:
        linear-gradient(160deg, rgba(238,245,253,.88) 0%, rgba(247,250,254,.88) 52%, rgba(237,247,243,.9) 100%);
    }

    .blend-canvas{
      border:1px solid rgba(202,220,241,.95);
    }

/* style-block-4 */
:root{
      --bg:#f4f5f7;
      --text:#1c1c1e;
      --muted:#697386;
      --accent:#0a84ff;
      --accent-dark:#006fe0;
      --border:#d8dde6;
      --danger:#d6455d;
      --ok:#1b9b63;
      --ok-bg:#eefaf3;
    }

    body{
      background:
        radial-gradient(980px 520px at -8% -14%, rgba(255,255,255,.96) 0%, rgba(255,255,255,0) 62%),
        radial-gradient(860px 500px at 108% -18%, rgba(222,236,252,.58) 0%, rgba(222,236,252,0) 60%),
        linear-gradient(180deg,#f5f7fb 0%,#edf1f7 100%);
      color:var(--text);
    }

    h1{
      font-size:clamp(2.02rem,3.4vw,2.85rem);
      letter-spacing:-.018em;
      font-weight:740;
      color:#101828;
      margin-bottom:10px;
    }

    .note{color:#5c6678}
    .note-sm{
      margin:0 0 14px;
      color:#60728b;
      font-size:.94rem;
    }

    .card,
    .run-block{
      background:rgba(255,255,255,.72);
      border:1px solid rgba(255,255,255,.92);
      box-shadow:
        0 14px 34px rgba(15,23,42,.08),
        inset 0 1px 0 rgba(255,255,255,.92);
      backdrop-filter:blur(18px) saturate(120%);
      -webkit-backdrop-filter:blur(18px) saturate(120%);
    }

    .upload-card{
      border-radius:24px;
      border:1px solid rgba(255,255,255,.95);
      background:
        linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.62) 100%),
        linear-gradient(140deg, rgba(237,243,252,.92) 0%, rgba(243,247,252,.9) 55%, rgba(236,246,241,.88) 100%);
    }

    .page-header{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:18px;
      margin:0 0 12px;
      width:var(--workspace-left-col);
      max-width:100%;
    }

    .page-header-main{
      min-width:0;
      max-width:100%;
    }

    .page-header-main h1{
      margin:0;
      font-size:clamp(1.45rem,1.95vw,2.05rem);
      line-height:1.12;
      letter-spacing:-.01em;
      overflow-wrap:anywhere;
      word-break:break-word;
    }

    .page-header-controls{
      min-width:min(100%,560px);
      flex:0 1 560px;
      display:flex;
      flex-direction:column;
      gap:8px;
    }

    .page-header-controls .quick-settings{
      margin:0;
    }

    .page-header-controls .advanced-settings{
      margin:0;
      padding:0;
      border:0;
      background:transparent;
      box-shadow:none;
    }

    .page-header-controls .advanced-settings summary{
      padding:0 2px;
      color:#335a87;
      font-weight:700;
    }

    .page-header-controls .advanced-settings[open]{
      margin-top:2px;
    }

    .upload-compare-row{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:16px;
      align-items:stretch;
      margin:0 0 14px;
      position:relative;
    }

    .upload-compare-row .upload-control{
      min-width:0;
      width:100%;
    }

    .swap-between-btn{
      width:52px;
      height:52px;
      padding:0;
      border-radius:999px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      position:absolute;
      left:50%;
      top:50%;
      transform:translate(-50%,-50%);
      z-index:3;
      background:#909aa8;
      box-shadow:0 6px 14px rgba(66,75,89,.2);
      border:1px solid rgba(0,0,0,.05);
      color:#fff;
      line-height:1;
    }

    .swap-between-btn:hover{
      background:#848f9e;
      box-shadow:0 8px 16px rgba(66,75,89,.24);
      transform:translate(-50%,-50%);
      filter:none;
    }

    .swap-between-btn .swap-arrows{
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:2px;
      font-size:1.08rem;
      font-weight:700;
      transform:translateY(-1px);
    }

    .swap-between-btn .swap-arrow{
      display:block;
      line-height:.9;
    }

    .swap-between-btn[hidden]{
      display:none !important;
    }

    .drop-zone,
    .preview-card,
    .imgbox,
    .metric,
    .text-diff-panel,
    .param-field,
    .advanced-settings,
    .legend-box{
      background:rgba(255,255,255,.7);
      border:1px solid rgba(206,215,229,.86);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
    }

    .drop-zone{
      position:relative;
      isolation:isolate;
      border:1px solid rgba(189,203,222,.9);
      border-radius:20px;
      background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(246,250,255,.92) 100%);
      box-shadow:0 8px 24px rgba(31,54,86,.06);
      min-height:312px;
      padding:16px;
      display:flex;
      flex-direction:column;
      justify-content:flex-start;
      gap:10px;
      transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease, background .2s ease;
    }

    .drop-zone::after{
      content:"";
      position:absolute;
      inset:-1px;
      border-radius:inherit;
      border:1px solid rgba(52,124,196,.34);
      box-shadow:0 0 0 0 rgba(52,124,196,0);
      opacity:.34;
      pointer-events:none;
      animation:dropZoneGlowIdle 3.1s ease-in-out infinite;
    }

    @keyframes dropZoneGlowIdle{
      0%,100%{
        opacity:.28;
        box-shadow:0 0 0 0 rgba(52,124,196,0);
      }
      50%{
        opacity:.62;
        box-shadow:0 0 0 6px rgba(52,124,196,.16);
      }
    }

    .drop-zone:hover{
      border-color:rgba(121,149,186,.86);
      box-shadow:0 16px 30px rgba(31,54,86,.12);
      transform:translateY(-2px);
    }

    .drop-zone.is-dragging{
      border-color:rgba(27,129,222,.95);
      background:linear-gradient(180deg, rgba(243,250,255,.96) 0%, rgba(235,245,255,.94) 100%);
      box-shadow:0 0 0 4px rgba(19,126,223,.16), 0 16px 30px rgba(31,54,86,.14);
    }

    .drop-zone.is-dragging::after{
      border-color:rgba(20,128,219,.7);
      opacity:.85;
      box-shadow:0 0 0 8px rgba(20,128,219,.2);
      animation:none;
    }

    .drop-zone.has-files{
      border-color:rgba(44,156,99,.74);
      background:linear-gradient(180deg, rgba(242,251,246,.96) 0%, rgba(236,248,241,.94) 100%);
    }

    .drop-zone.has-files::after{
      border-color:rgba(38,145,91,.5);
      animation:dropZoneGlowReady 3.3s ease-in-out infinite;
    }

    @keyframes dropZoneGlowReady{
      0%,100%{
        opacity:.3;
        box-shadow:0 0 0 0 rgba(38,145,91,0);
      }
      50%{
        opacity:.65;
        box-shadow:0 0 0 6px rgba(38,145,91,.15);
      }
    }

    .drop-zone.has-files:hover{
      border-color:rgba(31,138,86,.9);
    }

    .drop-zone.has-files .drop-zone-list .count{
      color:#1e8d58;
    }

    @media (prefers-reduced-motion: reduce){
      .drop-zone::after,
      .drop-zone.has-files::after,
      .drop-zone.is-dragging::after{
        animation:none !important;
      }
    }

    .drop-zone-title{
      font-size:1.1rem;
      font-weight:740;
      color:#14365f;
      letter-spacing:-.01em;
    }

    .drop-zone-list{
      color:#42648e;
      font-size:.9rem;
      line-height:1.45;
    }

    .drop-zone-list .upload-cta{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:0;
      border:0;
      border-radius:0;
      background:transparent;
      color:#2e5a8b;
      font-size:.9rem;
      font-weight:620;
      letter-spacing:.002em;
      box-shadow:none;
    }

    .drop-zone-list .upload-cta::before{
      content:"+";
      width:18px;
      height:18px;
      border-radius:999px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background:rgba(47,130,218,.15);
      color:#2f82da;
      font-size:.8rem;
      font-weight:700;
      line-height:1;
      flex:none;
    }

    .drop-zone-preview{
      position:relative;
      margin-top:4px;
      border:1px solid rgba(200,213,232,.9);
      border-radius:14px;
      background:linear-gradient(180deg, rgba(252,254,255,.96) 0%, rgba(246,250,255,.94) 100%);
      min-height:210px;
      height:210px;
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
    }

    .drop-zone-preview-canvas{
      display:block;
      max-width:100%;
      max-height:100%;
      width:auto;
      height:auto;
      border-radius:8px;
      box-shadow:0 5px 16px rgba(16,37,63,.12);
    }

    .drop-zone-preview-placeholder{
      color:#647d9d;
      font-size:.9rem;
      text-align:center;
      padding:0 14px;
    }

    .drop-zone-preview-placeholder.preview-clickable{
      cursor:pointer;
      color:#2f5f93;
      text-decoration:underline;
      text-underline-offset:2px;
      font-weight:620;
    }

    .drop-zone-preview-placeholder.preview-clickable:hover{
      color:#1e4e82;
    }

    .drop-zone-preview-nav{
      position:absolute;
      top:50%;
      transform:translateY(-50%);
      width:34px;
      height:34px;
      border-radius:999px;
      border:1px solid rgba(177,192,212,.92);
      background:rgba(245,250,255,.94);
      color:#2e4f76;
      font-size:1.15rem;
      font-weight:700;
      line-height:1;
      padding:0;
      display:flex;
      align-items:center;
      justify-content:center;
      box-shadow:0 4px 10px rgba(16,37,63,.12);
      opacity:0;
      pointer-events:none;
      transition:opacity .16s ease;
    }

    .drop-zone-preview-nav.prev{left:10px}
    .drop-zone-preview-nav.next{right:10px}

    .drop-zone.has-multipage:hover .drop-zone-preview-nav:not([hidden]),
    .drop-zone.has-multipage:focus-within .drop-zone-preview-nav:not([hidden]){
      opacity:1;
      pointer-events:auto;
    }

    .drop-zone-preview-page{
      position:absolute;
      bottom:8px;
      left:50%;
      transform:translateX(-50%);
      background:rgba(17,34,56,.72);
      color:#fff;
      border-radius:999px;
      padding:3px 8px;
      font-size:.73rem;
      letter-spacing:.01em;
      pointer-events:none;
      opacity:0;
      transition:opacity .16s ease;
    }

    .drop-zone.has-preview .drop-zone-preview-page{
      opacity:1;
    }

    .drop-zone-preview-canvas[hidden],
    .drop-zone-preview-placeholder[hidden],
    .drop-zone-preview-nav[hidden],
    .drop-zone-preview-page[hidden]{
      display:none !important;
    }

    .drop-zone:not(.has-files){
      min-height:124px;
      justify-content:center;
    }

    .drop-zone:not(.has-files) .drop-zone-preview{
      display:none !important;
    }

    .state-chip,
    .pairing-info,
    .legend-item,
    .run-filter-btn,
    .marker-btn,
    .layer-item{
      background:rgba(255,255,255,.82);
      border:1px solid rgba(198,208,223,.9);
      box-shadow:none;
      color:#4e596d;
    }

    .state-chip.ok{
      background:rgba(237,249,243,.92);
      border-color:rgba(173,218,197,.95);
      color:#16784c;
    }

    .state-chip.missing{
      background:rgba(255,241,244,.92);
      border-color:rgba(236,191,200,.95);
      color:#a53549;
    }

    button{
      background:#0a84ff;
      border:1px solid rgba(0,0,0,.05);
      box-shadow:0 6px 14px rgba(10,132,255,.24), inset 0 1px 0 rgba(255,255,255,.28);
      border-radius:12px;
    }

    button:hover{
      background:#0078ef;
      box-shadow:0 8px 16px rgba(10,132,255,.28), inset 0 1px 0 rgba(255,255,255,.3);
      transform:translateY(-1px);
      filter:none;
    }

    button:disabled{
      background:#aeb8c6;
      box-shadow:none;
      border-color:transparent;
    }

    .btn-secondary{background:#7e8a99;box-shadow:0 6px 14px rgba(66,75,89,.2)}
    .btn-secondary:hover{background:#727f90}
    .btn-tertiary{background:#909aa8;box-shadow:0 6px 14px rgba(66,75,89,.2)}
    .btn-tertiary:hover{background:#848f9e}

    .actions{
      align-items:center;
      justify-content:space-between;
      gap:12px;
    }

    .run-main-control{
      min-width:min(100%,370px);
      width:min(100%,560px);
      display:flex;
      flex-direction:column;
      gap:0;
      border-radius:16px;
      overflow:hidden;
      border:1px solid rgba(12,93,170,.28);
      background:linear-gradient(120deg,#0a74dc 0%,#1289ff 52%,#0b74de 100%);
      background-size:180% 180%;
      box-shadow:0 10px 24px rgba(12,78,143,.28);
      transition:box-shadow .2s ease;
    }

    .run-main-control.settings-open{
      box-shadow:0 16px 34px rgba(12,78,143,.34);
    }

    .run-main-control.needs-upload{
      animation:uploadCtaGlow 3.2s ease-in-out infinite;
    }

    @keyframes uploadCtaGlow{
      0%,100%{
        box-shadow:0 10px 24px rgba(12,78,143,.28);
        background-position:0% 50%;
      }
      50%{
        box-shadow:0 16px 34px rgba(20,105,187,.38);
        background-position:100% 50%;
      }
    }

    .run-main-bar{
      display:grid;
      grid-template-columns:minmax(0,1fr) 56px;
      align-items:stretch;
    }

    #runBtn{
      min-height:56px;
      font-size:1.05rem;
      font-weight:740;
      padding:12px 20px;
      border-radius:0;
      border:0;
      border-right:1px solid rgba(255,255,255,.22);
      letter-spacing:.01em;
      background:transparent;
      color:#fff;
      box-shadow:none;
    }

    #runBtn:hover{
      background:rgba(255,255,255,.11);
      box-shadow:none;
      transform:none;
    }

    #runBtn:disabled{
      background:transparent;
      color:#dfe9f7;
      opacity:.86;
      box-shadow:none;
    }

    .run-settings-toggle{
      width:56px;
      min-height:56px;
      border:0;
      border-left:1px solid rgba(255,255,255,.22);
      background:transparent;
      color:#fff;
      display:flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      font-size:1.18rem;
      font-weight:700;
      box-shadow:none;
      user-select:none;
      transition:background .14s ease,color .14s ease;
    }

    .run-settings-toggle:hover,
    .run-main-control.settings-open .run-settings-toggle{
      background:rgba(255,255,255,.14);
      box-shadow:none;
      transform:none;
    }

    .run-settings-toggle:focus-visible{
      outline:none;
      box-shadow:inset 0 0 0 2px rgba(255,255,255,.5);
    }

    .run-settings-panel{
      background:rgba(250,253,255,.97);
      border-top:1px solid rgba(192,209,231,.92);
      max-height:0;
      opacity:0;
      visibility:hidden;
      overflow:hidden;
      padding:0 14px;
      display:flex;
      flex-direction:column;
      gap:12px;
      transition:max-height .26s ease,opacity .18s ease,padding .18s ease,visibility 0s linear .26s;
    }

    .run-main-control.settings-open .run-settings-panel{
      max-height:440px;
      opacity:1;
      visibility:visible;
      padding:14px;
      transition-delay:0s;
    }

    .run-settings-panel .quick-settings{
      margin:0;
      display:flex;
      flex-direction:column;
      align-items:stretch;
      gap:6px;
    }

    .run-settings-panel .quick-settings label{
      margin:0;
      font-size:.84rem;
      color:#4e5b70;
    }

    .run-settings-panel .quick-preset-native{
      display:none !important;
    }

    .run-settings-panel .quick-preset-buttons{
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:8px;
    }

    .run-settings-panel .quick-preset-btn{
      min-height:40px;
      padding:8px 10px;
      border-radius:12px;
      border:1px solid #c5d5ea;
      background:#f3f7fc;
      color:#39597f;
      font-size:.8rem;
      font-weight:700;
      letter-spacing:.005em;
      box-shadow:none;
      transform:none;
      cursor:pointer;
    }

    .run-settings-panel .quick-preset-btn:hover{
      background:#e8f1ff;
      border-color:#9eb9dc;
      box-shadow:none;
      transform:none;
      filter:none;
    }

    .run-settings-panel .quick-preset-btn.active{
      background:linear-gradient(135deg,#0b78e1 0%,#1290ff 100%);
      border-color:#0b78e1;
      color:#fff;
    }

    .run-settings-panel .quick-preset-btn:focus-visible{
      outline:none;
      box-shadow:0 0 0 3px rgba(10,132,255,.22);
    }

    .run-settings-panel .advanced-settings{
      margin:0;
      border:0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
      padding:0;
    }

    .run-settings-panel .controls{
      margin:0;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:10px;
    }

    .run-settings-panel .param-field{
      border:0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
      padding:0;
    }

    .run-settings-panel .param-field label{
      font-size:.82rem;
      color:#516c8c;
      margin-bottom:5px;
      font-weight:700;
    }

    .run-settings-panel input[type="number"]{
      border-radius:12px;
      min-height:42px;
      background:#fff;
    }

    .drop-zone-preview .drop-zone-preview-nav{
      background:rgba(245,250,255,.94);
      border:1px solid rgba(177,192,212,.92);
      box-shadow:0 4px 10px rgba(16,37,63,.12);
      border-radius:999px;
      transform:translateY(-50%);
      filter:none;
    }

    .drop-zone-preview .drop-zone-preview-nav:hover{
      background:rgba(236,245,255,.97);
      box-shadow:0 6px 14px rgba(16,37,63,.14);
      transform:translateY(-50%);
      filter:none;
    }

    .drop-zone-preview .drop-zone-preview-nav:disabled{
      opacity:.35 !important;
      pointer-events:none !important;
      background:rgba(241,246,252,.9);
      border-color:rgba(195,206,222,.9);
      box-shadow:none;
    }

    .run-filter-btn{
      color:#52627a;
      background:rgba(255,255,255,.86);
    }

    .run-filter-btn:hover{
      border-color:rgba(152,174,201,.86);
      background:rgba(247,251,255,.95);
      transform:none;
      box-shadow:none;
    }

    .run-filter-btn.active{
      background:#0a84ff;
      color:#fff;
      border-color:#0a84ff;
    }

    input[type="number"],
    select{
      border:1px solid rgba(179,194,214,.95);
      background:rgba(255,255,255,.92);
    }

    input[type="number"]:focus,
    select:focus{
      border-color:#0a84ff;
      box-shadow:0 0 0 3px rgba(10,132,255,.13);
    }

    .progress-track{
      border:0;
      background:rgba(235,240,246,.9);
      box-shadow:none;
    }

    .progress-bar{
      background:linear-gradient(90deg,#0a84ff 0%, #3da2ff 100%);
    }

    .pairing-hint,
    .preview-meta,
    #status,
    .text-diff-count,
    .run-sub{
      color:#657186;
    }

    .workspace-shell{
      margin:0;
      display:grid;
      grid-template-columns:var(--workspace-left-col) minmax(0,1fr) var(--workspace-right-col);
      gap:var(--workspace-gap);
      align-items:stretch;
      min-height:0;
      height:100%;
      overflow:visible;
    }

    .workspace-main{
      min-width:0;
      min-height:0;
      height:calc(100% + var(--workspace-main-lift));
      margin-top:calc(var(--workspace-main-lift) * -1);
      grid-column:2;
      grid-row:1;
      display:flex;
      flex-direction:column;
      overflow:hidden;
    }

    .results-shell{
      min-width:0;
      min-height:0;
      flex:1 1 auto;
      margin:0;
      display:flex;
      flex-direction:column;
      overflow:hidden;
    }

    #resultsSection{
      min-width:0;
      min-height:0;
      height:100%;
      margin:0;
      display:flex;
      flex-direction:column;
      overflow:hidden;
    }

    .results-sidebar{
      position:relative;
      top:auto;
      grid-column:1;
      grid-row:1;
      width:100%;
      height:100%;
      max-height:100%;
      min-height:248px;
      display:flex;
      flex-direction:column;
      padding:14px 13px;
      border:none;
      border-radius:16px;
      background:rgba(246,250,255,.9);
      box-shadow:0 14px 28px rgba(15,23,42,.12);
      backdrop-filter:blur(8px) saturate(112%);
      -webkit-backdrop-filter:blur(8px) saturate(112%);
      color:#425d7f;
      z-index:34;
      overflow:hidden;
      align-self:stretch;
    }

    .results-sidebar-top{
      display:flex;
      align-items:center;
      justify-content:flex-start;
      gap:8px;
      margin-bottom:8px;
    }

    .ad-rail{
      position:relative;
      top:auto;
      grid-column:3;
      grid-row:1;
      width:100%;
      height:calc(100% + var(--workspace-main-lift));
      max-height:none;
      margin-top:calc(var(--workspace-main-lift) * -1);
      min-height:248px;
      display:flex;
      flex-direction:column;
      padding:14px 13px;
      border:none;
      border-radius:16px;
      background:rgba(246,250,255,.9);
      box-shadow:0 14px 28px rgba(15,23,42,.12);
      backdrop-filter:blur(8px) saturate(112%);
      -webkit-backdrop-filter:blur(8px) saturate(112%);
      color:#425d7f;
      z-index:34;
      overflow:hidden;
      align-self:stretch;
    }

    .ad-rail-title{
      margin:0 0 8px;
      font-size:.94rem;
      line-height:1.2;
      font-weight:760;
      color:#1d3d66;
    }

    .ad-rail-note{
      margin:0 0 10px;
      font-size:.8rem;
      line-height:1.35;
      color:#60728a;
    }

    .ad-rail-slot{
      min-height:0;
      flex:1 1 auto;
      border:1px dashed rgba(126,156,191,.75);
      border-radius:12px;
      background:rgba(255,255,255,.62);
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
      padding:10px;
    }

    .ad-rail-slot-size{
      font-size:.82rem;
      font-weight:700;
      color:#5b7393;
      letter-spacing:.01em;
    }

    .legal-footer-link{
      border:0;
      background:transparent;
      box-shadow:none;
      color:#7a8da8;
      padding:0;
      border-radius:6px;
      font-size:.72rem;
      font-weight:600;
      line-height:1.2;
      cursor:pointer;
    }

    .legal-footer-link:hover{
      background:transparent;
      box-shadow:none;
      color:#425d7f;
      transform:none;
      filter:none;
    }

    .legal-footer-link:focus-visible{
      outline:2px solid rgba(148,163,184,.45);
      outline-offset:2px;
    }

    .results-sidebar-title{
      margin:0 0 8px;
      font-size:.94rem;
      line-height:1.2;
      font-weight:760;
      color:#1d3d66;
    }

    .results-sidebar-note{
      margin:0 0 10px;
      font-size:.8rem;
      line-height:1.35;
      color:#60728a;
    }

    .results-sidebar .sidebar-export-panel{
      margin:0 0 12px;
      padding:9px 10px 10px;
      border-radius:12px;
      background:rgba(255,255,255,.52);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
    }

    .results-sidebar .sidebar-export-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
      margin-bottom:8px;
    }

    .results-sidebar .sidebar-export-title{
      font-size:.84rem;
      color:#1d3f67;
      font-weight:700;
    }

    .results-sidebar .sidebar-export-btn{
      width:100%;
      min-width:0;
    }

    .results-sidebar .sidebar-export-btn:disabled{
      background:rgba(255,255,255,.93);
      border:1px solid rgba(191,207,226,.96);
      color:#7187a3;
      cursor:not-allowed;
      box-shadow:none;
    }

    .results-sidebar .sidebar-export-meta{
      margin:8px 2px 0;
      font-size:.76rem;
      line-height:1.35;
      color:#60728a;
    }

    .results-sidebar .sidebar-view-mode-panel{
      display:block;
      margin:0 0 12px;
    }

    .results-sidebar .sidebar-view-mode-card{
      display:flex;
      flex-direction:column;
      overflow:hidden;
      border:1px solid rgba(38,59,88,.26);
      border-radius:26px;
      background:rgba(255,255,255,.76);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.84);
    }

    .results-sidebar .sidebar-view-mode-toggle{
      display:none;
      position:relative;
      width:172px;
      min-width:172px;
      height:46px;
      min-height:46px;
      border:2px solid #101828;
      border-radius:999px;
      background:#f8fafc;
      color:#111827;
      padding:0 18px;
      box-shadow:none;
      overflow:hidden;
      transition:background-color .18s ease, color .18s ease, border-color .18s ease;
    }

    .results-sidebar .sidebar-view-mode-toggle-thumb{
      position:absolute;
      top:50%;
      left:2px;
      width:38px;
      height:38px;
      border-radius:999px;
      background:#0b0f16;
      transform:translateY(-50%);
      transition:left .2s ease, background-color .18s ease;
      pointer-events:none;
    }

    .results-sidebar .sidebar-view-mode-toggle-label{
      position:relative;
      z-index:1;
      width:100%;
      text-align:center;
      font-size:.9rem;
      font-weight:780;
      letter-spacing:.06em;
      text-transform:uppercase;
      line-height:1;
      pointer-events:none;
    }

    .results-sidebar .sidebar-view-mode-toggle.is-overlay{
      background:#f8fafc;
      border-color:#0f172a;
      color:#0f172a;
    }

    .results-sidebar .sidebar-view-mode-toggle.is-overlay .sidebar-view-mode-toggle-thumb{
      left:2px;
      background:#0b0f16;
    }

    .results-sidebar .sidebar-view-mode-toggle.is-split{
      background:#0b0f16;
      border-color:#0b0f16;
      color:#f8fafc;
    }

    .results-sidebar .sidebar-view-mode-toggle.is-split .sidebar-view-mode-toggle-thumb{
      left:calc(100% - 40px);
      background:#f8fafc;
    }

    .results-sidebar .sidebar-view-mode-toggle:focus-visible{
      outline:2px solid rgba(37,99,235,.45);
      outline-offset:2px;
    }

    .results-sidebar .sidebar-view-mode-row-docs{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .results-sidebar .sidebar-view-mode-btn{
      width:100%;
      border:0;
      border-radius:0;
      background:transparent;
      color:#162a43;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
      padding:14px 12px;
      box-shadow:none;
      transform:none;
      font-family:inherit;
      transition:background-color .16s ease,color .16s ease;
      appearance:none;
    }

    .results-sidebar .sidebar-view-mode-row-docs .sidebar-view-mode-btn + .sidebar-view-mode-btn{
      border-left:1px solid rgba(38,59,88,.28);
    }

    .results-sidebar .sidebar-view-mode-row-docs .sidebar-view-mode-btn:first-child{
      border-top-left-radius:25px;
    }

    .results-sidebar .sidebar-view-mode-row-docs .sidebar-view-mode-btn:last-child{
      border-top-right-radius:25px;
    }

    .results-sidebar .sidebar-view-mode-btn-wide{
      min-height:62px;
      border-top:1px solid rgba(38,59,88,.28);
      font-size:1rem;
      font-weight:560;
      letter-spacing:.01em;
    }

    .results-sidebar .sidebar-view-mode-btn-doc{
      min-height:72px;
      font-size:.84rem;
      font-weight:700;
      line-height:1.15;
    }

    .results-sidebar .sidebar-view-mode-doc-name{
      display:-webkit-box;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:2;
      overflow:hidden;
      max-width:100%;
      overflow-wrap:anywhere;
      word-break:break-word;
    }

    .results-sidebar .sidebar-view-mode-card > .sidebar-view-mode-btn:last-child{
      border-bottom-left-radius:25px;
      border-bottom-right-radius:25px;
    }

    .results-sidebar .sidebar-view-mode-btn:hover{
      background:rgba(237,244,252,.98);
      filter:none;
      transform:none;
      box-shadow:none;
    }

    .results-sidebar .sidebar-view-mode-btn.active{
      background:rgba(18,64,116,.15);
      color:#103559;
      box-shadow:inset 0 0 0 999px rgba(18,64,116,.15);
    }

    .results-sidebar .sidebar-view-mode-btn:focus-visible{
      outline:2px solid rgba(10,132,255,.4);
      outline-offset:-2px;
      position:relative;
      z-index:1;
    }

    .results-sidebar .sidebar-zoom-panel{
      margin:0 0 12px;
      padding:9px 10px 10px;
      border-radius:12px;
      background:rgba(255,255,255,.52);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
    }

    .results-sidebar .sidebar-zoom-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
      margin-bottom:8px;
    }

    .results-sidebar .sidebar-zoom-title{
      font-size:.84rem;
      color:#1d3f67;
      font-weight:700;
    }

    .results-sidebar .sidebar-sync-btn{
      width:100%;
      min-width:0;
    }

    .results-sidebar .sidebar-sync-btn.blocked,
    .results-sidebar .sidebar-sync-btn:disabled{
      background:rgba(255,255,255,.93);
      border-color:rgba(191,207,226,.96);
      color:#7187a3;
      cursor:not-allowed;
    }

    .results-sidebar .sidebar-visibility-controls{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:8px;
      margin:0 0 10px;
    }

    .results-sidebar .sidebar-visibility-btn{
      min-height:32px;
      border:1px solid rgba(176,194,217,.95);
      border-radius:10px;
      background:rgba(255,255,255,.92);
      color:#2f547c;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:6px;
      padding:6px 8px;
      font-size:.75rem;
      font-weight:700;
      cursor:pointer;
    }

    .results-sidebar .sidebar-visibility-btn:hover{
      background:rgba(244,250,255,.98);
      border-color:rgba(132,166,203,.95);
      filter:none;
      transform:none;
      box-shadow:none;
    }

    .results-sidebar .sidebar-visibility-btn:focus-visible{
      outline:2px solid rgba(10,132,255,.45);
      outline-offset:2px;
    }

    .results-sidebar .sidebar-visibility-btn.is-off{
      background:rgba(239,244,250,.9);
      border-color:rgba(188,205,224,.96);
      color:#6a7f99;
    }

    .results-sidebar .sidebar-visibility-icon{
      width:14px;
      height:14px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      flex:none;
    }

    .results-sidebar .sidebar-visibility-icon svg{
      width:14px;
      height:14px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
      pointer-events:none;
    }

    .results-sidebar .sidebar-visibility-icon-off{
      display:none;
    }

    .results-sidebar .sidebar-visibility-btn.is-off .sidebar-visibility-icon-on{
      display:none;
    }

    .results-sidebar .sidebar-visibility-btn.is-off .sidebar-visibility-icon-off{
      display:inline-flex;
    }

    .results-sidebar .sidebar-visibility-label{
      line-height:1;
      white-space:nowrap;
    }

    .results-sidebar .sidebar-section-title-wrap{
      display:flex;
      align-items:center;
      gap:7px;
      min-width:0;
      flex:1 1 auto;
    }

    .results-sidebar .sidebar-inline-visibility-btn{
      width:24px;
      min-width:24px;
      height:24px;
      min-height:24px;
      padding:0;
      gap:0;
      border-radius:999px;
      flex:none;
    }

    .results-sidebar .sidebar-inline-visibility-btn .sidebar-visibility-icon{
      width:13px;
      height:13px;
    }

    .results-sidebar .sidebar-inline-visibility-btn .sidebar-visibility-icon svg{
      width:13px;
      height:13px;
    }

    .results-sidebar .sidebar-markers-body,
    .results-sidebar .sidebar-text-diff .text-diff-body{
      display:flex;
      flex-direction:column;
      gap:6px;
    }

    .results-legend-top{
      margin:8px 0 10px;
      padding:0;
      border:0;
      background:transparent;
      box-shadow:none;
    }

    .results-legend-top .legend-controls{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:10px 14px;
      align-items:start;
    }

    .results-legend-top .legend-pill-control{
      --level:100;
      --legend-color:#2e5da3;
      --legend-dot-size:42px;
      --legend-gap:12px;
      display:flex;
      flex-direction:column;
      gap:6px;
      min-width:0;
    }

    .results-legend-top .legend-pill-control-new{--legend-color:#1cb45f}
    .results-legend-top .legend-pill-control-removed{--legend-color:#dc2d39}

    .results-legend-top .legend-pill-doc{
      display:block;
      max-width:100%;
      font-size:.84rem;
      line-height:1.2;
      color:#1f2a36;
      font-weight:600;
      margin-left:2px;
      white-space:normal;
      overflow-wrap:anywhere;
      word-break:break-word;
    }

    .results-legend-top .legend-pill{
      position:relative;
      display:flex;
      align-items:center;
      gap:var(--legend-gap);
      min-height:var(--legend-dot-size);
      padding:0;
      border:0;
      background:transparent;
      box-shadow:none;
      cursor:ew-resize;
      user-select:none;
      touch-action:none;
      overflow:visible;
    }

    .results-legend-top .legend-pill::before{
      content:"";
      position:absolute;
      left:calc(var(--legend-dot-size) + var(--legend-gap));
      right:0;
      top:50%;
      transform:translateY(-50%);
      height:var(--legend-dot-size);
      border-radius:999px;
      background:linear-gradient(
        90deg,
        var(--legend-color) 0%,
        var(--legend-color) calc(var(--level) * 1%),
        #d0d2d6 calc(var(--level) * 1%),
        #d0d2d6 100%
      );
      z-index:1;
      pointer-events:none;
    }

    .results-legend-top .legend-pill > *{
      position:relative;
      z-index:2;
    }

    .results-legend-top .legend-pill-percent{
      width:var(--legend-dot-size);
      min-width:var(--legend-dot-size);
      height:var(--legend-dot-size);
      border-radius:50%;
      border:0;
      background:var(--legend-color);
      padding:0;
      font-size:0;
      line-height:0;
      color:transparent;
      text-indent:-9999px;
      overflow:hidden;
      box-shadow:none;
      pointer-events:none;
    }

    .results-legend-top .legend-pill-range{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      margin:0;
      opacity:0;
      pointer-events:none;
      accent-color:var(--legend-color);
    }

    .results-legend-top .legend-pill-color-wrap{
      position:absolute;
      left:0;
      top:50%;
      transform:translateY(-50%);
      width:var(--legend-dot-size);
      height:var(--legend-dot-size);
      display:block;
      border-radius:50%;
      border:0;
      background:transparent;
      padding:0;
      overflow:hidden;
      cursor:pointer;
      z-index:3;
    }

    .results-legend-top .legend-pill-color-text{
      display:none;
    }

    .results-legend-top .legend-pill-color{
      width:100%;
      height:100%;
      border:0;
      border-radius:50%;
      padding:0;
      background:transparent;
      opacity:0;
      cursor:pointer;
    }

    .results-legend-top .legend-pill-color::-webkit-color-swatch-wrapper{
      padding:0;
    }

    .results-legend-top .legend-pill-color::-webkit-color-swatch{
      border:0;
      border-radius:50%;
    }

    .results-legend-top .legend-pill-color::-moz-color-swatch{
      border:0;
      border-radius:50%;
    }

    .results-sidebar .sidebar-legend{
      margin:2px 0 0;
      padding:0;
      border:0;
      background:transparent;
      box-shadow:none;
    }

    .results-sidebar .legend-controls{
      display:flex;
      flex-direction:column;
      gap:14px;
    }

    .results-sidebar .legend-pill-control{
      --level:100;
      --legend-color:#2e5da3;
      --legend-dot-size:64px;
      --legend-gap:20px;
      display:flex;
      flex-direction:column;
      gap:8px;
    }

    .results-sidebar .legend-pill-control-new{--legend-color:#1cb45f}
    .results-sidebar .legend-pill-control-removed{--legend-color:#dc2d39}

    .results-sidebar .legend-pill-doc{
      display:block;
      max-width:100%;
      font-size:.9rem;
      line-height:1.2;
      color:#1f2a36;
      font-weight:600;
      margin-left:2px;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }

    .results-sidebar .legend-pill{
      position:relative;
      display:flex;
      align-items:center;
      gap:var(--legend-gap);
      min-height:var(--legend-dot-size);
      padding:0;
      border:0;
      background:transparent;
      box-shadow:none;
      cursor:ew-resize;
      user-select:none;
      touch-action:none;
      overflow:visible;
    }

    .results-sidebar .legend-pill::before{
      content:"";
      position:absolute;
      left:calc(var(--legend-dot-size) + var(--legend-gap));
      right:0;
      top:50%;
      transform:translateY(-50%);
      height:var(--legend-dot-size);
      border-radius:999px;
      background:linear-gradient(
        90deg,
        var(--legend-color) 0%,
        var(--legend-color) calc(var(--level) * 1%),
        #d0d2d6 calc(var(--level) * 1%),
        #d0d2d6 100%
      );
      z-index:1;
      pointer-events:none;
    }

    .results-sidebar .legend-pill > *{
      position:relative;
      z-index:2;
    }

    .results-sidebar .legend-pill-percent{
      width:var(--legend-dot-size);
      min-width:var(--legend-dot-size);
      height:var(--legend-dot-size);
      border-radius:50%;
      border:0;
      background:var(--legend-color);
      padding:0;
      font-size:0;
      line-height:0;
      color:transparent;
      text-indent:-9999px;
      overflow:hidden;
      box-shadow:none;
      pointer-events:none;
    }

    .results-sidebar .legend-pill-range{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      margin:0;
      opacity:0;
      pointer-events:none;
      accent-color:var(--legend-color);
    }

    .results-sidebar .legend-pill-color-wrap{
      position:absolute;
      left:0;
      top:50%;
      transform:translateY(-50%);
      width:var(--legend-dot-size);
      height:var(--legend-dot-size);
      display:block;
      border-radius:50%;
      border:0;
      background:transparent;
      padding:0;
      overflow:hidden;
      cursor:pointer;
      z-index:3;
    }

    .results-sidebar .legend-pill-color-text{
      display:none;
    }

    .results-sidebar .legend-pill-color{
      width:100%;
      height:100%;
      border:0;
      border-radius:50%;
      padding:0;
      background:transparent;
      opacity:0;
      cursor:pointer;
    }

    .results-sidebar .legend-pill-color::-webkit-color-swatch-wrapper{
      padding:0;
    }

    .results-sidebar .legend-pill-color::-webkit-color-swatch{
      border:0;
      border-radius:50%;
    }

    .results-sidebar .legend-pill-color::-moz-color-swatch{
      border:0;
      border-radius:50%;
    }

    .results-sidebar .sidebar-text-diff{
      margin-top:12px;
      padding:8px;
      border:0;
      background:rgba(255,255,255,.52);
      box-shadow:none;
    }

    .results-sidebar .sidebar-text-diff .text-diff-head{
      margin-bottom:6px;
      gap:6px;
    }

    .results-sidebar .sidebar-text-diff .text-diff-title{
      font-size:.84rem;
    }

    .results-sidebar .sidebar-text-diff .text-diff-count-total{
      font-size:1.45rem;
      line-height:1;
      color:#18385f;
      font-weight:780;
      letter-spacing:.01em;
    }

    .results-sidebar .sidebar-text-diff .text-diff-empty{
      font-size:.75rem;
      color:#5f738d;
      line-height:1.3;
    }

    .results-sidebar .sidebar-text-diff .text-diff-list{
      max-height:260px;
      gap:5px;
    }

    .results-sidebar .sidebar-text-diff .text-diff-item{
      padding:6px 7px;
      font-size:.77rem;
    }

    .results-sidebar .sidebar-text-diff .text-diff-page{
      font-size:.66rem;
    }

    .results-sidebar .sidebar-text-diff .text-diff-preview{
      font-size:.74rem;
    }

    .results-sidebar .sidebar-diff-box{
      margin-top:10px;
      padding:8px 10px;
      border-radius:10px;
      background:rgba(255,255,255,.58);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
    }

    .results-sidebar .sidebar-diff-label{
      font-size:.74rem;
      line-height:1.2;
      color:#63768f;
      font-weight:600;
      margin-bottom:4px;
    }

    .results-sidebar .sidebar-diff-value{
      font-size:1.28rem;
      line-height:1.1;
      color:#18385f;
      font-weight:760;
      letter-spacing:.01em;
    }

    .results-sidebar .sidebar-markers{
      margin-top:10px;
      padding:8px;
      border-radius:10px;
      background:rgba(255,255,255,.52);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
      display:flex;
      flex:1 1 auto;
      min-height:0;
      flex-direction:column;
      overflow:auto;
      scrollbar-gutter:stable;
    }

    .results-sidebar .sidebar-markers-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
      position:sticky;
      top:0;
      z-index:2;
      margin:-8px -8px 6px;
      padding:8px 8px 6px;
      background:rgba(246,250,255,.94);
      backdrop-filter:blur(6px);
      -webkit-backdrop-filter:blur(6px);
    }

    .results-sidebar .sidebar-markers-title{
      font-size:.84rem;
      color:#1d3f67;
      font-weight:700;
    }

    .results-sidebar .sidebar-markers-count{
      font-size:1.45rem;
      line-height:1;
      color:#18385f;
      font-weight:780;
      letter-spacing:.01em;
    }

    .results-sidebar .sidebar-marker-list{
      display:flex;
      flex-direction:column;
      gap:8px;
      flex:0 0 auto;
      min-height:auto;
      max-height:none;
      overflow:visible;
      padding-right:2px;
    }

    .results-sidebar .marker-list-item{
      display:flex;
      flex-direction:column;
      gap:7px;
      width:100%;
      padding:9px 10px;
      border:1px solid rgba(189,205,224,.85);
      border-radius:12px;
      background:rgba(255,255,255,.72);
      box-shadow:none;
      text-align:left;
      transform:none;
      filter:none;
    }

    .results-sidebar .marker-list-item:hover{
      background:rgba(245,250,255,.92);
      box-shadow:none;
      transform:none;
      filter:none;
    }

    .results-sidebar .marker-list-item:focus-visible{
      outline:2px solid rgba(10,132,255,.45);
      outline-offset:2px;
    }

    .results-sidebar .marker-list-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
    }

    .results-sidebar .marker-list-badges{
      display:flex;
      align-items:center;
      flex-wrap:wrap;
      gap:6px;
      min-width:0;
    }

    .results-sidebar .marker-list-index{
      min-width:34px;
      padding:4px 8px;
      border:1px solid transparent;
      color:#fff;
      font-size:.75rem;
      font-weight:700;
      line-height:1.1;
      box-shadow:none;
      border-radius:999px;
    }

    .results-sidebar .marker-list-kind,
    .results-sidebar .marker-list-side{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-width:24px;
      padding:3px 8px;
      border-radius:999px;
      border:1px solid rgba(182,199,220,.85);
      font-size:.72rem;
      font-weight:760;
      line-height:1.1;
      color:#31506f;
      background:rgba(241,246,252,.92);
      white-space:nowrap;
    }

    .results-sidebar .marker-list-page{
      font-size:.73rem;
      font-weight:700;
      color:#5e7290;
      letter-spacing:.01em;
    }

    .results-sidebar .marker-list-content{
      display:flex;
      flex-direction:column;
      gap:6px;
      min-width:0;
    }

    .results-sidebar .marker-list-text{
      display:inline-block;
      max-width:100%;
      overflow-wrap:anywhere;
      line-height:1.3;
      border-radius:8px;
      padding:4px 7px;
      font-weight:650;
      font-size:.83rem;
    }

    .results-sidebar .marker-object-preview-frame{
      display:flex;
      align-items:center;
      justify-content:center;
      min-height:62px;
      border:1px solid rgba(188,204,223,.88);
      border-radius:10px;
      background:rgba(247,250,254,.9);
      overflow:hidden;
      padding:4px;
    }

    .results-sidebar .marker-object-preview-canvas{
      display:block;
      max-width:100%;
      height:auto;
      border-radius:7px;
      background:#fff;
    }

    .results-sidebar .marker-object-preview-note{
      font-size:.78rem;
      font-weight:700;
      color:#7188a5;
    }

    .results-sidebar .sidebar-markers-empty{
      font-size:.75rem;
      color:#5f738d;
      line-height:1.3;
    }

    .results-tabs{
      display:flex;
      align-items:flex-end;
      gap:0;
      flex-wrap:wrap;
      margin:0;
      padding:0;
      border-bottom:0;
    }

    .composer-tab-panel{
      margin:0;
      min-height:0;
      flex:1 1 auto;
      overflow:auto;
      scrollbar-width:none;
      -ms-overflow-style:none;
    }

    .composer-tab-panel::-webkit-scrollbar{
      width:0;
      height:0;
      display:none;
    }

    .composer-tab-panel #uploadCard{
      margin:0;
    }

    .workspace-main > #uploadCard,
    .composer-tab-panel > #uploadCard{
      min-height:0;
      overflow:auto;
      border-top-left-radius:0;
      border-top:0;
      border-left:0;
    }

    .workspace-main > .results-shell > #resultsSection{
      min-height:0;
      border-top-left-radius:0;
      border-top:0;
      border-left:0;
    }

    #history{
      min-height:0;
      flex:1 1 auto;
      overflow:auto;
      padding-right:4px;
      scrollbar-width:none;
      -ms-overflow-style:none;
    }

    #history::-webkit-scrollbar{
      width:0;
      height:0;
      display:none;
    }

    .result-tab{
      position:relative;
      border:0;
      background:rgba(214,225,240,.94);
      color:#2f4d72;
      min-height:36px;
      padding:0 16px 2px;
      border-radius:12px 12px 0 0;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      font-size:.82rem;
      font-weight:700;
      line-height:1;
      cursor:pointer;
      box-shadow:none;
      transform:none;
      max-width:280px;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      user-select:none;
    }

    .result-tab + .result-tab{
      margin-left:12px;
    }

    .result-tab + .result-tab::before{
      content:"";
      position:absolute;
      left:-7px;
      top:9px;
      bottom:7px;
      width:1px;
      background:rgba(130,153,183,.72);
      pointer-events:none;
    }

    .result-tab-composer{
      width:38px;
      min-width:38px;
      max-width:38px;
      padding:0 0 2px;
      font-size:1.16rem;
      font-weight:700;
    }

    .result-tab:not(.active):hover{
      background:rgba(226,236,248,.97);
      filter:none;
      transform:none;
      box-shadow:none;
    }

    .result-tab:focus-visible{
      outline:2px solid rgba(10,132,255,.45);
      outline-offset:2px;
    }

    .result-tab.active{
      background:rgba(255,255,255,.98);
      color:#233f62;
      border-radius:12px 12px 0 0;
      margin-bottom:-1px;
      z-index:2;
    }

    .sidebar-compare-info{
      margin:0 0 10px;
      padding:8px 9px;
      border-radius:10px;
      background:rgba(255,255,255,.58);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
    }

    .sidebar-compare-title{
      font-size:.75rem;
      color:#62758f;
      font-weight:700;
      margin-bottom:5px;
    }

    .sidebar-compare-item{
      font-size:.76rem;
      color:#2f4f75;
      line-height:1.3;
      word-break:break-word;
    }

    .sidebar-compare-item + .sidebar-compare-item{
      margin-top:3px;
    }

    .sidebar-new-compare{
      width:100%;
      margin-top:auto;
      min-height:38px;
      border-radius:11px;
      background:linear-gradient(135deg,#0b78e1 0%,#1290ff 100%);
      color:#fff;
      font-size:.82rem;
      font-weight:700;
      letter-spacing:.01em;
      box-shadow:none;
      transform:none;
    }

    .sidebar-new-compare:hover{
      background:linear-gradient(135deg,#0a6fd1 0%,#0f83eb 100%);
      box-shadow:none;
      transform:none;
      filter:none;
    }

    .run-block{
      background:transparent;
      border:0;
      box-shadow:none;
      padding:0;
    }

    .result{
      background:transparent;
      border:0;
      box-shadow:none;
      padding:0;
    }

    .imgbox{
      --imgbox-sticky-shell-offset:0px;
      border:0;
      padding:0;
      background:transparent;
      box-shadow:none;
    }

    .imgbox-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
      margin:0 0 8px;
      position:sticky;
      top:0;
      z-index:8;
      padding:4px 0 10px;
      background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.98) 78%, rgba(255,255,255,0) 100%);
      backdrop-filter:blur(4px);
      -webkit-backdrop-filter:blur(4px);
    }

    .imgbox-head.has-control-slot{
      flex-direction:column;
      align-items:stretch;
      justify-content:flex-start;
      gap:8px;
    }

    .imgbox h3{
      margin:0;
      font-size:.95rem;
      color:#3d5f86;
      line-height:1.2;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }

    .doc-title-row{
      display:flex;
      align-items:center;
      gap:8px;
      min-width:0;
      flex:1 1 auto;
    }

    .doc-title-row > h3,
    .doc-title-row > .merged-doc-name{
      min-width:0;
      flex:1 1 auto;
    }

    .doc-visibility-toggle{
      width:28px;
      height:28px;
      min-width:28px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border:1px solid #c6d4e6;
      border-radius:999px;
      background:#f7fbff;
      color:#4f6f97;
      cursor:pointer;
      transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
      padding:0;
      flex:0 0 auto;
    }

    .doc-visibility-toggle:hover{
      background:#eef5fd;
      border-color:#9cb6d5;
      color:#2f557f;
      transform:translateY(-1px);
    }

    .doc-visibility-toggle.is-hidden{
      background:#eef2f6;
      border-color:#d0dae6;
      color:#8aa0bd;
    }

    .doc-visibility-toggle svg{
      width:15px;
      height:15px;
      fill:none;
      stroke:currentColor;
      stroke-width:1.9;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

    .imgbox-merged .imgbox-head{
      flex-direction:column;
      align-items:stretch;
      justify-content:flex-start;
      gap:8px;
      margin:0 0 8px;
    }

    .imgbox-merged .imgbox-head > h3{
      white-space:normal;
      overflow:visible;
      text-overflow:clip;
    }

    .merged-docs{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:8px 12px;
      min-width:0;
      width:100%;
      align-items:start;
    }

    .merged-doc{
      display:flex;
      flex-direction:column;
      gap:8px;
      min-width:0;
      align-items:stretch;
    }

    .merged-doc-name{
      margin:0;
      font-size:.95rem;
      color:#3d5f86;
      line-height:1.2;
      font-weight:700;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }

    .imgbox.is-doc-hidden .imgbox-head h3,
    .merged-doc.is-doc-hidden .merged-doc-name{
      color:#8aa0bd;
    }

    .merged-doc.is-doc-hidden .legend-inline-control .legend-doc-opacity-group{
      opacity:.45;
    }

    .imgbox.is-doc-hidden .legend-inline-control .legend-doc-opacity-group{
      opacity:.45;
    }

    .merged-doc-control-slot{
      min-height:30px;
      width:100%;
    }

    .merged-doc-control-slot .legend-inline-control{
      margin:0;
      width:100%;
    }

    .imgbox-doc-control-slot{
      min-height:30px;
    }

    .imgbox-doc-control-slot .legend-inline-control{
      margin:0;
    }

    .imgbox-doc-control-slot.is-empty{
      display:none;
    }

    .mobile-doc-controls-handle{
      display:none;
    }

    .mobile-doc-controls-drawer{
      min-width:0;
    }

    .imgbox-doc-control-slot:empty,
    .merged-doc-control-slot:empty{
      display:none;
    }

    .legend-inline-control{
      --level:100;
      --legend-color:#2e5da3;
      --legend-dot-size:30px;
      --legend-gap:8px;
      display:flex;
      flex-direction:column;
      gap:4px;
      margin:0 0 6px;
      min-width:0;
    }

    .legend-inline-control.legend-pill-control-new{--legend-color:#1cb45f}
    .legend-inline-control.legend-pill-control-removed{--legend-color:#dc2d39}

    .legend-inline-control .legend-pill-doc{
      display:none;
    }

    .legend-inline-control .legend-control-row{
      display:flex;
      align-items:center;
      gap:8px;
      min-width:0;
    }

    .legend-inline-control .legend-doc-opacity-group{
      display:flex;
      align-items:center;
      gap:8px;
      flex:0 0 42%;
      min-width:120px;
    }

    .legend-inline-control .legend-doc-opacity{
      --doc-level:100;
      position:relative;
      display:flex;
      align-items:center;
      justify-content:flex-end;
      flex:1 1 auto;
      min-width:0;
      min-height:var(--legend-dot-size);
      padding:0 12px;
      border:1px solid rgba(60,79,101,.78);
      border-radius:999px;
      background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,249,252,.98));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
      cursor:ew-resize;
      user-select:none;
      touch-action:none;
      overflow:hidden;
    }

    .legend-inline-control .legend-doc-opacity::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      background:linear-gradient(
        90deg,
        rgba(74,90,111,.16) 0%,
        rgba(74,90,111,.16) calc(var(--doc-level) * 1%),
        rgba(255,255,255,0) calc(var(--doc-level) * 1%),
        rgba(255,255,255,0) 100%
      );
      pointer-events:none;
    }

    .legend-inline-control .legend-doc-opacity > *{
      position:relative;
      z-index:1;
    }

    .legend-inline-control .legend-doc-opacity-toggle{
      position:relative;
      left:auto;
      top:auto;
      width:28px;
      height:28px;
      min-width:28px;
      z-index:2;
    }

    .legend-inline-control .legend-doc-opacity-toggle:hover{
      transform:none;
    }

    .legend-inline-control .legend-doc-opacity-value{
      font-size:.74rem;
      line-height:1;
      font-weight:700;
      color:#506a86;
      letter-spacing:.01em;
      white-space:nowrap;
    }

    .legend-inline-control .legend-doc-opacity-range{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      margin:0;
      opacity:0;
      pointer-events:none;
    }

    .legend-inline-control .legend-pill{
      position:relative;
      display:flex;
      align-items:center;
      flex:1 1 auto;
      min-width:0;
      gap:var(--legend-gap);
      min-height:var(--legend-dot-size);
      padding:0;
      border:0;
      background:transparent;
      box-shadow:none;
      cursor:ew-resize;
      user-select:none;
      touch-action:none;
      overflow:visible;
    }

    .legend-inline-control .legend-pill::before{
      content:"";
      position:absolute;
      left:calc(var(--legend-dot-size) + var(--legend-gap));
      right:0;
      top:50%;
      transform:translateY(-50%);
      height:var(--legend-dot-size);
      border-radius:999px;
      background:linear-gradient(
        90deg,
        var(--legend-color) 0%,
        var(--legend-color) calc(var(--level) * 1%),
        #d0d2d6 calc(var(--level) * 1%),
        #d0d2d6 100%
      );
      z-index:1;
      pointer-events:none;
    }

    .legend-inline-control .legend-pill > *{
      position:relative;
      z-index:2;
    }

    .legend-inline-control .legend-pill-percent{
      width:var(--legend-dot-size);
      min-width:var(--legend-dot-size);
      height:var(--legend-dot-size);
      border-radius:50%;
      border:0;
      background:var(--legend-color);
      padding:0;
      font-size:0;
      line-height:0;
      color:transparent;
      text-indent:-9999px;
      overflow:hidden;
      box-shadow:none;
      pointer-events:none;
    }

    .legend-inline-control .legend-pill-range{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      margin:0;
      opacity:0;
      pointer-events:none;
      accent-color:var(--legend-color);
    }

    .results-legend-top .legend-pill-range,
    .results-sidebar .legend-pill-range,
    .legend-inline-control .legend-pill-range,
    .legend-inline-control .legend-doc-opacity-range{
      -webkit-appearance:none;
      appearance:none;
      background:transparent;
      border:0;
      outline:none;
    }

    .results-legend-top .legend-pill-range::-webkit-slider-thumb,
    .results-sidebar .legend-pill-range::-webkit-slider-thumb,
    .legend-inline-control .legend-pill-range::-webkit-slider-thumb,
    .legend-inline-control .legend-doc-opacity-range::-webkit-slider-thumb{
      -webkit-appearance:none;
      appearance:none;
      width:0;
      height:0;
      border:0;
      background:transparent;
      box-shadow:none;
      opacity:0;
    }

    .results-legend-top .legend-pill-range::-moz-range-thumb,
    .results-sidebar .legend-pill-range::-moz-range-thumb,
    .legend-inline-control .legend-pill-range::-moz-range-thumb,
    .legend-inline-control .legend-doc-opacity-range::-moz-range-thumb{
      width:0;
      height:0;
      border:0;
      background:transparent;
      box-shadow:none;
      opacity:0;
    }

    .results-legend-top .legend-pill-range::-webkit-slider-runnable-track,
    .results-sidebar .legend-pill-range::-webkit-slider-runnable-track,
    .legend-inline-control .legend-pill-range::-webkit-slider-runnable-track,
    .legend-inline-control .legend-doc-opacity-range::-webkit-slider-runnable-track,
    .results-legend-top .legend-pill-range::-moz-range-track,
    .results-sidebar .legend-pill-range::-moz-range-track,
    .legend-inline-control .legend-pill-range::-moz-range-track,
    .legend-inline-control .legend-doc-opacity-range::-moz-range-track{
      background:transparent;
      border:0;
    }

    .legend-inline-control .legend-pill-color-wrap{
      position:absolute;
      left:0;
      top:50%;
      transform:translateY(-50%);
      width:var(--legend-dot-size);
      height:var(--legend-dot-size);
      display:block;
      border-radius:50%;
      border:0;
      background:transparent;
      padding:0;
      overflow:hidden;
      cursor:pointer;
      z-index:3;
    }

    .legend-inline-control .legend-pill-color-text{
      display:none;
    }

    .legend-inline-control .legend-pill-color{
      width:100%;
      height:100%;
      border:0;
      border-radius:50%;
      padding:0;
      background:transparent;
      opacity:0;
      cursor:pointer;
    }

    .legend-inline-control .legend-pill-color::-webkit-color-swatch-wrapper{
      padding:0;
    }

    .legend-inline-control .legend-pill-color::-webkit-color-swatch{
      border:0;
      border-radius:50%;
    }

    .legend-inline-control .legend-pill-color::-moz-color-swatch{
      border:0;
      border-radius:50%;
    }

    .result-canvas-shell{
      position:relative;
      overflow:hidden;
      margin-top:var(--imgbox-sticky-shell-offset,0px);
      border-radius:10px;
      touch-action:pan-x pan-y;
      aspect-ratio:var(--result-canvas-aspect,1 / 1);
      background:#fff;
    }

    .imgbox.is-doc-hidden .result-canvas:not(.result-canvas-overlay){
      opacity:0;
      pointer-events:none;
    }

    .imgbox.is-doc-hidden .result-canvas-shell:not(.is-overlay-only){
      background:#f6f9fc;
      border:1px dashed #c5d3e2;
    }

    .imgbox.is-doc-hidden .result-canvas-shell[data-hidden-label]:not([data-hidden-label=""])::after{
      content:attr(data-hidden-label);
      position:absolute;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:18px;
      text-align:center;
      font-size:.92rem;
      font-weight:700;
      color:#7a8ea8;
      background:linear-gradient(180deg, rgba(246,249,252,.94), rgba(239,245,251,.98));
      z-index:3;
      pointer-events:none;
    }

    .result-canvas-viewport{
      position:relative;
      width:100%;
      height:100%;
      overflow-x:auto;
      overflow-y:scroll;
      scrollbar-gutter:stable both-edges;
      border-radius:inherit;
      cursor:grab;
    }

    .result-focus-overlay{
      position:absolute;
      z-index:5;
      pointer-events:none;
      border-radius:18px;
      border:0;
      background:rgba(255,255,255,.16);
      box-shadow:
        0 0 0 9999px rgba(9,24,43,.16),
        0 14px 34px rgba(16,44,78,.14),
        inset 0 0 28px rgba(255,255,255,.5);
      opacity:0;
      transform:scale(.96);
      transition:opacity .18s ease, transform .18s ease, left .12s ease, top .12s ease, width .12s ease, height .12s ease;
    }

    .result-focus-overlay::after{
      content:none;
    }

    .result-focus-overlay.is-active{
      opacity:1;
      transform:scale(1);
    }

    .result-canvas-shell.is-zoomed{
      cursor:grab;
    }

    .result-canvas-shell.is-zoomed .result-canvas,
    .result-canvas-shell.is-zoomed .result-canvas-viewport{
      cursor:grab;
    }

    .result-canvas-shell.is-dragging,
    .result-canvas-shell.is-dragging .result-canvas,
    .result-canvas-shell.is-dragging .result-canvas-viewport{
      cursor:grabbing;
      user-select:none;
    }

    .img-fullscreen-btn{
      width:34px;
      height:34px;
      padding:0;
      border:1px solid rgba(168,188,214,.95);
      border-radius:10px;
      background:rgba(255,255,255,.96);
      color:#30557e;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      flex:none;
    }

    .result-canvas-shell .img-fullscreen-btn{
      position:absolute;
      top:12px;
      right:12px;
      z-index:4;
      box-shadow:0 4px 12px rgba(17,58,98,.16);
    }

    .imgs > .imgbox-merged{
      display:none;
    }

    .imgs.merge-view{
      grid-template-columns:minmax(0,1fr);
    }

    .imgs.merge-view > .imgbox-left,
    .imgs.merge-view > .imgbox-right{
      display:none;
    }

    .imgs.merge-view > .imgbox-merged{
      display:block;
      grid-column:1 / -1;
    }

    .imgs.merge-view > .imgbox-merged .result-canvas-shell{
      width:100%;
      max-width:100%;
      margin-left:auto;
      aspect-ratio:var(--result-canvas-aspect,1 / 1);
    }

    .imgs.single-view{
      grid-template-columns:minmax(0,1fr);
    }

    .imgs.single-view > .imgbox{
      display:none;
    }

    .imgs.single-view > .imgbox.is-expanded{
      display:block;
      grid-column:1 / -1;
    }

    .img-fullscreen-btn:hover{
      background:rgba(244,250,255,.98);
      border-color:rgba(128,158,196,.95);
      filter:none;
      transform:none;
      box-shadow:none;
    }

    .img-fullscreen-btn svg{
      width:17px;
      height:17px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
      pointer-events:none;
    }

    .result-canvas{
      border:1px solid rgba(182,199,220,.9);
      cursor:grab;
      transform-origin:top left;
    }

    .result-canvas-overlay{
      position:absolute;
      left:0;
      top:0;
      z-index:2;
      pointer-events:none;
      background:transparent;
      border:0;
    }

    .result-canvas-overlay-boxes{
      z-index:3;
    }

    .result-canvas-overlay-base{
      z-index:1;
      border:0;
    }

    .result-top-controls{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      margin:0 0 8px;
    }

    .result.has-merge-view .result-top-controls{
      justify-content:flex-end;
    }

    .result.has-single-view .result-top-controls{
      justify-content:flex-end;
    }

    .result-sync-controls{
      display:flex;
      align-items:center;
      min-height:34px;
    }

    .result-sync-controls[hidden]{
      display:none !important;
    }

    .result:has(.imgs.single-view) .result-sync-controls{
      display:none !important;
    }

    .result.has-single-view .result-sync-controls{
      display:none !important;
    }

    .result-sync-btn{
      min-width:70px;
      height:34px;
      padding:0 12px;
      border:1px solid rgba(173,193,217,.95);
      border-radius:10px;
      background:rgba(255,255,255,.95);
      color:#365982;
      font-weight:700;
      font-size:.82rem;
      cursor:pointer;
      display:inline-flex;
      align-items:center;
      justify-content:center;
    }

    .result-sync-btn:hover{
      background:rgba(244,250,255,.98);
      border-color:rgba(132,166,203,.95);
      filter:none;
      transform:none;
      box-shadow:none;
    }

    .result-sync-btn.active{
      background:#2e9b58;
      border-color:#2b8f52;
      color:#fff;
    }

    .result-sync-btn.active:hover{
      background:#27874c;
      border-color:#247d46;
    }

    .result-sync-btn.blocked,
    .result-sync-btn:disabled{
      background:rgba(255,255,255,.93);
      border-color:rgba(191,207,226,.96);
      color:#7187a3;
      cursor:not-allowed;
      opacity:1;
    }

    .result-sync-btn.blocked:hover,
    .result-sync-btn:disabled:hover{
      background:rgba(255,255,255,.93);
      border-color:rgba(191,207,226,.96);
    }

    .result-layout-controls{
      display:flex;
      flex-wrap:wrap;
      gap:6px;
      justify-content:flex-end;
      margin:0;
      padding:0;
      border:0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
    }

    .result-layout-btn{
      width:auto;
      min-width:76px;
      height:36px;
      padding:0 12px;
      border:1px solid rgba(173,193,217,.95);
      border-radius:10px;
      background:rgba(255,255,255,.95);
      color:#365982;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      font-size:.78rem;
      font-weight:700;
      letter-spacing:.01em;
      line-height:1;
    }

    .result-layout-btn[hidden]{
      display:none !important;
    }

    .result-layout-btn:hover{
      background:rgba(245,247,250,.98);
      border-color:rgba(151,170,192,.95);
      filter:none;
      transform:none;
      box-shadow:none;
    }

    .result-layout-btn.active{
      background:rgba(238,244,248,.98);
      border-color:rgba(150,168,188,.95);
      color:#233e59;
    }

    .result-layout-btn svg{
      width:17px;
      height:17px;
      stroke:currentColor;
      fill:none;
      stroke-width:1.9;
      stroke-linecap:round;
      stroke-linejoin:round;
      pointer-events:none;
    }

    .result.force-split .imgs{
      grid-template-columns:minmax(460px,1fr) minmax(460px,1fr);
      overflow-x:auto;
      align-items:start;
    }

    .result.force-split .imgs.merge-view{
      grid-template-columns:minmax(0,1fr);
      overflow-x:visible;
    }

    .cat-badge.cat-identical{background:rgba(229,247,238,.95)}
    .cat-badge.cat-minor{background:rgba(255,244,226,.95)}
    .cat-badge.cat-critical{background:rgba(255,232,236,.95)}

    .zoom-backdrop{
      background:rgba(18,22,28,.34);
      backdrop-filter:blur(6px);
      -webkit-backdrop-filter:blur(6px);
    }

    .zoom-panel{
      background:rgba(255,255,255,.8);
      border:1px solid rgba(218,225,236,.92);
      box-shadow:
        0 22px 50px rgba(15,23,42,.2),
        inset 0 1px 0 rgba(255,255,255,.86);
      backdrop-filter:blur(20px) saturate(118%);
      -webkit-backdrop-filter:blur(20px) saturate(118%);
    }

    .zoom-toolbar{
      background:rgba(246,248,251,.86);
      border-bottom:1px solid rgba(212,221,234,.9);
    }

    .zoom-content{
      background:linear-gradient(160deg, rgba(242,246,251,.92) 0%, rgba(248,250,252,.92) 100%);
    }

    .zoom-modal.simple .zoom-backdrop{
      background:rgba(229,234,242,.82);
      backdrop-filter:none;
    }

    .zoom-modal.simple .zoom-panel{
      width:min(98vw,1220px);
      height:min(96vh,920px);
      border-radius:16px;
      border:1px solid rgba(191,208,230,.95);
      box-shadow:0 18px 36px rgba(16,37,63,.14);
      background:#eef3f9;
    }

    .zoom-modal.simple .zoom-toolbar{
      display:none;
    }

    .zoom-modal.simple .zoom-content{
      padding:10px;
      background:transparent;
    }

    .zoom-modal.simple .blend-stage{
      display:block;
      width:100%;
      min-width:0;
    }

    .zoom-modal.simple .blend-canvas{
      width:100%;
      max-width:100%;
      height:auto;
      border-radius:10px;
      border:1px solid #b9cde5;
      box-shadow:none;
      background:#fff;
    }

    @media (max-width:840px){
      .merged-docs{
        grid-template-columns:minmax(0,1fr);
      }
    }

    @media (max-width:920px){
      :root{
        --workspace-gap:14px;
        --workspace-left-col:clamp(220px, 25vw, 252px);
        --workspace-right-col:clamp(180px, 20vw, 220px);
        --workspace-main-lift:0px;
      }

      .page-header{
        width:100%;
        flex-direction:column;
        align-items:stretch;
      }

      .page-header-main h1{
        font-size:clamp(1.35rem,7vw,1.95rem);
      }

      .workspace-main{
        margin-top:0;
      }

      .upload-compare-row{
        grid-template-columns:1fr;
        gap:10px;
      }

      .swap-between-btn{
        position:static;
        left:auto;
        top:auto;
        transform:none;
        justify-self:center;
        width:48px;
        height:48px;
      }

      .drop-zone{
        min-height:308px;
      }

      .drop-zone-preview{
        min-height:194px;
        height:194px;
      }

      .actions{
        flex-direction:column;
        align-items:stretch;
      }

      .run-main-control{
        width:100%;
      }

      .run-main-control.settings-open .run-settings-panel{
        max-height:520px;
      }

      .run-settings-panel .quick-preset-buttons{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }

      .results-sidebar{
        top:82px;
        min-height:212px;
      }

      .ad-rail{
        margin-top:0;
        height:100%;
        max-height:100%;
        top:82px;
        min-height:212px;
      }

      .ad-rail-slot{
        min-height:320px;
      }

      .results-legend-top .legend-pill-control{
        --legend-dot-size:38px;
        --legend-gap:10px;
      }

      .results-sidebar .legend-pill-control{
        --legend-dot-size:52px;
        --legend-gap:16px;
      }
    }

    @media (max-width:760px){
      body{
        overflow:auto;
      }

      .wrap{
        height:auto;
        min-height:100dvh;
        overflow:visible;
      }

      .run-settings-panel .controls{
        grid-template-columns:1fr;
      }

      .workspace-shell{
        grid-template-columns:1fr;
        gap:10px;
      }

      .results-sidebar{
        position:static;
        top:auto;
        width:100%;
        min-height:0;
        padding:10px 11px;
      }

      .ad-rail{
        position:static;
        top:auto;
        width:100%;
        min-height:0;
        padding:10px 11px;
      }

      .ad-rail-slot{
        min-height:160px;
      }

      .results-legend-top .legend-controls{
        grid-template-columns:1fr;
        gap:8px;
      }

      .results-legend-top .legend-pill-control{
        --legend-dot-size:34px;
        --legend-gap:9px;
        gap:5px;
      }

      .results-legend-top .legend-pill-doc{
        font-size:.78rem;
      }

      .results-sidebar-note{
        margin-bottom:0;
      }

      .results-sidebar .legend-pill-control{
        --legend-dot-size:44px;
        --legend-gap:12px;
        gap:7px;
      }

      .results-sidebar .sidebar-text-diff{
        margin-top:8px;
        padding:6px;
      }

      .results-sidebar .sidebar-diff-box{
        margin-top:7px;
        padding:6px 8px;
      }

      .results-sidebar .sidebar-diff-value{
        font-size:1.04rem;
      }

      .results-sidebar .sidebar-markers{
        margin-top:7px;
        padding:6px;
      }

      .results-sidebar .sidebar-markers-title{
        font-size:.78rem;
      }

      .sidebar-compare-info{
        padding:7px 8px;
        margin-bottom:8px;
      }

      .result-tab{
        max-width:220px;
      }

      .sidebar-new-compare{
        min-height:34px;
        margin-top:auto;
      }

      .results-sidebar .sidebar-text-diff .text-diff-list{
        max-height:120px;
      }

      .results-sidebar .sidebar-text-diff .text-diff-count-total{
        font-size:1.12rem;
      }
    }

    .load-state,
    .pairing-row{
      display:none !important;
    }

    .preview-details{
      display:none !important;
    }

    #status{
      display:none !important;
    }

/* final-button-unification */
:root{
      --ui-btn-radius:14px;
      --ui-btn-border:rgba(163,184,209,.92);
      --ui-btn-surface-top:rgba(255,255,255,.98);
      --ui-btn-surface-bottom:rgba(239,246,253,.98);
      --ui-btn-surface-hover-top:rgba(255,255,255,1);
      --ui-btn-surface-hover-bottom:rgba(231,241,252,.98);
      --ui-btn-surface-text:#294b70;
      --ui-btn-surface-shadow:0 8px 18px rgba(65,94,127,.12), inset 0 1px 0 rgba(255,255,255,.94);
      --ui-btn-surface-shadow-hover:0 12px 22px rgba(65,94,127,.16), inset 0 1px 0 rgba(255,255,255,.98);
      --ui-btn-primary-top:#36a0ff;
      --ui-btn-primary-mid:#1589f6;
      --ui-btn-primary-bottom:#066fd8;
      --ui-btn-primary-border:rgba(8,103,196,.92);
      --ui-btn-primary-shadow:0 14px 28px rgba(14,97,178,.28), inset 0 1px 0 rgba(255,255,255,.3);
      --ui-btn-primary-shadow-hover:0 18px 32px rgba(14,97,178,.34), inset 0 1px 0 rgba(255,255,255,.34);
      --ui-btn-secondary-top:#8197b0;
      --ui-btn-secondary-bottom:#617a95;
      --ui-btn-secondary-border:rgba(92,118,148,.92);
      --ui-btn-secondary-shadow:0 12px 24px rgba(73,93,116,.2), inset 0 1px 0 rgba(255,255,255,.24);
      --ui-btn-secondary-shadow-hover:0 16px 28px rgba(73,93,116,.25), inset 0 1px 0 rgba(255,255,255,.28);
    }

    .btn-secondary,
    .btn-tertiary,
    .img-action-btn,
    .zoom-btn,
    .sidebar-export-btn{
      min-height:42px;
      border-radius:var(--ui-btn-radius);
      border:1px solid var(--ui-btn-primary-border);
      font-weight:720;
      letter-spacing:.01em;
      transition:transform .16s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
      filter:none;
    }

    .btn-secondary,
    .sidebar-export-btn{
      background:linear-gradient(180deg,var(--ui-btn-secondary-top) 0%, var(--ui-btn-secondary-bottom) 100%);
      border-color:var(--ui-btn-secondary-border);
      box-shadow:var(--ui-btn-secondary-shadow);
      color:#fff;
    }

    .btn-secondary:hover,
    .sidebar-export-btn:hover{
      background:linear-gradient(180deg,#8aa0b8 0%, #68819d 100%);
      box-shadow:var(--ui-btn-secondary-shadow-hover);
      transform:translateY(-1px);
      filter:none;
    }

    .btn-tertiary{
      background:linear-gradient(180deg,#99a9bb 0%, #788a9f 100%);
      border-color:rgba(118,135,155,.92);
      box-shadow:0 12px 24px rgba(87,100,117,.18), inset 0 1px 0 rgba(255,255,255,.22);
      color:#fff;
    }

    .btn-tertiary:hover{
      background:linear-gradient(180deg,#a5b3c3 0%, #8395a8 100%);
      box-shadow:0 16px 28px rgba(87,100,117,.24), inset 0 1px 0 rgba(255,255,255,.28);
      transform:translateY(-1px);
      filter:none;
    }

    .img-action-btn,
    .zoom-btn{
      background:linear-gradient(180deg,var(--ui-btn-primary-top) 0%, var(--ui-btn-primary-mid) 48%, var(--ui-btn-primary-bottom) 100%);
      border-color:var(--ui-btn-primary-border);
      box-shadow:var(--ui-btn-primary-shadow);
      color:#fff;
    }

    .img-action-btn:hover,
    .zoom-btn:hover{
      background:linear-gradient(180deg,#49a9ff 0%, #1d90fb 48%, #0a77e5 100%);
      box-shadow:var(--ui-btn-primary-shadow-hover);
      transform:translateY(-1px);
      filter:none;
    }

    .btn-secondary:disabled,
    .btn-tertiary:disabled,
    .img-action-btn:disabled,
    .zoom-btn:disabled,
    .sidebar-export-btn:disabled{
      background:linear-gradient(180deg,#bcc8d6 0%, #a7b6c7 100%);
      border-color:rgba(174,189,206,.96);
      box-shadow:none;
      color:#f5f8fc;
      transform:none;
    }

    #runBtn,
    .run-settings-toggle{
      transition:background-color .16s ease, box-shadow .18s ease, color .18s ease;
    }

    .run-main-control{
      border-radius:18px;
      border:1px solid rgba(14,94,171,.28);
      background:linear-gradient(135deg,#0b78e1 0%, #1791ff 52%, #0d74dd 100%);
      box-shadow:0 18px 36px rgba(13,90,165,.24), inset 0 1px 0 rgba(255,255,255,.18);
    }

    .run-main-control.settings-open{
      box-shadow:0 24px 42px rgba(13,90,165,.28), inset 0 1px 0 rgba(255,255,255,.22);
    }

    #runBtn{
      font-weight:760;
      letter-spacing:.012em;
      text-shadow:0 1px 0 rgba(0,0,0,.12);
    }

    #runBtn:hover{
      background:rgba(255,255,255,.16);
    }

    .run-settings-toggle{
      background:rgba(255,255,255,.04);
    }

    .run-settings-toggle:hover,
    .run-main-control.settings-open .run-settings-toggle{
      background:rgba(255,255,255,.18);
    }

    .swap-between-btn{
      border-radius:18px;
      background:linear-gradient(180deg,rgba(255,255,255,.98) 0%, rgba(236,244,252,.98) 100%);
      border:1px solid var(--ui-btn-border);
      box-shadow:var(--ui-btn-surface-shadow);
      color:#2b669c;
    }

    .swap-between-btn:hover{
      background:linear-gradient(180deg,rgba(255,255,255,1) 0%, rgba(227,239,251,.98) 100%);
      box-shadow:var(--ui-btn-surface-shadow-hover);
      transform:translate(-50%,-51%);
      filter:none;
    }

    .run-settings-panel .quick-preset-btn,
    .results-sidebar .sidebar-view-mode-btn,
    .result-layout-btn,
    .result-sync-btn,
    .run-filter-btn,
    .marker-btn{
      border:1px solid var(--ui-btn-border);
      background:linear-gradient(180deg,var(--ui-btn-surface-top) 0%, var(--ui-btn-surface-bottom) 100%);
      color:var(--ui-btn-surface-text);
      box-shadow:var(--ui-btn-surface-shadow);
      transition:transform .16s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
      filter:none;
    }

    .run-settings-panel .quick-preset-btn:hover,
    .results-sidebar .sidebar-view-mode-btn:hover,
    .result-layout-btn:hover,
    .result-sync-btn:hover,
    .run-filter-btn:hover,
    .marker-btn:hover{
      background:linear-gradient(180deg,var(--ui-btn-surface-hover-top) 0%, var(--ui-btn-surface-hover-bottom) 100%);
      border-color:rgba(129,163,198,.94);
      box-shadow:var(--ui-btn-surface-shadow-hover);
      transform:translateY(-1px);
      filter:none;
    }

    .run-settings-panel .quick-preset-btn,
    .results-sidebar .sidebar-view-mode-btn,
    .result-layout-btn{
      min-height:40px;
      border-radius:12px;
      font-weight:710;
    }

    .run-filter-btn,
    .marker-btn,
    .result-sync-btn{
      border-radius:999px;
      font-weight:710;
    }

    .run-filter-btn,
    .marker-btn{
      min-height:32px;
      padding:0 12px;
    }

    .result-sync-btn{
      min-width:78px;
      padding:0 14px;
    }

    .run-settings-panel .quick-preset-btn.active,
    .results-sidebar .sidebar-view-mode-btn.active,
    .result-layout-btn.active,
    .run-filter-btn.active{
      background:linear-gradient(180deg,#2697ff 0%, #0c80ef 100%);
      border-color:var(--ui-btn-primary-border);
      color:#fff;
      box-shadow:0 14px 26px rgba(14,97,178,.24), inset 0 1px 0 rgba(255,255,255,.28);
    }

    .result-sync-btn.active{
      background:linear-gradient(180deg,#31b669 0%, #1f9650 100%);
      border-color:rgba(31,126,72,.92);
      color:#fff;
      box-shadow:0 12px 24px rgba(31,126,72,.22), inset 0 1px 0 rgba(255,255,255,.24);
    }

    .result-sync-btn.active:hover{
      background:linear-gradient(180deg,#38c072 0%, #259f57 100%);
      border-color:rgba(31,126,72,.96);
      box-shadow:0 16px 28px rgba(31,126,72,.26), inset 0 1px 0 rgba(255,255,255,.28);
    }

    .run-settings-panel .quick-preset-btn:disabled,
    .results-sidebar .sidebar-view-mode-btn:disabled,
    .result-layout-btn:disabled,
    .result-sync-btn.blocked,
    .result-sync-btn:disabled{
      background:linear-gradient(180deg,#f7f9fc 0%, #edf2f7 100%);
      border-color:rgba(199,211,226,.96);
      color:#8a9bb0;
      box-shadow:none;
      transform:none;
      cursor:not-allowed;
    }

    .results-sidebar .sidebar-view-mode-card{
      padding:6px;
      gap:6px;
      border-radius:18px;
      background:rgba(231,239,248,.8);
      border:1px solid rgba(187,205,226,.9);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
    }

    .results-sidebar .sidebar-view-mode-btn{
      min-height:44px;
      padding:12px 14px;
      border-top:0;
      border-left:0;
      box-shadow:var(--ui-btn-surface-shadow);
    }

    .results-sidebar .sidebar-view-mode-row-docs .sidebar-view-mode-btn + .sidebar-view-mode-btn,
    .results-sidebar .sidebar-view-mode-card > .sidebar-view-mode-btn + .sidebar-view-mode-btn{
      border-left:0;
      margin-top:0;
    }

    .results-sidebar .sidebar-view-mode-card > .sidebar-view-mode-btn:last-child{
      border-bottom-left-radius:12px;
      border-bottom-right-radius:12px;
    }

    .result-tab{
      background:linear-gradient(180deg,rgba(223,233,244,.96) 0%, rgba(209,222,238,.94) 100%);
      color:#345578;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
    }

    .result-tab:not(.active):hover{
      background:linear-gradient(180deg,rgba(232,239,248,.98) 0%, rgba(219,230,243,.96) 100%);
    }

    .result-tab.active{
      background:linear-gradient(180deg,rgba(255,255,255,.99) 0%, rgba(247,250,253,.99) 100%);
      color:#203f62;
      box-shadow:0 -1px 0 rgba(255,255,255,.95), inset 0 1px 0 rgba(255,255,255,.98);
    }

    #runBtn:focus-visible,
    .run-settings-toggle:focus-visible,
    .btn-secondary:focus-visible,
    .btn-tertiary:focus-visible,
    .img-action-btn:focus-visible,
    .zoom-btn:focus-visible,
    .swap-between-btn:focus-visible,
    .run-settings-panel .quick-preset-btn:focus-visible,
    .results-sidebar .sidebar-view-mode-btn:focus-visible,
    .result-layout-btn:focus-visible,
    .result-sync-btn:focus-visible,
    .run-filter-btn:focus-visible,
    .marker-btn:focus-visible,
    .result-tab:focus-visible{
      outline:none;
      box-shadow:0 0 0 4px rgba(21,119,227,.16);
    }

/* retro-modern-theme */
:root{
      --retro-bg:#f6ead3;
      --retro-bg-soft:#efe1c5;
      --retro-panel:#fff7e7;
      --retro-panel-strong:#fffaf0;
      --retro-ink:#24324b;
      --retro-ink-soft:#52627d;
      --retro-line:#344562;
      --retro-line-soft:#90a0bb;
      --retro-blue:#4d7ea8;
      --retro-blue-deep:#365d84;
      --retro-teal:#3f887f;
      --retro-green:#45a06b;
      --retro-orange:#d9894b;
      --retro-orange-deep:#b66a37;
      --retro-shadow:6px 6px 0 rgba(36,50,75,.16);
      --retro-shadow-soft:0 16px 30px rgba(77,95,125,.12);
    }

    body{
      font-family:"Trebuchet MS","Avenir Next","Segoe UI",sans-serif;
      background:
        radial-gradient(circle at top left, rgba(255,255,255,.72) 0, rgba(255,255,255,0) 28%),
        radial-gradient(circle at top right, rgba(226,198,152,.24) 0, rgba(226,198,152,0) 30%),
        repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, rgba(255,255,255,0) 1px 28px),
        repeating-linear-gradient(90deg, rgba(52,69,98,.035) 0 1px, rgba(52,69,98,0) 1px 28px),
        linear-gradient(180deg, var(--retro-bg) 0%, #f2e5cb 52%, #ead9b7 100%);
      color:var(--retro-ink);
    }

    .page-header{
      margin:0 0 16px;
    }

    .page-header-main h1{
      margin:0;
      color:#1f2d45;
      font-family:"Trebuchet MS","Avenir Next","Segoe UI",sans-serif;
      font-size:clamp(2rem,3.1vw,3.1rem);
      line-height:1.05;
      letter-spacing:.01em;
      text-wrap:balance;
    }

    .note-sm,
    .results-sidebar-note,
    .results-sidebar .sidebar-export-meta,
    .preview-meta,
    .run-sub,
    .pairing-hint{
      color:var(--retro-ink-soft);
    }

    .card,
    .run-block,
    .result,
    .metric,
    .results-sidebar,
    .ad-rail,
    .results-sidebar .sidebar-export-panel,
    .results-sidebar .sidebar-zoom-panel,
    .results-sidebar .sidebar-text-diff,
    .results-sidebar .sidebar-diff-box,
    .results-sidebar .sidebar-markers,
    .sidebar-compare-info,
    .legend-box{
      background:linear-gradient(180deg, var(--retro-panel-strong) 0%, var(--retro-panel) 100%);
      border:2px solid rgba(52,69,98,.28);
      box-shadow:var(--retro-shadow), var(--retro-shadow-soft), inset 0 1px 0 rgba(255,255,255,.9);
      backdrop-filter:none;
      -webkit-backdrop-filter:none;
    }

    .upload-card{
      background:
        linear-gradient(180deg, rgba(255,249,238,.96) 0%, rgba(252,243,225,.96) 100%);
      border:2px solid rgba(52,69,98,.28);
      border-radius:26px;
      box-shadow:var(--retro-shadow), 0 20px 38px rgba(88,96,115,.12), inset 0 1px 0 rgba(255,255,255,.9);
    }

    .workspace-main > #uploadCard,
    .composer-tab-panel > #uploadCard,
    .workspace-main > .results-shell > #resultsSection{
      border-top:2px solid rgba(52,69,98,.28);
      border-left:2px solid rgba(52,69,98,.28);
    }

    .results-sidebar,
    .ad-rail{
      border-radius:24px;
      background:
        linear-gradient(180deg, rgba(255,248,236,.97) 0%, rgba(245,232,205,.97) 100%);
      overflow:hidden;
    }

    .results-sidebar-title,
    .ad-rail-title,
    .results-sidebar .sidebar-export-title,
    .results-sidebar .sidebar-zoom-title,
    .results-sidebar .sidebar-markers-title,
    .results-sidebar .text-diff-title{
      color:#21324b;
      font-weight:800;
      letter-spacing:.015em;
    }

    .ad-rail-slot{
      border:2px dashed rgba(52,69,98,.35);
      border-radius:18px;
      background:
        linear-gradient(180deg, rgba(255,250,241,.95) 0%, rgba(245,236,216,.95) 100%);
    }

    .drop-zone{
      border:2px solid rgba(52,69,98,.22);
      border-radius:22px;
      background:
        linear-gradient(180deg, rgba(255,250,242,.98) 0%, rgba(246,236,213,.98) 100%);
      box-shadow:var(--retro-shadow-soft), inset 0 1px 0 rgba(255,255,255,.94);
    }

    .drop-zone::after{
      background:linear-gradient(135deg, rgba(217,137,75,.17) 0%, rgba(63,136,127,.12) 100%);
    }

    .drop-zone:hover{
      border-color:rgba(182,111,59,.52);
      background:linear-gradient(180deg, rgba(255,252,246,.99) 0%, rgba(250,239,219,.99) 100%);
      box-shadow:0 22px 32px rgba(103,90,69,.14), inset 0 1px 0 rgba(255,255,255,.98);
    }

    .drop-zone.has-files{
      background:
        linear-gradient(180deg, rgba(255,247,233,.99) 0%, rgba(244,231,207,.99) 100%);
      border-color:rgba(52,69,98,.28);
    }

    .drop-zone.is-dragging{
      border-color:rgba(182,111,59,.72);
      box-shadow:0 0 0 4px rgba(217,137,75,.12), 0 24px 36px rgba(103,90,69,.16), inset 0 1px 0 rgba(255,255,255,.98);
    }

    .drop-zone-title{
      color:#24324b;
      font-weight:800;
      letter-spacing:.01em;
    }

    .drop-zone-list{
      color:#51627d;
    }

    .drop-zone-list .count,
    .drop-zone-list .upload-cta{
      color:#a15b2e;
    }

    button,
    input,
    select{
      font-family:"Trebuchet MS","Avenir Next","Segoe UI",sans-serif;
    }

    button{
      border-radius:16px;
    }

    #runBtn,
    .btn-secondary,
    .btn-tertiary,
    .img-action-btn,
    .zoom-btn,
    .sidebar-export-btn{
      min-height:44px;
      border:2px solid rgba(40,58,88,.34);
      border-radius:16px;
      box-shadow:4px 4px 0 rgba(36,50,75,.18), inset 0 1px 0 rgba(255,255,255,.24);
    }

    #runBtn{
      background:linear-gradient(180deg, var(--retro-orange) 0%, var(--retro-orange-deep) 100%);
      border-color:rgba(135,80,42,.68);
      color:#fffaf4;
      text-shadow:none;
    }

    #runBtn:hover{
      background:linear-gradient(180deg, #e29757 0%, #c8733b 100%);
      transform:none;
      box-shadow:5px 5px 0 rgba(36,50,75,.2), inset 0 1px 0 rgba(255,255,255,.28);
    }

    #runBtn:disabled{
      background:linear-gradient(180deg,#d8cab4 0%, #c9baa1 100%);
      color:#f8f0e2;
      box-shadow:none;
    }

    .run-main-control{
      border:2px solid rgba(52,69,98,.28);
      border-radius:22px;
      background:linear-gradient(180deg, #fff6e7 0%, #f2dfbc 100%);
      box-shadow:var(--retro-shadow), 0 18px 34px rgba(103,90,69,.12), inset 0 1px 0 rgba(255,255,255,.86);
    }

    .run-settings-toggle{
      border-left:2px solid rgba(52,69,98,.18);
      background:linear-gradient(180deg, rgba(89,119,149,.98) 0%, rgba(58,89,123,.98) 100%);
      color:#fff7ea;
      box-shadow:none;
    }

    .run-settings-toggle:hover,
    .run-main-control.settings-open .run-settings-toggle{
      background:linear-gradient(180deg, rgba(99,130,160,.98) 0%, rgba(66,99,136,.98) 100%);
    }

    .btn-secondary,
    .sidebar-export-btn{
      background:linear-gradient(180deg, var(--retro-blue) 0%, var(--retro-blue-deep) 100%);
      border-color:rgba(46,73,106,.72);
      color:#fff8ef;
    }

    .btn-secondary:hover,
    .sidebar-export-btn:hover{
      background:linear-gradient(180deg, #5989b2 0%, #41698f 100%);
      transform:translateY(-1px);
      box-shadow:5px 5px 0 rgba(36,50,75,.18), inset 0 1px 0 rgba(255,255,255,.28);
    }

    .btn-tertiary{
      background:linear-gradient(180deg, #8da2b6 0%, #70869c 100%);
      border-color:rgba(86,103,122,.62);
      color:#fff8ef;
    }

    .img-action-btn,
    .zoom-btn{
      background:linear-gradient(180deg, #56a29a 0%, var(--retro-teal) 100%);
      border-color:rgba(43,101,92,.66);
      color:#fffaf3;
    }

    .img-action-btn:hover,
    .zoom-btn:hover{
      background:linear-gradient(180deg, #65afa7 0%, #468f86 100%);
      transform:translateY(-1px);
      box-shadow:5px 5px 0 rgba(36,50,75,.18), inset 0 1px 0 rgba(255,255,255,.26);
    }

    .btn-secondary:disabled,
    .btn-tertiary:disabled,
    .img-action-btn:disabled,
    .zoom-btn:disabled,
    .sidebar-export-btn:disabled{
      background:linear-gradient(180deg,#d8cfbf 0%, #cbbda6 100%);
      border-color:rgba(163,151,128,.68);
      color:#fff7e7;
      box-shadow:none;
    }

    .swap-between-btn{
      border-radius:18px;
      background:linear-gradient(180deg, #fff8ed 0%, #f0e0bf 100%);
      border:2px solid rgba(52,69,98,.28);
      color:#a25f32;
      box-shadow:4px 4px 0 rgba(36,50,75,.15), inset 0 1px 0 rgba(255,255,255,.95);
    }

    .swap-between-btn:hover{
      background:linear-gradient(180deg, #fffaf3 0%, #f4e6c8 100%);
      color:#8f5127;
      box-shadow:5px 5px 0 rgba(36,50,75,.18), inset 0 1px 0 rgba(255,255,255,.98);
      transform:translate(-50%,-51%);
    }

    .run-settings-panel{
      background:linear-gradient(180deg, rgba(255,249,239,.98) 0%, rgba(247,236,212,.98) 100%);
      border-top:2px solid rgba(52,69,98,.14);
    }

    .run-settings-panel .quick-preset-btn,
    .results-sidebar .sidebar-view-mode-btn,
    .result-layout-btn,
    .result-sync-btn,
    .run-filter-btn,
    .marker-btn{
      border:2px solid rgba(52,69,98,.24);
      background:linear-gradient(180deg, #fffaf1 0%, #ecdec0 100%);
      color:#2f4362;
      box-shadow:3px 3px 0 rgba(36,50,75,.12), inset 0 1px 0 rgba(255,255,255,.94);
    }

    .run-settings-panel .quick-preset-btn:hover,
    .results-sidebar .sidebar-view-mode-btn:hover,
    .result-layout-btn:hover,
    .result-sync-btn:hover,
    .run-filter-btn:hover,
    .marker-btn:hover{
      background:linear-gradient(180deg, #fffdf7 0%, #f1e4c8 100%);
      border-color:rgba(182,111,59,.52);
      color:#283a56;
      box-shadow:4px 4px 0 rgba(36,50,75,.14), inset 0 1px 0 rgba(255,255,255,.98);
      transform:translateY(-1px);
    }

    .run-settings-panel .quick-preset-btn.active,
    .results-sidebar .sidebar-view-mode-btn.active,
    .result-layout-btn.active,
    .run-filter-btn.active{
      background:linear-gradient(180deg, #5c93bf 0%, #3d6f97 100%);
      border-color:rgba(43,72,103,.76);
      color:#fff7ef;
      box-shadow:4px 4px 0 rgba(36,50,75,.16), inset 0 1px 0 rgba(255,255,255,.22);
    }

    .result-sync-btn.active,
    .results-sidebar .sidebar-sync-btn{
      background:linear-gradient(180deg, #61b57d 0%, #41945f 100%);
      border:2px solid rgba(36,113,65,.66);
      color:#fffaf0;
      box-shadow:4px 4px 0 rgba(36,50,75,.16), inset 0 1px 0 rgba(255,255,255,.22);
    }

    .result-sync-btn.active:hover,
    .results-sidebar .sidebar-sync-btn:hover{
      background:linear-gradient(180deg, #6bc087 0%, #4d9f6a 100%);
      border-color:rgba(36,113,65,.72);
      box-shadow:5px 5px 0 rgba(36,50,75,.18), inset 0 1px 0 rgba(255,255,255,.26);
      transform:translateY(-1px);
    }

    .result-sync-btn.blocked,
    .result-sync-btn:disabled,
    .results-sidebar .sidebar-sync-btn:disabled{
      background:linear-gradient(180deg,#f2ebdc 0%, #e5dac3 100%);
      border-color:rgba(161,149,126,.6);
      color:#918168;
      box-shadow:none;
    }

    .results-sidebar .sidebar-view-mode-card{
      padding:8px;
      gap:8px;
      border-radius:22px;
      background:linear-gradient(180deg, rgba(245,233,209,.72) 0%, rgba(237,222,195,.72) 100%);
      border:2px solid rgba(52,69,98,.18);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
    }

    .results-sidebar .sidebar-view-mode-btn{
      min-height:48px;
      border-radius:16px;
      border-top:2px solid rgba(52,69,98,.24);
      padding:12px 14px;
    }

    .results-sidebar .sidebar-export-panel,
    .results-sidebar .sidebar-zoom-panel,
    .results-sidebar .sidebar-text-diff,
    .results-sidebar .sidebar-diff-box,
    .results-sidebar .sidebar-markers{
      border-radius:20px;
    }

    .results-sidebar .legend-pill,
    .results-sidebar .legend-doc-opacity{
      background:linear-gradient(180deg, #fffbf4 0%, #efe3c8 100%);
      border:2px solid rgba(52,69,98,.18);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
    }

    .doc-visibility-toggle{
      background:linear-gradient(180deg, #fff8ee 0%, #f0e0c0 100%);
      border:2px solid rgba(52,69,98,.2);
      color:#5f7796;
      box-shadow:2px 2px 0 rgba(36,50,75,.12), inset 0 1px 0 rgba(255,255,255,.96);
    }

    .doc-visibility-toggle:hover{
      background:linear-gradient(180deg, #fffdf9 0%, #f4e7cc 100%);
      color:#436989;
      transform:translateY(-1px);
    }

    .result-tab{
      background:linear-gradient(180deg, #efe1c2 0%, #e1cfaa 100%);
      color:#4e5b6f;
      border:2px solid rgba(52,69,98,.16);
      border-bottom:0;
      border-radius:18px 18px 0 0;
      box-shadow:none;
    }

    .result-tab:not(.active):hover{
      background:linear-gradient(180deg, #f5e8cc 0%, #e8d7b5 100%);
    }

    .result-tab.active{
      background:linear-gradient(180deg, #fff8ea 0%, #f8eedc 100%);
      color:#23344d;
      border-color:rgba(52,69,98,.24);
      box-shadow:0 -1px 0 rgba(255,255,255,.92), inset 0 1px 0 rgba(255,255,255,.98);
    }

    input[type="number"],
    select{
      border:2px solid rgba(52,69,98,.16);
      border-radius:16px;
      background:linear-gradient(180deg, #fffbf3 0%, #f0e3ca 100%);
      color:#2f4362;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
    }

    input[type="number"]:focus,
    select:focus{
      border-color:rgba(182,111,59,.62);
      box-shadow:0 0 0 4px rgba(217,137,75,.12), inset 0 1px 0 rgba(255,255,255,.98);
    }

    .result-canvas-shell,
    .preview-canvas-wrap,
    .marker-object-preview-frame{
      border:2px solid rgba(52,69,98,.16);
      border-radius:18px;
      background:linear-gradient(180deg, rgba(255,251,244,.98) 0%, rgba(242,231,208,.98) 100%);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
    }

    .ok-row{
      border:2px solid rgba(53,131,88,.28);
      background:linear-gradient(180deg, rgba(236,249,239,.98) 0%, rgba(219,241,224,.98) 100%);
      color:#236a45;
      box-shadow:3px 3px 0 rgba(36,50,75,.08);
    }

    .cat-badge.cat-identical{
      background:linear-gradient(180deg, rgba(230,247,234,.98) 0%, rgba(214,239,221,.98) 100%);
    }

    .cat-badge.cat-minor{
      background:linear-gradient(180deg, rgba(255,244,225,.98) 0%, rgba(247,229,196,.98) 100%);
    }

    .cat-badge.cat-critical{
      background:linear-gradient(180deg, rgba(255,232,229,.98) 0%, rgba(246,211,205,.98) 100%);
    }

    #runBtn:focus-visible,
    .run-settings-toggle:focus-visible,
    .btn-secondary:focus-visible,
    .btn-tertiary:focus-visible,
    .img-action-btn:focus-visible,
    .zoom-btn:focus-visible,
    .swap-between-btn:focus-visible,
    .run-settings-panel .quick-preset-btn:focus-visible,
    .results-sidebar .sidebar-view-mode-btn:focus-visible,
    .result-layout-btn:focus-visible,
    .result-sync-btn:focus-visible,
    .run-filter-btn:focus-visible,
    .marker-btn:focus-visible,
    .result-tab:focus-visible,
    .doc-visibility-toggle:focus-visible{
      box-shadow:0 0 0 4px rgba(217,137,75,.14);
    }

/* retro-modern-flat */
:root{
      --retro-bg:#ffffff;
      --retro-bg-soft:#f5f7fb;
      --retro-panel:#ffffff;
      --retro-panel-strong:#ffffff;
      --retro-shadow:5px 5px 0 rgba(36,50,75,.12);
      --retro-shadow-soft:0 14px 28px rgba(77,95,125,.08);
      --retro-btn-shadow:0 10px 20px rgba(36,50,75,.14);
      --retro-btn-shadow-hover:0 14px 24px rgba(36,50,75,.18);
      --retro-btn-shadow-soft:0 8px 18px rgba(36,50,75,.1);
      --retro-btn-shadow-soft-hover:0 11px 22px rgba(36,50,75,.14);
      --retro-btn-shadow-disabled:0 4px 10px rgba(36,50,75,.06);
    }

    body{
      background:#ffffff;
    }

    .card,
    .run-block,
    .result,
    .metric,
    .results-sidebar,
    .ad-rail,
    .results-sidebar .sidebar-export-panel,
    .results-sidebar .sidebar-zoom-panel,
    .results-sidebar .sidebar-text-diff,
    .results-sidebar .sidebar-diff-box,
    .results-sidebar .sidebar-markers,
    .sidebar-compare-info,
    .legend-box,
    .upload-card,
    .drop-zone,
    .run-main-control,
    .ad-rail-slot,
    .results-sidebar .sidebar-view-mode-card,
    .results-sidebar .legend-pill,
    .results-sidebar .legend-doc-opacity,
    .result-canvas-shell,
    .preview-canvas-wrap,
    .marker-object-preview-frame,
    input[type="number"],
    select{
      background:#ffffff;
      background-image:none;
    }

    .drop-zone::after{
      background:rgba(52,69,98,.035);
    }

    .drop-zone:hover,
    .drop-zone.has-files,
    .drop-zone.is-dragging{
      background:#ffffff;
      background-image:none;
    }

    #runBtn,
    .btn-secondary,
    .btn-tertiary,
    .img-action-btn,
    .zoom-btn,
    .sidebar-export-btn,
    .swap-between-btn,
    .run-settings-toggle,
    .run-settings-panel .quick-preset-btn,
    .results-sidebar .sidebar-view-mode-btn,
    .result-layout-btn,
    .result-sync-btn,
    .results-sidebar .sidebar-sync-btn,
    .run-filter-btn,
    .marker-btn,
    .result-tab,
    .doc-visibility-toggle{
      background-image:none;
      border:none;
      box-shadow:var(--retro-btn-shadow-soft);
    }

    #runBtn{
      background:#d9894b;
      color:#fffaf4;
      box-shadow:var(--retro-btn-shadow);
    }

    #runBtn:hover{
      background:#c9783e;
      box-shadow:var(--retro-btn-shadow-hover);
    }

    #runBtn:disabled{
      background:#ddd6ca;
      color:#f8f4ec;
      box-shadow:var(--retro-btn-shadow-disabled);
    }

    .run-settings-toggle{
      background:#4d7ea8;
      color:#fffaf0;
      box-shadow:var(--retro-btn-shadow);
    }

    .run-settings-toggle:hover,
    .run-main-control.settings-open .run-settings-toggle{
      background:#416d93;
      box-shadow:var(--retro-btn-shadow-hover);
    }

    .btn-secondary,
    .sidebar-export-btn{
      background:#4d7ea8;
      color:#fffaf0;
      box-shadow:var(--retro-btn-shadow);
    }

    .btn-secondary:hover,
    .sidebar-export-btn:hover{
      background:#416d93;
      box-shadow:var(--retro-btn-shadow-hover);
    }

    .btn-tertiary{
      background:#8597a9;
      color:#fffaf0;
      box-shadow:var(--retro-btn-shadow);
    }

    .btn-tertiary:hover{
      background:#738596;
      box-shadow:var(--retro-btn-shadow-hover);
    }

    .img-action-btn,
    .zoom-btn{
      background:#3f887f;
      color:#fffaf2;
      box-shadow:var(--retro-btn-shadow);
    }

    .img-action-btn:hover,
    .zoom-btn:hover{
      background:#37766f;
      box-shadow:var(--retro-btn-shadow-hover);
    }

    .btn-secondary:disabled,
    .btn-tertiary:disabled,
    .img-action-btn:disabled,
    .zoom-btn:disabled,
    .sidebar-export-btn:disabled{
      background:#e1e6ed;
      color:#97a4b5;
      box-shadow:var(--retro-btn-shadow-disabled);
    }

    .swap-between-btn{
      background:#ffffff;
      color:#a15b2e;
      box-shadow:var(--retro-btn-shadow-soft);
    }

    .swap-between-btn:hover{
      background:#f7f9fc;
      box-shadow:var(--retro-btn-shadow-soft-hover);
    }

    .run-settings-panel .quick-preset-btn,
    .results-sidebar .sidebar-view-mode-btn,
    .result-layout-btn,
    .run-filter-btn,
    .marker-btn{
      background:#ffffff;
      color:#2f4362;
      box-shadow:var(--retro-btn-shadow-soft);
    }

    .run-settings-panel .quick-preset-btn:hover,
    .results-sidebar .sidebar-view-mode-btn:hover,
    .result-layout-btn:hover,
    .run-filter-btn:hover,
    .marker-btn:hover{
      background:#f5f8fc;
      box-shadow:var(--retro-btn-shadow-soft-hover);
    }

    .run-settings-panel .quick-preset-btn.active,
    .results-sidebar .sidebar-view-mode-btn.active,
    .result-layout-btn.active,
    .run-filter-btn.active{
      background:#4d7ea8;
      color:#fffaf0;
      box-shadow:var(--retro-btn-shadow);
    }

    .result-sync-btn.active,
    .results-sidebar .sidebar-sync-btn{
      background:#45a06b;
      color:#fffaf2;
      box-shadow:var(--retro-btn-shadow);
    }

    .result-sync-btn.active:hover,
    .results-sidebar .sidebar-sync-btn:hover{
      background:#3c8d5e;
      box-shadow:var(--retro-btn-shadow-hover);
    }

    .result-sync-btn.blocked,
    .result-sync-btn:disabled,
    .results-sidebar .sidebar-sync-btn:disabled{
      background:#e7ebf0;
      color:#8b98aa;
      box-shadow:var(--retro-btn-shadow-disabled);
    }

    .doc-visibility-toggle{
      background:#ffffff;
      color:#5f7796;
      box-shadow:0 6px 14px rgba(36,50,75,.1);
    }

    .doc-visibility-toggle:hover{
      background:#f5f8fc;
      box-shadow:0 9px 18px rgba(36,50,75,.14);
    }

    .result-tab{
      background:#eef2f7;
      color:#51627b;
      box-shadow:0 8px 16px rgba(36,50,75,.08);
    }

    .result-tab:not(.active):hover{
      background:#e5ebf3;
      box-shadow:0 10px 18px rgba(36,50,75,.11);
    }

    .result-tab.active{
      background:#ffffff;
      color:#23344d;
      box-shadow:0 10px 20px rgba(36,50,75,.1);
    }

    .ok-row{
      background:#eef7f1;
    }

    .cat-badge.cat-identical{
      background:#e9f6ee;
    }

    .cat-badge.cat-minor{
      background:#fff1df;
    }

    .cat-badge.cat-critical{
      background:#ffe9e5;
    }

    .results-sidebar .sidebar-export-panel,
    .results-sidebar .sidebar-zoom-panel,
    .results-sidebar .sidebar-view-mode-card,
    .results-sidebar .sidebar-text-diff,
    .results-sidebar .sidebar-diff-box,
    .results-sidebar .sidebar-markers{
      background:transparent;
      border:none;
      box-shadow:none;
    }

    .results-sidebar .sidebar-export-panel,
    .results-sidebar .sidebar-zoom-panel,
    .results-sidebar .sidebar-text-diff,
    .results-sidebar .sidebar-diff-box,
    .results-sidebar .sidebar-markers{
      padding:0;
    }

    .results-sidebar .sidebar-view-mode-card{
      padding:0;
      gap:10px;
    }

    .results-tabs{
      position:relative;
      z-index:3;
      display:inline-flex;
      width:max-content;
      max-width:100%;
      margin:0 0 -1px 0;
      padding:0;
    }

    .results-shell{
      position:relative;
      border:none;
      border-radius:0 22px 22px 22px;
      background:#ffffff;
      box-shadow:none;
      overflow:hidden;
    }

    .results-shell::before{
      content:"";
      position:absolute;
      top:0;
      right:0;
      width:22px;
      height:22px;
      border-top:1.5px solid rgba(171,186,208,.96);
      border-right:1.5px solid rgba(171,186,208,.96);
      border-top-right-radius:22px;
      pointer-events:none;
    }

    .results-shell::after{
      content:"";
      position:absolute;
      inset:0;
      border-right:1.5px solid rgba(171,186,208,.96);
      border-bottom:1.5px solid rgba(171,186,208,.96);
      border-bottom-right-radius:22px;
      border-bottom-left-radius:22px;
      pointer-events:none;
    }

    .run-block,
    .result{
      background:transparent !important;
      border:none !important;
      box-shadow:none !important;
    }

    #resultsSection,
    .history-card{
      background:transparent;
      border:none;
      box-shadow:none;
      border-radius:0 0 22px 22px;
    }

    .result-canvas-shell,
    .preview-canvas-wrap,
    .marker-object-preview-frame{
      border:none;
      box-shadow:none;
      background:#ffffff;
    }

    .result-tab{
      border:1.5px solid transparent;
      border-bottom:none;
      border-radius:16px 16px 0 0;
      box-shadow:none;
    }

    .result-tab.active{
      background:#ffffff;
      border-color:rgba(171,186,208,.96);
      border-bottom-color:transparent;
      margin-bottom:-1px;
      box-shadow:none;
      z-index:4;
    }

    .result-tab.active::after{
      content:"";
      position:absolute;
      left:-1px;
      right:-1px;
      bottom:-2px;
      height:4px;
      background:#ffffff;
      pointer-events:none;
    }

    /* user override: compact header + top-aligned desktop rails + no shadows */
    :root{
      --workspace-main-lift:52px;
    }

    .wrap{
      padding-top:20px;
    }

    .page-header{
      margin-bottom:10px;
    }

    .page-header-main h1{
      font-size:clamp(1.2rem,1.45vw,1.6rem) !important;
      line-height:1.08;
    }

    .brand-title{
      display:inline-flex;
      align-items:center;
      gap:10px;
    }

    .brand-mark{
      width:30px;
      height:30px;
      flex:0 0 auto;
      display:inline-flex;
      align-items:center;
      justify-content:center;
    }

    .brand-cross-svg{
      width:100%;
      height:100%;
      display:block;
      overflow:visible;
    }

    .brand-cross-core{
      fill:none;
      stroke:none;
    }

    .brand-cross-outline{
      fill:none;
      stroke:none;
    }

    .brand-cross-glow{
      display:none;
    }

    .brand-cross-chaser{
      fill:none;
      stroke:url(#swissCrossGlowGradient);
      stroke-width:5.6;
      stroke-linecap:round;
      stroke-linejoin:round;
      stroke-dasharray:85 15;
      filter:url(#swissCrossGlowFilter);
      opacity:.92;
      animation:brandCrossTrace 9.2s linear infinite, brandCrossPulse 2.8s ease-in-out infinite;
    }

    @keyframes brandCrossTrace{
      from{stroke-dashoffset:0;}
      to{stroke-dashoffset:-100;}
    }

    @keyframes brandCrossPulse{
      0%,100%{opacity:.72;}
      38%{opacity:1;}
      74%{opacity:.86;}
    }

    @media (prefers-reduced-motion:reduce){
      .brand-cross-chaser,
      .brand-cross-glow{
        animation:none !important;
      }
    }

    .result[data-view-mode="split"] .imgbox-left .doc-title-row > h3,
    .result[data-view-mode="split"] .imgbox-right .doc-title-row > h3{
      font-weight:800 !important;
    }

    .doc-title-row{
      align-items:center;
      gap:10px;
    }

    .doc-reorder-handle{
      width:22px;
      height:22px;
      min-width:22px;
      border:none !important;
      border-radius:8px;
      padding:0;
      margin:0;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background:transparent !important;
      color:#5f7898;
      cursor:grab;
      flex:0 0 auto;
      touch-action:none;
    }

    .doc-reorder-handle:active{
      cursor:grabbing;
    }

    .doc-reorder-handle:hover{
      color:#355a84;
      background:rgba(144,164,188,.18) !important;
    }

    .doc-reorder-handle:focus-visible{
      outline:2px solid #8aa8c7;
      outline-offset:1px;
    }

    .doc-reorder-handle svg{
      width:14px;
      height:14px;
      fill:currentColor;
      pointer-events:none;
    }

    .doc-title-row.is-drop-target{
      border-radius:8px;
      background:rgba(143,164,190,.22) !important;
    }

    .results-tabs{
      gap:6px;
      margin:0 0 8px 0;
    }

    .result-tab,
    .result-tab.active,
    .result-tab:not(.active):hover{
      background:#f2f3f3 !important;
      color:#2d4461 !important;
      border:none !important;
      box-shadow:none !important;
      transform:none !important;
    }

    .result-tab.active::after{
      content:none !important;
    }

    .drop-zone-list,
    .drop-zone-list .count,
    .drop-zone-list .upload-cta{
      color:#476486 !important;
    }

    #runBtn:disabled{
      background:#c7d1dd !important;
      color:#4d6687 !important;
    }

    body{
      background:#d4d6d6 !important;
      background-image:none !important;
    }

    .card,
    .run-block,
    .result,
    .metric,
    .results-sidebar,
    .ad-rail,
    .upload-card,
    .drop-zone,
    .preview-card,
    .imgbox,
    .results-shell,
    #resultsSection,
    .history-card,
    .legend-box,
    .run-main-control,
    .results-sidebar .sidebar-export-panel,
    .results-sidebar .sidebar-zoom-panel,
    .results-sidebar .sidebar-view-mode-card,
    .results-sidebar .sidebar-text-diff,
    .results-sidebar .sidebar-markers{
      border:none !important;
      background:#f2f3f3 !important;
      background-image:none !important;
    }

    .result-canvas-shell,
    .preview-canvas-wrap,
    .marker-object-preview-frame,
    .ad-rail-slot{
      border:none !important;
      background:#ffffff !important;
      background-image:none !important;
    }

    .results-shell::before,
    .results-shell::after{
      content:none !important;
      border:none !important;
    }

    .results-shell[hidden]{
      display:none !important;
    }

    *,
    *::before,
    *::after{
      box-shadow:none !important;
      text-shadow:none !important;
    }

    @media (max-width:920px){
      :root{
        --workspace-main-lift:0px;
      }
    }

    html,
    body,
    button,
    input,
    select,
    textarea,
    option,
    *{
      font-family:"Helvetica Neue", Helvetica, Arial, sans-serif !important;
    }

    #runSettingsToggle{
      display:none !important;
    }

    .run-main-control{
      width:min(100%,1120px) !important;
      max-width:100% !important;
      border-radius:20px !important;
      overflow:hidden !important;
      border:1px solid #d6dce5 !important;
      background:#ebeff4 !important;
      animation:none !important;
    }

    .run-main-control.needs-upload{
      animation:none !important;
    }

    .run-main-bar{
      grid-template-columns:minmax(0,1fr) !important;
    }

    #runBtn{
      min-height:62px !important;
      border:0 !important;
      border-radius:0 !important;
      background:#c3cedd !important;
      color:#486487 !important;
      font-size:clamp(1.05rem,1.45vw,1.45rem) !important;
      font-weight:700 !important;
      letter-spacing:.01em !important;
      transition:background-color .16s ease,color .16s ease !important;
      position:relative;
    }

    #runBtn:hover{
      background:#b6c3d4 !important;
      color:#3f5b7f !important;
    }

    #runBtn:disabled{
      cursor:not-allowed !important;
      opacity:1 !important;
    }

    #runBtn.is-running:disabled{
      cursor:progress !important;
    }

    .run-main-control.needs-upload #runBtn.upload-blocked:disabled:hover{
      background:#b8c5d6 !important;
      color:#4a6689 !important;
    }

    .run-main-control.needs-upload #runBtn.upload-blocked:disabled:hover::after{
      content:"";
      position:absolute;
      right:18px;
      top:50%;
      transform:translateY(-50%);
      width:18px;
      height:18px;
      border:2px solid #cf5a5a;
      border-radius:50%;
      background:linear-gradient(135deg, transparent 42%, #cf5a5a 42%, #cf5a5a 58%, transparent 58%);
      pointer-events:none;
    }

    .run-settings-panel{
      max-height:none !important;
      opacity:1 !important;
      visibility:visible !important;
      overflow:visible !important;
      padding:14px 16px 16px !important;
      border-top:1px solid #d6dce5 !important;
      background:#edf1f5 !important;
    }

    .run-main-control.settings-open .run-settings-panel{
      max-height:none !important;
      opacity:1 !important;
      visibility:visible !important;
      padding:14px 16px 16px !important;
    }

    .run-settings-panel .quick-settings{
      gap:8px !important;
    }

    .run-settings-panel .quick-settings label{
      font-size:.98rem !important;
      font-weight:700 !important;
      color:#465f81 !important;
    }

    .run-settings-panel .quick-preset-buttons{
      gap:10px !important;
    }

    .run-settings-panel .quick-preset-btn{
      min-height:44px !important;
      border:none !important;
      border-radius:14px !important;
      background:#f6f8fa !important;
      color:#334d6f !important;
      font-size:.96rem !important;
      font-weight:700 !important;
    }

    .run-settings-panel .quick-preset-btn.active{
      background:#5f7fa2 !important;
      color:#ffffff !important;
    }

    .run-settings-panel .controls{
      margin-top:2px !important;
      grid-template-columns:repeat(3,minmax(0,1fr)) !important;
      gap:12px !important;
    }

    .run-settings-panel .param-field label{
      font-size:.94rem !important;
      color:#4c6689 !important;
      margin-bottom:6px !important;
      font-weight:700 !important;
    }

    .run-settings-panel input[type="number"]{
      min-height:52px !important;
      border:1px solid #c9d1db !important;
      border-radius:14px !important;
      background:#f7f9fb !important;
      color:#2f4a6d !important;
      font-size:1.22rem !important;
      font-weight:700 !important;
      padding:8px 14px !important;
    }

    @media (max-width:980px){
      .run-settings-panel .controls{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
      }
    }

    @media (max-width:720px){
      .run-settings-panel .controls{
        grid-template-columns:minmax(0,1fr) !important;
      }
      #runBtn{
        min-height:56px !important;
      }
      .run-settings-panel .quick-preset-btn{
        min-height:42px !important;
        font-size:.92rem !important;
      }
      .run-settings-panel input[type="number"]{
        min-height:48px !important;
        font-size:1.08rem !important;
      }
    }

    .page-header-main{
      display:flex !important;
      align-items:flex-start !important;
      justify-content:space-between !important;
      gap:12px !important;
    }

    .page-header-main .brand-title{
      min-width:0 !important;
      margin:0 !important;
    }

    @media (max-width:680px){
      .page-header-main{
        flex-direction:column !important;
        align-items:flex-start !important;
      }
    }

    @media (max-width:1024px){
      body{
        overflow:auto !important;
      }

      .wrap{
        max-width:100% !important;
        margin:8px auto 16px !important;
        padding:0 8px !important;
        height:auto !important;
        min-height:100dvh !important;
        overflow:visible !important;
      }

      .page-header{
        margin-bottom:8px !important;
      }

      .page-header-main{
        align-items:center !important;
        justify-content:space-between !important;
        gap:8px !important;
      }

      .brand-name{
        font-size:clamp(1.1rem,6.2vw,1.55rem) !important;
        line-height:1.04 !important;
      }

      .workspace-shell{
        display:flex !important;
        flex-direction:column !important;
        grid-template-columns:1fr !important;
        gap:8px !important;
        height:auto !important;
        min-height:0 !important;
        overflow:visible !important;
      }

      .results-sidebar{
        order:1 !important;
        position:static !important;
        top:auto !important;
        grid-column:auto !important;
        grid-row:auto !important;
        width:100% !important;
        height:auto !important;
        max-height:none !important;
        min-height:0 !important;
        padding:10px !important;
        border-radius:14px !important;
        overflow:visible !important;
      }

      .results-sidebar-top{
        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;
        gap:8px !important;
        margin-bottom:6px !important;
      }

      #exportBtnMobile:not([hidden]){
        display:inline-flex !important;
      }

      .results-sidebar .sidebar-export-panel{
        display:none !important;
      }

      .results-sidebar-title{
        margin:0 0 4px !important;
        font-size:1.05rem !important;
      }

      .results-sidebar-note{
        margin:0 0 8px !important;
        font-size:.9rem !important;
        line-height:1.3 !important;
      }

      .results-sidebar .sidebar-export-panel,
      .results-sidebar .sidebar-view-mode-panel,
      .results-sidebar .sidebar-zoom-panel,
      .results-sidebar .sidebar-markers,
      .results-sidebar .sidebar-text-diff{
        margin-top:6px !important;
        padding:8px !important;
        border-radius:10px !important;
      }

      .results-sidebar .sidebar-view-mode-card{
        display:none !important;
      }

      .results-sidebar .sidebar-view-mode-toggle{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        width:136px !important;
        min-width:136px !important;
        height:36px !important;
        min-height:36px !important;
        padding:0 12px !important;
      }

      .results-sidebar .sidebar-view-mode-toggle-thumb{
        top:50% !important;
        transform:translateY(-50%) !important;
        left:1px !important;
        width:32px !important;
        height:32px !important;
      }

      .results-sidebar .sidebar-view-mode-toggle.is-split .sidebar-view-mode-toggle-thumb{
        left:calc(100% - 33px) !important;
      }

      .results-sidebar .sidebar-view-mode-toggle-label{
        font-size:.74rem !important;
        letter-spacing:.05em !important;
      }

      .results-sidebar .sidebar-export-btn{
        min-height:38px !important;
        padding:8px 10px !important;
        font-size:1rem !important;
      }

      .results-sidebar .sidebar-export-meta,
      .results-sidebar .sidebar-markers-empty{
        font-size:.9rem !important;
        line-height:1.3 !important;
      }

      .results-sidebar .sidebar-markers-head{
        padding:8px !important;
      }

      .results-sidebar .sidebar-markers-title{
        font-size:1rem !important;
      }

      .results-sidebar .sidebar-markers-count{
        font-size:1.65rem !important;
      }

      .workspace-main{
        order:2 !important;
        grid-column:auto !important;
        grid-row:auto !important;
        width:100% !important;
        height:auto !important;
        min-height:0 !important;
        margin-top:0 !important;
        overflow:visible !important;
      }

      .results-shell,
      #resultsSection,
      #history{
        height:auto !important;
        max-height:none !important;
        overflow:visible !important;
      }

      .results-tabs{
        display:flex !important;
        width:100% !important;
        max-width:100% !important;
        flex-wrap:nowrap !important;
        overflow-x:auto !important;
        -webkit-overflow-scrolling:touch;
        gap:6px !important;
        margin:0 0 6px 0 !important;
        padding-bottom:2px !important;
      }

      .result-tab{
        max-width:none !important;
        min-height:34px !important;
        padding:0 12px 2px !important;
        font-size:.9rem !important;
      }

      .result-tab + .result-tab{
        margin-left:0 !important;
      }

      .result-tab + .result-tab::before{
        content:none !important;
      }

      .run-main-control{
        border-radius:14px !important;
      }

      #runBtn{
        min-height:52px !important;
        font-size:1.05rem !important;
      }

      .run-settings-panel{
        padding:10px !important;
      }

      .run-settings-panel .controls{
        gap:8px !important;
      }

      .run-settings-panel .quick-preset-btn{
        min-height:38px !important;
        font-size:.9rem !important;
      }

      .run-settings-panel input[type="number"]{
        min-height:42px !important;
        font-size:1rem !important;
        padding:6px 10px !important;
      }

      .controls-files{
        grid-template-columns:1fr !important;
        gap:8px !important;
      }

      .drop-zone{
        min-height:96px !important;
        padding:10px !important;
        border-radius:12px !important;
      }

      .ad-rail{
        display:none !important;
      }
    }

    .mobile-markers-footer{
      display:none;
    }

    @media (max-width:1024px){
      html,
      body{
        height:100%;
        overflow:hidden !important;
      }

      .wrap{
        margin:0 !important;
        padding:6px 8px 8px !important;
        max-width:100% !important;
        height:100dvh !important;
        min-height:100dvh !important;
        display:flex !important;
        flex-direction:column !important;
        gap:6px !important;
        overflow:hidden !important;
      }

      .page-header{
        margin:0 !important;
        flex:0 0 auto !important;
      }

      .page-header-main{
        gap:8px !important;
      }

      .brand-mark{
        width:26px !important;
        height:26px !important;
      }

      .brand-name{
        font-size:clamp(1.06rem,4.8vw,1.38rem) !important;
        line-height:1.05 !important;
      }

      .workspace-shell{
        display:grid !important;
        grid-template-columns:1fr !important;
        grid-template-rows:auto minmax(0,1fr) auto !important;
        flex:1 1 auto !important;
        min-height:0 !important;
        height:100% !important;
        overflow:hidden !important;
        gap:8px !important;
      }

      .results-sidebar{
        order:1 !important;
        display:flex !important;
        flex-direction:row !important;
        align-items:center !important;
        gap:6px !important;
        min-height:56px !important;
        max-height:70px !important;
        padding:6px 8px !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
        white-space:nowrap !important;
        border-radius:14px !important;
      }

      .results-sidebar::-webkit-scrollbar{
        height:0;
      }

      .results-sidebar > *{
        margin:0 !important;
        flex:0 0 auto !important;
      }

      .results-sidebar-top{
        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;
        gap:8px !important;
        margin:0 !important;
        order:-1 !important;
      }

      #exportBtnMobile:not([hidden]){
        display:inline-flex !important;
      }

      .results-sidebar-title,
      .results-sidebar-note,
      .results-sidebar .sidebar-export-head,
      .results-sidebar .sidebar-export-title,
      .results-sidebar .sidebar-export-meta,
      .results-sidebar #sidebarTextDiff{
        display:none !important;
      }

      .results-sidebar .sidebar-export-panel,
      .results-sidebar .sidebar-view-mode-panel,
      .results-sidebar .sidebar-zoom-panel,
      .results-sidebar .sidebar-legend{
        margin:0 !important;
        padding:0 !important;
        background:transparent !important;
        border:0 !important;
        box-shadow:none !important;
      }

      .results-sidebar .sidebar-export-panel{
        display:none !important;
      }

      .results-sidebar .sidebar-export-btn,
      .results-sidebar .sidebar-view-mode-btn,
      .results-sidebar .sidebar-sync-btn{
        width:38px !important;
        min-width:38px !important;
        height:34px !important;
        min-height:34px !important;
        border-radius:10px !important;
        padding:0 !important;
        font-size:0 !important;
        line-height:0 !important;
      }

      .results-sidebar .sidebar-view-mode-card{
        display:none !important;
      }

      .results-sidebar .sidebar-view-mode-toggle{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        width:132px !important;
        min-width:132px !important;
        height:34px !important;
        min-height:34px !important;
        padding:0 10px !important;
      }

      .results-sidebar .sidebar-view-mode-toggle-thumb{
        top:50% !important;
        transform:translateY(-50%) !important;
        left:1px !important;
        width:30px !important;
        height:30px !important;
      }

      .results-sidebar .sidebar-view-mode-toggle.is-split .sidebar-view-mode-toggle-thumb{
        left:calc(100% - 31px) !important;
      }

      .results-sidebar .sidebar-view-mode-toggle-label{
        font-size:.72rem !important;
        letter-spacing:.05em !important;
      }

      .results-sidebar .sidebar-export-btn::before{
        content:"\2193";
        font-size:17px;
        line-height:1;
      }

      .results-sidebar .sidebar-view-mode-btn[data-view-mode="overlay"]::before{
        content:"\25EB";
        font-size:15px;
        line-height:1;
      }

      .results-sidebar .sidebar-view-mode-btn[data-view-mode="split"]::before{
        content:"\25A5";
        font-size:15px;
        line-height:1;
      }

      .results-sidebar .sidebar-sync-btn::before{
        content:none !important;
        display:none !important;
      }

      .results-sidebar #sidebarSyncBtn{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
      }

      .results-sidebar #sidebarSyncBtn .sidebar-sync-btn-icon{
        display:block !important;
        width:20px !important;
        height:20px !important;
        fill:none !important;
        stroke:currentColor !important;
        stroke-width:2.1 !important;
        stroke-linecap:round !important;
        stroke-linejoin:round !important;
        pointer-events:none !important;
      }

      .results-sidebar .legend-controls{
        display:flex !important;
        flex-direction:row !important;
        align-items:center !important;
        gap:6px !important;
      }

      .results-sidebar .legend-pill-control{
        --legend-dot-size:20px !important;
        --legend-gap:4px !important;
        width:116px !important;
        min-width:116px !important;
        gap:3px !important;
      }

      .results-sidebar .legend-pill-doc{
        display:none !important;
      }

      .results-sidebar .legend-control-row{
        gap:4px !important;
      }

      .results-sidebar .legend-doc-opacity-group{
        min-width:72px !important;
        flex:0 0 72px !important;
        gap:4px !important;
      }

      .results-sidebar .legend-doc-opacity{
        min-height:20px !important;
        padding:0 6px !important;
      }

      .results-sidebar .legend-doc-opacity-value{
        font-size:.63rem !important;
      }

      .results-sidebar .legend-doc-opacity-toggle{
        width:20px !important;
        min-width:20px !important;
        height:20px !important;
      }

      .results-sidebar .legend-pill{
        min-height:20px !important;
      }

      .results-sidebar .legend-pill::before{
        height:20px !important;
      }

      .results-sidebar .legend-pill-percent,
      .results-sidebar .legend-pill-color-wrap{
        width:20px !important;
        min-width:20px !important;
        height:20px !important;
      }

      .workspace-main{
        order:2 !important;
        min-height:0 !important;
        height:100% !important;
        margin-top:0 !important;
        overflow:hidden !important;
        display:flex !important;
        flex-direction:column !important;
        gap:6px !important;
      }

      .results-tabs{
        margin:0 !important;
        padding:0 0 2px !important;
        gap:6px !important;
        flex-wrap:nowrap !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
        flex:0 0 auto !important;
      }

      .results-tabs::-webkit-scrollbar{
        height:0;
      }

      .result-tab{
        min-height:32px !important;
        padding:0 10px 1px !important;
        font-size:.88rem !important;
      }

      .workspace-main > #uploadCard,
      .composer-tab-panel > #uploadCard{
        margin:0 !important;
        max-height:100% !important;
        overflow:auto !important;
      }

      .upload-card{
        padding:10px !important;
      }

      .upload-card .note-sm{
        margin:0 0 6px !important;
        font-size:.84rem !important;
        line-height:1.3 !important;
      }

      .upload-compare-row{
        gap:8px !important;
        margin:0 0 8px !important;
      }

      .drop-zone{
        padding:8px !important;
        gap:6px !important;
      }

      .drop-zone-title{
        font-size:1rem !important;
      }

      .drop-zone-list{
        font-size:.82rem !important;
        line-height:1.25 !important;
      }

      .drop-zone-preview{
        margin-top:2px !important;
        min-height:148px !important;
        height:148px !important;
      }

      .drop-zone-preview-page{
        bottom:6px !important;
        padding:2px 7px !important;
        font-size:.68rem !important;
      }

      .results-shell,
      #resultsSection{
        flex:1 1 auto !important;
        min-height:0 !important;
        height:100% !important;
        overflow:hidden !important;
      }

      #history{
        height:100% !important;
        overflow:hidden !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        gap:8px !important;
        padding:0 0 calc(var(--mobile-markers-footer-offset,182px) + env(safe-area-inset-bottom)) !important;
        scroll-padding-bottom:calc(var(--mobile-markers-footer-offset,182px) + env(safe-area-inset-bottom)) !important;
      }

      .result .result-canvas-viewport{
        touch-action:none !important;
      }

      .result[data-view-mode="split"] .result-canvas-viewport{
        overflow:hidden !important;
      }

      body.mobile-markers-footer-visible #history{
        padding-bottom:calc(var(--mobile-markers-footer-offset,182px) + env(safe-area-inset-bottom)) !important;
        scroll-padding-bottom:calc(var(--mobile-markers-footer-offset,182px) + env(safe-area-inset-bottom)) !important;
      }

      body.mobile-markers-footer-visible #history > .run-block:last-child{
        margin-bottom:8px !important;
      }

      body.mobile-markers-footer-visible .workspace-main > #uploadCard,
      body.mobile-markers-footer-visible .composer-tab-panel > #uploadCard,
      body.mobile-markers-footer-visible .composer-tab-panel{
        padding-bottom:calc(var(--mobile-markers-footer-offset,182px) + env(safe-area-inset-bottom)) !important;
      }

      body.mobile-run-footer-visible .workspace-main > #uploadCard,
      body.mobile-run-footer-visible .composer-tab-panel > #uploadCard,
      body.mobile-run-footer-visible .composer-tab-panel{
        padding-bottom:76px !important;
        padding-bottom:calc(76px + env(safe-area-inset-bottom)) !important;
      }

      #history > .run-block{
        width:min(100%,980px) !important;
        margin:0 auto !important;
      }

      #history > .run-block > div{
        width:100% !important;
      }

      .result{
        margin:0 !important;
        padding:0 !important;
      }

      .imgs{
        grid-template-columns:minmax(0,1fr) !important;
        gap:8px !important;
      }

      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgs{
        position:relative !important;
        grid-template-columns:minmax(0,1fr) !important;
        column-gap:0 !important;
        row-gap:8px !important;
        align-items:stretch !important;
        overflow:visible !important;
      }

      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgs > .imgbox-left:not(.mobile-combined-doc-shell),
      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgs > .imgbox-right{
        grid-column:1 !important;
      }

      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgs > .mobile-combined-doc-shell{
        position:absolute !important;
        top:0 !important;
        right:-8px !important;
        bottom:0 !important;
        grid-column:auto !important;
        grid-row:auto !important;
        align-self:auto !important;
        justify-self:auto !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        display:flex !important;
        z-index:7 !important;
      }

      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgs > .imgbox-left:not(.mobile-combined-doc-shell) .imgbox-doc-control-slot,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgs > .imgbox-right .imgbox-doc-control-slot{
        display:none !important;
      }

      .result[data-view-mode="split"] .imgbox-left .result-canvas-shell,
      .result[data-view-mode="split"] .imgbox-right .result-canvas-shell{
        aspect-ratio:auto !important;
        height:clamp(140px,26dvh,270px) !important;
        max-height:30dvh !important;
      }

      .result[data-view-mode="split"] .imgbox-left,
      .result[data-view-mode="split"] .imgbox-right{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) auto !important;
        grid-template-rows:auto minmax(0,1fr) !important;
        grid-template-areas:
          "title title"
          "canvas controls" !important;
        column-gap:0 !important;
        row-gap:6px !important;
        align-items:start !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-head.has-control-slot,
      .result[data-view-mode="split"] .imgbox-right .imgbox-head.has-control-slot{
        display:contents !important;
      }

      .result[data-view-mode="split"] .imgbox-left .doc-title-row,
      .result[data-view-mode="split"] .imgbox-right .doc-title-row{
        grid-area:title !important;
      }

      .result[data-view-mode="split"] .imgbox-left .result-canvas-shell,
      .result[data-view-mode="split"] .imgbox-right .result-canvas-shell{
        grid-area:canvas !important;
        min-width:0 !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot{
        --mobile-doc-controls-collapsed-width:22px;
        --mobile-doc-controls-expanded-width:130px;
        --mobile-doc-controls-current-width:var(--mobile-doc-controls-expanded-width);
        grid-area:controls !important;
        position:relative !important;
        width:var(--mobile-doc-controls-current-width) !important;
        min-height:0 !important;
        display:flex !important;
        align-items:flex-start !important;
        justify-content:flex-end !important;
        align-self:stretch !important;
        justify-self:end !important;
        margin-left:auto !important;
        overflow:hidden !important;
        box-sizing:border-box !important;
        border-radius:16px !important;
        border:1px solid #d6dce5 !important;
        background:#f2f3f3 !important;
        box-shadow:0 10px 24px rgba(31,43,59,.2) !important;
        transition:width .22s ease !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot.is-collapsed,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot.is-collapsed,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot.is-collapsed{
        --mobile-doc-controls-current-width:var(--mobile-doc-controls-collapsed-width);
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot.is-dragging,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot.is-dragging,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot.is-dragging{
        transition:none !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot.is-empty,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot.is-empty{
        display:none !important;
      }

      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgbox-left .imgbox-doc-control-slot.is-empty,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .imgbox-right .imgbox-doc-control-slot.is-empty{
        display:none !important;
      }

      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot{
        display:flex !important;
        flex-direction:column !important;
        height:100% !important;
        min-height:100% !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer{
        width:100% !important;
        min-width:0 !important;
        box-sizing:border-box !important;
        padding:9px 7px 9px calc(7px + var(--mobile-doc-controls-collapsed-width)) !important;
        border:0 !important;
        border-radius:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        display:flex !important;
        align-items:stretch !important;
        opacity:1 !important;
        transform:translateX(0) !important;
        transition:opacity .2s ease, transform .22s ease !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot.is-collapsed .mobile-doc-controls-drawer,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot.is-collapsed .mobile-doc-controls-drawer,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot.is-collapsed .mobile-doc-controls-drawer{
        opacity:0 !important;
        pointer-events:none !important;
        transform:translateX(12px) !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-handle,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-handle,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-handle{
        position:absolute !important;
        left:0 !important;
        top:0 !important;
        bottom:0 !important;
        transform:none !important;
        width:20px !important;
        min-width:20px !important;
        height:auto !important;
        min-height:0 !important;
        border:0 !important;
        border-radius:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        padding:0 !important;
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        cursor:ew-resize !important;
        touch-action:none !important;
        z-index:4 !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-handle-bar,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-handle-bar,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-handle-bar{
        display:block !important;
        width:4px !important;
        height:26px !important;
        border-radius:999px !important;
        background:#8ea2ba !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot.is-expanded .mobile-doc-controls-handle,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot.is-expanded .mobile-doc-controls-handle,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot.is-expanded .mobile-doc-controls-handle{
        border-right-color:transparent !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot.is-expanded .mobile-doc-controls-handle-bar,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot.is-expanded .mobile-doc-controls-handle-bar,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot.is-expanded .mobile-doc-controls-handle-bar{
        background:#6f88a5 !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot.is-hinting .mobile-doc-controls-handle,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot.is-hinting .mobile-doc-controls-handle,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot.is-hinting .mobile-doc-controls-handle{
        animation:mobile-doc-controls-hint-nudge .72s ease-in-out 0s 2;
      }

      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer{
        height:100% !important;
        min-height:100% !important;
        padding-top:0 !important;
        padding-bottom:0 !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-inline-control,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-inline-control,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-inline-control{
        --mobile-vertical-pill-height:118px;
        --legend-dot-size:34px !important;
        --legend-gap:7px !important;
        width:100% !important;
        margin:0 !important;
        display:flex !important;
        flex-direction:column !important;
        gap:10px !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-control-row,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-control-row,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-control-row{
        padding:0 !important;
        border-radius:0 !important;
        background:transparent !important;
        border:0 !important;
        display:grid !important;
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        align-items:start !important;
        justify-items:center !important;
        column-gap:8px !important;
        row-gap:8px !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-group,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-group,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-group{
        min-width:0 !important;
        width:auto !important;
        flex:0 0 auto !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:flex-start !important;
        gap:8px !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity{
        width:42px !important;
        min-width:42px !important;
        height:var(--mobile-vertical-pill-height) !important;
        min-height:var(--mobile-vertical-pill-height) !important;
        padding:0 !important;
        justify-content:center !important;
        border-radius:999px !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity::before,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity::before,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity::before{
        background:linear-gradient(
          180deg,
          rgba(255,255,255,0) 0%,
          rgba(255,255,255,0) calc(100% - (var(--doc-level) * 1%)),
          rgba(74,90,111,.16) calc(100% - (var(--doc-level) * 1%)),
          rgba(74,90,111,.16) 100%
        ) !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-value,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-value,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-value{
        font-size:.68rem !important;
        letter-spacing:0 !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-toggle,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-toggle,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-doc-opacity-toggle{
        width:34px !important;
        min-width:34px !important;
        height:34px !important;
        align-self:center !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill{
        width:42px !important;
        min-width:42px !important;
        height:calc(var(--mobile-vertical-pill-height) + var(--legend-dot-size) + var(--legend-gap)) !important;
        min-height:calc(var(--mobile-vertical-pill-height) + var(--legend-dot-size) + var(--legend-gap)) !important;
        margin:0 auto !important;
        flex:0 0 auto !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:flex-start !important;
        gap:6px !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill::before,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill::before,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill::before{
        left:50% !important;
        right:auto !important;
        top:calc(var(--legend-dot-size) + var(--legend-gap)) !important;
        bottom:0 !important;
        width:var(--legend-dot-size) !important;
        height:auto !important;
        transform:translateX(-50%) !important;
        background:linear-gradient(
          180deg,
          #d0d2d6 0%,
          #d0d2d6 calc(100% - (var(--level) * 1%)),
          var(--legend-color) calc(100% - (var(--level) * 1%)),
          var(--legend-color) 100%
        ) !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-percent,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-percent,
      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-color-wrap,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-color-wrap,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-percent,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-color-wrap{
        width:34px !important;
        min-width:34px !important;
        height:34px !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-percent,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-percent,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-percent{
        display:none !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-color-wrap,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-color-wrap,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-color-wrap{
        position:relative !important;
        left:auto !important;
        top:auto !important;
        transform:none !important;
        order:1 !important;
        margin:0 auto !important;
        background:var(--legend-color) !important;
        border:1px solid rgba(255,255,255,.58) !important;
        box-shadow:0 2px 6px rgba(15,29,45,.22) !important;
      }

      .result[data-view-mode="split"] .imgbox-left .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-range,
      .result[data-view-mode="split"] .imgbox-right .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-range,
      .result[data-view-mode="split"].mobile-single-doc-sidebar .mobile-combined-doc-shell .imgbox-doc-control-slot .mobile-doc-controls-drawer .legend-pill-range{
        order:2 !important;
      }

      @keyframes mobile-doc-controls-hint-nudge{
        0%{
          transform:translateX(0);
        }
        45%{
          transform:translateX(6px);
        }
        100%{
          transform:translateX(0);
        }
      }

      #runSettingsToggle{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        width:52px !important;
        min-width:52px !important;
        height:48px !important;
        min-height:48px !important;
        border-radius:0 !important;
        border-left:1px solid rgba(226,238,250,.44) !important;
        background:#5f85ad !important;
        color:#f3f8ff !important;
      }

      .run-main-bar{
        grid-template-columns:minmax(0,1fr) auto !important;
        align-items:stretch !important;
      }

      #runBtn{
        min-height:48px !important;
        font-size:1rem !important;
        border-right:1px solid rgba(226,238,250,.44) !important;
        background:#5f85ad !important;
        color:#f3f8ff !important;
      }

      #runBtn:hover,
      #runSettingsToggle:hover,
      .run-main-control.settings-open #runSettingsToggle{
        background:#52779f !important;
        color:#ffffff !important;
      }

      #runBtn:disabled{
        background:#89a3bd !important;
        color:#e4edf7 !important;
        border-right:1px solid rgba(223,235,247,.36) !important;
      }

      .actions{
        position:fixed !important;
        left:8px !important;
        right:8px !important;
        bottom:8px !important;
        bottom:calc(8px + env(safe-area-inset-bottom)) !important;
        width:auto !important;
        margin:0 !important;
        padding:0 !important;
        display:flex !important;
        align-items:flex-end !important;
        justify-content:center !important;
        gap:0 !important;
        z-index:98 !important;
        pointer-events:none !important;
      }

      .actions #status{
        display:none !important;
      }

      .actions .run-main-control{
        width:100% !important;
        max-width:none !important;
        margin:0 !important;
        pointer-events:auto !important;
      }

      body:not(.mobile-run-footer-visible) .actions{
        display:none !important;
      }

      .run-main-control .run-settings-panel{
        max-height:0 !important;
        opacity:0 !important;
        visibility:hidden !important;
        overflow:hidden !important;
        padding:0 10px !important;
        border-top:0 !important;
      }

      .run-main-control.settings-open .run-settings-panel{
        max-height:62vh !important;
        opacity:1 !important;
        visibility:visible !important;
        overflow:auto !important;
        padding:10px !important;
        border-top:1px solid #d6dce5 !important;
      }

      .mobile-markers-footer{
        display:none !important;
      }

      .mobile-markers-footer:not([hidden]){
        --mobile-markers-collapsed-height:144px;
        --mobile-markers-expanded-height:min(58dvh,520px);
        display:block !important;
        position:fixed !important;
        left:8px !important;
        right:8px !important;
        bottom:8px !important;
        bottom:calc(8px + env(safe-area-inset-bottom)) !important;
        width:auto !important;
        min-height:114px !important;
        height:var(--mobile-markers-collapsed-height) !important;
        max-height:var(--mobile-markers-collapsed-height) !important;
        padding:20px 8px 6px !important;
        border-radius:14px !important;
        background:#f2f3f3 !important;
        border:1px solid #d6dce5 !important;
        box-shadow:0 10px 24px rgba(31,43,59,.2) !important;
        overflow:hidden !important;
        z-index:95 !important;
        touch-action:pan-x !important;
        transition:height .2s ease,max-height .2s ease !important;
      }

      .mobile-markers-footer.is-expanded:not([hidden]){
        height:var(--mobile-markers-expanded-height) !important;
        max-height:var(--mobile-markers-expanded-height) !important;
      }

      .mobile-markers-handle{
        position:absolute !important;
        left:50% !important;
        top:2px !important;
        transform:translateX(-50%) !important;
        width:84px !important;
        min-width:84px !important;
        height:18px !important;
        min-height:18px !important;
        padding:0 !important;
        border:0 !important;
        background:transparent !important;
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        cursor:ns-resize !important;
        z-index:2 !important;
      }

      .mobile-markers-handle-bar{
        display:block !important;
        width:40px !important;
        height:4px !important;
        border-radius:999px !important;
        background:#8ea2ba !important;
      }

      .mobile-markers-footer.is-expanded .mobile-markers-handle-bar{
        width:50px !important;
        background:#6f88a5 !important;
      }

      .mobile-markers-footer #sidebarMarkers{
        margin:0 !important;
        padding:12px 0 0 !important;
        border:0 !important;
        box-shadow:none !important;
        background:transparent !important;
        height:100% !important;
        min-height:0 !important;
        display:flex !important;
        flex-direction:column !important;
        overflow:hidden !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-markers-head{
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:8px !important;
        position:static !important;
        margin:0 !important;
        padding:0 0 4px !important;
        background:transparent !important;
        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-section-title-wrap{
        display:flex !important;
        align-items:center !important;
        gap:6px !important;
        min-width:0 !important;
        flex:1 1 auto !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-markers-title{
        font-size:.84rem !important;
        font-weight:700 !important;
        color:#1d3f67 !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-markers-count{
        font-size:1.18rem !important;
        line-height:1 !important;
        font-weight:780 !important;
        color:#18385f !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn{
        width:22px !important;
        min-width:22px !important;
        height:22px !important;
        min-height:22px !important;
        padding:0 !important;
        border-radius:999px !important;
        border:1px solid #c6d4e6 !important;
        background:#f7fbff !important;
        color:#4f6f97 !important;
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        gap:0 !important;
        cursor:pointer !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn:hover{
        background:#eef5fd !important;
        border-color:#9cb6d5 !important;
        color:#2f557f !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn .sidebar-visibility-icon{
        width:12px !important;
        height:12px !important;
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn .sidebar-visibility-icon-off{
        display:none !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn .sidebar-visibility-icon svg{
        width:12px !important;
        height:12px !important;
        fill:none !important;
        stroke:currentColor !important;
        stroke-width:1.9 !important;
        stroke-linecap:round !important;
        stroke-linejoin:round !important;
        pointer-events:none !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn.is-off{
        background:#eef2f6 !important;
        border-color:#d0dae6 !important;
        color:#8aa0bd !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn.is-off .sidebar-visibility-icon-on{
        display:none !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn.is-off .sidebar-visibility-icon-off{
        display:inline-flex !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-inline-visibility-btn:not(.is-off) .sidebar-visibility-icon-on{
        display:inline-flex !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-markers-body{
        flex:1 1 auto !important;
        min-height:0 !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-marker-list{
        display:flex !important;
        flex-direction:row !important;
        gap:6px !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
        padding:0 2px 2px !important;
        scroll-snap-type:x mandatory;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-marker-list::-webkit-scrollbar{
        height:0;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-item{
        width:min(62vw,220px) !important;
        min-width:min(62vw,220px) !important;
        max-width:min(62vw,220px) !important;
        min-height:62px !important;
        max-height:92px !important;
        display:flex !important;
        flex-direction:column !important;
        padding:7px 8px !important;
        gap:4px !important;
        text-align:left !important;
        border:1px solid rgba(189,205,224,.85) !important;
        border-radius:10px !important;
        background:rgba(255,255,255,.92) !important;
        scroll-snap-align:start;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-head{
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:6px !important;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-badges{
        display:flex !important;
        align-items:center !important;
        flex-wrap:wrap !important;
        gap:4px !important;
        min-width:0 !important;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-index{
        min-width:26px !important;
        padding:2px 5px !important;
        font-size:.64rem !important;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-kind,
      .mobile-markers-footer #sidebarMarkers .marker-list-side{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        padding:2px 5px !important;
        font-size:.62rem !important;
        border-radius:999px !important;
        border:1px solid rgba(182,199,220,.85) !important;
        background:rgba(241,246,252,.92) !important;
        color:#31506f !important;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-page{
        font-size:.62rem !important;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-content{
        display:flex !important;
        flex-direction:column !important;
        gap:3px !important;
        min-width:0 !important;
      }

      .mobile-markers-footer #sidebarMarkers .marker-list-text{
        font-size:.69rem !important;
        line-height:1.2 !important;
        padding:3px 5px !important;
        border-radius:7px !important;
        overflow-wrap:anywhere !important;
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        overflow:hidden;
      }

      .mobile-markers-footer #sidebarMarkers .marker-object-preview-frame{
        display:none !important;
      }

      .mobile-markers-footer #sidebarMarkers .sidebar-markers-empty{
        font-size:.72rem !important;
        line-height:1.25 !important;
      }

      .mobile-markers-footer.is-expanded #sidebarMarkers .sidebar-marker-list{
        flex-direction:column !important;
        overflow-x:hidden !important;
        overflow-y:auto !important;
        scroll-snap-type:y proximity;
      }

      .mobile-markers-footer.is-expanded #sidebarMarkers .marker-list-item{
        width:100% !important;
        min-width:0 !important;
        max-width:none !important;
        max-height:none !important;
      }
    }
