/* Lezhou Route A frontend polish v2026070101 */
:root {
  --polish-focus: rgba(20, 184, 166, .18);
  --polish-border: var(--border-subtle, #dfe7ef);
  --polish-surface: var(--bg-surface, #fff);
  --polish-raised: var(--bg-raised, #f8fafc);
  --polish-text: var(--text-primary, #122033);
  --polish-muted: var(--text-muted, #6b7b8f);
}

html {
  scrollbar-gutter: stable;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  letter-spacing: 0 !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

button,
input,
textarea,
select {
  letter-spacing: 0 !important;
}

input,
textarea,
select {
  color: var(--polish-text) !important;
  caret-color: var(--c-brand, #0f766e);
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in srgb, var(--polish-muted) 70%, transparent) !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: color-mix(in srgb, var(--c-brand, #0f766e) 62%, var(--polish-border)) !important;
  box-shadow: 0 0 0 3px var(--polish-focus) !important;
}

button,
.btn,
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-success,
.btn-ghost,
.btn-submit,
.btn-send,
.icon-btn,
.btn-icon {
  min-height: 34px;
  white-space: nowrap;
}

.btn,
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-success,
.btn-ghost,
.btn-submit,
.btn-send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  max-width: 100%;
}

.btn span,
.btn-primary span,
.btn-secondary span,
.btn-danger span,
.btn-success span,
.btn-ghost span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dropdown-menu,
.modal,
.modal-dialog,
.popover,
.admin-search-results {
  color: var(--polish-text);
  border-color: var(--polish-border) !important;
}

.skeleton,
.loading-skeleton .sk-row,
.loading-skeleton .sk-card,
.loading-skeleton .sk-table {
  background:
    linear-gradient(90deg, transparent, color-mix(in srgb, var(--c-brand, #0f766e) 8%, transparent), transparent),
    color-mix(in srgb, var(--polish-raised) 86%, var(--polish-border)) !important;
  background-size: 220% 100%, 100% 100%;
}

/* Login: remove distracting background motion and keep typed text visible. */
.login-page {
  background:
    linear-gradient(180deg, rgba(15, 118, 110, .08), transparent 260px),
    #081018 !important;
}

#particles,
.login-page .bg-orb,
.lz-intro {
  display: none !important;
}

.lz-intro *,
.lz-intro::before,
.lz-intro::after {
  animation: none !important;
  transition: none !important;
}

.login-card {
  border-radius: 14px !important;
  border-color: rgba(148, 176, 205, .14) !important;
  box-shadow: 0 28px 70px rgba(0, 0, 0, .38), 0 1px 0 rgba(255, 255, 255, .05) inset !important;
  animation: none !important;
}

.login-card .brand .logo {
  background: var(--grad-brand, linear-gradient(135deg, #0f766e, #2563eb)) !important;
}

.login-card .brand h1 {
  color: #edf6f9 !important;
  -webkit-text-fill-color: #edf6f9 !important;
}

.login-card .brand h1 em {
  background: var(--grad-brand, linear-gradient(135deg, #14b8a6, #60a5fa)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

.login-card .brand p {
  color: rgba(184, 197, 211, .62) !important;
}

.login-card .field input,
.login-card .field-row .field input,
.login-card input[type="text"],
.login-card input[type="password"],
.login-card input[type="email"] {
  color: #edf6f9 !important;
  caret-color: #2dd4bf !important;
  background: rgba(15, 28, 42, .78) !important;
  border-color: rgba(148, 176, 205, .18) !important;
  -webkit-text-fill-color: #edf6f9 !important;
}

.login-card .field input::placeholder {
  color: rgba(184, 197, 211, .42) !important;
  -webkit-text-fill-color: rgba(184, 197, 211, .42) !important;
}

.login-card .btn-submit {
  background: var(--grad-brand, linear-gradient(135deg, #0f766e, #2563eb)) !important;
  box-shadow: 0 12px 28px rgba(15, 118, 110, .24) !important;
}

[data-theme="light"] .login-page {
  background:
    linear-gradient(180deg, rgba(15, 118, 110, .08), transparent 260px),
    #f5f7fb !important;
}

[data-theme="light"] .login-card .field input,
[data-theme="light"] .login-card .field-row .field input,
[data-theme="light"] .login-card input[type="text"],
[data-theme="light"] .login-card input[type="password"],
[data-theme="light"] .login-card input[type="email"] {
  color: #122033 !important;
  background: #fff !important;
  border-color: #c8d3df !important;
  -webkit-text-fill-color: #122033 !important;
}

[data-theme="light"] .login-card .brand h1 {
  color: #122033 !important;
  -webkit-text-fill-color: #122033 !important;
}

[data-theme="light"] .login-card .brand h1 em {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

[data-theme="light"] .login-card .brand p {
  color: rgba(64, 81, 101, .66) !important;
}

/* Shared shell: keep navigation stable and scannable. */
.portal-shell .sidebar,
.app-shell .sidebar,
.studio-sidebar {
  scrollbar-gutter: stable;
}

.portal-shell .topbar,
.app-shell .topbar,
.studio-topbar {
  min-height: 58px;
  gap: .75rem;
}

.topbar-title-group,
.portal-shell .topbar > div,
.app-shell .topbar-right,
.studio-title {
  min-width: 0;
}

.side-nav .nav-item,
.studio-nav a {
  min-height: 36px;
}

.side-nav .nav-item span:last-child,
.studio-nav a {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nav-icon {
  width: 24px;
  min-width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  font-size: .82rem;
  line-height: 1;
}

.portal-shell .main,
.app-shell .main,
.studio-main {
  min-width: 0;
  overflow-anchor: none;
}

.portal-content,
#mainContent {
  min-width: 0;
}

.balance-display,
.topbar-right .user-dropdown .trigger,
.portal-shell .user-dropdown .trigger {
  min-height: 34px;
}

/* Video workspace: avoid horizontal hunting and keep task actions nearby. */
.video-gen-shell,
.video-gen-creative-layout,
.video-gen-history-item,
.video-gen-result-card,
.video-gen-control-panel,
.video-gen-preview-panel,
.video-gen-media-file-row,
.video-gen-postprocess-grid {
  min-width: 0;
}

.video-gen-history-actions {
  right: 0 !important;
  align-self: start;
}

.video-gen-history-view,
.video-gen-history-delete,
.video-gen-result-action,
.video-gen-media-file-actions button {
  min-width: 38px;
}

.video-gen-history-title,
.video-gen-history-diagnostic,
.video-gen-media-file-main strong,
.video-gen-media-file-main span,
.video-gen-file-meta strong,
.video-gen-file-meta span,
.video-gen-file-error {
  min-width: 0;
}

.video-gen-file-error {
  display: block;
  max-width: 100%;
  margin-top: .12rem;
  color: #dc2626 !important;
  font-size: .72rem;
  font-style: normal;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-gen-upstream-json,
.video-gen-result-card pre,
.video-gen-task-detail pre {
  max-height: 280px;
  overflow: auto;
  scrollbar-gutter: stable;
}

.video-gen-result-card video,
.video-gen-preview-stage video {
  width: 100%;
  max-height: min(62vh, 640px);
  background: #050b12;
}

.video-gen-material-dropzone,
.video-gen-face-dropzone,
.video-gen-model-card,
.video-gen-option-card,
.video-gen-history-item {
  transition: border-color .12s ease, background-color .12s ease, color .12s ease !important;
}

.video-gen-task-status,
.video-gen-progress,
.video-gen-progress-text,
.video-gen-estimate-time,
.video-gen-billing-detail {
  font-variant-numeric: tabular-nums;
}

/* Admin: dense data should scroll inside tables instead of pushing actions away. */
.admin-global-search input {
  color: var(--polish-text) !important;
}

.admin-table-wrap,
.table-wrap,
.data-table-wrap,
.logs-table-wrap,
.request-log-table,
.image-task-table-wrap {
  max-width: 100%;
  overflow: auto;
  scrollbar-gutter: stable;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

th,
td {
  vertical-align: middle;
}

td .btn,
td button,
.table-actions .btn,
.row-actions .btn {
  min-height: 30px;
}

/* Comic studio: calm workspace, one clear scroll layer per panel. */
.comic-app,
.studio-workspace,
.studio-main,
.studio-panel,
.work-view,
.canvas-stage-wrap {
  min-width: 0;
}

.studio-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.studio-actions .btn {
  min-height: 34px;
}

.studio-panel,
.work-view,
.project-list,
.version-list,
.asset-list,
.video-task-list {
  scrollbar-gutter: stable;
}

.studio-logo-orbit,
.studio-brand::after,
.studio-sidebar::after {
  animation: none !important;
}

.studio-nav a,
.project-item,
.storyboard-card,
.asset-card,
.video-task-item {
  transition: border-color .12s ease, background-color .12s ease, color .12s ease !important;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 900px) {
  .portal-shell .topbar,
  .app-shell .topbar,
  .studio-topbar {
    min-height: auto;
    align-items: flex-start;
  }

  .portal-shell .topbar > div:last-child,
  .app-shell .topbar-right,
  .studio-actions {
    width: 100%;
    justify-content: flex-start;
    gap: .5rem;
  }

  .balance-display {
    max-width: 100%;
    white-space: normal;
  }

  .video-gen-history-actions {
    position: static !important;
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .login-card {
    width: calc(100vw - 1.5rem) !important;
    padding: 1.5rem 1.15rem !important;
    border-radius: 12px !important;
  }

  .btn,
  .btn-primary,
  .btn-secondary,
  .btn-danger,
  .btn-success,
  .btn-ghost,
  .btn-submit {
    min-height: 38px;
  }

  .video-gen-billing-detail,
  .video-gen-history-summary,
  .video-gen-media-stats-buckets {
    grid-template-columns: 1fr !important;
  }

  .video-gen-result-action,
  .video-gen-history-view,
  .video-gen-history-delete {
    flex: 1 1 auto;
  }
}