/* ==========================================================================
   GoldAlgo V150 — theme layer (loaded AFTER style.css)
   1. Design tokens (dark = brand default, light = "daylight desk")
   2. Shared components: icons, top bar, theme toggle, menus, dashboard head
   3. Light theme overrides
   Light-mode rules use !important on purpose: style.css already contains
   ~1,100 !important declarations from earlier versions, so this layer must
   win without editing those rules one by one.
   ========================================================================== */

/* 1. TOKENS ------------------------------------------------------------- */
:root,
html[data-theme="dark"]{
  --ga-bg:#050b14;
  --ga-bg-grad:linear-gradient(180deg,#07111f 0%,#040a14 100%);
  --ga-surface:#0a1422;
  --ga-surface-2:#0e1b2d;
  --ga-surface-3:#13233a;
  --ga-line:rgba(130,163,201,.18);
  --ga-line-strong:rgba(130,163,201,.32);
  --ga-text:#f3f7fc;
  --ga-text-2:#c4d0de;
  --ga-muted:#8494aa;
  --ga-gold:#f4b72b;
  --ga-gold-ink:#f4b72b;
  --ga-gold-soft:rgba(244,183,43,.12);
  --ga-blue:#4fb3ff;
  --ga-green:#19e683;
  --ga-red:#ff596d;
  --ga-amber:#ffd773;
  --ga-shadow:0 18px 40px rgba(0,0,0,.35);
  --ga-focus:0 0 0 3px rgba(244,183,43,.45);
}
html[data-theme="light"]{
  color-scheme:light;
  --ga-bg:#eef1f6;
  --ga-bg-grad:linear-gradient(180deg,#f5f7fb 0%,#eaeef4 100%);
  --ga-surface:#ffffff;
  --ga-surface-2:#f6f8fb;
  --ga-surface-3:#edf1f7;
  --ga-line:#dde3ec;
  --ga-line-strong:#c7d1de;
  --ga-text:#0e1a2b;
  --ga-text-2:#2f3d52;
  --ga-muted:#5d6c82;
  --ga-gold:#e8a516;          /* fills, buttons */
  --ga-gold-ink:#946200;      /* gold text on white: 5.3:1 */
  --ga-gold-soft:rgba(232,165,22,.12);
  --ga-blue:#0a6fb5;
  --ga-green:#0b8048;         /* 4.9:1 on white */
  --ga-red:#c42a3e;           /* 5.6:1 on white */
  --ga-amber:#9a5d00;
  --ga-shadow:0 1px 2px rgba(14,26,43,.06),0 8px 24px rgba(14,26,43,.07);
  --ga-focus:0 0 0 3px rgba(10,111,181,.35);
}
html[data-theme="dark"]{color-scheme:dark}

/* Smooth colour change only while the user is switching, never on load. */
html.ga-theme-switching *,
html.ga-theme-switching *::before,
html.ga-theme-switching *::after{
  transition:background-color .22s ease,border-color .22s ease,color .22s ease,fill .22s ease!important;
}

/* 2. SHARED COMPONENTS -------------------------------------------------- */

/* Icons */
.ga-i{width:1.15em;height:1.15em;display:inline-block;vertical-align:-.18em;flex:none;stroke:currentColor;fill:none;overflow:visible}

/* Thai-friendly font stack (falls back to the old one) */
body{font-family:"Noto Sans Thai","Sarabun","Segoe UI","Leelawadee UI",Tahoma,sans-serif}

/* Keyboard focus that is actually visible */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:none!important;box-shadow:var(--ga-focus)!important;border-radius:10px}

/* Top bar nav icons: one size, one stroke, coloured by state */
.ga-topnav-link .ga-nav-icon{display:inline-flex!important;align-items:center;justify-content:center;width:20px;height:20px;font-size:20px!important;color:var(--ga-gold)!important}
.ga-topnav-link .ga-nav-icon .ga-i{width:20px;height:20px}
.ga-topnav-link.active .ga-nav-icon{color:var(--ga-blue)!important}
.ga-topnav-link .ga-nav-icon svg:not(.ga-i){display:none} /* hide any legacy inline svg */

/* Theme toggle */
.ga-theme-toggle{
  position:relative;width:42px;height:42px;flex:none;display:inline-grid;place-items:center;
  border:1px solid var(--ga-line-strong);border-radius:12px;background:var(--ga-surface-2);
  color:var(--ga-gold-ink);cursor:pointer;padding:0;transition:border-color .15s,background .15s,transform .15s;
}
.ga-theme-toggle:hover{border-color:var(--ga-gold);background:var(--ga-gold-soft)}
.ga-theme-toggle:active{transform:scale(.95)}
.ga-theme-toggle .ga-theme-icon{grid-area:1/1;display:grid;place-items:center;transition:opacity .2s,transform .3s}
.ga-theme-toggle .ga-i{width:20px;height:20px}
html[data-theme="dark"] .ga-theme-icon-sun,
html:not([data-theme]) .ga-theme-icon-sun{opacity:0;transform:rotate(-60deg) scale(.6)}
html[data-theme="light"] .ga-theme-icon-moon{opacity:0;transform:rotate(60deg) scale(.6)}
.ga-theme-toggle-floating{position:fixed;top:16px;right:16px;z-index:9000;box-shadow:var(--ga-shadow)}

/* News button icon (replaces the CSS-drawn bell) */
.ga-news-button .ga-news-ico{display:inline-grid;place-items:center;color:var(--ga-gold-ink)}
.ga-news-button .ga-news-ico .ga-i{width:19px;height:19px}
.ga-news-count.is-empty{opacity:.55}

/* Hamburger + dropdown */
.ga-hamburger-toggle{display:inline-grid!important;place-items:center!important;color:var(--ga-gold)!important}
.ga-hamburger-toggle .ga-i{width:22px;height:22px}
.user-menu.is-open .user-dropdown{display:flex!important}
.user-dropdown a{justify-content:flex-start!important;gap:10px}
.user-dropdown a .ga-i{width:18px;height:18px;opacity:.8}
.ga-public-news-close{display:inline-grid!important;place-items:center}
.ga-public-news-close .ga-i{width:18px;height:18px}

/* Generic icon buttons */
.ga-btn-icon{display:inline-flex!important;align-items:center;justify-content:center;gap:7px}
.ga-btn-icon .ga-i{width:17px;height:17px}
.ga-icon-only{display:inline-grid!important;place-items:center;min-width:40px}
.ga-icon-only .ga-i{width:18px;height:18px}
.icon-close,.delete-modal-close,.daily-detail-close{display:inline-grid!important;place-items:center}
.icon-close .ga-i,.delete-modal-close .ga-i,.daily-detail-close .ga-i{width:20px;height:20px}
.delete-modal-icon .ga-i{width:30px;height:30px}
.auth-home-link{display:inline-flex;align-items:center;gap:6px}
.auth-home-link .ga-i{width:16px;height:16px}

/* Home page icon slots */
.v105-feature-grid article>span .ga-i{width:18px;height:18px}
.v94-stat-icon{display:grid!important;place-items:center}
.v94-stat-icon .ga-i{width:26px;height:26px}
.v94-features article>span{display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:11px;background:var(--ga-gold-soft);color:var(--ga-gold-ink)!important}
.v94-features article>span .ga-i{width:22px;height:22px}
.v105-primary-btn .ga-i,.v105-secondary-btn .ga-i{width:18px;height:18px}
.ga-h-ico{display:inline-grid;place-items:center;color:var(--ga-gold-ink);vertical-align:-3px}
.ga-h-ico .ga-i{width:22px;height:22px}
.v142-pagination button{display:inline-flex;align-items:center;gap:4px}
.v142-pagination button .ga-i{width:16px;height:16px}
.ranking-delete-btn{display:inline-grid!important;place-items:center}
.ranking-delete-btn .ga-i{width:16px;height:16px}

/* ---------- Dashboard page (now shares the public top bar) ---------- */
body.ga-app-page{background:var(--ga-bg-grad)!important;min-height:100vh}
body.ga-app-page>.ga-topbar{margin:0;padding-left:max(18px,calc((100vw - 1480px)/2 + 18px));padding-right:max(18px,calc((100vw - 1480px)/2 + 18px))}
body.ga-app-page .page-wrap{padding-top:18px!important}
.ga-page-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:16px 18px;margin-bottom:12px;border:1px solid var(--ga-line);border-radius:16px;
  background:linear-gradient(120deg,var(--ga-surface-2),var(--ga-surface));
}
.ga-page-head-user{display:flex;align-items:center;gap:14px;min-width:0}
.ga-page-head h1{margin:0;font-size:22px!important;line-height:1.2;color:var(--ga-text)}
.ga-page-head .subline{color:var(--ga-muted)!important;margin-top:3px}
.ga-page-avatar{width:48px!important;height:48px!important;border-radius:14px!important;flex:none;overflow:hidden;display:grid;place-items:center;
  border:1px solid var(--ga-gold)!important;background:var(--ga-surface-3)!important;color:var(--ga-gold-ink)!important;font-weight:900;font-size:20px}
.ga-page-avatar img{width:100%;height:100%;object-fit:cover}
.ga-page-head-actions{display:flex;align-items:center;gap:10px}
.ga-page-head-actions .primary-btn{padding:10px 16px!important}

/* Dashboard cards: bring placeholder + add-card into the navy/gold family */
.dashboard-scale-75 .blue-slot:not(.plus-card){
  background:linear-gradient(160deg,var(--ga-surface-2),var(--ga-surface))!important;
  border:1px dashed var(--ga-line-strong)!important;
}
.dashboard-scale-75 .plus-card{
  background:transparent!important;border:1.5px dashed var(--ga-line-strong)!important;color:var(--ga-text)!important;
  transition:border-color .15s,background .15s;
}
.dashboard-scale-75 .plus-card:hover{border-color:var(--ga-gold)!important;background:var(--ga-gold-soft)!important}
.plus-card .plus-circle{border:0!important;width:64px!important;height:64px!important;border-radius:18px!important;background:var(--ga-gold-soft);color:var(--ga-gold-ink)}
.plus-card .plus-circle .ga-i{width:30px;height:30px}
.plus-card .plus-text{font-size:20px!important;color:var(--ga-text)}
.plus-card .plus-note{font-size:13px!important;color:var(--ga-muted);max-width:260px;line-height:1.5}
.icon-btn.delete-card-btn{display:inline-grid!important;place-items:center;width:32px;height:32px;padding:0!important}
.icon-btn.delete-card-btn .ga-i{width:16px;height:16px}
.icon-btn.delete-card-btn:hover{color:var(--ga-red)!important}
.action-link{gap:6px}
.action-link .ga-i{width:15px;height:15px}
.news-open-btn{display:inline-flex!important;align-items:center;gap:6px}
.news-open-btn .ga-i{width:15px;height:15px}

@media (max-width:760px){
  .ga-theme-toggle{width:38px;height:38px}
  .ga-page-head{padding:12px}
  .ga-page-head-actions{width:100%;justify-content:space-between}
  body.ga-app-page>.ga-topbar{padding-left:12px;padding-right:12px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* 3. LIGHT THEME ------------------------------------------------------- */
html[data-theme="light"] body{background:var(--ga-bg-grad)!important;color:var(--ga-text)!important}
html[data-theme="light"] body::before,
html[data-theme="light"] body::after{background:none!important;opacity:0!important}
html[data-theme="light"] h1,html[data-theme="light"] h2,html[data-theme="light"] h3,html[data-theme="light"] h4{color:var(--ga-text)}

/* Utility colours (style.css forces neon values with !important) */
html[data-theme="light"] .green{color:var(--ga-green)!important}
html[data-theme="light"] .red{color:var(--ga-red)!important}
html[data-theme="light"] .yellow{color:var(--ga-amber)!important}
html[data-theme="light"] .cyan{color:var(--ga-blue)!important}

/* Top bar */
html[data-theme="light"] .ga-topbar{background:rgba(255,255,255,.92)!important;backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--ga-line)!important;box-shadow:0 1px 0 rgba(14,26,43,.03),0 6px 18px rgba(14,26,43,.05)!important}
html[data-theme="light"] .ga-brand,html[data-theme="light"] .ga-brand-text strong{color:var(--ga-text)!important}
html[data-theme="light"] .ga-brand-text strong b{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .ga-brand-text small{color:var(--ga-muted)!important}
html[data-theme="light"] .ga-topnav{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important;box-shadow:none!important}
html[data-theme="light"] .ga-topnav-link{color:var(--ga-text-2)!important}
html[data-theme="light"] .ga-topnav-link:hover{color:var(--ga-text)!important;background:var(--ga-surface-3)!important}
html[data-theme="light"] .ga-topnav-link.active{color:var(--ga-blue)!important;background:#e3effa!important}
html[data-theme="light"] .ga-topnav-link.active::after{background:var(--ga-blue)!important;box-shadow:none!important}
html[data-theme="light"] .ga-topnav-link .ga-nav-icon{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .ga-topnav-link.active .ga-nav-icon{color:var(--ga-blue)!important}
html[data-theme="light"] .ga-news-button,
html[data-theme="light"] .ga-hamburger-toggle,
html[data-theme="light"] .ga-profile-toggle{background:var(--ga-surface)!important;border:1px solid var(--ga-line-strong)!important;color:var(--ga-text)!important;box-shadow:none!important}
html[data-theme="light"] .ga-hamburger-toggle{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .ga-hamburger-toggle:hover,
html[data-theme="light"] .ga-news-button:hover{border-color:var(--ga-gold)!important;background:var(--ga-gold-soft)!important}
html[data-theme="light"] .ga-news-label b{color:var(--ga-text)!important}
html[data-theme="light"] .ga-news-label small{color:var(--ga-muted)!important}
html[data-theme="light"] .ga-auth-link{color:var(--ga-text)!important;border-color:var(--ga-line-strong)!important;background:var(--ga-surface)!important}
html[data-theme="light"] .ga-auth-primary{color:#1b1300!important;background:var(--ga-gold)!important;border-color:var(--ga-gold)!important}

/* Dropdown + news modal */
html[data-theme="light"] .user-dropdown{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;box-shadow:0 18px 40px rgba(14,26,43,.14)!important}
html[data-theme="light"] .user-dropdown:before{background:var(--ga-surface)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .user-dropdown-head{border-color:var(--ga-line)!important}
html[data-theme="light"] .user-dropdown-head b{color:var(--ga-text)!important}
html[data-theme="light"] .user-dropdown-head small{color:var(--ga-muted)!important}
html[data-theme="light"] .user-dropdown a{color:var(--ga-text-2)!important}
html[data-theme="light"] .user-dropdown a:hover{background:var(--ga-surface-3)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .user-dropdown .dropdown-logout{color:var(--ga-red)!important;border-top-color:var(--ga-line)!important}
html[data-theme="light"] .profile-avatar{background:var(--ga-surface-3)!important;color:var(--ga-gold-ink)!important;border-color:var(--ga-line-strong)!important}
html[data-theme="light"] .ga-public-news-backdrop,
html[data-theme="light"] .modal{background:rgba(20,30,45,.38)!important}
html[data-theme="light"] .ga-public-news-card,
html[data-theme="light"] .modal-card,
html[data-theme="light"] .news-modal-card{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;color:var(--ga-text)!important;box-shadow:0 30px 70px rgba(14,26,43,.22)!important}
html[data-theme="light"] .ga-public-news-head h2,html[data-theme="light"] .modal-head h3{color:var(--ga-text)!important}
html[data-theme="light"] .ga-public-news-head p,html[data-theme="light"] .news-sub{color:var(--ga-muted)!important}
html[data-theme="light"] .ga-public-news-close{color:var(--ga-gold-ink)!important;border-color:var(--ga-line-strong)!important;background:var(--ga-surface-2)!important}
html[data-theme="light"] .ga-public-news-item,
html[data-theme="light"] .news-item{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .ga-public-news-analysis,
html[data-theme="light"] .news-item pre{color:var(--ga-text-2)!important;background:transparent!important}
html[data-theme="light"] .ga-public-news-time,html[data-theme="light"] .news-time{color:var(--ga-blue)!important}
html[data-theme="light"] .ga-public-news-impact,html[data-theme="light"] .news-impact{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .ga-public-news-title,html[data-theme="light"] .news-headline{color:var(--ga-text)!important}
html[data-theme="light"] .icon-close{color:var(--ga-muted)!important}

/* Buttons & form controls */
html[data-theme="light"] .primary-btn{background:linear-gradient(135deg,#f2b733,#de9a10)!important;color:#1b1300!important;border:0!important;box-shadow:0 6px 16px rgba(222,154,16,.25)!important}
html[data-theme="light"] .ghost-btn,
html[data-theme="light"] .action-link,
html[data-theme="light"] .news-open-btn{background:var(--ga-surface)!important;color:var(--ga-text)!important;border:1px solid var(--ga-line-strong)!important;box-shadow:none!important}
html[data-theme="light"] .ghost-btn:hover,
html[data-theme="light"] .action-link:hover,
html[data-theme="light"] .news-open-btn:hover{border-color:var(--ga-gold)!important;background:var(--ga-gold-soft)!important}
html[data-theme="light"] .icon-btn{background:var(--ga-surface-3)!important;color:var(--ga-muted)!important;border:1px solid var(--ga-line)!important}
html[data-theme="light"] input:not([type=checkbox]):not([type=radio]),
html[data-theme="light"] select,
html[data-theme="light"] textarea{background:var(--ga-surface)!important;color:var(--ga-text)!important;border:1px solid var(--ga-line-strong)!important}
html[data-theme="light"] input::placeholder,html[data-theme="light"] textarea::placeholder{color:#8a97aa!important}
html[data-theme="light"] .live-status{background:var(--ga-surface)!important;border-color:var(--ga-line-strong)!important}
html[data-theme="light"] .alert{background:#fdecee!important;border-color:#f3c2c9!important;color:#9b1c2e!important}
html[data-theme="light"] .success-alert{background:#e7f6ee!important;border-color:#b9e3cb!important;color:#0b6b3c!important}
html[data-theme="light"] .success-alert.warn{background:#fff5e0!important;border-color:#f1d79e!important;color:#7a4b00!important}
html[data-theme="light"] .demo-box{background:var(--ga-surface-2)!important;border-color:var(--ga-line-strong)!important;color:var(--ga-text-2)!important}

/* ---------- Dashboard ---------- */
html[data-theme="light"] .ga-page-head{background:linear-gradient(120deg,#fff 30%,#fbf6ea 100%)!important;border-color:var(--ga-line)!important;box-shadow:var(--ga-shadow)}
html[data-theme="light"] .news-panel,
html[data-theme="light"] .news-compact{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;box-shadow:none!important}
html[data-theme="light"] .news-title{color:var(--ga-text)!important}
html[data-theme="light"] .news-badge{background:#e7f6ee!important;color:var(--ga-green)!important;border-color:#b9e3cb!important}
html[data-theme="light"] .summary-card,
html[data-theme="light"] .instance-card,
html[data-theme="light"] .metric,
html[data-theme="light"] .small-box{background:var(--ga-surface)!important;border:1px solid var(--ga-line)!important;box-shadow:none!important}
html[data-theme="light"] .summary-card{box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .instance-card{box-shadow:var(--ga-shadow)!important;border-color:var(--ga-line-strong)!important}
html[data-theme="light"] .metric,
html[data-theme="light"] .small-box{background:var(--ga-surface-2)!important}
html[data-theme="light"] .summary-card .label,
html[data-theme="light"] .mini-label{color:var(--ga-muted)!important}
html[data-theme="light"] .summary-card .value,
html[data-theme="light"] .metric .big,
html[data-theme="light"] .small-box .num{color:var(--ga-text)}
html[data-theme="light"] .instance-card h3,
html[data-theme="light"] .blue-slot h3{color:var(--ga-text)!important}
html[data-theme="light"] .slot-sub,
html[data-theme="light"] .subline{color:var(--ga-muted)!important}
html[data-theme="light"] .slot-pill{background:var(--ga-surface-2)!important;border-color:var(--ga-line-strong)!important;color:var(--ga-text-2)!important}
html[data-theme="light"] .slot-pill.live{color:var(--ga-green)!important;background:#e7f6ee!important;border-color:#b9e3cb!important}
html[data-theme="light"] .slot-pill.offline{color:var(--ga-muted)!important}
html[data-theme="light"] .info-row{border-color:var(--ga-line)!important}
html[data-theme="light"] .info-row span:first-child{color:var(--ga-muted)!important}
html[data-theme="light"] .info-row span:last-child{color:var(--ga-text)!important}
html[data-theme="light"] .info-row.claim-row span:last-child{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .section-title{color:var(--ga-text)!important}
html[data-theme="light"] .cards-toolbar{color:var(--ga-text)}
html[data-theme="light"] .delete-account-card{background:var(--ga-surface)!important;color:var(--ga-text)!important}
html[data-theme="light"] .delete-modal-desc,html[data-theme="light"] .delete-modal-list{color:var(--ga-text-2)!important}
html[data-theme="light"] .delete-cancel-btn{background:var(--ga-surface-2)!important;color:var(--ga-text)!important;border-color:var(--ga-line-strong)!important}

/* ---------- Home ---------- */
html[data-theme="light"] .v105-hero{background:linear-gradient(115deg,#ffffff 0%,#ffffff 46%,#f7efdc 100%)!important;border-color:var(--ga-line)!important;box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .v105-hero::before,html[data-theme="light"] .v105-hero::after{opacity:0!important}
html[data-theme="light"] .v105-hero h1{color:var(--ga-text)!important}
html[data-theme="light"] .v105-hero h1 span{color:var(--ga-gold-ink)!important;text-shadow:none!important}
html[data-theme="light"] .v105-hero h2{color:var(--ga-text)!important}
html[data-theme="light"] .v105-hero-lead{color:var(--ga-text-2)!important}
html[data-theme="light"] .v105-eyebrow{color:var(--ga-gold-ink)!important;border-color:rgba(148,98,0,.35)!important;background:var(--ga-gold-soft)!important}
html[data-theme="light"] .v105-feature-grid article{background:var(--ga-surface)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .v105-feature-grid article>span{color:var(--ga-gold-ink)!important;background:var(--ga-gold-soft)!important;border-color:rgba(148,98,0,.25)!important}
html[data-theme="light"] .v105-feature-grid b{color:var(--ga-text)!important}
html[data-theme="light"] .v105-feature-grid small{color:var(--ga-muted)!important}
html[data-theme="light"] .v105-secondary-btn{color:var(--ga-text)!important;background:var(--ga-surface)!important;border-color:var(--ga-line-strong)!important}
html[data-theme="light"] .v105-secondary-btn:hover{border-color:var(--ga-gold)!important;color:var(--ga-gold-ink)!important}
html[data-theme="light"] .v105-safe-note{color:var(--ga-muted)!important}
/* The hero screenshot is a dark product shot — keep it dark, frame it like a device on a desk */
html[data-theme="light"] .v105-hero-visual{border-radius:16px;overflow:hidden;background:#0b1626!important;box-shadow:0 24px 50px rgba(14,26,43,.22)}
html[data-theme="light"] .v105-hero-visual::before{background:linear-gradient(0deg,rgba(4,12,21,.35),transparent 40%)!important}

html[data-theme="light"] .v94-stat-card{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .v94-stat-card small{color:var(--ga-muted)!important}
html[data-theme="light"] .v94-stat-card strong{color:var(--ga-text)!important}
html[data-theme="light"] .v94-stat-card p{color:var(--ga-muted)!important}
html[data-theme="light"] .v94-stat-card.gold p{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .v94-stat-card.green .v94-stat-icon{color:#0b8048!important;background:#e2f5ea!important}
html[data-theme="light"] .v94-stat-card.blue .v94-stat-icon{color:#3450c8!important;background:#e7ebfb!important}
html[data-theme="light"] .v94-stat-card.purple .v94-stat-icon{color:#8a3bb5!important;background:#f3e8fa!important}
html[data-theme="light"] .v94-stat-card.gold .v94-stat-icon{color:var(--ga-gold-ink)!important;background:#fbf0d6!important}
html[data-theme="light"] .v105-winner-photo{background:var(--ga-surface-3)!important}

html[data-theme="light"] .v94-ranking-card{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .v94-ranking-head{background:linear-gradient(90deg,#fff,#fbf6ea)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .v94-ranking-head h2{color:var(--ga-text)!important}
html[data-theme="light"] .v94-ranking-head p{color:var(--ga-muted)!important}
html[data-theme="light"] .v142-period-tabs{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .v142-period-tab{color:var(--ga-text-2)!important;background:transparent!important}
html[data-theme="light"] .v142-period-tab.is-active{color:#1b1300!important;background:var(--ga-gold)!important;box-shadow:none!important}
html[data-theme="light"] .v142-ranking-layout{background:transparent!important}
html[data-theme="light"] .v142-rank-panel{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;box-shadow:none!important}
html[data-theme="light"] .v142-panel-title{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .v142-panel-title strong{color:var(--ga-text)!important}
html[data-theme="light"] .v142-panel-title span{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .v142-table-head{background:var(--ga-surface-2)!important;color:var(--ga-muted)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .v142-next-grid,html[data-theme="light"] .v142-rank-column{border-color:var(--ga-line)!important}
html[data-theme="light"] .v142-rank-row{border-color:var(--ga-line)!important;background:transparent!important}
html[data-theme="light"] .v142-rank-row:hover{background:var(--ga-surface-2)!important}
html[data-theme="light"] .v142-owner b{color:var(--ga-text)!important}
html[data-theme="light"] .v142-owner small{color:var(--ga-muted)!important}
html[data-theme="light"] .v142-profit{color:var(--ga-green)!important}
html[data-theme="light"] .v142-profit.loss{color:var(--ga-red)!important}
html[data-theme="light"] .v94-rank-badge{background:var(--ga-surface-2)!important;color:var(--ga-text-2)!important;border-color:var(--ga-line-strong)!important}
html[data-theme="light"] .v94-rank-badge.rank-1{background:linear-gradient(145deg,#ffd75a,#d39a10)!important;color:#3d2a00!important;border-color:#e6b23a!important;box-shadow:none!important}
html[data-theme="light"] .v94-rank-badge.rank-2{background:linear-gradient(145deg,#f4f6f9,#b8c3d1)!important;color:#2f3d52!important}
html[data-theme="light"] .v94-rank-badge.rank-3{background:linear-gradient(145deg,#f3b07a,#c26a2e)!important;color:#3b1a05!important}
html[data-theme="light"] .v94-avatar{background:#e6edf6!important;border-color:var(--ga-line-strong)!important;color:var(--ga-blue)!important}
html[data-theme="light"] .v142-pagination{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .v142-pagination button{background:var(--ga-surface)!important;color:var(--ga-text)!important;border:1px solid var(--ga-line-strong)!important}
html[data-theme="light"] .v142-pagination button:disabled{opacity:.45}
html[data-theme="light"] .v142-page-status strong{color:var(--ga-text)!important}
html[data-theme="light"] .v142-page-status small,html[data-theme="light"] .v142-empty,html[data-theme="light"] .v142-loading{color:var(--ga-muted)!important}
html[data-theme="light"] .v94-features article{background:var(--ga-surface)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .v94-features b{color:var(--ga-text)!important}
html[data-theme="light"] .v94-features p{color:var(--ga-muted)!important}
html[data-theme="light"] .v94-footer{border-color:var(--ga-line)!important;color:var(--ga-muted)!important}
html[data-theme="light"] .v94-footer a{color:var(--ga-text-2)!important}

/* ---------- Ranking / downloads / videos / public cards ---------- */
html[data-theme="light"] .public-title-card,
html[data-theme="light"] .ranking-hero,
html[data-theme="light"] .download-card,
html[data-theme="light"] .video-card,
html[data-theme="light"] .empty-public-card{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;color:var(--ga-text)!important;box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .public-title-card p,
html[data-theme="light"] .download-card p,
html[data-theme="light"] .video-card p{color:var(--ga-muted)!important}
html[data-theme="light"] .download-version{color:var(--ga-green)!important;background:#e7f6ee!important;border-color:#b9e3cb!important}

/* ---------- Auth & form pages ---------- */
html[data-theme="light"] .auth-body{background:radial-gradient(1200px 600px at 80% -10%,#fbefd2 0%,transparent 60%),var(--ga-bg-grad)!important}
html[data-theme="light"] .auth-card{background:var(--ga-surface)!important;border:1px solid var(--ga-line)!important;box-shadow:0 24px 60px rgba(14,26,43,.12)!important;color:var(--ga-text)!important}
html[data-theme="light"] .auth-card h1{color:var(--ga-text)!important}
html[data-theme="light"] .auth-sub,html[data-theme="light"] .helper-row,html[data-theme="light"] .auth-form label{color:var(--ga-text-2)!important}
html[data-theme="light"] .helper-row a,html[data-theme="light"] .auth-home-link{color:var(--ga-blue)!important}

/* ---------- Monthly calendar ---------- */
html[data-theme="light"] .day-cell{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;color:var(--ga-text)!important}
html[data-theme="light"] .day-mini{color:var(--ga-muted)!important}
html[data-theme="light"] .chip{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important;color:var(--ga-text)!important}
html[data-theme="light"] .topbar{background:var(--ga-surface)!important;border-color:var(--ga-line)!important;box-shadow:var(--ga-shadow)!important}

/* ---------- Ranking page (public cards) ---------- */
html[data-theme="light"] .ranking-title-card{background:linear-gradient(110deg,#fff 40%,#fbf6ea 100%)!important;border-color:var(--ga-line)!important;box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .ranking-title-card h1{color:var(--ga-text)!important}
html[data-theme="light"] .ranking-title-card p{color:var(--ga-muted)!important}
html[data-theme="light"] .ranking-title-card .chip,
html[data-theme="light"] .ranking-title-card [class*="count"]{background:var(--ga-surface-2)!important;color:var(--ga-text)!important;border-color:var(--ga-line-strong)!important}
html[data-theme="light"] .ranking-card{background:var(--ga-surface)!important;box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .ranking-card::before{background:radial-gradient(circle at top right,rgba(232,165,22,.10),transparent 40%)!important}
html[data-theme="light"] .ranking-card h3,
html[data-theme="light"] .ranking-group-title{color:var(--ga-text)!important}
html[data-theme="light"] .ranking-inner-card{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important;box-shadow:none!important}
html[data-theme="light"] .rank-badge{background:var(--ga-surface-2)!important;color:var(--ga-text)!important;border-color:var(--ga-line-strong)!important}
html[data-theme="light"] .rank-gold{border-color:#e6b23a!important;box-shadow:0 0 0 1px rgba(230,178,58,.35),0 14px 34px rgba(198,140,10,.16)!important}
html[data-theme="light"] .rank-gold .rank-badge{color:#6e4800!important;background:#fbefcf!important;border-color:#e6b23a!important}
html[data-theme="light"] .rank-silver{border-color:#b8c3d1!important;box-shadow:0 0 0 1px rgba(150,165,185,.35),var(--ga-shadow)!important}
html[data-theme="light"] .rank-silver .rank-badge{color:#2f3d52!important;background:#eef2f7!important;border-color:#b8c3d1!important}
html[data-theme="light"] .rank-bronze{border-color:#d08b52!important;box-shadow:0 0 0 1px rgba(208,139,82,.35),var(--ga-shadow)!important}
html[data-theme="light"] .rank-bronze .rank-badge{color:#7a3b0c!important;background:#fbeadc!important;border-color:#d08b52!important}
html[data-theme="light"] .rank-profit-label,html[data-theme="light"] .rank-frame-label{color:var(--ga-muted)!important}
html[data-theme="light"] .owner-pill{background:#e7f6ee!important;color:var(--ga-green)!important;border-color:#b9e3cb!important}
html[data-theme="light"] .ranking-owner-avatar{background:var(--ga-surface-3)!important;border-color:var(--ga-line-strong)!important;color:var(--ga-gold-ink)!important;box-shadow:none!important}
html[data-theme="light"] .ranking-delete-btn{background:var(--ga-surface)!important;color:var(--ga-muted)!important;border:1px solid var(--ga-line)!important}
html[data-theme="light"] .ranking-delete-btn:hover{color:var(--ga-red)!important;border-color:#f3c2c9!important}
html[data-theme="light"] .video-frame{background:#0b1626!important;border-radius:12px}

/* EA settings panel is a replica of the on-chart MT5 panel: keep it as-is in both themes */
html[data-theme="light"] .new-ea-settings-card .new-ea-section{color:#fff!important}
html[data-theme="light"] .new-ea-settings-card{box-shadow:0 18px 40px rgba(14,26,43,.25)!important}
html[data-theme="light"] .hero-kicker{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .form-help{color:var(--ga-muted)!important}
html[data-theme="light"] .agreement-card,
html[data-theme="light"] .agreement-content{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important;color:var(--ga-text-2)!important}
html[data-theme="light"] .agreement-card h2,html[data-theme="light"] .agreement-card span{color:var(--ga-text)!important}
html[data-theme="light"] .agreement-kicker{color:var(--ga-gold-ink)!important}

/* ---------- Trading calendar (dashboard Show + ranking popup) ---------- */
html[data-theme="light"] .trade-calendar-wrap{background:var(--ga-surface)!important;border:1px solid var(--ga-line)!important;box-shadow:var(--ga-shadow)!important}
html[data-theme="light"] .weekday-head{color:var(--ga-muted)!important;background:transparent!important}
html[data-theme="light"] .cal-day,
html[data-theme="light"] .week-summary{background:var(--ga-surface-2)!important;border:1px solid var(--ga-line)!important;box-shadow:none!important;color:var(--ga-text)!important}
html[data-theme="light"] .cal-day.is-empty,html[data-theme="light"] .week-summary.empty{background:var(--ga-surface-2)!important}
html[data-theme="light"] .cal-day.positive,html[data-theme="light"] .week-summary.positive{background:#e6f6ed!important;border-color:#b6e2c8!important}
html[data-theme="light"] .cal-day.negative,html[data-theme="light"] .week-summary.negative{background:#fdecee!important;border-color:#f3c2c9!important}
html[data-theme="light"] .cal-day.clickable-day:hover{box-shadow:0 0 0 2px var(--ga-gold)!important}
html[data-theme="light"] .cal-day-num{color:var(--ga-text)!important}
html[data-theme="light"] .cal-meta,html[data-theme="light"] .week-summary-label,html[data-theme="light"] .week-summary-meta,html[data-theme="light"] .slash-text,html[data-theme="light"] .cal-empty{color:var(--ga-text-2)!important}
html[data-theme="light"] .cal-profit.muted{color:var(--ga-muted)!important}
html[data-theme="light"] .win-text,html[data-theme="light"] .winrate-value{color:var(--ga-green)!important}
html[data-theme="light"] .loss-text{color:var(--ga-red)!important}
html[data-theme="light"] .cal-day.positive .green,html[data-theme="light"] .week-summary.positive .green{color:#06683a!important}
html[data-theme="light"] .cal-day.negative .red,html[data-theme="light"] .week-summary.negative .red{color:#a8172b!important}
html[data-theme="light"] .daily-detail-card{background:var(--ga-surface)!important;color:var(--ga-text)!important}
html[data-theme="light"] .daily-summary-box{background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important;color:var(--ga-text)!important}
html[data-theme="light"] .daily-kicker{color:var(--ga-gold-ink)!important}
html[data-theme="light"] .daily-detail-table th{background:var(--ga-surface-3)!important;color:var(--ga-muted)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .daily-detail-table td{color:var(--ga-text)!important;border-color:var(--ga-line)!important;background:transparent!important}
html[data-theme="light"] .daily-detail-close{color:var(--ga-muted)!important;background:var(--ga-surface-2)!important;border-color:var(--ga-line)!important}
html[data-theme="light"] .month-nav .ghost-btn:not(.ga-icon-only):not(.ga-btn-icon),
html[data-theme="light"] .month-label{color:var(--ga-text)!important}

/* Toggle placed inside an existing page header */
.ga-theme-toggle-inline{width:40px;height:40px}

/* ---------- Mobile top bar (fixes nav row overlapping the page + 5th item cut off) ---------- */
@media (max-width:760px){
  .ga-topbar,
  body.ranking-page .ranking-wrap > .ga-topbar{
    height:auto!important;min-height:0!important;display:grid!important;grid-template-columns:1fr auto!important;
    row-gap:8px!important;padding:8px 12px 0!important;position:sticky!important;top:0!important;
  }
  .ga-topbar-left{min-width:0}
  .ga-topbar-right{gap:8px!important}
  .ga-topnav{
    grid-column:1/-1!important;order:3!important;width:auto!important;height:auto!important;margin:0 -12px!important;
    display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;overflow:visible!important;
    border-radius:0!important;border-left:0!important;border-right:0!important;border-bottom:0!important;padding:0!important;position:static!important;transform:none!important;
  }
  .ga-topnav-link{
    height:52px!important;min-width:0!important;padding:4px 2px!important;flex-direction:column!important;gap:3px!important;
    font-size:10.5px!important;line-height:1.1!important;border-radius:0!important;
  }
  .ga-topnav-link span:last-child{display:block!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .ga-topnav-link.active::after{left:22%!important;right:22%!important}
  .ga-news-button{display:none!important}
}

/* ======================= EA remote settings page ======================= */
.ea-remote-wrap{max-width:1100px;margin:0 auto}
.er-online{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid var(--ga-line-strong);background:var(--ga-surface-2);color:var(--ga-muted);font-weight:800;font-size:13px}
.er-online i{width:9px;height:9px;border-radius:50%;background:#7b8797}
.er-online.is-on{color:var(--ga-green)}
.er-online.is-on i{background:var(--ga-green);box-shadow:0 0 0 4px rgba(25,230,131,.15);animation:erPulse 1.6s infinite}
@keyframes erPulse{50%{box-shadow:0 0 0 7px rgba(25,230,131,0)}}
.er-layout{display:grid;grid-template-columns:minmax(260px,1fr) 360px;gap:16px;align-items:start;padding-bottom:90px}
.er-live{border:1px solid var(--ga-line);border-radius:16px;background:var(--ga-surface);padding:18px;position:sticky;top:90px}
.er-live h2{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:17px;color:var(--ga-text)}
.er-live h2 .ga-i{color:var(--ga-gold-ink)}
.er-status-text{color:var(--ga-text-2);font-weight:700;margin-bottom:14px}
.er-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.er-stats div{border:1px solid var(--ga-line);border-radius:12px;background:var(--ga-surface-2);padding:10px 12px}
.er-stats small{display:block;color:var(--ga-muted);font-size:12px;font-weight:700}
.er-stats b{display:block;margin-top:3px;font-size:18px;color:var(--ga-text);font-variant-numeric:tabular-nums}
.er-stats b[data-sign="pos"]{color:var(--ga-green)} .er-stats b[data-sign="neg"]{color:var(--ga-red)}
.er-stats .er-buy{color:var(--ga-green)} .er-stats .er-sell{color:var(--ga-red)}
.er-note{margin:14px 0 0;color:var(--ga-muted);font-size:12.5px;line-height:1.6}

/* Panel replica: same colours as the on-chart MT5 panel in both themes */
.er-panel{background:#000;border:1px solid #e3b23c;border-radius:6px;padding:10px 12px 14px;font-family:Tahoma,"Segoe UI",sans-serif;color:#fff;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.er-title{text-align:center;color:#2ee6e6;font-size:18px;letter-spacing:.5px;margin:2px 0 10px}
.er-row{display:grid;grid-template-columns:96px 1fr 72px;align-items:center;gap:8px;margin:5px 0}
.er-row label{font-size:14px;color:#e8e8e8}
.er-row label.c-buy{color:#33e34a} .er-row label.c-sell{color:#ff6a4d}
.er-row input{width:100%;height:28px;border:1px solid #888;background:#fff;color:#000;font:15px Tahoma,sans-serif;padding:0 6px;border-radius:0;box-sizing:border-box}
.er-row input:disabled{background:#c8c8c8;color:#555}
.er-row input.is-dirty{outline:2px solid #ffc400;outline-offset:1px}
html[data-theme="light"] .er-row input{background:#fff!important;color:#000!important;border-color:#888!important}
.er-row > :nth-child(2):last-child{grid-column:2/4}
.er-onoff{height:28px;border:0;font:15px Tahoma,sans-serif;cursor:pointer;background:#e0201f;color:#ff8a8a}
.er-onoff.on{background:#11751f;color:#fff}
.er-onoff.is-dirty,.er-bar.is-dirty{box-shadow:0 0 0 2px #ffc400}
.er-step{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.er-step button{height:28px;border:0;font:700 17px Tahoma,sans-serif;cursor:pointer;color:#111}
.s-gray button{background:#666;color:#ddd} .s-yellow button{background:#ffd400} .s-pink button{background:#ff2bff}
.s-orange button{background:#ffa31a} .s-coral button{background:#ff6347}
.er-step button:active,.er-onoff:active,.er-bar:active{transform:scale(.96)}
.er-bar{display:block;width:100%;height:30px;margin:8px 0;border:0;color:#fff;font:15px Tahoma,sans-serif;cursor:pointer;text-align:center}
.b-orange{background:#ff8c00} .b-gray{background:#6b6b6b} .b-green{background:#11751f} .b-red{background:#b52025}
.b-teal{background:#2f5d5d} .b-navy{background:#0a1890}
.er-close{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:12px}
.er-close button{height:40px;border:0;color:#fff;font:13px Tahoma,sans-serif;cursor:pointer}
.er-close .c1{background:#0f6b1b} .er-close .c2{background:#7d0b0b} .er-close .c3{background:#b52025}
.er-savebar{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:50;width:min(1060px,calc(100vw - 24px));
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;border-radius:16px;border:1px solid var(--ga-line-strong);
  background:color-mix(in srgb,var(--ga-surface) 94%,transparent);backdrop-filter:blur(10px);box-shadow:0 18px 40px rgba(0,0,0,.25)}
.er-dirty{font-weight:800;color:var(--ga-muted)}
.has-edits .er-dirty{color:var(--ga-gold-ink)}
.er-cmd{flex:1;font-weight:700;font-size:14px}
.er-cmd.wait{color:var(--ga-blue)} .er-cmd.ok{color:var(--ga-green)} .er-cmd.err{color:var(--ga-red)} .er-cmd.warn{color:var(--ga-amber)} .er-cmd.muted{color:var(--ga-muted)}
.er-cmd.ok::before{content:"✓ "}
.er-savebar .primary-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none!important}
@media (max-width:820px){
  .er-layout{grid-template-columns:1fr}
  .er-live{position:static}
  .er-panel{max-width:420px;width:100%;margin:0 auto;box-sizing:border-box}
  .er-savebar .er-cmd{flex-basis:100%;order:3}
}

/* ---- EA settings page: mobile pass ---- */
html[data-theme="light"] .er-row input:disabled{background:#c8c8c8!important;color:#555!important}
@media (max-width:820px){
  .ea-remote-wrap{padding-left:10px!important;padding-right:10px!important}
  .ea-remote-wrap .ga-page-head{padding:10px 12px;gap:8px}
  .ea-remote-wrap .ga-page-head h1{font-size:19px!important}
  .ea-remote-wrap .ga-page-head .subline{font-size:12.5px}
  .ea-remote-wrap .ga-page-head-actions{width:auto}
  /* live state: compact strip ABOVE the panel */
  .er-live{padding:12px}
  .er-live h2{font-size:15px;margin-bottom:2px}
  .er-status-text{font-size:13px;margin-bottom:8px}
  .er-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .er-stats div{padding:6px 7px;border-radius:9px}
  .er-stats small{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .er-stats b{font-size:14px}
  .er-note{display:none}
  /* bigger touch targets, 16px inputs (no iOS zoom) */
  .er-panel{padding:10px}
  .er-row{grid-template-columns:84px 1fr 84px;gap:6px;margin:6px 0}
  .er-row label{font-size:13.5px}
  .er-row input,.er-onoff,.er-step button{height:38px}
  .er-row input{font-size:16px}
  .er-bar{height:38px}
  .er-close button{height:46px}
  /* save bar: one compact row pinned to the bottom */
  .er-layout{padding-bottom:120px}
  .er-savebar{bottom:0;width:100vw;border-radius:16px 16px 0 0;border-bottom:0;padding:10px 12px calc(10px + env(safe-area-inset-bottom));gap:8px;flex-wrap:wrap}
  .er-savebar .er-dirty{flex:1;font-size:13px;min-width:0}
  .er-savebar #erReset{padding:9px 10px!important;font-size:13px}
  .er-savebar #erSave{padding:10px 14px!important;font-size:14px}
  .er-savebar .er-cmd{flex-basis:100%;order:-1;font-size:13px}
  .er-savebar .er-cmd:empty{display:none}
}
@media (max-width:360px){ .er-stats{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* V158: mobile user menu — old style.css centered it on the ☰ button (left:50%),
   so on phones half of it went off-screen. Anchor it to the right edge instead. */
@media (max-width:760px){
  .ga-topbar .user-menu .user-dropdown{
    left:auto!important;right:0!important;transform:none!important;
    top:calc(100% + 10px)!important;
    width:min(290px, calc(100vw - 24px))!important;max-width:calc(100vw - 24px)!important;
    max-height:calc(100dvh - 90px);overflow-y:auto;box-sizing:border-box;
  }
  .ga-topbar .user-menu .user-dropdown:before{left:auto!important;right:16px!important;transform:rotate(45deg)!important}
  .ga-topbar .user-dropdown-head{min-width:0}
  .ga-topbar .user-dropdown-head > div:last-child{min-width:0}
  .ga-topbar .user-dropdown-head b,
  .ga-topbar .user-dropdown-head small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ga-topbar .user-dropdown a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* V160: page switch without the white flash (Safari 18.2+, Chrome 126+); older browsers ignore it */
@view-transition { navigation: auto; }
::view-transition-old(root),::view-transition-new(root){ animation-duration: .16s; }
.ga-topbar{ view-transition-name: ga-topbar; }           /* top bar stays put while the page changes */
::view-transition-group(ga-topbar){ animation: none; }
html{ background: var(--ga-bg); }                         /* no white between pages in dark mode */
/* opened from the Home Screen: leave room for the iPhone status bar / notch */
@media (display-mode: standalone){
  .ga-topbar{ padding-top: calc(env(safe-area-inset-top) + 6px)!important; }
  body{ padding-bottom: env(safe-area-inset-bottom); }
}

/* V161: ranking page puts the top bar inside .ranking-wrap with its own padding rule,
   which beat the safe-area padding -> header hid under the iPhone status bar. */
@media (display-mode: standalone){
  body.ranking-page .ranking-wrap > .ga-topbar,
  body .page-wrap > .ga-topbar,
  .ga-topbar{ padding-top: calc(env(safe-area-inset-top) + 6px)!important; }
}
@media (display-mode: standalone) and (max-width:760px){
  body.ranking-page .ranking-wrap > .ga-topbar{ margin-top: 0!important; top: 0!important; }
}

/* V162: 6-box code input */
.otp{position:relative;width:100%;max-width:360px;margin:4px 0 6px;cursor:text}
.otp-input{position:absolute;inset:0;width:100%!important;height:100%!important;opacity:0!important;border:0!important;
  font-size:16px!important;color:transparent!important;background:transparent!important;caret-color:transparent;z-index:2;padding:0!important}
.otp-boxes{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.otp-boxes span{height:54px;display:grid;place-items:center;border-radius:12px;border:1.5px solid var(--ga-line-strong);
  background:var(--ga-surface-2);color:var(--ga-text);font:800 24px/1 ui-monospace,Consolas,monospace;transition:border-color .12s,box-shadow .12s}
.otp-boxes span.filled{border-color:var(--ga-gold)}
.otp-boxes span.active{border-color:var(--ga-gold);box-shadow:0 0 0 3px var(--ga-gold-soft)}
.otp-boxes span.active:empty::after{content:"";width:2px;height:24px;background:var(--ga-gold);animation:otpBlink 1s steps(1) infinite}
.otp.complete .otp-boxes span{border-color:var(--ga-green)}
@keyframes otpBlink{50%{opacity:0}}
@media (max-width:420px){.otp-boxes{gap:6px}.otp-boxes span{height:48px;font-size:21px}}
.auth-forgot-link{display:block;text-align:right;margin:-4px 0 10px;font-size:13.5px;color:var(--ga-blue)!important;text-decoration:none;font-weight:700}
.auth-forgot-link:hover{text-decoration:underline}

/* V169: faster taps on mobile (no double-tap-zoom wait, no grey flash) */
a,button,[role=button],input,select,label,summary{touch-action:manipulation}
a,button{-webkit-tap-highlight-color:transparent}
