.capture-wrap {
  padding: 24px;
  min-height: calc(100vh - 84px);
  overflow: auto;
}
.capture-head,
.capture-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.capture-head p {
  margin: 0.35rem 0 0;
  color: #91a0b5;
}
.capture-chip {
  border: 1px solid #376157;
  background: #0a1b18;
  color: #7dffc2;
  padding: 10px 14px;
  border-radius: 999px;
  font-size: 12px;
}
.capture-steps {
  display: flex;
  gap: 8px;
  margin: 18px 0;
}
.capture-steps span {
  flex: 1;
  padding: 10px;
  text-align: center;
  border-radius: 10px;
  background: #0d1320;
  color: #657187;
  border: 1px solid #202b3e;
}
.capture-steps span.active {
  color: #fff;
  border-color: #9d4eff;
  background: #251443;
}
.capture-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  height: min(54vh, 560px);
}
.capture-media,
.capture-preview {
  min-width: 0;
  border: 1px solid #28364b;
  border-radius: 18px;
  background: #080d17;
  overflow: hidden;
  position: relative;
}
.capture-media {
  display: grid;
  grid-template-rows: 1fr auto auto;
}
.capture-video-wrap {
  position: relative;
  min-height: 0;
  background: #02050a;
  overflow: hidden;
}
.capture-video-wrap video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #02050a;
}
.capture-video-wrap canvas {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.capture-empty {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 30px;
  text-align: center;
  background: radial-gradient(circle, #142039, #070b13 70%);
  color: #f2e9ff;
}
.capture-empty span,
.capture-note {
  color: #8997ac;
  font-size: 12px;
}
.record-timer {
  position: absolute;
  left: 16px;
  top: 16px;
  padding: 8px 11px;
  background: #931b34;
  color: white;
  border-radius: 9px;
  font-weight: 900;
}
.capture-actions {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
}
.capture-media > .capture-actions {
  padding: 12px 14px 4px;
}
.capture-note {
  margin: 4px 14px 12px;
}
.upload-button,
.danger {
  border-radius: 12px;
  padding: 13px 16px;
  font-weight: 800;
  cursor: pointer;
  background: #0d1320;
  border: 1px solid #35445d;
  color: #dfe7f4;
}
.danger {
  background: #3a101a;
  border-color: #8d263d;
}
.capture-preview {
  background: radial-gradient(circle at 50% 45%, #13253b, #07101c 60%);
  min-width: 0;
  overflow: hidden;
}
.capture-avatar {
  position: absolute;
  inset: 0;
}
.capture-progress {
  margin: 14px 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: #0b111d;
  border: 1px solid #26344a;
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 16px;
  align-items: center;
}
.capture-progress[data-kind="error"] {
  border-color: #873046;
}
.capture-progress[data-kind="success"] {
  border-color: #2b8b68;
}
.capture-progress div:last-child {
  display: grid;
  gap: 4px;
}
.capture-progress span {
  color: #8f9db1;
  font-size: 12px;
}
.progress-track {
  height: 9px;
  background: #1a2434;
  border-radius: 999px;
  overflow: hidden;
}
.progress-track i {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, #7447ff, #e84bd7, #62efbb);
  transition: width 0.2s;
}
.capture-footer {
  align-items: flex-end;
}
.capture-options {
  display: flex;
  gap: 12px;
}
.capture-options label {
  color: #aab6ca;
  font-size: 12px;
}
.capture-options select {
  display: block;
  margin-top: 5px;
  background: #0d1320;
  color: white;
  border: 1px solid #35445d;
  border-radius: 9px;
  padding: 9px;
}
.capture-actions button:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}
@media (max-width: 1000px) {
  .capture-grid {
    grid-template-columns: 1fr;
    height: auto;
  }
  .capture-media,
  .capture-preview {
    min-height: 430px;
  }
  .capture-head,
  .capture-footer {
    align-items: stretch;
    flex-direction: column;
  }
  .capture-progress {
    grid-template-columns: 1fr;
  }
  .capture-options {
    flex-wrap: wrap;
  }
}
@media (max-width: 640px) {
  .shell {
    display: block;
  }
  .side {
    position: fixed;
    z-index: 20;
    left: 0;
    right: 0;
    bottom: 0;
    height: 68px;
    border: 0;
    border-top: 1px solid #263248;
    padding: 7px;
    background: #050711;
  }
  .brand,
  .profile,
  .ver {
    display: none;
  }
  .side nav {
    grid-template-columns: repeat(6, 1fr);
    gap: 3px;
  }
  .side nav button {
    font-size: 0;
    padding: 10px 2px;
    text-align: center;
  }
  .side nav button::first-letter {
    font-size: 20px;
  }
  header {
    height: 68px;
    padding: 0 14px;
  }
  .pill {
    display: none;
  }
  .capture-wrap,
  .studio,
  .ranking,
  .battlewrap {
    padding: 12px 12px 82px;
  }
  .capture-head h2 {
    font-size: 20px;
  }
  .capture-chip {
    align-self: flex-start;
  }
  .capture-grid {
    gap: 10px;
  }
  .capture-media,
  .capture-preview {
    min-height: 360px;
  }
  .capture-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .capture-actions > * {
    text-align: center;
  }
  .capture-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }
  .capture-options select {
    width: 100%;
  }
  .capture-steps span {
    font-size: 11px;
    padding: 8px 4px;
  }
}

@media (max-width: 760px) and (orientation: portrait) {
  .capture-wrap {
    width: 100%;
    min-height: auto;
    padding: 14px 14px 22px;
    overflow: visible;
  }
  .capture-head, .capture-footer { align-items: stretch; flex-direction: column; }
  .capture-head h2 { font-size: 24px; }
  .capture-chip { align-self: flex-start; }
  .capture-steps { gap: 5px; margin: 14px 0; }
  .capture-steps span { min-width: 0; padding: 9px 3px; font-size: 11px; }
  .capture-grid {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    gap: 12px;
  }
  .capture-media, .capture-preview { width: 100%; min-height: 55svh; }
  .capture-media { grid-template-rows: minmax(320px, 55svh) auto auto; }
  .capture-preview { height: 55svh; }
  .capture-progress { grid-template-columns: 1fr; gap: 10px; }
  .capture-options { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .capture-options select { width: 100%; }
  .capture-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .capture-actions > * { width: 100%; text-align: center; }
  .record-timer {
    left: 50%;
    top: 18px;
    transform: translateX(-50%);
    min-width: 150px;
    text-align: center;
    font-size: 18px;
  }
}

@media (orientation: landscape) and (max-width: 1000px) and (max-height: 600px) {
  .capture-wrap { height: calc(100svh - 108px - env(safe-area-inset-bottom)); min-height: 0; padding: 7px 10px; overflow-y: auto; }
  .capture-head { flex-direction: row; align-items: center; gap: 8px; }
  .capture-head h2 { font-size: 18px; }
  .capture-head p { display: none; }
  .capture-head small { font-size: 9px; }
  .capture-chip { padding: 6px 9px; font-size: 10px; }
  .capture-steps { height: 30px; margin: 6px 0; }
  .capture-steps span { padding: 5px 2px; font-size: 10px; }
  .capture-grid { display: grid; grid-template-columns: 1fr 1fr; height: calc(100% - 96px); min-height: 150px; max-height: 180px; gap: 8px; }
  .capture-media, .capture-preview { min-height: 0; height: 100%; }
  .capture-media { grid-template-rows: minmax(0, 1fr) auto; }
  .capture-media > .capture-actions { display: flex; padding: 5px; gap: 5px; }
  .capture-media > .capture-actions > * { width: auto; flex: 1; padding: 7px 5px; font-size: 10px; }
  .capture-note { display: none; }
  .capture-empty { padding: 12px; gap: 5px; font-size: 11px; }
  .capture-empty span { font-size: 9px; }
  .capture-progress { margin: 6px 0; padding: 6px 8px; grid-template-columns: 120px 1fr; gap: 8px; font-size: 10px; }
  .capture-progress span { font-size: 9px; }
  .capture-footer { flex-direction: row; align-items: center; gap: 7px; }
  .capture-options { display: flex; width: auto; flex: 0 0 auto; gap: 5px; }
  .capture-options label { font-size: 9px; }
  .capture-options select { width: auto; margin-top: 1px; padding: 5px; font-size: 9px; }
  .capture-footer > .capture-actions { display: flex; flex: 1; gap: 5px; }
  .capture-footer > .capture-actions > * { width: auto; flex: 1; min-width: 0; padding: 7px 4px; font-size: 9px; }
}

.capture-toggle{display:flex!important;align-items:center;gap:6px;padding:8px 10px;border:1px solid #263750;border-radius:10px}.capture-toggle input,.camera-consent input{width:auto!important}.capture-advanced{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px;padding:12px;border:1px solid #263750;border-radius:14px;background:#08111d}.camera-consent{grid-column:1/-1;display:flex;align-items:flex-start;gap:9px;color:#aab5c8;line-height:1.4}.capture-video-wrap.mirrored video,.capture-video-wrap.mirrored canvas{transform:scaleX(-1)}
@media(max-width:760px){.capture-advanced{grid-template-columns:1fr}.camera-consent{grid-column:auto}.capture-toggle{justify-content:center}}

/*
 * Móvil horizontal 3.1: cada área de trabajo ocupa exactamente el espacio
 * visible entre la cabecera y la navegación inferior. No hay scroll de página.
 */
@media (orientation: landscape) and (max-width: 1180px) and (max-height: 700px) {
  html, body, .shell { width: 100%; height: 100dvh; min-height: 0; overflow: hidden !important; }
  .shell { display: block; }
  main {
    width: 100%; height: 100dvh; min-height: 0;
    padding: 0 0 calc(50px + env(safe-area-inset-bottom));
    overflow: hidden !important;
  }
  .side {
    position: fixed; z-index: 100; inset: auto 0 0 0;
    width: 100%; height: calc(50px + env(safe-area-inset-bottom));
    padding: 3px max(7px, env(safe-area-inset-right)) calc(3px + env(safe-area-inset-bottom)) max(7px, env(safe-area-inset-left));
    border: 0; border-top: 1px solid #263248; background: rgba(5,7,17,.97);
  }
  .brand, .profile, .ver { display: none !important; }
  .side nav { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)) !important; gap: 4px !important; height: 44px; }
  .side nav button { min-width: 0; min-height: 42px; padding: 2px !important; border-radius: 9px; text-align: center; font-size: 0 !important; }
  .side nav button .nav-icon, .side nav button::first-letter { display: inline; font-size: 16px !important; }
  header {
    width: 100%; height: 44px; min-height: 44px;
    padding: 4px max(12px,env(safe-area-inset-right)) 4px max(12px,env(safe-area-inset-left));
  }
  header small { font-size: 8px; line-height: 1; }
  header h1 { margin: 1px 0 0; font-size: 20px; line-height: 1; }
  header .pill { display: none !important; }
  .header-actions { gap: 4px; }
  .header-actions select, .header-actions .ghost { min-height: 0; padding: 4px 6px; font-size: 9px; }
  .view.active { height: calc(100dvh - 94px - env(safe-area-inset-bottom)); min-height: 0; overflow: hidden !important; }

  /* Inicio */
  #home.active .hero { display: grid; align-content: center; height: 100%; padding: 10px max(18px,env(safe-area-inset-left)); overflow: hidden; font-size: 13px; }
  #home .hero h2 { font-size: 22px; }
  #home .hero p { max-width: 100%; margin: 5px 0; font-size: 11px; line-height: 1.3; }
  #home .home-steps { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin-top: 7px; }
  #home .home-steps article { gap: 3px; padding: 7px; border-radius: 10px; font-size: 10px; }

  /* Creador de avatar */
  #creator.active { display: grid; grid-template-columns: minmax(0,58%) minmax(285px,42%); height: calc(100dvh - 94px - env(safe-area-inset-bottom)); overflow: hidden; }
  #creator > .stage { width: 100%; height: 100%; min-height: 0; }
  #creator > .panel { position: relative; inset: auto; width: 100%; height: 100%; padding: 6px 8px; overflow: hidden; border: 0; border-left: 1px solid #273042; }
  #creator .tabs { gap: 3px; margin-bottom: 5px; }
  #creator .tabs button { min-height: 0; padding: 5px 2px; font-size: 9px; border-radius: 8px; }
  #creator .panel label { margin: 5px 0 3px; font-size: 9px; }
  #creator .cards { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 3px; }
  #creator .cards.compact { grid-template-columns: repeat(4,minmax(0,1fr)); }
  #creator .cards button { min-height: 0; padding: 5px 2px; border-radius: 7px; font-size: 8px; line-height: 1.1; }
  #creator .info, #creator .hint { margin: 4px 0 0; padding: 5px; max-height: 34px; overflow: hidden; font-size: 8px; line-height: 1.2; }
  #creator .swatches { gap: 4px; }
  #creator .swatches button { width: 25px; height: 25px; border-radius: 6px; }
  #creator .panel input[type="range"] { height: 12px; }
  #creator .save { position: absolute; z-index: 4; left: 8px; right: 8px; bottom: 6px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 0; }
  #creator .save button { min-width: 0; padding: 6px 3px; font-size: 8px; border-radius: 8px; }
  #creator .tabpane.active { padding-bottom: 31px; }
  .tools { top: 5px; left: 5px; gap: 3px; max-width: calc(100% - 10px); }
  .tools button { min-width: 48px; padding: 5px 3px; font-size: 9px; }
  .status { top: 5px; right: 5px; left: auto; max-width: 50%; padding: 5px 7px; border-radius: 8px; font-size: 8px; }
  .camera-pad, .camera-pad.compact { right: 5px; bottom: 5px; display: flex; grid-template-columns: none; gap: 2px; padding: 3px; }
  .camera-pad button, .camera-pad.compact button { width: 25px; height: 25px; border-radius: 6px; font-size: 12px; }

  /* Aura Move Studio */
  .studio { display: grid; grid-template-rows: 29px 27px minmax(0,1fr); width: 100%; height: 100%; padding: 4px 8px; overflow: hidden !important; }
  .studiohead { min-height: 0; flex-direction: row; align-items: center; gap: 5px; }
  .studiohead small { font-size: 7px; }
  .studiohead h2 { font-size: 15px; line-height: 1; }
  .studiohead > div:last-child { display: flex; gap: 3px; }
  .studiohead button { min-width: 0; padding: 5px 6px; font-size: 8px; border-radius: 7px; white-space: nowrap; }
  .move-library { grid-template-columns: auto minmax(90px,1fr) repeat(3,auto); gap: 3px; margin: 2px 0; font-size: 8px; }
  .move-library select, .move-library button { min-width: 0; padding: 4px; border-radius: 6px; font-size: 8px; }
  .movegrid { display: grid; grid-template-columns: minmax(0,58%) minmax(285px,42%); width: 100%; height: 100%; min-height: 0; margin: 0; }
  .movegrid > .stage { width: 100%; height: 100%; min-height: 0; }
  .movegrid > .move-panel { position: relative; inset: auto; display: grid; grid-template-columns: 58px minmax(0,1fr) 58px minmax(0,1fr); grid-auto-flow: row; align-content: start; gap: 3px 5px; width: 100%; height: 100%; padding: 6px; overflow: hidden; border: 0; border-left: 1px solid #273042; }
  .move-panel label { align-self: center; margin: 0; font-size: 7px; line-height: 1; }
  .move-panel input, .move-panel select { align-self: center; min-width: 0; height: 22px; padding: 2px 4px !important; font-size: 8px; }
  .move-panel input[type="range"] { height: 14px; padding: 0 !important; }
  .move-panel button { min-width: 0; padding: 5px 3px; font-size: 7px; border-radius: 6px; }
  .move-panel .timeline { grid-column: 1/-1; display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; max-height: 39px; margin: 1px 0 0; overflow: hidden; }
  .move-panel .timeline div { padding: 3px; font-size: 6px; }
  .badge { left: 5px; bottom: 5px; padding: 4px 6px; border-radius: 7px; font-size: 7px; }

  /* Batalla: ambos rivales siempre visibles en una única pantalla. */
  .battlewrap { position: relative; display: grid; grid-template-rows: auto auto minmax(0,1fr) auto; width: 100%; height: 100%; min-height: 0; padding: 4px max(8px,env(safe-area-inset-right)) 3px max(8px,env(safe-area-inset-left)); overflow: hidden !important; }
  .battlehead { height: 27px; min-height: 0; flex-direction: row; align-items: center; gap: 5px; }
  .battlehead small { font-size: 7px; }
  .battlehead h2 { font-size: 15px; line-height: 1; }
  .battlehead button { min-width: 0; padding: 5px 7px; font-size: 8px; white-space: nowrap; }
  .battle-lobby { grid-template-columns: minmax(130px,1fr) 48px minmax(95px,.8fr) auto; gap: 3px; min-height: 0; margin: 2px 0; padding: 3px; border-radius: 8px; }
  .battle-lobby label { gap: 1px; font-size: 7px; }
  .battle-lobby button, .battle-lobby select, .battle-lobby input { min-height: 0; padding: 4px; border-radius: 6px; font-size: 8px; }
  .battle-modes { gap: 3px; }
  .battle-runtime { min-height: 0; margin: 2px 0; padding: 3px 5px; gap: 5px; flex-wrap: nowrap; border-radius: 8px; font-size: 8px; }
  .battle-runtime strong { margin-left: auto; font-size: 13px; }
  .battle-runtime button { min-width: 0; padding: 4px 6px; border-radius: 6px; font-size: 7px; }
  .battle-history { position: absolute; z-index: 20; top: 31px; right: 8px; width: min(55%,390px); max-height: calc(100% - 36px); margin: 0; overflow: auto; }
  .arenas { display: grid; grid-template-columns: minmax(0,1fr) 48px minmax(0,1fr); align-items: stretch; gap: 5px; width: 100%; height: 100%; min-height: 0; padding: 3px; border-radius: 10px; }
  .fighter { display: grid; grid-template-rows: 16px minmax(0,1fr) 24px 24px; gap: 2px; width: 100%; height: 100%; min-height: 0; }
  .fighter > b { padding: 2px 7px; font-size: 9px; line-height: 12px; }
  .fighter select, .fighter button { min-width: 0; height: 24px; padding: 2px 4px; border-radius: 6px; font-size: 8px; }
  .battlecanvas { position: relative; inset: auto; width: 100%; height: 100%; min-height: 0; border-radius: 9px; }
  .versus { display: grid; align-content: center; width: 44px; min-width: 0; min-height: 44px; padding: 6px 2px; font-size: 13px; }
  .versus small { display: block; max-height: 55px; margin-top: 4px; overflow: hidden; font-size: 6px; line-height: 1.15; overflow-wrap: anywhere; }
  .score { height: 19px; margin: 1px 0 0; gap: 18px; font-size: 14px; line-height: 18px; }
  .score span { font-size: 7px; }
  .fighter.battle-winner .battlecanvas::after { top: 5px; padding: 3px 7px; font-size: 7px; }
  .fighter.battle-winner .battlecanvas::before { inset: 6%; }
  .arena-marquee { top: 3px; gap: 4px; padding: 2px 6px; font-size: 5px; }

  /* Clasificación y comunidad */
  .ranking, .community-wrap { display: grid; grid-template-rows: 29px minmax(0,1fr); width: 100%; height: 100%; min-height: 0; padding: 4px 8px; overflow: hidden !important; }
  .ranklist { grid-template-columns: repeat(2,minmax(0,1fr)); grid-auto-rows: minmax(0,1fr); gap: 3px; min-height: 0; margin-top: 3px; overflow: hidden; }
  .rankrow { grid-template-columns: 25px minmax(0,1fr) auto; gap: 4px; min-height: 0; padding: 3px 6px; border-radius: 7px; font-size: 8px; }
  .rankrow > :last-child { display: none; }
  .rankrow:nth-child(n+9) { display: none; }
  .community-grid { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(2,minmax(0,1fr)); gap: 4px; min-height: 0; overflow: hidden; }
  .community-card { min-height: 0; padding: 5px; border-radius: 8px; overflow: hidden; font-size: 7px; }
  .community-card h3 { margin: 0 0 3px; font-size: 9px; }
  .community-card form { flex-direction: row; gap: 3px; }
  .community-card input, .community-card button { min-width: 0; padding: 3px; font-size: 7px; }
  .community-item { gap: 3px; margin-top: 2px; padding: 3px; border-radius: 5px; font-size: 7px; }
  .community-item small { font-size: 6px; }

  /* Diálogo de acceso */
  .auth-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 8px); overflow: hidden; border-radius: 13px; }
  .auth-card { grid-template-columns: minmax(160px,.55fr) minmax(340px,1.45fr); min-height: 0; height: calc(100dvh - 10px); }
  .auth-brand-panel { justify-content: center; padding: 14px; }
  .auth-form-panel { padding: 10px 20px; overflow: hidden; }
  .auth-form-panel h2 { margin: 3px 0; font-size: 18px; }
  .auth-form-panel > p { margin: 2px 0; font-size: 9px; }
  .auth-mode { margin: 5px 0 2px; padding: 2px; }
  .auth-mode button { padding: 5px; font-size: 9px; }
  .auth-dialog label { gap: 2px; margin: 4px 0; font-size: 8px; }
  .auth-dialog input { min-height: 28px; padding: 4px 7px; font-size: 11px; }
  .auth-dialog .primary { min-height: 30px; padding: 5px; font-size: 9px; }
  .auth-privacy { margin-top: 4px !important; font-size: 7px; }
  .auth-status { min-height: 10px; margin-top: 2px !important; font-size: 8px; }

  /* Aura Capture */
  .capture-wrap { display: grid; grid-template-rows: 27px 22px minmax(0,1fr) 27px 31px 24px; width: 100%; height: 100%; min-height: 0; padding: 3px 8px; overflow: hidden !important; }
  .capture-head { min-height: 0; flex-direction: row; align-items: center; gap: 5px; }
  .capture-head h2 { font-size: 15px; line-height: 1; }
  .capture-head small { font-size: 7px; }
  .capture-head p { display: none; }
  .capture-chip { padding: 3px 6px; font-size: 7px; }
  .capture-steps { height: 20px; gap: 3px; margin: 1px 0; }
  .capture-steps span { padding: 3px; border-radius: 6px; font-size: 7px; }
  .capture-grid { display: grid; grid-template-columns: 1fr 1fr; width: 100%; height: 100%; min-height: 0; max-height: none; gap: 5px; }
  .capture-media, .capture-preview { width: 100%; height: 100%; min-height: 0; border-radius: 9px; }
  .capture-media { grid-template-rows: minmax(0,1fr) 25px; }
  .capture-media > .capture-actions { display: flex; flex-wrap: nowrap; gap: 3px; padding: 2px; }
  .capture-media > .capture-actions > * { flex: 1; min-width: 0; padding: 3px; border-radius: 5px; text-align: center; font-size: 7px; }
  .capture-note { display: none; }
  .capture-empty { gap: 3px; padding: 5px; font-size: 8px; }
  .capture-empty span { font-size: 6px; }
  .record-timer { top: 4px; left: 4px; padding: 3px 5px; font-size: 8px; }
  .capture-progress { grid-template-columns: 85px minmax(0,1fr); gap: 5px; min-height: 0; margin: 2px 0; padding: 3px 5px; border-radius: 7px; font-size: 7px; }
  .capture-progress span { font-size: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .progress-track { height: 5px; }
  .capture-footer { min-height: 0; flex-direction: row; align-items: center; gap: 4px; overflow: hidden; }
  .capture-options { display: flex; flex: 0 1 auto; width: auto; gap: 2px; }
  .capture-options label { gap: 1px; padding: 2px 3px; font-size: 6px; }
  .capture-options select { width: 55px; padding: 2px; font-size: 6px; }
  .capture-toggle { padding: 3px 4px; border-radius: 5px; }
  .capture-footer > .capture-actions { display: flex; flex: 1; flex-wrap: nowrap; gap: 2px; }
  .capture-footer > .capture-actions > * { flex: 1; min-width: 0; padding: 4px 2px; border-radius: 5px; text-align: center; font-size: 6px; white-space: nowrap; }
  .capture-advanced { display: grid; grid-template-columns: 1fr 1fr minmax(100px,.8fr); align-items: center; gap: 4px; min-height: 0; margin: 1px 0 0; padding: 2px 4px; border-radius: 6px; overflow: hidden; }
  .capture-advanced label { display: flex; align-items: center; gap: 3px; min-width: 0; margin: 0; font-size: 6px; white-space: nowrap; }
  .capture-advanced input[type="range"] { min-width: 0; height: 10px; }
  .camera-consent { grid-column: auto; align-items: center; line-height: 1; }
  .camera-consent span { overflow: hidden; text-overflow: ellipsis; }
}