:root { font-family: sans-serif; }
      body { margin: 0; background: #f5f7fa; color: #111; font-size: 13px; line-height: 1.45; }
      .wrap { max-width: 1680px; margin: 0 auto; padding: 16px; }
      .app-shell { display: grid; grid-template-columns: 240px 1fr; gap: 16px; align-items: start; }
      .sidebar { position: sticky; top: 16px; }
      .topbar { position: sticky; top: 0; z-index: 5; background: #f5f7fa; padding-bottom: 12px; }
      .card { background: #fff; border: 1px solid #d8dee4; border-radius: 8px; padding: 14px; margin-bottom: 16px; }
      .grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
      input, select, button { padding: 7px 10px; border: 1px solid #ccd4dd; border-radius: 6px; font: inherit; font-size: 12px; }
      button { background: #175cd3; color: #fff; border-color: #175cd3; cursor: pointer; }
      button.secondary { background: #fff; color: #344054; border-color: #d0d5dd; }
      button:disabled { opacity: .58; cursor: not-allowed; }
      table { width: 100%; border-collapse: collapse; }
      th, td { padding: 8px 6px; border-bottom: 1px solid #e5e7eb; text-align: left; font-size: 12px; }
      h2 { margin: 0; font-size: 16px; line-height: 1.3; }
      .toolbar { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
      .muted { color: #666; font-size: 12px; }
      .pager { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
      .pager-nav, .pager-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
      .page-number-group { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
      .page-number-btn { min-width: 30px; height: 30px; padding: 0 9px; background: #fff; color: #344054; border-color: #d0d5dd; }
      .page-number-btn.active { background: #175cd3; color: #fff; border-color: #175cd3; }
      .page-ellipsis { color: #98a2b3; font-size: 12px; padding: 0 2px; }
      .pager-size-label { display: inline-flex; align-items: center; gap: 6px; color: #475467; font-size: 12px; }
      .pager-size-label select { min-width: 74px; }
      .pager-jump-form { display: inline-flex; align-items: center; gap: 6px; }
      .pager-jump-form input { width: 68px; text-align: center; }
      .modal { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.65); display: flex; align-items: center; justify-content: center; padding: 24px; }
      .hidden { display: none !important; }
      .modal-card { width: min(1240px, 100%); max-height: 90vh; overflow: auto; background: #fff; border-radius: 10px; padding: 16px; }
      .preview-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; align-items: start; }
      .preview-wrap { background: #111; min-height: 320px; display: flex; align-items: center; justify-content: center; overflow: auto; border-radius: 8px; }
      .preview-wrap.table-preview-mode,
      .preview-wrap.document-preview-mode { background: #fff; align-items: stretch; justify-content: stretch; }
      .preview-image-stage { min-width: 100%; min-height: 100%; display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; }
      .preview-image { max-width: none; max-height: none; display: block; }
      .preview-video { width: 100%; max-height: 70vh; background: #000; }
      .preview-pdf { width: 100%; min-height: 72vh; border: 0; border-radius: 8px; background: #fff; }
      .preview-message { padding: 24px; text-align: center; color: #fff; display: grid; gap: 10px; justify-items: center; }
      .preview-message p { margin: 0; }
      .preview-loading-panel { width: 100%; min-height: 320px; padding: 24px; display: grid; align-content: center; justify-items: center; gap: 12px; }
      .preview-loading-panel .loading-track { width: min(320px, 100%); }
      .preview-loading-panel p { margin: 0; color: #475467; font-size: 12px; }
      .preview-loading-panel.media p { color: #fff; }
      .preview-document-panel { width: 100%; padding: 14px; color: #111; display: grid; gap: 10px; }
      .preview-document-meta { display: flex; flex-wrap: wrap; gap: 8px; }
      .preview-document-note { color: #475467; font-size: 12px; }
      .preview-document-scroll { overflow: auto; max-height: 70vh; border: 1px solid #e4e7ec; border-radius: 8px; background: #fcfcfd; }
      .preview-document-text { margin: 0; padding: 14px; white-space: pre-wrap; word-break: break-word; font-size: 12px; line-height: 1.6; color: #101828; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
      .preview-table-panel { width: 100%; padding: 12px; color: #111; }
      .preview-table-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
      .preview-table-tabs { display: flex; gap: 6px; overflow: auto; padding-bottom: 2px; margin-bottom: 10px; }
      .preview-table-tab-btn { background: #f8fafc; color: #475467; border: 1px solid #d0d5dd; white-space: nowrap; }
      .preview-table-tab-btn.active { background: #eef4ff; color: #3538cd; border-color: #b2ccff; }
      .preview-table-chip { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px; background: #eef4ff; color: #3538cd; font-size: 11px; font-weight: 700; }
      .preview-table-note { color: #475467; font-size: 12px; margin-bottom: 10px; }
      .preview-table-scroll { overflow: auto; max-height: 70vh; border: 1px solid #e4e7ec; border-radius: 8px; }
      .preview-table { width: 100%; min-width: max-content; border-collapse: separate; border-spacing: 0; background: #fff; }
      .preview-table th, .preview-table td { border-bottom: 1px solid #eaecf0; border-right: 1px solid #eaecf0; padding: 7px 8px; font-size: 12px; vertical-align: top; text-align: left; }
      .preview-table th { position: sticky; top: 0; background: #f8fafc; z-index: 1; font-weight: 700; color: #344054; }
      .preview-table td { max-width: 240px; white-space: pre-wrap; word-break: break-word; color: #101828; }
      .preview-table tr:last-child td { border-bottom: 0; }
      .preview-table th:last-child, .preview-table td:last-child { border-right: 0; }
      .preview-table .row-index { background: #f8fafc; color: #667085; font-weight: 600; min-width: 46px; }
      .preview-side { border: 1px solid #e5e7eb; border-radius: 8px; background: #fafafa; padding: 12px; }
      .preview-info-grid { display: grid; gap: 10px; }
      .preview-info-grid div { border-bottom: 1px solid #eceff3; padding-bottom: 8px; }
      .preview-info-grid div:last-child { border-bottom: 0; padding-bottom: 0; }
      .preview-info-grid strong { display: block; font-size: 12px; color: #666; margin-bottom: 4px; }
      .preview-version-section { margin-top: 16px; border-top: 1px solid #e5e7eb; padding-top: 12px; }
      .preview-version-list { display: grid; gap: 8px; max-height: 320px; overflow: auto; }
      .preview-version-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: start; border: 1px solid #d8dee4; border-radius: 8px; background: #fff; padding: 8px; }
      .preview-version-item.active { border-color: #111; box-shadow: inset 0 0 0 1px #111; }
      .preview-version-open-btn { background: none; border: 0; padding: 0; color: inherit; text-align: left; cursor: pointer; display: grid; gap: 4px; }
      .preview-version-open-btn strong { font-size: 13px; }
      .preview-version-actions { display:flex; gap:6px; align-items:center; }
      .preview-version-actions .secondary { white-space: nowrap; }
      .preview-version-meta { display: block; color: #666; font-size: 12px; word-break: break-word; }
      .preview-compare-panel { margin: 10px 0 12px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; }
      .preview-compare-header { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px; }
      .preview-compare-rows { display:grid; gap:8px; }
      .preview-compare-row { display:grid; grid-template-columns: 92px minmax(0, 1fr) minmax(0, 1fr) auto; gap:8px; align-items:start; font-size:12px; }
      .compare-label { color:#666; font-weight:700; }
      .compare-value { word-break:break-word; }
      .compare-pill { display:inline-flex; align-items:center; padding:3px 8px; border-radius:999px; font-size:11px; font-weight:700; }
      .compare-pill.same { background:#eef2f6; color:#475467; }
      .compare-pill.changed { background:#fff4ce; color:#8a5a00; }
      .preview-open-btn { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
      .preview-open-btn strong { color: #111; }
      .tile-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
      .tile { border: 1px solid #e5e7eb; border-radius: 8px; padding: 10px; background: #fafafa; }
      .tile > .preview-entry-btn { display: block; width: 100%; }
      .tile-thumb { width: 100%; aspect-ratio: 4 / 3; border-radius: 6px; background: #e5e7eb; overflow: hidden; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; position: relative; }
      .tile-thumb img, .tile-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; }
      .list-thumb { width: 88px; height: 56px; border-radius: 6px; background: #e5e7eb; overflow: hidden; display: flex; align-items: center; justify-content: center; position: relative; }
      .list-thumb img, .list-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; }
      .thumb-video { position: relative; width: 100%; height: 100%; display: block; overflow: hidden; background: linear-gradient(135deg, #667085 0%, #475467 100%); }
      .video-thumb-bg { position: absolute; inset: 0; display: block; background-color: #344054; background-size: cover; background-position: center; z-index: 0; }
      .video-thumb-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
      .video-thumb-default { position: absolute; inset: 0; z-index: 1; display: flex; align-items: flex-end; justify-content: flex-start; padding: 8px; background:
        radial-gradient(circle at 22% 22%, rgba(255,255,255,.18), transparent 28%),
        linear-gradient(135deg, #6b7280 0%, #374151 55%, #1f2937 100%);
        color: rgba(255,255,255,.92); font-size: 11px; font-weight: 700; letter-spacing: .08em; }
      .video-thumb-default span { padding: 3px 6px; border-radius: 999px; background: rgba(255,255,255,.14); backdrop-filter: blur(4px); }
      .video-thumb-overlay { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; background: linear-gradient(to top, rgba(0,0,0,.26), rgba(0,0,0,0) 45%); transition: background .18s ease; }
      .video-thumb-play { width: 42px; height: 42px; border-radius: 999px; border: 1px solid rgba(255,255,255,.42); background: rgba(0,0,0,.52); color: #fff; font-size: 18px; display: inline-flex; align-items: center; justify-content: center; pointer-events: none; box-shadow: 0 10px 24px rgba(0,0,0,.22); transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
      .list-thumb .video-thumb-play { width: 28px; height: 28px; font-size: 13px; }
      .list-thumb .video-thumb-default { padding: 6px; font-size: 9px; }
      .video-thumb-duration { position: absolute; right: 6px; bottom: 6px; z-index: 3; padding: 2px 6px; border-radius: 4px; background: rgba(17,17,17,.82); color: #fff; font-size: 11px; line-height: 1.2; font-weight: 600; }
      .list-thumb .video-thumb-duration { right: 4px; bottom: 4px; font-size: 10px; padding: 2px 4px; }
      .video-thumb-preview { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; object-fit: cover; display: none; background: #000; }
      .video-thumb-bg,
      .video-thumb-poster,
      .video-thumb-default { transition: transform .18s ease, filter .18s ease; }
      .thumb-video:hover .video-thumb-bg,
      .thumb-video:hover .video-thumb-poster,
      .thumb-video:hover .video-thumb-default { transform: scale(1.035); filter: saturate(1.08) contrast(1.03); }
      .thumb-video:hover .video-thumb-overlay { background: linear-gradient(to top, rgba(0,0,0,.38), rgba(0,0,0,.04) 48%); }
      .thumb-video:hover .video-thumb-play { transform: scale(1.08); background: rgba(0,0,0,.68); box-shadow: 0 12px 26px rgba(0,0,0,.3); }
      .thumb-video.is-playing .video-thumb-preview { display: block; }
      .thumb-video.is-playing .video-thumb-bg,
      .thumb-video.is-playing .video-thumb-poster,
      .thumb-video.is-playing .video-thumb-default,
      .thumb-video.is-playing .video-thumb-overlay { display: none; }
      .tile strong, .tile span { display: block; margin-bottom: 6px; word-break: break-word; }
      .tile-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
      .icon-btn { width: 28px; height: 28px; padding: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; line-height: 1; }
      .btn-icon-svg { width: 14px; height: 14px; display: block; stroke: currentColor; }
      button.download-btn, button.secondary.download-btn { background: #eff8ff; color: #175cd3; border-color: #b2ddff; }
      button.restore-btn, button.secondary.restore-btn { background: #ecfdf3; color: #027a48; border-color: #75e0a7; }
      button.view-btn, button.secondary.view-btn { background: #eef4ff; color: #3538cd; border-color: #c7d7fe; }
      button.view-btn.active, button.secondary.view-btn.active { background: #3538cd; color: #fff; border-color: #3538cd; }
      button.upload-btn { background: #039855; color: #fff; border-color: #039855; }
      button.neutral-btn, button.secondary.neutral-btn { background: #fff; color: #344054; border-color: #d0d5dd; }
      button.confirm-btn { background: #175cd3; color: #fff; border-color: #175cd3; }
      button.danger { background: #b42318; border-color: #b42318; color: #fff; }
      button.danger.secondary { background: #fff5f4; color: #b42318; border-color: #f04438; }
      .selection-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 12px 0; }
      .split-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; margin-bottom: 16px; }
      .split-grid > .card { margin-bottom: 0; }
      .files-top-layout { display:grid; grid-template-columns: minmax(0, 1fr) minmax(380px, 1.15fr); gap: 16px; align-items: start; margin-bottom: 16px; }
      .files-left-stack { display:grid; gap: 16px; align-items: start; }
      .upload-panel-card { min-height: 0; align-self: start; }
      .dropzone { margin-top: 12px; border: 2px dashed #d0d5dd; border-radius: 10px; padding: 16px; background: #f8fafc; text-align: center; color: #475467; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
      .dropzone.dragover { border-color: #111; background: #eef2f6; color: #111; }
      .bulk-preview-list { display: grid; gap: 10px; max-height: 52vh; overflow: auto; margin-top: 12px; }
      .bulk-preview-item { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 12px; align-items: start; border: 1px solid #e5e7eb; border-radius: 8px; background: #fafafa; padding: 10px; }
      .bulk-preview-meta { display: grid; gap: 4px; min-width: 0; }
      .bulk-preview-meta strong, .bulk-preview-meta span { display: block; word-break: break-word; }
      .upload-job-list { display: grid; gap: 10px; margin-top: 12px; max-height: none; overflow: visible; }
      .upload-job-item { border: 1px solid #e5e7eb; border-radius: 8px; background: #fafafa; padding: 9px; display: grid; gap: 8px; }
      .upload-job-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
      .upload-job-title { min-width: 0; }
      .upload-job-title strong, .upload-job-title span { display: block; word-break: break-word; }
      .upload-job-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
      .upload-progress { width: 100%; height: 10px; border-radius: 999px; background: #e5e7eb; overflow: hidden; }
      .upload-progress-bar { height: 100%; background: linear-gradient(90deg, #0f5cc0, #2e90fa); transition: width .15s ease; }
      .upload-job-meta { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
      .upload-job-error { color: #b42318; font-size: 12px; word-break: break-word; }
      .tile-select { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
      .tile-select label { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #475467; }
      .nav-btn { width: 100%; text-align: left; background: #fff; color: #111; border: 1px solid #d8dee4; margin-bottom: 8px; }
      .nav-btn.active { background: #111; color: #fff; border-color: #111; }
      .stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
      .topbar .card { padding: 10px 12px; margin-bottom: 10px; }
      .stat-box { border: 1px solid #e5e7eb; border-radius: 8px; padding: 8px 9px; background: #fff; min-height: 54px; }
      .stat-box strong { display: block; font-size: 11px; color: #666; margin-bottom: 4px; }
      .stat-box span { font-size: 14px; font-weight: 700; }
      .section.hidden { display: none !important; }
      .breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 12px; }
      .crumb { background: #fff; color: #111; border: 1px solid #d8dee4; padding: 6px 10px; border-radius: 999px; cursor: pointer; }
      .browser-link { background: none; border: 0; padding: 0; color: #111; cursor: pointer; font: inherit; text-align: left; }
      .context-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; }
      .path-links { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 4px; }
      .path-link { background: none; border: 0; padding: 0; color: #0f5cc0; cursor: pointer; font: inherit; }
      .path-sep { color: #98a2b3; }
      .path-tail { color: #666; word-break: break-all; }
      .tile .path-links { display: block; }
      .tile-path-inline { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #666; }
      .queue-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
      .status-pill { display: inline-flex; align-items: center; padding: 2px 7px; border-radius: 999px; font-size: 11px; font-weight: 700; }
      .status-pill.queued { background: #fff4ce; color: #8a5a00; }
      .status-pill.processing { background: #dbeafe; color: #1d4ed8; }
      .status-pill.ready { background: #eef2f6; color: #475467; }
      .status-pill.resume_waiting { background: #f3e8ff; color: #7e22ce; }
      .status-pill.uploading { background: #dbeafe; color: #1d4ed8; }
      .status-pill.cancelled { background: #fef3f2; color: #b42318; }
      .status-pill.failed { background: #fee2e2; color: #b91c1c; }
      .status-pill.done { background: #dcfce7; color: #15803d; }
      .status-pill.idle { background: #e5e7eb; color: #374151; }
      .status-pill.stopping { background: #f3e8ff; color: #7e22ce; }
      .compact-form { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
      .loading-strip { display: none; align-items: center; gap: 10px; margin-top: 10px; }
      .loading-strip.active { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
      .loading-track { height: 6px; border-radius: 999px; background: #e4e7ec; overflow: hidden; }
      .loading-bar { width: 40%; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #175cd3, #53b1fd); animation: loading-slide 1.1s linear infinite; transform: translateX(-140%); }
      .loading-note { color: #475467; font-size: 11px; white-space: nowrap; }
      .empty-state { display: grid; gap: 8px; justify-items: start; padding: 18px 8px; }
      .empty-state strong { font-size: 13px; color: #101828; }
      .empty-state span { color: #475467; font-size: 12px; }
      .empty-state.tile-empty { grid-column: 1 / -1; border: 1px dashed #d0d5dd; border-radius: 8px; background: #fcfcfd; padding: 16px; }
      .topbar-meta-row { display:flex; justify-content:flex-end; align-items:center; gap:8px; margin-top:8px; flex-wrap:wrap; }
      .archive-jobs-notice-btn { display:inline-flex; align-items:center; gap:8px; background:#eff8ff; color:#175cd3; border-color:#b2ddff; }
      .archive-jobs-notice-btn strong { font-size:12px; }
      .archive-jobs-notice-btn span { font-size:11px; color:#475467; }
      .archive-jobs-notice-btn .badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 6px; border-radius:999px; background:#b42318; color:#fff; font-size:11px; font-weight:700; }
      .toast-stack { position: fixed; right: 18px; bottom: 18px; z-index: 1200; display: grid; gap: 10px; width: min(360px, calc(100vw - 36px)); }
      .toast-card { background:#fff; border:1px solid #d8dee4; border-left:4px solid #175cd3; border-radius:10px; padding:12px; box-shadow:0 14px 40px rgba(16,24,40,.14); display:grid; gap:8px; }
      .toast-card.success { border-left-color:#039855; }
      .toast-card.error { border-left-color:#d92d20; }
      .toast-card strong { font-size:13px; color:#101828; }
      .toast-card p { margin:0; color:#475467; font-size:12px; }
      .toast-actions { display:flex; justify-content:flex-end; gap:8px; }
      .table-wrap { overflow:auto; }
      .result-table-wrap { overflow-x: auto; overflow-y: visible; }
      .result-table { min-width: 1220px; }
      .result-table tbody tr { --row-bg: #fff; }
      .result-table tbody tr:hover { --row-bg: #f5faff; }
      .result-table tbody td { background: var(--row-bg); transition: background .12s ease; }
      .result-table th.col-name,
      .result-table td.col-name { position: sticky; left: 0; z-index: 2; background: #fff; box-shadow: 8px 0 16px -14px rgba(16,24,40,.28); }
      .result-table thead th.col-name { z-index: 4; background: #f8fafc; }
      .result-table th.col-actions,
      .result-table td.col-actions { position: sticky; right: 0; z-index: 3; background: #fff; box-shadow: -8px 0 16px -14px rgba(16,24,40,.28); }
      .result-table thead th.col-actions { background: #f8fafc; z-index: 5; }
      .result-table tbody td.col-name,
      .result-table tbody td.col-actions { background: var(--row-bg); }
      .result-table td.col-actions > div,
      .result-table th.col-actions { white-space: nowrap; }
      .result-table td.col-name .preview-open-btn,
      .result-table td.col-name .browser-link { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .result-table td.col-size,
      .result-table td.col-updated,
      .result-table td.col-created,
      .result-table td.col-version,
      .result-table td.col-deleted { white-space: nowrap; }
      .mobile-path-text { display: none; color: #667085; }
      .mobile-result-list { display: none; }
      .mobile-result-card { border: 1px solid #e4e7ec; border-radius: 14px; background: #fff; padding: 14px; display: grid; gap: 12px; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
      .mobile-result-card.folder { background: #fcfcfd; }
      .mobile-result-header { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 12px; align-items: start; }
      .mobile-result-header.no-thumb { grid-template-columns: minmax(0, 1fr) auto; }
      .mobile-result-thumb { width: 96px; height: 96px; border-radius: 12px; overflow: hidden; background: #e5e7eb; display: flex; align-items: center; justify-content: center; position: relative; }
      .mobile-result-thumb img, .mobile-result-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; }
      .mobile-result-folder-thumb { font-size: 34px; color: #667085; }
      .mobile-result-main { min-width: 0; display: grid; gap: 8px; align-content: start; }
      .mobile-result-title { font-size: 15px; font-weight: 700; line-height: 1.35; color: #101828; max-width: 100%; }
      .mobile-result-title.preview-open-btn, .mobile-result-title.browser-link { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .mobile-result-select-wrap { display: flex; justify-content: flex-end; align-items: flex-start; }
      .mobile-result-select { display: inline-flex; align-items: center; gap: 6px; color: #667085; font-size: 12px; white-space: nowrap; flex-shrink: 0; }
      .mobile-result-select input { width: 18px; height: 18px; margin: 0; }
      .mobile-result-path { color: #475467; font-size: 13px; line-height: 1.45; word-break: break-word; }
      .mobile-result-subline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; color: #667085; font-size: 12px; }
      .mobile-result-chip { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px; background: #eef4ff; color: #3538cd; font-size: 11px; font-weight: 700; }
      .mobile-result-meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
      .mobile-result-meta { border-radius: 10px; background: #f8fafc; padding: 9px 10px; min-width: 0; }
      .mobile-result-meta strong { display: block; font-size: 11px; color: #667085; margin-bottom: 3px; }
      .mobile-result-meta span { display: block; font-size: 13px; color: #101828; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .mobile-result-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
      .mobile-result-actions .icon-btn,
      .mobile-result-actions .secondary,
      .mobile-result-actions .danger { min-height: 36px; min-width: 36px; }
      .mobile-result-actions .icon-btn { width: 36px; height: 36px; }
      @keyframes loading-slide {
        0% { transform: translateX(-140%); }
        100% { transform: translateX(320%); }
      }
      @media (max-width: 900px) { .grid { grid-template-columns: 1fr 1fr; } }
      @media (max-width: 900px) { .tile-grid { grid-template-columns: 1fr 1fr; } }
      @media (max-width: 900px) { .stats-grid, .queue-grid, .split-grid, .files-top-layout { grid-template-columns: 1fr 1fr; } .app-shell { grid-template-columns: 1fr; } .sidebar { position: static; } .preview-layout { grid-template-columns: 1fr; } }
      @media (max-width: 768px) {
        body { font-size: 14px; }
        input, select, button { font-size: 13px; padding: 9px 11px; }
        .card { padding: 16px 14px; }
        .toolbar { align-items: flex-start; }
        .topbar { padding-bottom: 8px; }
        .topbar .card { padding: 9px 10px; }
        .topbar .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
        .topbar .stat-box { min-height: 0; padding: 7px 8px; }
        .topbar .stat-box strong { font-size: 10px; margin-bottom: 2px; }
        .topbar .stat-box span { font-size: 13px; }
        .archive-jobs-notice-btn strong { font-size: 11px; }
        .archive-jobs-notice-btn span { font-size: 10px; }
        .result-table-wrap { display: none !important; }
        .mobile-result-list:not(.hidden) { display: grid; gap: 12px; margin-top: 12px; }
        .selection-toolbar { align-items: stretch; }
        .selection-toolbar > div { width: 100%; }
        .selection-toolbar > div button { flex: 1 1 calc(50% - 4px); min-height: 38px; }
        .toolbar > div:last-child { width: 100%; justify-content: space-between; }
        .result-table .col-select,
        .result-table .col-owner,
        .result-table .col-bucket,
        .result-table .col-created,
        .result-table .col-version { display: none; }
        .result-table td.col-thumb,
        .result-table th.col-thumb { width: 76px; min-width: 76px; }
        .result-table .desktop-path-links { display: none; }
        .mobile-path-text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .pager { align-items: flex-start; }
        .pager-nav, .pager-tools { width: 100%; }
        .pager-tools { justify-content: space-between; }
      }
      @media (max-width: 640px) {
        .grid, .tile-grid, .stats-grid, .queue-grid, .split-grid, .files-top-layout { grid-template-columns: 1fr; }
        .mobile-result-header { grid-template-columns: 88px minmax(0, 1fr) auto; }
        .mobile-result-thumb { width: 88px; height: 88px; }
        .mobile-result-meta-grid { grid-template-columns: 1fr; }
        .pager-tools { flex-direction: column; align-items: stretch; }
        .pager-jump-form { width: 100%; }
        .pager-jump-form input { flex: 1 1 auto; width: auto; }
      }