:root {
        color-scheme: light;
        /* Design system – mock-inspired */
        --bg-page: #f5f5f5;
        --bg-primary: #ffffff;
        --bg-card: #ffffff;
        --bg-secondary: #f8f9fa;
        --surface: #ffffff;
        --surface-alt: #f9fafb;
        --border: #e5e7eb;
        --border-strong: #d1d5db;
        --accent: #0ba3dc;
        --accent-light: #e0f7ff;
        --accent-border: #7dd3f0;
        --accent-text: #0680ac;
        --accent-strong: #111827;
        --accent-soft: rgba(11, 163, 220, 0.12);
        --text: #111827;
        --muted: #6b7280;
        --text-muted: #6b7280;
        --text-faint: #9ca3af;
        --text-ghost: #d1d5db;
        --label: #374151;
        --success: #16a34a;
        --success-soft: rgba(22, 163, 74, 0.12);
        --danger: #dc2626;
        --danger-soft: rgba(220, 38, 38, 0.12);
        --radius-sm: 8px;
        --radius-md: 12px;
        --radius-lg: 16px;
        --radius-xl: 24px;
        --shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
        --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
        --backdrop: rgba(0, 0, 0, 0.45);
        --focus-ring: rgba(11, 163, 220, 0.25);
        font-family: "Inter", "Gotham", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
      }
      *, *::before, *::after { box-sizing: border-box; }
      body { margin: 0; min-height: 100vh; background: var(--bg-page); color: var(--text); -webkit-font-smoothing: antialiased; }
      body.post-modal-open { overflow: hidden; }
      a { color: inherit; }
      .app { min-height: 100vh; display: flex; flex-direction: row; }
      .top-nav { position: sticky; top: 0; z-index: 50; background: #ffffff; border-right: 1px solid var(--border); box-shadow: 0 1px 3px rgba(0,0,0,0.06); width: 240px; height: 100vh; }
      .top-nav__inner { height: 100%; display: flex; flex-direction: column; align-items: stretch; padding: 1.25rem 1rem; gap: 1rem; }
      .top-nav__brand { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; text-decoration: none; color: inherit; text-align: center; }
      .top-nav__logo { display: flex; align-items: center; justify-content: center; width: 100%; }
      .top-nav__logo-img { display: block; width: 100%; max-width: 208px; height: auto; max-height: 140px; object-fit: contain; }
      .top-nav__subtitle { font-size: 0.75rem; color: #9ca3af; font-weight: 500; }
      .top-nav__links { display: flex; flex-direction: column; align-items: stretch; gap: 0.35rem; }
      .top-nav__link { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 0.75rem; border-radius: 0.6rem; font-size: 0.875rem; font-weight: 500; color: #6b7280; text-decoration: none; transition: color 0.15s, background 0.15s; }
      .top-nav__link:hover { color: #374151; background: #f3f4f6; }
      .top-nav__link.top-nav__link--active { color: #0680ac; background: #e0f7ff; }
      .top-nav__link.top-nav__link--active .top-nav__icon { color: #0ba3dc; }
      .top-nav__icon { flex-shrink: 0; color: #6b7280; }
      .top-nav__actions { display: none; }
      .top-nav__hamburger { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 40px; height: 40px; padding: 8px; border: 1px solid var(--border); border-radius: 8px; background: transparent; cursor: pointer; align-self: flex-start; }
      .top-nav__hamburger span { display: block; width: 20px; height: 2px; background: var(--text); border-radius: 1px; }
      @media (max-width: 900px) {
        .app { flex-direction: column; }
        .top-nav { width: 100%; height: auto; border-right: none; border-bottom: 1px solid var(--border); }
        .top-nav__inner { flex-direction: row; flex-wrap: wrap; height: auto; min-height: 56px; padding: 0.75rem 1rem; }
        .top-nav__brand { flex-direction: row; align-items: center; text-align: left; gap: 0.65rem; }
        .top-nav__logo { width: auto; }
        .top-nav__logo-img { max-width: none; height: 42px; max-height: none; width: auto; }
        .top-nav__hamburger { display: flex; }
        .top-nav__links, .top-nav__actions { display: none; width: 100%; }
        .top-nav__links.is-open { display: flex; flex-direction: column; width: 100%; margin-top: 0.5rem; padding-top: 0.5rem; border-top: 1px solid var(--border); }
        .top-nav__actions.is-open { display: flex; flex-direction: column; width: 100%; }
        .top-nav__link { padding: 0.625rem 0.75rem; }
        .shell { padding: 1.25rem 1.5rem; }
      }
      .shell { max-width: none; width: 100%; margin: 0; padding: 1.5rem 2rem; display: flex; flex-direction: column; gap: 1rem; }
      .page-head { margin-bottom: 0.25rem; }
      .page-head__title { margin: 0; font-size: 1.125rem; font-weight: 600; color: #111827; }
      .page-head__subtitle { margin: 0.15rem 0 0; font-size: 0.8125rem; color: #6b7280; }
      .launch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
      @media (max-width: 1024px) { .launch-grid { grid-template-columns: 1fr; } }
      .config-card { display: flex; flex-direction: column; width: 100%; max-width: 100%; min-height: 100%; background: #ffffff; border: 1px solid #e5e7eb; border-radius: 10px; box-shadow: 0 1px 2px rgba(0,0,0,0.05); overflow: hidden; }
      .config-card__body { flex: 1; min-height: 0; overflow-y: auto; padding: 1rem 1.25rem; }
      .config-card__footer { padding: 1rem 1.25rem; border-top: 1px solid #f3f4f6; flex-shrink: 0; }
      .field-block { margin-bottom: 1.25rem; }
      .field-block__label { display: block; font-size: 0.875rem; font-weight: 600; color: #374151; margin-bottom: 0.5rem; }
      .file-dropdown { position: relative; }
      .file-dropdown__trigger { display: flex; align-items: center; gap: 0.5rem; width: 100%; padding: 0.625rem 0.875rem; border: 1px solid #e5e7eb; border-radius: 8px; background: #f3f4f6; font-size: 0.8125rem; text-align: left; cursor: pointer; transition: border-color 0.2s, box-shadow 0.2s; }
      .file-dropdown__trigger:hover { border-color: #d1d5db; }
      .file-dropdown__trigger[aria-expanded="true"],
      .file-dropdown--open .file-dropdown__trigger { border-color: #0ba3dc; box-shadow: 0 0 0 3px rgba(11,163,220,0.15); background: #f9fafb; }
      .file-dropdown__icon--film { color: #6b7280; flex-shrink: 0; }
      .file-dropdown__trigger:has(.file-dropdown__input:not([value=""])) .file-dropdown__icon--film { color: #0ba3dc; }
      .file-dropdown__input { flex: 1; min-width: 0; border: none; background: transparent; font-size: 0.875rem; color: #111827; font-weight: 500; outline: none; }
      .file-dropdown__input::placeholder { color: #9ca3af; font-weight: 400; }
      .file-dropdown__chevron { color: #6b7280; flex-shrink: 0; transition: transform 0.2s; }
      .file-dropdown__trigger[aria-expanded="true"] .file-dropdown__chevron,
      .file-dropdown--open .file-dropdown__chevron { transform: rotate(180deg); }
      .file-dropdown__panel { position: absolute; top: 100%; left: 0; right: 0; margin-top: 6px; background: #ffffff; border: 1px solid #e5e7eb; border-radius: 12px; box-shadow: 0 10px 25px rgba(0,0,0,0.08); z-index: 20; overflow: hidden; display: flex; flex-direction: column; max-height: 320px; }
      .file-dropdown__panel[hidden] { display: none !important; }
      .file-upload { padding: 0.75rem; border-bottom: 1px solid #f3f4f6; background: #ffffff; }
      .file-upload__zone { border: 1px dashed #cbd5f5; border-radius: 10px; padding: 0.75rem 0.9rem; text-align: center; background: #f9fafb; cursor: pointer; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; display: flex; flex-direction: column; gap: 0.35rem; align-items: center; }
      .file-upload__zone:hover { border-color: #9ca3af; background: #f3f4f6; }
      .file-upload__zone.is-dragover { border-color: #0ba3dc; background: rgba(11,163,220,0.08); box-shadow: 0 0 0 3px rgba(11,163,220,0.12); }
      .file-upload__title { font-size: 0.85rem; font-weight: 600; color: #111827; }
      .file-upload__subtitle { font-size: 0.75rem; color: #6b7280; }
      .file-upload__btn { margin-top: 0.35rem; }
      .file-upload__status { margin-top: 0.4rem; font-size: 0.75rem; color: #6b7280; min-height: 1rem; }
      .file-upload__status.is-error { color: #b91c1c; }
      .file-upload--compact { padding: 0; border-bottom: none; background: transparent; margin-top: 0.6rem; }
      .file-upload--compact .file-upload__zone { background: #ffffff; }
      .file-dropdown__search-wrap { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; background: #ffffff; border-bottom: 1px solid #f3f4f6; }
      .file-dropdown__search-wrap .file-dropdown__search-icon { color: #9ca3af; flex-shrink: 0; }
      .file-dropdown__search { flex: 1; min-width: 0; padding: 0.5rem 0.6rem; border: none; border-radius: 8px; background: #f3f4f6; font-size: 0.875rem; color: #111827; outline: none; }
      .file-dropdown__search::placeholder { color: #9ca3af; }
      .file-dropdown__search:focus { background: #e5e7eb; }
      .file-dropdown__list { padding: 0.25rem 0; overflow-y: auto; max-height: 260px; flex: 1; min-height: 0; }
      .file-dropdown__panel .input-files__status { margin: 0; padding: 1rem 0.75rem; font-size: 0.875rem; color: #6b7280; }
      .file-dropdown__panel .input-files__list { display: flex; flex-direction: column; gap: 0; }
      .file-dropdown__panel .input-files__row { display: flex; align-items: center; gap: 0; border-bottom: 1px solid #f3f4f6; }
      .file-dropdown__panel .input-files__row:last-child { border-bottom: none; }
      .file-dropdown__panel .input-files__item { flex: 1; min-width: 0; border: none; border-radius: 0; padding: 0.75rem 0.75rem 0.75rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; background: transparent; color: #111827; font-size: 0.875rem; cursor: pointer; transition: background 0.15s; text-align: left; }
      .file-dropdown__panel .input-files__item:hover { background: #f9fafb; }
      .file-dropdown__panel .input-files__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; color: #111827; }
      .file-dropdown__panel .input-files__meta { flex-shrink: 0; font-size: 0.8125rem; color: #9ca3af; white-space: nowrap; }
      .file-dropdown__panel .input-files__delete-btn { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-right: 0.5rem; border: none; border-radius: 6px; background: transparent; color: #d1d5db; cursor: pointer; transition: color 0.2s, background 0.2s; }
      .file-dropdown__panel .input-files__delete-btn:hover { color: #dc2626; background: #fef2f2; }
      .config-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
      .stepper { display: flex; align-items: stretch; height: 40px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb; overflow: hidden; }
      .stepper__btn { width: 48px; border: none; border-right: 1px solid #e5e7eb; background: transparent; color: #9ca3af; font-size: 1.25rem; font-weight: 700; cursor: pointer; transition: background 0.2s, color 0.2s; }
      .stepper__btn:hover { background: #fff; color: #0ba3dc; }
      .stepper__btn:last-of-type { border-right: none; border-left: 1px solid #e5e7eb; }
      .stepper__value { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 1rem; font-weight: 700; color: #111827; }
      .segmented { display: flex; padding: 3px; background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 8px; height: 40px; }
      .segmented__btn { flex: 1; border: none; border-radius: 8px; background: transparent; font-size: 0.875rem; font-weight: 700; color: #6b7280; cursor: pointer; transition: all 0.2s; }
      .segmented__btn:hover { color: #374151; }
      .segmented__btn.active { background: #ffffff; color: #111827; box-shadow: 0 1px 2px rgba(0,0,0,0.05); border: 1px solid #f3f4f6; }
      .toggle-block { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0.75rem; border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb; margin-bottom: 0.75rem; }
      .toggle-block__label { margin: 0; font-size: 0.8125rem; font-weight: 600; color: #111827; }
      .toggle { position: relative; display: inline-block; width: 48px; height: 26px; flex-shrink: 0; cursor: pointer; }
      .toggle input { opacity: 0; width: 0; height: 0; }
      .toggle__track { position: absolute; inset: 0; background: #e5e7eb; border-radius: 999px; transition: background 0.3s; }
      .toggle__track::after { content: ""; position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; background: #fff; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,0.2); transition: transform 0.3s; }
      .toggle input:checked + .toggle__track { background: #111827; }
      .toggle input:checked + .toggle__track::after { transform: translateX(22px); }
      #vt-preview-section[hidden] { display: none !important; }
      .vt-preview { margin-top: 1rem; margin-bottom: 0; }
      .vt-preview__wrap { position: relative; width: 100%; height: 250px; border-radius: 10px; overflow: hidden; border: 1px solid #e5e7eb; background: #f9fafb; }
      .vt-preview__video { display: block; width: 100%; height: 100%; object-fit: contain; }
      .vt-preview__video[src=""] { display: none; }
      .vt-preview__placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; margin: 0; padding: 1rem; font-size: 0.8125rem; color: #6b7280; text-align: center; background: #f3f4f6; }
      .vt-preview__wrap:has(.vt-preview__video[src]:not([src=""])) .vt-preview__placeholder { display: none; }
      .status { display: none; padding: 0.75rem 1rem; border-radius: 12px; font-size: 0.875rem; margin-top: 0.5rem; }
      .status.show { display: block; }
      .status--error { border: 1px solid #fecaca; background: #fef2f2; color: #dc2626; }
      .btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; padding: 0.75rem 1.25rem; border: none; border-radius: 8px; font-size: 0.8125rem; font-weight: 700; background: #111827; color: #fff; cursor: pointer; transition: background 0.2s, transform 0.2s; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
      .btn-primary:hover:not(:disabled) { background: #1f2937; transform: translateY(-1px); }
      .btn-primary:disabled { background: #f3f4f6; color: #9ca3af; cursor: not-allowed; border: 1px solid #e5e7eb; }
      .btn-primary__loading { display: none; }
      .btn-primary:disabled .btn-primary__text, .btn-primary:disabled .btn-primary__icon--zap { display: none; }
      .btn-primary:disabled .btn-primary__loading { display: inline-flex !important; align-items: center; gap: 0.5rem; }
      .btn-success { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; padding: 1rem 1.5rem; border: none; border-radius: 12px; font-size: 0.875rem; font-weight: 700; background: #16a34a; color: #fff; text-decoration: none; cursor: pointer; transition: background 0.2s; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
      .btn-success:hover { background: #15803d; }
      .spinner { display: inline-block; width: 18px; height: 18px; border: 2px solid #e5e7eb; border-top-color: #0ba3dc; border-radius: 50%; animation: spin 0.8s linear infinite; }
      @keyframes spin { to { transform: rotate(360deg); } }
      .process-card { display: flex; flex-direction: column; width: 100%; max-width: 100%; min-height: 100%; background: #ffffff; border: 1px solid #e5e7eb; border-radius: 10px; box-shadow: 0 1px 2px rgba(0,0,0,0.05); overflow: hidden; }
      .process-card__header { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid #e5e7eb; background: #f9fafb; }
      .process-card__header-left { display: flex; align-items: center; gap: 1rem; }
      .process-card__icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
      .process-card__icon--idle { background: #f3f4f6; border: 1px solid #e5e7eb; color: #9ca3af; }
      .process-card__icon--running { background: #e0f7ff; border: 1px solid #7dd3f0; color: #0ba3dc; }
      .process-card__icon--done { background: #dcfce7; border: 1px solid #86efac; color: #16a34a; }
      .process-card__icon .spinner { width: 24px; height: 24px; border-width: 2px; border-top-color: #0ba3dc; }
      .process-card__title { margin: 0; font-size: 0.875rem; font-weight: 700; color: #111827; }
      .process-card__subtitle { margin: 0.25rem 0 0; font-size: 0.6875rem; color: #6b7280; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .process-card__job-id { margin: 0.2rem 0 0; font-size: 0.6875rem; font-family: ui-monospace, "SF Mono", Monaco, monospace; color: #6b7280; word-break: break-all; line-height: 1.35; }
      .process-card__job-id:empty { display: none; }
      .process-card__header-right { display: flex; flex-direction: column; align-items: flex-end; gap: 0.35rem; flex-shrink: 0; }
      .process-card__badge { font-size: 0.625rem; font-weight: 700; color: #0369a1; background: #e0f7ff; padding: 0.25rem 0.5rem; border-radius: 6px; border: 1px solid #7dd3f0; }
      .process-card__stop-btn { display: none; padding: 0.25rem 0.5rem; font-size: 0.6875rem; font-weight: 600; color: #0369a1; background: #e0f7ff; border: 1px solid #7dd3f0; border-radius: 6px; cursor: pointer; white-space: nowrap; }
      .process-card__stop-btn:hover { background: #bae6fd; color: #0c4a6e; }
      .process-card__stop-btn.show { display: inline-block; }
      .process-card__timeline { flex: 1; min-height: 160px; overflow-y: auto; overflow-x: hidden; padding: 1rem 1.25rem; position: relative; background: #fff; scroll-behavior: smooth; }
      .timeline__line { position: absolute; left: 12px; top: 1rem; bottom: 1rem; width: 2px; background: #f3f4f6; border-radius: 2px; z-index: 0; }
      .job-log__body { position: relative; z-index: 1; }
      .job-log__empty { margin: 0; font-size: 0.8125rem; color: #6b7280; text-align: center; padding: 1.5rem 1rem; }
      .job-log__list { list-style: none; margin: 0; padding: 0; }
      .job-log__item { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.15rem 0 1rem; position: relative; font-size: 0.8125rem; color: #374151; }
      .job-log__item:last-child { padding-bottom: 0.15rem; }
      .job-log__item::before { content: ""; width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0; background: #f3f4f6; border: 2px solid #e5e7eb; }
      .job-log__item--completed::before, .job-log__item--success::before { content: "✓"; background: #dcfce7; border-color: #86efac; color: #16a34a; font-size: 0.7rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
      .job-log__item--active { font-weight: 600; color: #111827; }
      .job-log__item--active::before { background: #e0f7ff; border-color: #7dd3f0; box-shadow: 0 0 0 3px rgba(11,163,220,0.12); border-width: 2px; border-style: solid; border-top-color: #0ba3dc; animation: spin 0.8s linear infinite; }
      .job-log__item--error::before { content: "✕"; background: #fef2f2; border-color: #fecaca; color: #dc2626; font-size: 0.75rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
      .job-log__item--complete.job-log__item--success { color: #16a34a; font-weight: 700; }
      .job-log__item--complete.job-log__item--success::before { background: #dcfce7; border-color: #86efac; color: #16a34a; }
      .process-card__footer { padding: 1rem 1.25rem; border-top: 1px solid #f3f4f6; background: #fff; flex-shrink: 0; }
      .process-card__footer-waiting { display: flex; align-items: center; justify-content: center; padding: 0.75rem 1rem; border: 1px dashed #e5e7eb; border-radius: 8px; font-size: 0.6875rem; color: #9ca3af; }
      .job-log__footer-link { display: none !important; }
      #job-log.job-log--completed .job-log__footer-link { display: inline-flex !important; }
      #job-log.job-log--completed .process-card__footer-waiting { display: none !important; }
      .btn-ghost { background: transparent; border: 1px solid #e5e7eb; color: #6b7280; padding: 0.5rem 1rem; border-radius: 8px; font-size: 0.85rem; font-weight: 500; cursor: pointer; }
      .btn-ghost:hover { background: #f9fafb; color: #374151; }
      .btn-small { padding: 0.4rem 0.75rem; font-size: 0.8rem; }
      .card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: clamp(1.6rem, 3vw, 2.2rem); box-shadow: var(--shadow); position: relative; overflow: hidden; }
      .card::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; border: 1px solid var(--border); }
      .card h2 { margin: 0 0 0.6rem; font-size: 1.35rem; }
      .card p.lead { margin: 0; color: var(--muted); max-width: 820px; line-height: 1.55; }
      .controls { display: grid; gap: 1rem clamp(1rem,3vw,1.5rem); grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); }
      .field { display: flex; flex-direction: column; gap: 0.45rem; }
      label { font-size: 0.92rem; font-weight: 600; color: var(--label); }
      input[type="text"], input[type="password"], input[type="number"], textarea, select { width: 100%; padding: 0.75rem 0.95rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface-alt); color: var(--text); font-size: 0.95rem; transition: border 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; }
      input:focus, textarea:focus, select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(11, 163, 220, 0.12); background: var(--surface); }
      textarea { resize: vertical; min-height: 190px; font-family: "JetBrains Mono", monospace; line-height: 1.48; }
      .card-actions { display: flex; flex-wrap: wrap; gap: 0.9rem; align-items: center; justify-content: space-between; }
      .btn { border: none; border-radius: 12px; padding: 0.85rem 1.65rem; font-size: 0.95rem; font-weight: 600; letter-spacing: 0.01em; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; }
      .btn.primary { background: #111827; color: #fff; box-shadow: var(--shadow); }
      .btn.primary:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); background: #1f2937; }
      .btn.ghost { background: transparent; border: 1px solid var(--border); color: var(--text); }
      .btn.ghost:hover { background: var(--surface-alt); border-color: var(--border-strong); }
      .btn.small { padding: 0.5rem 1rem; font-size: 0.85rem; }
      .status { flex: 1 1 auto; min-width: 240px; padding: 0.75rem 1rem; border-radius: var(--radius-md); border: 1px solid var(--border-strong); background: var(--accent-soft); color: var(--text); display: none; }
      .status.show { display: block; }
      .simple-controls { display: grid; gap: 1rem clamp(1rem,3vw,1.5rem); grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); }
      .simple-controls .field { min-width: 0; }
      .field--toggle { flex-direction: row; align-items: center; gap: 0.6rem; grid-column: 1 / -1; }
      .toggle-label { display: inline-flex; align-items: center; gap: 0.55rem; cursor: pointer; font-size: 0.92rem; font-weight: 600; color: var(--label); user-select: none; }
      .toggle-label input[type="checkbox"] { position: absolute; opacity: 0; width: 0; height: 0; }
      .toggle-switch { position: relative; width: 42px; height: 24px; background: var(--border); border-radius: var(--radius-md); transition: background 0.25s ease; flex-shrink: 0; }
      .toggle-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; background: var(--border-strong); border-radius: 50%; transition: transform 0.25s ease, background 0.25s ease; }
      .toggle-label input:checked + .toggle-switch { background: #111827; }
      .toggle-label input:checked + .toggle-switch::after { transform: translateX(18px); background: #fff; }
      .field__hint { font-size: 0.8rem; color: var(--muted); margin: 0; }
      .status.error { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); }
      .job-log__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
      .job-log__item { position: relative; padding-left: 1.5rem; padding-top: 0.15rem; color: var(--text-muted); font-size: 0.88rem; }
      .job-log__item::before { content: ""; position: absolute; left: 0; top: 0.5rem; width: 8px; height: 8px; border-radius: 50%; background: var(--border-strong); }
      .job-log__item--waiting::before { background: var(--border-strong); }
      .job-log__item--completed::before { background: var(--accent); }
      .job-log__item--completed { color: var(--text); }
      .job-log__item--active { color: var(--text); font-weight: 500; }
      .job-log__item--active::before { background: var(--accent); box-shadow: 0 0 0 3px rgba(11, 163, 220, 0.25); animation: job-pulse 1.2s ease-in-out infinite; }
      @keyframes job-pulse { 50% { box-shadow: 0 0 0 6px rgba(11, 163, 220, 0.15); } }
      .job-log__item--success { color: var(--success); }
      .job-log__item--success::before { background: var(--success); }
      .job-log__item--error { color: var(--danger); }
      .job-log__item--error::before { background: var(--danger); }
      .cuts-board { display: flex; flex-direction: column; gap: 1.25rem; background: #f5f5f5; padding: 1.5rem; border-radius: 12px; }
      .cuts-board__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
      .cuts-board__head { flex: 1; min-width: 0; }
      .cuts-board__title { margin: 0; font-size: 1.25rem; font-weight: 700; color: #111827; }
      .cuts-board__subtitle { margin: 0.35rem 0 0; font-size: 0.875rem; color: #6b7280; }
      .cuts-board__toolbar { display: flex; align-items: stretch; gap: 0.5rem; flex-wrap: wrap; width: 100%; justify-content: space-between; }
      .cuts-board__search-wrap { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; background: #f0f0f0; border-radius: 12px; border: 1px solid #e5e7eb; flex: 1; min-width: 0; max-width: 100%; }
      .cuts-board__search-wrap .cuts-board__search-icon { color: #9ca3af; flex-shrink: 0; }
      .cuts-board__search { flex: 1; min-width: 0; padding: 0.5rem 0.5rem 0.5rem 0; border: none; background: transparent; font-size: 0.875rem; color: #111827; outline: none; }
      .cuts-board__search::placeholder { color: #9ca3af; }
      .cuts-board__btn-refresh { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border-radius: 12px; border: 1px solid #e5e7eb; background: #f0f0f0; color: #374151; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: background 0.2s, border-color 0.2s; }
      .cuts-board__btn-refresh:hover { background: #e5e7eb; border-color: #d1d5db; }
      .cuts-board__btn-refresh svg { flex-shrink: 0; color: #6b7280; }
      .cuts-gallery { display: flex; flex-direction: column; gap: 1.25rem; }
      .lot-card { background: #ffffff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 1.25rem; box-shadow: 0 1px 3px rgba(0,0,0,0.06); display: flex; flex-direction: column; gap: 1rem; }
      .lot-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
      .lot-card__info { display: flex; align-items: flex-start; gap: 0.75rem; flex: 1; min-width: 0; }
      .lot-card__icon { color: #6b7280; flex-shrink: 0; margin-top: 0.2rem; }
      .lot-card__info-text { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 0.35rem; }
      .lot-card__title { margin: 0; font-size: 1.0625rem; font-weight: 600; color: #111827; line-height: 1.35; letter-spacing: -0.01em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-word; }
      .lot-card__meta { margin: 0; font-size: 0.8125rem; color: #6b7280; display: flex; align-items: center; gap: 0.35rem; }
      .lot-card__meta--clock::before { content: ""; width: 14px; height: 14px; flex-shrink: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") no-repeat center; display: inline-block; }
      .lot-card__meta--user::before { content: ""; width: 14px; height: 14px; flex-shrink: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") no-repeat center; display: inline-block; }
      .lot-card__header-actions { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
      .lot-card__count { flex-shrink: 0; padding: 0.35rem 0.75rem; border-radius: 8px; background: #f3f4f6; color: #6b7280; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.02em; }
      .lot-card__trash { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border: none; border-radius: 8px; background: transparent; color: #9ca3af; cursor: pointer; transition: color 0.2s, background 0.2s; }
      .lot-card__trash:hover { color: #dc2626; background: #fef2f2; }
      .lot-card__cuts { display: flex; flex-wrap: wrap; gap: 1rem; }
      .cut-tile { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; text-align: left; flex: 0 0 auto; width: min(180px, 28vw); box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
      .cut-tile:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
      .cut-tile .tile-preview { position: relative; flex: 0 0 auto; border-radius: 10px 10px 0 0; overflow: hidden; background: #f3f4f6; aspect-ratio: 9 / 16; }
      .cut-tile .tile-preview video { width: 100%; height: 100%; display: block; object-fit: cover; pointer-events: none; }
      .cut-tile .tile-preview__placeholder { position: absolute; inset: 0; }
      .cut-tile__caption { flex: 0 0 auto; padding: 0.5rem 0.6rem; font-size: 0.75rem; font-weight: 600; color: #111827; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; letter-spacing: 0.01em; word-break: break-word; overflow-wrap: break-word; background: #fff; border-top: 1px solid #e5e7eb; min-height: calc(4 * 1.3 * 0.75rem + 0.5rem * 2); }
      .extras-board { margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 0.7rem; }
      .extras-board h3 { margin: 0; font-size: 0.95rem; }
      .extras-list { display: flex; flex-wrap: wrap; gap: 0.55rem; }
      .extras-list a { padding: 0.4rem 0.75rem; border-radius: var(--radius-md); border: 1px solid var(--border); font-size: 0.78rem; text-decoration: none; background: var(--surface-alt); transition: border 0.2s ease, color 0.2s ease; color: var(--text); }
      .extras-list a:hover { border-color: var(--border-strong); color: var(--accent); }
      .portal-board { display: flex; flex-direction: column; gap: 1.8rem; }
      .portal-board__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.2rem; flex-wrap: wrap; }
      .portal-board__header .lead { margin: 0; max-width: 760px; color: var(--text-muted); }
      .portal-list { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
      .portal-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1rem; display: flex; flex-direction: column; gap: 0.75rem; box-shadow: var(--shadow); cursor: pointer; transition: border 0.2s ease, box-shadow 0.2s ease; min-height: 0; }
      .portal-card:hover { border-color: #d1d5db; box-shadow: var(--shadow-md); }
      .portal-card__title { margin: 0; flex-shrink: 0; font-size: 0.875rem; font-weight: 600; color: var(--text); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-word; overflow-wrap: break-word; min-height: 2.7em; }
      .portal-card__meta { flex-shrink: 0; font-size: 0.75rem; color: var(--text-faint); }
      .portal-card__excerpt { flex-shrink: 0; font-size: 0.85rem; color: var(--muted); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-word; overflow-wrap: break-word; min-height: 2.9em; }
      .portal-card__body { flex: 1 1 auto; min-height: 0; font-size: 0.9rem; color: var(--text); line-height: 1.6; background: var(--surface-alt); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 1rem 1.1rem; max-height: 260px; overflow: auto; white-space: pre-wrap; }
      .portal-card__actions { display: flex; gap: 0.7rem; flex-wrap: wrap; }
      .portal-card__btn { border: none; border-radius: 999px; padding: 0.6rem 1.35rem; font-size: 0.84rem; font-weight: 600; letter-spacing: 0.02em; cursor: pointer; background: var(--accent-strong); color: #fff; box-shadow: var(--shadow); transition: transform 0.2s ease, box-shadow 0.2s ease; }
      .portal-card__btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
      .portal-card__btn.danger { background: var(--danger-soft); color: var(--danger); border: 1px solid var(--danger); box-shadow: none; }
      .portal-card__btn.danger:hover { border-color: var(--danger); }
      .cut-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 1200; padding: 1rem; }
      .cut-modal.open { display: flex; }
      .cut-modal__backdrop { position: absolute; inset: 0; background: var(--backdrop); backdrop-filter: blur(8px); }
      .cut-modal__content { position: relative; width: min(1000px, 95vw); max-height: 90vh; background: #f5f5f5; border: 1px solid #e5e7eb; border-radius: 12px; box-shadow: 0 25px 60px rgba(0,0,0,0.15); display: flex; flex-direction: column; overflow: hidden; }
      .cut-modal__header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid #e5e7eb; background: #fafafa; flex-shrink: 0; }
      .cut-modal__header-left { display: flex; align-items: center; gap: 0.75rem; min-width: 0; }
      .cut-modal__header-icon { color: #6b7280; flex-shrink: 0; }
      .cut-modal__title-text { margin: 0; font-size: 1rem; font-weight: 700; color: #111827; }
      .cut-modal__subtitle-text { margin: 0.25rem 0 0; font-size: 0.8125rem; color: #6b7280; }
      .cut-modal__header-controls { display: flex; align-items: center; gap: 0.5rem; }
      .cut-modal__close { border: none; background: transparent; color: #6b7280; padding: 0.25rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: color 0.2s; }
      .cut-modal__close:hover { color: #111827; }
      .cut-modal__body { display: flex; flex: 1; overflow: hidden; min-height: 0; }
      .cut-modal__video-wrap { position: relative; flex: 0 0 38%; max-width: 380px; background: #000; display: flex; align-items: center; justify-content: center; min-height: 0; overflow: hidden; }
      .cut-modal__video-preview { position: relative; width: 100%; max-width: 100%; max-height: 100%; aspect-ratio: 9 / 16; display: flex; align-items: center; justify-content: center; overflow: hidden; }
      .cut-modal__video-preview video { width: 100%; height: 100%; object-fit: contain; display: block; }
      .cut-modal__video-badge { position: absolute; top: 8px; left: 8px; background: rgba(255,255,255,0.9); color: #111; font-size: 0.7rem; font-weight: 700; padding: 0.2rem 0.4rem; border-radius: 4px; z-index: 1; }
      .cut-modal__variant-bar { position: absolute; top: 8px; right: 8px; z-index: 1; display: flex; flex-wrap: wrap; gap: 0.35rem; }
      .cut-modal__variant-bar button { border: 1px solid rgba(255,255,255,0.5); background: rgba(0,0,0,0.4); color: #fff; border-radius: 6px; padding: 0.25rem 0.5rem; font-size: 0.7rem; cursor: pointer; }
      .cut-modal__variant-bar button.active { background: #0ba3dc; border-color: #0ba3dc; }
      .cut-modal__right { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #fff; overflow: hidden; }
      .cut-modal__tabs { display: flex; padding: 4px; gap: 0; background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 8px; margin-bottom: 0; flex-shrink: 0; }
      .cut-modal__tab { flex: 1; display: flex; align-items: center; justify-content: center; gap: 0.4rem; padding: 0.6rem 0.75rem; border: none; border-radius: 6px; background: transparent; color: #6b7280; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.02em; cursor: pointer; transition: background 0.2s, color 0.2s; }
      .cut-modal__tab:hover { color: #374151; background: rgba(255,255,255,0.6); }
      .cut-modal__tab--active { background: #ffffff; color: #111827; box-shadow: 0 1px 2px rgba(0,0,0,0.05); border: 1px solid #e5e7eb; }
      .cut-modal__tab--active svg { color: #111827; }
      .cut-modal__panels { flex: 1; overflow-y: auto; padding: 1.25rem; min-height: 0; }
      .cut-modal__panel { display: none; flex-direction: column; gap: 1.25rem; }
      .cut-modal__panel--active { display: flex; }
      .cut-modal__field { display: flex; flex-direction: column; gap: 0.4rem; }
      .cut-modal__label { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #6b7280; }
      .cut-modal__label--with-icon { display: flex; align-items: center; gap: 0.35rem; }
      .cut-modal__label--with-icon svg { color: #9ca3af; flex-shrink: 0; }
      .cut-modal__label-row { display: flex; justify-content: space-between; align-items: center; }
      .cut-modal__link-btn { background: none; border: none; color: #9ca3af; font-size: 0.75rem; cursor: pointer; padding: 0; }
      .cut-modal__link-btn:hover { color: #0ba3dc; }
      .cut-modal__title-row { display: flex; align-items: center; gap: 0.5rem; }
      .cut-modal__input { width: 100%; padding: 0.6rem 0.75rem; border: 1px solid #e5e7eb; border-radius: 8px; background: #f3f4f6; color: #111827; font-size: 0.875rem; }
      .cut-modal__input--title { font-weight: 600; }
      .cut-modal__field--manchete { padding-left: 24px; }
      .cut-modal__field--manchete #modal-manchete-input { width: min(520px, 100%); display: block; margin: 0 auto 0 0; }
      .cut-modal__copy-btn { flex-shrink: 0; padding: 0.5rem; border: none; background: transparent; color: #6b7280; cursor: pointer; border-radius: 6px; display: flex; align-items: center; justify-content: center; }
      .cut-modal__copy-btn:hover { background: #f3f4f6; color: #0ba3dc; }
      .cut-modal__textarea { width: 100%; padding: 0.75rem; border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb; color: #111827; font-size: 0.875rem; resize: vertical; min-height: 120px; font-family: inherit; }
      .cut-modal__textarea--srt { font-family: ui-monospace, "SF Mono", Monaco, monospace; font-size: 0.8125rem; min-height: 160px; }
      .cut-modal__subtitle-footer { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-top: 0.5rem; flex-wrap: wrap; }
      .cut-modal__char-count { font-size: 0.7rem; color: #9ca3af; }
      .cut-modal__char-count--right { margin-left: auto; }
      .cut-modal__btn-primary { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border: none; border-radius: 8px; background: #111827; color: #fff; font-size: 0.8125rem; font-weight: 600; cursor: pointer; }
      .cut-modal__btn-primary:hover { background: #1f2937; }
      .cut-modal__subtitle-status { font-size: 0.75rem; color: #6b7280; margin-top: 0.25rem; }
      .cut-modal__subtitle-status--error { color: #dc2626; }
      .cut-modal__subtitle-status--success { color: #16a34a; }
      .cut-modal__platforms { display: flex; gap: 0.75rem; flex-wrap: wrap; }
      .cut-modal__platform-card { display: flex; flex-direction: column; align-items: flex-start; gap: 0.25rem; padding: 1rem 1.25rem; border-radius: 10px; border: 1px solid #e5e7eb; background: #f9fafb; color: #6b7280; font-size: 0.8125rem; min-width: 140px; cursor: pointer; transition: background 0.2s, border-color 0.2s; }
      .cut-modal__platform-card:hover { border-color: #d1d5db; }
      .cut-modal__platform-card--active { background: #111827; border-color: #111827; color: #fff; }
      .cut-modal__platform-card--active .cut-modal__platform-card-label { color: #fff; }
      .cut-modal__platform-card--active .cut-modal__platform-card-status { color: rgba(255,255,255,0.8); }
      .cut-modal__platform-card-label { font-weight: 700; display: block; }
      .cut-modal__platform-card-status { font-size: 0.7rem; display: block; margin-top: 0.15rem; }
      .cut-modal__publish-buttons { display: flex; flex-direction: column; gap: 0.75rem; margin-top: 0.5rem; }
      .cut-modal__btn-platform { display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; padding: 0.75rem 1.25rem; border: none; border-radius: 8px; background: #111827; color: #fff; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.04em; cursor: pointer; }
      .cut-modal__btn-platform:hover:not(:disabled) { background: #1f2937; }
      .cut-modal__btn-platform:disabled { opacity: 0.5; cursor: not-allowed; }
      .cut-modal__btn-publicar { display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; padding: 0.75rem 1.25rem; border: none; border-radius: 8px; background: #111827; color: #fff; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.04em; cursor: pointer; margin-top: 0.5rem; }
      .cut-modal__btn-publicar:hover { background: #1f2937; }
      .cut-modal__code-block { padding: 1rem; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; font-family: ui-monospace, "SF Mono", Monaco, monospace; font-size: 0.8rem; line-height: 1.5; color: #374151; overflow: auto; max-height: 320px; white-space: pre-wrap; word-break: break-word; }
      .cut-modal__title-editor { display: flex; flex-direction: column; gap: 0.35rem; margin-top: 0.25rem; }
      .cut-modal__title-label { font-size: 0.7rem; letter-spacing: 0.06em; text-transform: uppercase; color: #6b7280; }
      .cut-modal__title-field { display: flex; gap: 0.5rem; align-items: center; }
      .cut-modal__title-input { flex: 1; border-radius: 6px; border: 1px solid #e5e7eb; background: #fff; color: #111827; padding: 0.5rem 0.75rem; font-size: 0.875rem; }
      .cut-modal__title-button { border: none; border-radius: 6px; padding: 0.5rem 1rem; font-size: 0.8125rem; font-weight: 600; cursor: pointer; background: #111827; color: #fff; }
      .cut-modal__title-button.ghost { background: transparent; border: 1px solid #d1d5db; color: #6b7280; }
      .cut-modal__title-button.ghost:hover { border-color: #0ba3dc; color: #0ba3dc; }
      .cut-modal__title-status { font-size: 0.75rem; color: #6b7280; }
      .cut-modal__title-status--error { color: #dc2626; }
      .cut-modal__title-status--success { color: #16a34a; }
      .cut-modal__btn { border: none; border-radius: 8px; padding: 0.5rem 1rem; font-size: 0.8125rem; font-weight: 600; cursor: pointer; background: #111827; color: #fff; }
      .cut-modal__btn:hover { background: #1f2937; }
      .cut-modal__btn.danger { background: transparent; border: 1px solid #e5e7eb; color: #6b7280; padding: 0.4rem; }
      .cut-modal__btn.danger:hover { background: #fef2f2; color: #dc2626; border-color: #fecaca; }
      .cut-modal__btn--editor { display: inline-flex; align-items: center; gap: 6px; background: #7c3aed; color: #fff; }
      .cut-modal__btn--editor:hover { background: #6d28d9; }
      .cut-modal__action-empty { color: #9ca3af; font-size: 0.8125rem; }
      #modal-text { width: 100%; }
      body.modal-open { overflow: hidden; }
      .post-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 1250; padding: 1rem; }
      .post-modal.open { display: flex; }
      .post-modal__backdrop { position: absolute; inset: 0; background: var(--backdrop); backdrop-filter: blur(8px); }
      .post-modal__content { position: relative; width: min(720px, 92vw); max-height: 90vh; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: 0 25px 60px rgba(0, 0, 0, 0.18); padding: clamp(1.3rem, 3vw, 1.9rem); display: flex; flex-direction: column; gap: 1.2rem; overflow: hidden; }
      .post-modal__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
      .post-modal__header h2 { margin: 0; font-size: 1.3rem; }
      .post-modal__header p { margin: 0.35rem 0 0; font-size: 0.88rem; color: var(--muted); }
      .post-modal__close { border: none; background: transparent; color: var(--muted); font-size: 2rem; line-height: 1; cursor: pointer; padding: 0 0.2rem; transition: color 0.2s ease; }
      .post-modal__close:hover { color: var(--accent); }
      .post-modal__body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem; overflow: auto; padding-right: 0.4rem; }
      .post-modal__preview { display: flex; justify-content: center; }
      #post-modal-video { width: min(320px, 60vw); border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface-alt); aspect-ratio: 9 / 16; object-fit: cover; }
      .post-modal__summary { background: var(--surface-alt); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 0.9rem 1rem; display: flex; flex-direction: column; gap: 0.4rem; font-size: 0.86rem; color: var(--muted); }
      .post-modal__summary strong { color: var(--text); font-size: 0.94rem; }
      .post-modal__label { font-size: 0.82rem; font-weight: 600; color: var(--label); margin-bottom: 0.4rem; display: block; }
      #post-modal-caption { width: 100%; min-height: 160px; resize: vertical; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface-alt); color: var(--text); padding: 0.9rem 1rem; font-size: 0.9rem; font-family: "Inter", "Segoe UI", sans-serif; transition: border 0.2s ease, box-shadow 0.2s ease; }
      #post-modal-caption:focus { outline: none; border-color: var(--border-strong); box-shadow: 0 0 0 3px var(--focus-ring); }
      .post-modal__actions { display: flex; justify-content: flex-end; gap: 0.8rem; flex-wrap: wrap; }
      .post-modal__btn { border: none; border-radius: 999px; padding: 0.65rem 1.4rem; font-size: 0.9rem; font-weight: 600; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; }
      .post-modal__btn.cancel { background: transparent; border: 1px solid var(--border-strong); color: var(--muted); }
      .post-modal__btn.cancel:hover { border-color: var(--accent); color: var(--accent); }
      .post-modal__btn.submit { background: var(--accent-strong); color: #fff; box-shadow: var(--shadow); }
      .post-modal__btn.submit:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
      .confirm-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 1400; padding: 1rem; }
      .confirm-modal.open { display: flex; }
      .confirm-modal__backdrop { position: absolute; inset: 0; background: var(--backdrop); backdrop-filter: blur(8px); }
      .confirm-modal__content { position: relative; width: min(420px, 92vw); background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: 0 25px 60px rgba(0, 0, 0, 0.18); padding: 1.5rem 1.75rem; display: flex; flex-direction: column; gap: 1.25rem; }
      .confirm-modal__message { margin: 0; font-size: 1rem; line-height: 1.5; color: var(--text); }
      .confirm-modal__actions { display: flex; justify-content: flex-end; gap: 0.75rem; flex-wrap: wrap; }
      .confirm-modal__btn { border: none; border-radius: 999px; padding: 0.6rem 1.35rem; font-size: 0.9rem; font-weight: 600; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, color 0.2s ease; }
      .confirm-modal__btn--cancel { background: transparent; border: 1px solid var(--border-strong); color: var(--muted); }
      .confirm-modal__btn--cancel:hover { border-color: var(--accent); color: var(--accent); }
      .confirm-modal__btn--confirm { background: var(--danger); color: #fff; box-shadow: var(--shadow); }
      .confirm-modal__btn--confirm:hover { background: #b91c1c; transform: translateY(-1px); box-shadow: var(--shadow-md); }
      .article-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 1300; padding: 1rem; }
      .article-modal.open { display: flex; }
      .article-modal__backdrop { position: absolute; inset: 0; background: var(--backdrop); backdrop-filter: blur(8px); }
      .article-modal__content { position: relative; width: min(880px, 94vw); max-height: 92vh; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: 0 25px 60px rgba(0, 0, 0, 0.18); padding: clamp(1.45rem, 3vw, 2.1rem); display: flex; flex-direction: column; gap: 1.1rem; overflow: hidden; }
      .article-modal__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
      .article-modal__header h2 { margin: 0; font-size: 1.35rem; }
      .article-modal__header p { margin: 0.35rem 0 0; font-size: 0.88rem; color: var(--muted); }
      .article-modal__close { border: none; background: transparent; color: var(--muted); font-size: 2rem; line-height: 1; cursor: pointer; padding: 0 0.2rem; transition: color 0.2s ease; }
      .article-modal__close:hover { color: var(--accent); }
      .article-modal__body { display: flex; flex-direction: column; gap: 0.9rem; height: 100%; overflow: hidden; }
      .article-modal__summary { background: var(--surface-alt); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 0.9rem 1.05rem; font-size: 0.86rem; color: var(--muted); display: flex; flex-direction: column; gap: 0.4rem; }
      .article-modal__summary strong { color: var(--text); font-size: 0.95rem; }
      .article-modal__label { font-size: 0.82rem; font-weight: 600; color: var(--label); }
      #article-modal-textarea { flex: 1; min-height: 280px; resize: none; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface-alt); color: var(--text); font-size: 0.94rem; line-height: 1.58; padding: 1.05rem 1.15rem; font-family: "Inter", "Segoe UI", sans-serif; transition: border 0.2s ease, box-shadow 0.2s ease; }
      #article-modal-textarea:focus { outline: none; border-color: var(--border-strong); box-shadow: 0 0 0 3px var(--focus-ring); }
      .article-modal__actions { display: flex; justify-content: flex-end; gap: 0.8rem; flex-wrap: wrap; }
      .article-modal__btn { border: none; border-radius: 999px; padding: 0.65rem 1.45rem; font-size: 0.9rem; font-weight: 600; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; }
      .article-modal__btn.cancel { background: transparent; border: 1px solid var(--border-strong); color: var(--muted); }
      .article-modal__btn.cancel:hover { border-color: var(--accent); color: var(--accent); }
      .article-modal__btn.submit { background: var(--accent-strong); color: #fff; box-shadow: var(--shadow); }
      .article-modal__btn.submit:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
      .article-modal__btn.danger { background: var(--danger-soft); color: var(--danger); border: 1px solid var(--danger); box-shadow: none; }
      .article-modal__btn.danger:hover { border-color: var(--danger); }
      @media (max-width: 640px) { .post-modal__body { grid-template-columns: 1fr; } #post-modal-video { width: 100%; } }
      .empty-state { display: flex; align-items: center; justify-content: center; border: 1px dashed var(--border); border-radius: var(--radius-lg); padding: 3rem 1.5rem; text-align: center; color: var(--muted); min-height: 260px; background: var(--surface-alt); }
      ::-webkit-scrollbar { width: 5px; }
      ::-webkit-scrollbar-thumb { border-radius: 999px; background: #e5e7eb; }
      ::-webkit-scrollbar-thumb:hover { background: #d1d5db; }
      ::-webkit-scrollbar-track { background: var(--surface-alt); }
      .field__input-row { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; width: 100%; }
      .field__input-row input { flex: 1 1 auto; min-width: 220px; }
      .field__input-row button { flex: 0 0 auto; }
      .input-files { margin-top: 0.5rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--bg-card); padding: 0.5rem 0; color: var(--text); max-height: 220px; overflow-y: auto; width: 100%; box-sizing: border-box; grid-column: 1 / -1; order: 10; box-shadow: var(--shadow); transition: border 0.2s ease, box-shadow 0.2s ease; }
      .input-files[hidden] { display: none; }
      .input-files--full { grid-column: 1 / -1; }
      .input-files__status { margin: 0; font-size: 0.92rem; color: var(--text); display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
      .input-files__list { display: flex; flex-direction: column; gap: 0.55rem; margin-top: 0.25rem; }
      .input-files__item { width: 100%; border: 1px solid var(--border); background: var(--surface); border-radius: var(--radius-md); padding: 0.85rem 1.15rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.45rem; align-items: center; color: var(--text); font-size: 0.95rem; cursor: pointer; transition: border 0.2s ease, background 0.2s ease, transform 0.15s ease; }
      .input-files__item:hover { border-color: var(--border-strong); background: var(--surface-alt); transform: translateY(-1px); }
      .input-files__name { flex: 1 1 62%; min-width: 240px; font-weight: 600; letter-spacing: 0.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .input-files__meta { font-size: 0.82rem; opacity: 0.85; margin-left: 0.75rem; white-space: nowrap; display: flex; gap: 0.5rem; align-items: center; }
      @media (max-width: 980px) { .cuts-board__header { flex-direction: column; align-items: flex-start; } .lot-card__header { align-items: flex-start; } .lot-card__cuts { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }
      @media (max-width: 640px) { .hero { flex-direction: column; } .card-actions { flex-direction: column; align-items: stretch; } .status { min-width: unset; } }
      .logos-board { display: flex; flex-direction: column; gap: 1.5rem; }
      .logos-board__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
      .logos-board__subtitle { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.875rem; }
      .logos-board__upload-wrap { max-width: 480px; }
      .logos-board__gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; }
      .logos-board__empty, .logos-board__loading { color: var(--text-muted); font-size: 0.9rem; margin: 0; }
      .logo-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1rem; display: flex; flex-direction: column; align-items: center; gap: 0.75rem; box-shadow: var(--shadow); }
      .logo-card__img-wrap { width: 100%; aspect-ratio: 16/9; display: flex; align-items: center; justify-content: center; background: var(--surface-alt); border-radius: var(--radius-sm); overflow: hidden; position: relative; }
      .logo-card__img { max-width: 100%; max-height: 100%; object-fit: contain; }
      .logo-card__img-fallback { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: var(--text-muted); position: absolute; inset: 0; background: var(--surface-alt); }
      .logo-card__name-row { display: flex; align-items: center; gap: 4px; width: 100%; min-width: 0; }
      .logo-card__name { font-size: 0.78rem; color: var(--text-muted); word-break: break-all; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .logo-card__rename-btn { background: none; border: none; cursor: pointer; font-size: 0.75rem; padding: 2px 4px; opacity: 0.5; flex-shrink: 0; line-height: 1; }
      .logo-card__rename-btn:hover { opacity: 1; }
      .logo-card__rename-input { width: 100%; font-size: 0.78rem; padding: 3px 6px; border: 1px solid var(--accent); border-radius: var(--radius-sm); outline: none; background: var(--surface); color: var(--text); }
      .logo-card__select-btn { width: 100%; }
      .field__hint-link { color: var(--accent); text-decoration: none; font-weight: 600; }
      .field__hint-link:hover { text-decoration: underline; }
      .users-board { display: flex; flex-direction: column; gap: 1.25rem; }
      .users-board__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
      .users-board__subtitle { margin: 0; color: var(--muted); font-size: 0.875rem; }
      .users-form { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; align-items: flex-end; }
      .users-form label { display: block; font-size: 0.875rem; font-weight: 600; color: var(--label); margin-bottom: 0.35rem; }
      .users-form input[type="text"], .users-form input[type="password"] { width: 100%; min-width: 160px; max-width: 220px; padding: 0.5rem 0.75rem; border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--surface-alt); color: var(--text); font-size: 0.875rem; }
      .users-status { margin: 0; min-height: 1.2rem; font-size: 0.875rem; color: var(--muted); }
      .users-status.success { color: var(--success); }
      .users-status.error { color: var(--danger); }
      .users-list-title { margin: 0 0 0.25rem; font-size: 1.1rem; }
      .users-list-hint { margin: 0 0 0.75rem; color: var(--muted); font-size: 0.875rem; }
      .users-empty-msg { color: var(--muted); font-size: 0.875rem; }
      .users-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
      .users-table th, .users-table td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid var(--border); }
      .users-table th { font-weight: 600; color: var(--muted); font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.04em; }
      .users-table tbody tr:hover { background: var(--surface-alt); }
      .user-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.9rem; }
      .user-badge { display: inline-block; padding: 0.25rem 0.6rem; border-radius: 999px; font-size: 0.75rem; font-weight: 600; }
      .user-badge--admin { background: var(--accent-light); color: var(--accent-text); border: 1px solid var(--accent-border); }
      .user-badge--operador { background: var(--surface-alt); color: var(--muted); border: 1px solid var(--border); }
      .user-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
      .user-actions button { padding: 0.45rem 0.85rem; font-size: 0.8rem; font-weight: 600; border-radius: var(--radius-sm); cursor: pointer; white-space: nowrap; flex-shrink: 0; border: none; transition: background 0.2s, color 0.2s, border-color 0.2s; }
      .user-actions .btn-ghost { background: transparent; border: 1px solid var(--border); color: var(--text); }
      .user-actions .btn-ghost:hover { background: var(--surface-alt); border-color: var(--border-strong); }
      .user-actions .btn-danger { background: var(--danger-soft); color: var(--danger); border: 1px solid rgba(220,38,38,0.3); }
      .user-actions .btn-danger:hover { background: #fef2f2; border-color: #fecaca; }
      .user-actions .btn-promote { background: var(--accent-soft); color: var(--accent-text); border: 1px solid var(--accent-border); }
      .user-actions .btn-promote:hover { background: var(--accent-light); border-color: var(--accent); }
      .users-table td:last-child { white-space: nowrap; vertical-align: middle; }
      .login-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 1.5rem; }
      .login-page .login-wrap { width: 100%; max-width: 420px; }
      .login-page .login-card .config-card__body { display: flex; flex-direction: column; gap: 1.25rem; }
      .login-page .login-brand { display: flex; align-items: center; gap: 0.65rem; margin-bottom: 0.25rem; }
      .login-page .status.login-status { display: block; min-height: 1.2rem; font-size: 0.875rem; }
      .login-page .status.login-status:empty { visibility: hidden; }
      .login-page .status.login-status.status--error { display: block; }

      /* Prompts page – Histórico de versões (alinhado ao design da plataforma) */
      .prompts-page .history-card {
        margin-top: 2rem;
        padding-top: 1.5rem;
        border-top: 1px solid var(--border);
        display: flex;
        flex-direction: column;
        gap: 1.25rem;
      }
      .prompts-page .history-header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        flex-wrap: wrap;
      }
      .prompts-page .history-header h2 {
        margin: 0;
        font-size: 1rem;
        font-weight: 600;
        color: var(--text);
      }
      .prompts-page .history-header p {
        margin: 0.25rem 0 0;
        font-size: 0.8125rem;
        color: var(--muted);
      }
      .prompts-page .history-header .btn.ghost {
        flex-shrink: 0;
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
        font-weight: 600;
        border-radius: 999px;
        border: 1px solid var(--border-strong);
        background: transparent;
        color: var(--muted);
        cursor: pointer;
        transition: border-color 0.2s ease, color 0.2s ease;
      }
      .prompts-page .history-header .btn.ghost:hover:not(:disabled) {
        border-color: var(--accent);
        color: var(--accent);
      }
      .prompts-page .history-header .btn.ghost:disabled {
        opacity: 0.5;
        cursor: not-allowed;
      }
      .prompts-page .history-empty {
        font-size: 0.875rem;
        color: var(--muted);
        background: var(--surface-alt);
        border: 1px dashed var(--border);
        border-radius: var(--radius-md);
        padding: 1.5rem;
        text-align: center;
        min-height: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .prompts-page .history-empty[hidden] {
        display: none;
      }
      .prompts-page .history-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
      }
      .prompts-page .history-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1rem;
        padding: 0.85rem 1.15rem;
        border-radius: var(--radius-md);
        background: var(--surface);
        border: 1px solid var(--border);
        transition: border-color 0.2s ease, background 0.2s ease;
      }
      .prompts-page .history-item:hover {
        border-color: var(--border-strong);
        background: var(--surface-alt);
      }
      .prompts-page .history-item__info {
        display: flex;
        flex-direction: column;
        gap: 0.2rem;
        min-width: 0;
      }
      .prompts-page .history-item__info strong {
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--text);
      }
      .prompts-page .history-item__info span {
        font-size: 0.8125rem;
        color: var(--muted);
      }
      .prompts-page .history-item__actions {
        display: flex;
        gap: 0.5rem;
        flex-shrink: 0;
      }
      .prompts-page .history-item__btn {
        padding: 0.5rem 1rem;
        font-size: 0.8125rem;
        font-weight: 600;
        border-radius: 999px;
        border: none;
        cursor: pointer;
        transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
      }
      .prompts-page .history-item__btn:not(.history-item__btn--danger) {
        background: var(--accent-strong);
        color: #fff;
        box-shadow: var(--shadow);
      }
      .prompts-page .history-item__btn:not(.history-item__btn--danger):hover:not(:disabled) {
        background: #1f2937;
        box-shadow: var(--shadow-md);
      }
      .prompts-page .history-item__btn--danger {
        background: var(--danger-soft);
        color: var(--danger);
        border: 1px solid rgba(220, 38, 38, 0.3);
      }
      .prompts-page .history-item__btn--danger:hover:not(:disabled) {
        background: #fef2f2;
        border-color: #fecaca;
      }
      .prompts-page .history-item__btn:disabled {
        opacity: 0.6;
        cursor: not-allowed;
      }