/* Phone fixes shared by every admin page (loaded last). iPhone Safari zooms the whole page out when anything is
   wider than the screen, and zooms in on any text box under 16px, so both are guarded here. */
html{ -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* tell the browser which theme is showing, so built-in controls (selects, checkboxes, unstyled buttons, scrollbars)
   draw dark on the dark theme instead of white boxes with black text */

/* Admin is always near-black, whatever theme the visitor picked: this loads last on every admin page and out-ranks each
   page's own light / dark colours (triple :root beats :root[data-theme] and the prefers-color-scheme block). */
:root:root:root{
  color-scheme: dark;
  --bg: #05070a; --bg-raised: #0b0e13; --bg-raised-2: #10141a; --card: #0b0e13;
  --ink: #f0e8e8; --ink-dim: #a89898;
  --accent: #ff5555; --accent-dim: rgba(68,147,248,.14); --btn-primary-hover: #ff6666; --btn-hover-bg: #151a21;
  --err: #f85149; --ok: #3fb950; --ok-dim: rgba(63,185,80,.14); --ok-subtle: rgba(63,185,80,.12);
  --warn: #e3b341; --warn-dim: rgba(227,179,65,.14);
  --border-tint: 255,255,255; --grid-line: rgba(255,255,255,0);
  /* video maker */
  --app: #05070a; --panel: #0b0e13; --panel2: #10141a; --panel3: #151a21; --line: #1c222b; --line2: #272e39; --ruler: #080a0e;
}
/* the light / dark switch has nothing to do here */
.theme-toggle-btn, .theme-row:has(#theme-switch){ display: none !important; }

/* iPhone/iPad Safari only: drop its own rounded, shaded control styling so the page's styles show as designed */
@supports (-webkit-touch-callout: none){
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]), textarea, select{
    -webkit-appearance: none; appearance: none;
  }
  input[type=search]::-webkit-search-decoration{ -webkit-appearance: none; }
  select{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238b949e' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important; background-position: right 10px center !important; background-size: 12px !important;
    padding-right: 30px !important;
  }
  button, [role=button]{ -webkit-tap-highlight-color: transparent; }
}

@media (max-width: 700px){
  html, body{ overflow-x: clip; }
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]), select, textarea{ font-size: 16px !important; }
  input, select, textarea, label, button{ max-width: 100%; min-width: 0; box-sizing: border-box; }
  select{ text-overflow: ellipsis; }
  img, video, canvas, iframe, table, pre{ max-width: 100%; }
  pre, code{ white-space: pre-wrap; overflow-wrap: anywhere; }
  p, li, td, dd, a{ overflow-wrap: break-word; }

  /* top bar: title on one line, buttons wrap under it neatly */
  .topbar{ flex-wrap: wrap; row-gap: 10px; column-gap: 10px; }
  .topbar h1{ white-space: nowrap; min-width: 0; }
  .topbar .right{ flex-wrap: wrap; gap: 8px; }
  .topbar .right > a, .topbar .right > button{ white-space: nowrap; }

  /* founder tabs: one swipeable row instead of three wrapped rows */
  .page-tabs-inner{ flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .page-tabs-inner::-webkit-scrollbar{ display: none; }
  .page-tabs-inner > *{ flex-shrink: 0; white-space: nowrap; }
}

@media (max-width: 700px){
  .an-stage{ aspect-ratio: auto; min-height: 0; height: 240px; }
}