:root{
  color-scheme: dark light;
}

html[data-theme="dark"]{
  --bg:#050810;
  --bg2:#08111d;
  --panel:#101722;
  --panel2:#0d1420;
  --panel-soft:#0d1420;
  --line:#223247;
  --line2:#27364a;
  --line-strong:#334155;
  --text:#e8f0f7;
  --muted:rgba(232,240,247,.78);
  --chip:#0b1320;
  --accent:#60a5fa;
  color-scheme: dark;
}

html[data-theme="light"]{
  --bg:#f5f7fb;
  --bg2:#ffffff;
  --panel:#ffffff;
  --panel2:#f8fafc;
  --panel-soft:#f8fafc;
  --line:#d8e1ee;
  --line2:#c6d3e6;
  --line-strong:#94a3b8;
  --text:#132033;
  --muted:#64748b;
  --chip:#eef2f7;
  --accent:#111827;
  color-scheme: light;
}

html[data-theme="dark"] body{
  background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%) !important;
  color:var(--text) !important;
}

html[data-theme="light"] body{
  background:linear-gradient(180deg,#fbfcfe 0%,var(--bg) 100%) !important;
  color:var(--text) !important;
}

html[data-theme] .card,
html[data-theme] .panel,
html[data-theme] .account-card,
html[data-theme] .mfa-card,
html[data-theme] .venue,
html[data-theme] .stat,
html[data-theme] .box,
html[data-theme] .metric,
html[data-theme] .control,
html[data-theme] .summary-box,
html[data-theme] .ticket,
html[data-theme] .note{
  background:var(--panel) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}

html[data-theme] input,
html[data-theme] select,
html[data-theme] textarea{
  background:var(--panel2) !important;
  border-color:var(--line2) !important;
  color:var(--text) !important;
}

html[data-theme] .muted,
html[data-theme] .small,
html[data-theme] .sub,
html[data-theme] .k,
html[data-theme] label{
  color:var(--muted) !important;
}

html[data-theme] .chip,
html[data-theme] .pill,
html[data-theme] .live-pill,
html[data-theme] .eyebrow{
  background:var(--chip) !important;
  border-color:var(--line2) !important;
  color:var(--text) !important;
}

html[data-theme] button.primary:not(.theme-toggle),
html[data-theme] .header-btn.primary,
html[data-theme] .btn-primary,
html[data-theme] .btn:not(.secondary):not(.danger):not(.theme-toggle),
html[data-theme] .segmented button.active{
  background:#1d4ed8 !important;
  border-color:#1d4ed8 !important;
  color:#ffffff !important;
}

html[data-theme] button.good:not(.theme-toggle){
  background:#15803d !important;
  border-color:#15803d !important;
  color:#ffffff !important;
}

html[data-theme] button.warn:not(.theme-toggle){
  background:#b45309 !important;
  border-color:#b45309 !important;
  color:#ffffff !important;
}

html[data-theme] button.bad:not(.theme-toggle),
html[data-theme] .btn.danger{
  background:#b91c1c !important;
  border-color:#b91c1c !important;
  color:#ffffff !important;
}

html[data-theme] .btn.secondary,
html[data-theme] .btn-secondary,
html[data-theme] button:not(.primary):not(.good):not(.warn):not(.bad):not(.btn-primary):not(.theme-toggle):not(.tier-card){
  background:var(--panel2) !important;
  border-color:var(--line2) !important;
  color:var(--text) !important;
}

.theme-toggle{
  position:fixed;
  right:calc(16px + env(safe-area-inset-right));
  top:calc(16px + env(safe-area-inset-top));
  z-index:9999;
  width:auto !important;
  min-width:86px;
  min-height:42px;
  padding:10px 13px !important;
  border-radius:999px !important;
  border:1px solid var(--line2,#27364a) !important;
  background:var(--panel,#101722) !important;
  color:var(--text,#e8f0f7) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.22);
  font:700 13px system-ui,-apple-system,Segoe UI,sans-serif !important;
}

.theme-toggle:focus-visible{
  outline:3px solid rgba(96,165,250,.45);
  outline-offset:3px;
}

*{
  -webkit-tap-highlight-color:transparent;
}

img,
canvas,
svg,
video{
  max-width:100%;
}

input,
select,
textarea,
button{
  min-width:0;
}

table{
  max-width:100%;
}

@media (max-width:760px){
  html{
    text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
  }

  body{
    overflow-x:hidden;
  }

  h1,h2,h3{
    line-height:1.12;
    overflow-wrap:anywhere;
  }

  .shell{
    width:100%;
    padding:16px !important;
  }

  .brandbar,
  .topbar,
  .brand,
  .header-actions,
  .section-head,
  .livebar,
  .comparebar{
    align-items:flex-start !important;
  }

  .header-actions,
  .row,
  .proof,
  .live-meta{
    flex-wrap:wrap !important;
  }

  .header-actions > *,
  .row > button,
  .row > .btnlink{
    max-width:100%;
  }

  button,
  .btnlink,
  input,
  select,
  textarea{
    font-size:16px !important;
  }

  button,
  .btnlink{
    min-height:44px;
    white-space:normal;
  }

  .card,
  .panel,
  .account-card,
  .mfa-card,
  .venue,
  .stat{
    border-radius:14px !important;
    padding:14px !important;
  }

  .ticker{
    position:static !important;
  }

  .ticker-grid,
  .stats,
  .layout,
  .grid,
  .grid2,
  .venue-grid,
  .two,
  .meta,
  .controls,
  .tier-grid,
  .trend-grid,
  .filter-grid,
  .row{
    grid-template-columns:1fr !important;
  }

  .sticky-card{
    position:static !important;
  }

  table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
  }

  .brand-logo{
    transform:none !important;
    max-width:min(100%,280px) !important;
    height:auto !important;
    max-height:46px;
  }

  .theme-toggle{
    right:calc(10px + env(safe-area-inset-right));
    top:auto;
    bottom:calc(10px + env(safe-area-inset-bottom));
    min-width:78px;
  }
}

@media print{
  .theme-toggle{
    display:none !important;
  }
}
