/* =========================================================
   OFEDA ANDROID WEB CLIENT V4
   Android-only shell. Desktop/web is untouched.
   ========================================================= */
html[data-client="android"]{
  --android-nav-height:66px;
  --android-safe-bottom:env(safe-area-inset-bottom,0px);
  --android-safe-top:env(safe-area-inset-top,0px);
  scroll-padding-bottom:calc(var(--android-nav-height) + var(--android-safe-bottom) + 18px);
}
html[data-client="android"],
body[data-client="android"]{
  min-height:100%;
  overscroll-behavior-y:none;
  -webkit-tap-highlight-color:transparent;
}
body[data-client="android"].android-app-shell{
  min-width:0!important;
  width:100%!important;
  overflow-x:hidden!important;
  padding-bottom:calc(var(--android-nav-height) + var(--android-safe-bottom))!important;
}
body[data-client="android"].android-sheet-open{overflow:hidden!important}

/* Android login has its own native-app shell in V4. */

/* ---------- Shell ---------- */
body[data-client="android"] #appRoot,
body[data-client="android"] .layout,
body[data-client="android"] #appRoot .layout{
  min-width:0!important;
  width:100%!important;
}
body[data-client="android"] .layout,
body[data-client="android"] #appRoot .layout{display:block!important}
body[data-client="android"] .sidebar{display:none!important}
body[data-client="android"] .content{
  width:100%!important;
  max-width:760px!important;
  min-width:0!important;
  margin:0 auto!important;
  padding:0 12px 24px!important;
}

/* ---------- Dedicated Android account header ---------- */
.android-app-header{display:none}
body[data-client="android"] .android-app-header{
  position:sticky!important;
  z-index:55!important;
  top:0!important;
  min-height:calc(58px + var(--android-safe-top))!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 42px!important;
  align-items:end!important;
  gap:8px!important;
  margin:0 -12px 12px!important;
  padding:calc(8px + var(--android-safe-top)) 12px 8px!important;
  border-bottom:1px solid var(--theme-border)!important;
  background:color-mix(in srgb,var(--bg) 95%,transparent)!important;
  backdrop-filter:blur(18px) saturate(1.18)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.18)!important;
}
body[data-client="android"] .android-account-switcher{
  min-width:0!important;
  min-height:42px!important;
  display:grid!important;
  grid-template-columns:36px minmax(0,1fr) 17px!important;
  align-items:center!important;
  gap:9px!important;
  padding:3px 6px 3px 3px!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  color:var(--text)!important;
  box-shadow:none!important;
  text-align:left!important;
}
body[data-client="android"] .android-account-switcher:active{background:var(--theme-soft)!important}
.android-account-avatar{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid var(--theme-border);
  border-radius:50%;
  background:var(--primary);
  color:var(--on-primary,#fff);
  font-size:11px;
  font-weight:900;
}
.android-account-avatar img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%}
.android-account-copy{min-width:0;display:grid;gap:1px}
.android-account-copy small{color:var(--muted)!important;font-size:8px!important;font-weight:750!important}
.android-account-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)!important;font-size:13px!important;line-height:1.15!important}
.android-account-chevron{width:17px;height:17px;color:var(--muted)}
.android-account-chevron svg,.android-header-icon svg,.android-nav-icon svg,.android-more-item-icon svg,.android-more-chevron svg,.android-sheet-close svg{
  width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round
}
.android-header-icon{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  display:grid!important;
  place-items:center!important;
  padding:10px!important;
  border:1px solid var(--theme-border)!important;
  border-radius:12px!important;
  background:var(--panel)!important;
  color:var(--text)!important;
  box-shadow:none!important;
}

/* ---------- Original topbar becomes compact page header ---------- */
body[data-client="android"] .topbar{
  position:relative!important;
  top:auto!important;
  z-index:1!important;
  display:block!important;
  margin:0 0 12px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
body[data-client="android"] .topbar #menuBtn,
body[data-client="android"] .topbar .desktop-panel-toggle{display:none!important}
body[data-client="android"] .topbar>div:first-of-type{min-width:0!important;margin-bottom:9px!important}
body[data-client="android"] .topbar .eyebrow{margin:0 0 2px!important;font-size:8px!important;line-height:1.1!important}
body[data-client="android"] .topbar h1{
  max-width:100%!important;
  margin:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:24px!important;
  line-height:1.08!important;
}
body[data-client="android"] .top-actions{
  width:100%!important;
  display:block!important;
  margin:0!important;
}
body[data-client="android"] .top-actions>*{max-width:100%!important}
body[data-client="android"] .global-month-picker{
  width:100%!important;
  min-width:0!important;
  min-height:44px!important;
  padding:6px 9px!important;
  border-radius:12px!important;
}
body[data-client="android"] .global-month-icon{width:31px!important;height:31px!important}
body[data-client="android"] .today-clock{display:none!important}
/* Old V1 profile pill must never reappear. */
body[data-client="android"] #androidProfilePill{display:none!important}

/* ---------- Content rhythm ---------- */
body[data-client="android"] .stack{gap:11px!important}
body[data-client="android"] .card,
body[data-client="android"] .summary-card,
body[data-client="android"] .client-card,
body[data-client="android"] .settings-tile,
body[data-client="android"] .asset-source-card,
body[data-client="android"] .investment-card,
body[data-client="android"] .budget-card,
body[data-client="android"] .shopping-history-card{
  min-width:0!important;
  max-width:100%!important;
  border-radius:15px!important;
  box-shadow:0 4px 14px rgba(15,23,42,.05)!important;
}
body[data-client="android"] .card{padding:13px!important}
body[data-client="android"] .card-header{gap:8px!important;margin-bottom:11px!important}
body[data-client="android"] .card-header>div:first-child{min-width:0!important;flex:1 1 100%!important}
body[data-client="android"] .card-header h2{font-size:17px!important;line-height:1.15!important}
body[data-client="android"] .card-header h3{font-size:15px!important}
body[data-client="android"] .card-header p{font-size:10px!important;line-height:1.42!important}
body[data-client="android"] .card-header .actions{
  width:100%!important;
  margin:0!important;
  display:flex!important;
  justify-content:flex-start!important;
  gap:7px!important;
  flex-wrap:wrap!important;
}
body[data-client="android"] .card-header .actions button{flex:0 1 auto!important}

body[data-client="android"] .summary-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
}
body[data-client="android"] .summary-card{min-height:96px!important;padding:12px!important}
body[data-client="android"] .summary-card span{font-size:8px!important;line-height:1.25!important}
body[data-client="android"] .summary-card strong{font-size:clamp(16px,5vw,21px)!important;line-height:1.1!important;overflow-wrap:anywhere!important}
body[data-client="android"] .summary-card small{font-size:8px!important;line-height:1.3!important}

body[data-client="android"] .dashboard-top-summary-three,
body[data-client="android"] .dashboard-grid,
body[data-client="android"] .dashboard-grid.equal,
body[data-client="android"] .calendar-dashboard-grid,
body[data-client="android"] .settings-grid,
body[data-client="android"] .asset-source-grid,
body[data-client="android"] .investment-grid,
body[data-client="android"] .budget-usage-grid,
body[data-client="android"] .client-grid,
body[data-client="android"] .memo-kanban{
  grid-template-columns:1fr!important;
  gap:9px!important;
}
body[data-client="android"] .settings-tile-grid{grid-template-columns:1fr!important;gap:8px!important}
body[data-client="android"] .dashboard-stack-card,
body[data-client="android"] .dashboard-top-summary-three .dashboard-top-metric-card{min-height:0!important;border-radius:15px!important}
body[data-client="android"] .dashboard-stack-section{min-height:68px!important;padding:10px 12px!important}
body[data-client="android"] .dashboard-stack-section strong{max-width:100%!important;font-size:19px!important}

/* Charts and SVG never overflow phone width. */
body[data-client="android"] canvas,
body[data-client="android"] svg,
body[data-client="android"] .chart-container,
body[data-client="android"] .annual-chart-card{max-width:100%!important}
body[data-client="android"] canvas{height:auto!important}

/* ---------- Forms ---------- */
body[data-client="android"] button,
body[data-client="android"] .primary-btn,
body[data-client="android"] .secondary-btn,
body[data-client="android"] .danger-btn{min-height:43px!important;touch-action:manipulation}
body[data-client="android"] input,
body[data-client="android"] select,
body[data-client="android"] textarea{min-height:45px!important;font-size:16px!important}
body[data-client="android"] textarea{min-height:92px!important}
body[data-client="android"] .form-grid,
body[data-client="android"] .filters{grid-template-columns:1fr!important;gap:9px!important}
body[data-client="android"] .span-2{grid-column:auto!important}
body[data-client="android"] .row-actions{gap:6px!important;flex-wrap:wrap!important}
body[data-client="android"] .row-actions button{min-height:36px!important}

/* ---------- Calendar ---------- */
body[data-client="android"] .calendar-card{overflow:hidden!important}
body[data-client="android"] .calendar-toolbar{display:grid!important;grid-template-columns:1fr!important;gap:9px!important}
body[data-client="android"] .calendar-navigation{width:100%!important;display:grid!important;grid-template-columns:42px 1fr 42px!important;gap:6px!important}
body[data-client="android"] .calendar-navigation button{min-width:0!important;width:100%!important}
body[data-client="android"] .calendar-scroll{width:100%!important;overflow:hidden!important;border-radius:11px!important}
body[data-client="android"] .calendar-weekdays,
body[data-client="android"] .calendar-grid{grid-template-columns:repeat(7,minmax(0,1fr))!important}
body[data-client="android"] .calendar-weekdays>div{padding:6px 1px!important;font-size:7.5px!important;text-align:center!important}
body[data-client="android"] .calendar-day{position:relative!important;min-width:0!important;min-height:52px!important;padding:4px!important;overflow:hidden!important}
body[data-client="android"] .calendar-day-header{align-items:flex-start!important;gap:1px!important}
body[data-client="android"] .calendar-date-number{width:22px!important;height:22px!important;font-size:9.5px!important}
body[data-client="android"] .calendar-add-hint,
body[data-client="android"] .calendar-events{display:none!important}
.android-calendar-dots{display:none}
body[data-client="android"] .android-calendar-dots{display:flex!important;flex-wrap:wrap!important;justify-content:flex-end!important;gap:2px!important;max-width:16px!important;padding-top:3px!important}
body[data-client="android"] .android-calendar-dots i{width:4px!important;height:4px!important;border-radius:50%!important;background:#d97706!important}
body[data-client="android"] .android-calendar-dots i.pribadi{background:#0284c7!important}
body[data-client="android"] .android-calendar-dots i.akademik{background:#7c3aed!important}
body[data-client="android"] .android-calendar-dots i.pekerjaan{background:#059669!important}
body[data-client="android"] .android-calendar-dots i.lainnya{background:#d97706!important}
body[data-client="android"] .calendar-legend{gap:6px 9px!important;padding-top:8px!important;font-size:7.5px!important;flex-wrap:wrap!important}

/* ---------- Tables: predictable horizontal scroll, no forced card conversion ---------- */
body[data-client="android"] .table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  border:1px solid var(--theme-border)!important;
  border-radius:12px!important;
  background:var(--panel)!important;
}
body[data-client="android"] .table-wrap table{
  width:max-content!important;
  min-width:100%!important;
  max-width:none!important;
  display:table!important;
  table-layout:auto!important;
}
body[data-client="android"] .table-wrap thead{display:table-header-group!important;position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important;white-space:normal!important}
body[data-client="android"] .table-wrap tbody{display:table-row-group!important}
body[data-client="android"] .table-wrap tr{display:table-row!important;background:transparent!important;box-shadow:none!important}
body[data-client="android"] .table-wrap th,
body[data-client="android"] .table-wrap td{
  display:table-cell!important;
  min-width:100px!important;
  max-width:220px!important;
  padding:9px 10px!important;
  white-space:normal!important;
  vertical-align:top!important;
  text-align:left!important;
}
body[data-client="android"] .table-wrap th{font-size:8px!important;white-space:nowrap!important}
body[data-client="android"] .table-wrap td{font-size:10.5px!important}
body[data-client="android"] .table-wrap td::before{content:none!important;display:none!important}
body[data-client="android"] .table-wrap .row-actions{min-width:132px!important;justify-content:flex-start!important}

/* ---------- Modal as stable bottom sheet ---------- */
body[data-client="android"] .modal-backdrop{align-items:flex-end!important;padding:0!important;background:rgba(8,14,22,.58)!important;backdrop-filter:blur(4px)!important}
body[data-client="android"] .modal,
body[data-client="android"] .modal.wide{
  width:100%!important;
  max-width:760px!important;
  max-height:min(94dvh,920px)!important;
  margin:0 auto!important;
  border-width:1px 0 0!important;
  border-radius:22px 22px 0 0!important;
  box-shadow:0 -18px 60px rgba(8,14,22,.24)!important;
}
body[data-client="android"] .modal-header{padding:14px 14px 11px!important}
body[data-client="android"] .modal-body{padding:13px 13px calc(15px + var(--android-safe-bottom))!important;overflow:auto!important}
body[data-client="android"] .modal-footer{
  margin:13px -13px calc(-15px - var(--android-safe-bottom))!important;
  padding:10px 13px calc(10px + var(--android-safe-bottom))!important;
  display:flex!important;
  justify-content:flex-end!important;
  gap:7px!important;
  flex-wrap:wrap!important;
}
body[data-client="android"] .modal-footer button{flex:1 1 130px!important}

/* ---------- Bottom navigation ---------- */
.android-bottom-nav{display:none}
body[data-client="android"] .android-bottom-nav{
  position:fixed!important;
  z-index:700!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:calc(var(--android-nav-height) + var(--android-safe-bottom))!important;
  padding:5px 7px calc(5px + var(--android-safe-bottom))!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:2px!important;
  border-top:1px solid var(--theme-border)!important;
  background:color-mix(in srgb,var(--panel) 96%,transparent)!important;
  backdrop-filter:blur(20px) saturate(1.2)!important;
  -webkit-backdrop-filter:blur(20px) saturate(1.2)!important;
  box-shadow:0 -6px 24px rgba(15,23,42,.09)!important;
}
body[data-client="android"] .android-bottom-nav button{
  position:relative!important;
  min-width:0!important;
  min-height:54px!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  gap:2px!important;
  padding:3px 2px!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  color:var(--muted)!important;
  box-shadow:none!important;
}
body[data-client="android"] .android-bottom-nav button.active{background:var(--theme-soft)!important;color:var(--soft-text,var(--text))!important}
body[data-client="android"] .android-bottom-nav button.active::before{content:"";position:absolute;top:2px;width:20px;height:3px;border-radius:999px;background:var(--primary)}
body[data-client="android"] .android-bottom-nav button>span:last-child{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px!important;font-weight:850!important}
.android-nav-icon{width:21px;height:21px}
.android-nav-icon svg circle{fill:currentColor;stroke:none}

/* ---------- Shared Android sheets ---------- */
.android-sheet-root[hidden]{display:none!important}
.android-sheet-root{position:fixed;z-index:820;inset:0;pointer-events:none}
.android-sheet-root.open{pointer-events:auto}
.android-sheet-backdrop{position:absolute;inset:0;background:rgba(8,14,22,.56);opacity:0;transition:opacity 180ms ease}
.android-sheet-root.open .android-sheet-backdrop{opacity:1}
.android-sheet{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  max-height:min(84dvh,720px);
  overflow:auto;
  padding:8px 14px calc(15px + var(--android-safe-bottom));
  border:1px solid var(--theme-border);
  border-width:1px 0 0;
  border-radius:24px 24px 0 0;
  background:var(--panel);
  color:var(--text);
  box-shadow:0 -24px 80px rgba(8,14,22,.24);
  transform:translateY(102%);
  transition:transform 210ms cubic-bezier(.2,.75,.25,1)
}
.android-sheet-root.open .android-sheet{transform:translateY(0)}
.android-sheet-handle{width:38px;height:4px;margin:2px auto 12px;border-radius:999px;background:color-mix(in srgb,var(--muted) 38%,transparent)}
.android-sheet-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:0 2px 10px}
.android-sheet-kicker{color:var(--primary);font-size:8px;font-weight:900;letter-spacing:.15em}
.android-sheet-header h2{margin:2px 0 0;color:var(--text);font-size:21px}
.android-sheet-header p{margin:3px 0 0;color:var(--muted);font-size:9px}
.android-sheet-close{width:40px;height:40px;min-height:40px!important;display:grid;place-items:center;padding:10px;border:1px solid var(--theme-border);border-radius:50%;background:var(--theme-soft);color:var(--soft-text,var(--text))}

/* Profile/account sheet */
.android-account-list{display:grid;gap:7px;padding:2px 0 8px}
.android-account-option{
  width:100%;
  min-height:62px!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 24px!important;
  align-items:center!important;
  gap:10px!important;
  padding:8px!important;
  border:1px solid var(--theme-border)!important;
  border-radius:14px!important;
  background:var(--panel)!important;
  color:var(--text)!important;
  box-shadow:none!important;
  text-align:left!important;
}
.android-account-option.active{background:var(--theme-soft)!important;border-color:color-mix(in srgb,var(--primary) 42%,var(--theme-border))!important}
.android-account-option-avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--primary);color:var(--on-primary,#fff);font-size:11px;font-weight:900}
.android-account-option-copy{min-width:0;display:grid;gap:2px}
.android-account-option-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:13px}
.android-account-option-copy small{color:var(--muted);font-size:8.5px}
.android-account-check{color:var(--primary);font-size:17px;font-weight:900;text-align:center}
.android-account-actions{padding-top:7px;border-top:1px solid var(--theme-border)}
.android-account-empty{padding:22px;text-align:center;color:var(--muted);font-size:11px}

/* More sheet */
.android-more-list,.android-more-mode{display:grid;gap:3px}
.android-more-list button,.android-more-mode button,.android-sheet-action{
  width:100%;
  min-height:55px!important;
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr) 18px!important;
  align-items:center!important;
  gap:10px!important;
  padding:8px 7px!important;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--theme-border) 65%,transparent)!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--text)!important;
  box-shadow:none!important;
  text-align:left!important;
}
.android-more-list button span:nth-child(2),.android-more-mode button span:nth-child(2),.android-sheet-action span:nth-child(2){min-width:0;display:grid;gap:2px}
.android-more-list strong,.android-more-mode strong,.android-sheet-action strong{color:var(--text);font-size:12.5px}
.android-more-list small,.android-more-mode small,.android-sheet-action small{color:var(--muted);font-size:8.5px}
.android-more-dot{width:8px;height:8px;margin-left:3px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 4px rgba(var(--theme-rgb),.12)}
.android-more-item-icon,.android-more-chevron{width:18px;height:18px;color:var(--muted)}
.android-more-mode{margin-top:7px;padding-top:6px;border-top:1px solid var(--theme-border)}

/* ---------- Theme compatibility ---------- */
body[data-client="android"][data-ofeda-theme="brutalism"] .android-app-header,
body[data-client="android"][data-ofeda-theme="brutalism"] .android-bottom-nav,
body[data-client="android"][data-ofeda-theme="brutalism"] .android-sheet{border-color:#171126!important}
body[data-client="android"][data-ofeda-theme="brutalism"] .android-account-option,
body[data-client="android"][data-ofeda-theme="brutalism"] .android-header-icon,
body[data-client="android"][data-ofeda-theme="brutalism"] .android-bottom-nav button{border-radius:3px!important}
body[data-client="android"][data-ofeda-theme="minimal"] .android-bottom-nav{box-shadow:none!important}
body[data-client="android"][data-ofeda-theme="dark"] .android-app-header,
body[data-client="android"][data-ofeda-theme="dark"] .android-bottom-nav{background:color-mix(in srgb,var(--panel) 96%,transparent)!important}
body[data-client="android"][data-ofeda-theme="retro"] .android-sheet{border-color:#322e27!important}

@media(max-width:365px){
  body[data-client="android"] .content{padding-inline:9px!important}
  body[data-client="android"] .android-app-header{margin-inline:-9px!important;padding-inline:9px!important}
  body[data-client="android"] .summary-card strong{font-size:16px!important}
}
@media(min-width:430px){
  body[data-client="android"] .settings-tile-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(min-width:760px){
  body[data-client="android"] .android-sheet{left:50%;right:auto;width:min(760px,100%);transform:translate(-50%,102%)}
  .android-sheet-root.open .android-sheet{transform:translate(-50%,0)}
}
@media(prefers-reduced-motion:reduce){
  .android-sheet-backdrop,.android-sheet{transition:none!important}
}


/* =========================================================
   OFEDA ANDROID CLIENT V3 — CENTER HOME CIRCLE
   Masuk | Keluar | BERANDA | Aset | Lainnya
   ========================================================= */
body[data-client="android"]{
  --android-nav-height:72px;
  --android-home-size:62px;
}

body[data-client="android"] .android-bottom-nav{
  height:calc(var(--android-nav-height) + var(--android-safe-bottom))!important;
  padding:7px 8px calc(7px + var(--android-safe-bottom))!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:end!important;
  gap:2px!important;
  overflow:visible!important;
  border-top:1px solid color-mix(in srgb,var(--theme-border) 82%,transparent)!important;
  background:color-mix(in srgb,var(--panel) 97%,transparent)!important;
  box-shadow:0 -8px 28px rgba(15,23,42,.10)!important;
}

body[data-client="android"] .android-bottom-nav button{
  min-height:54px!important;
  height:54px!important;
  align-self:end!important;
  padding:4px 2px 2px!important;
  border-radius:12px!important;
  background:transparent!important;
  color:var(--muted)!important;
}

body[data-client="android"] .android-bottom-nav button:not(.android-home-fab).active{
  background:var(--theme-soft)!important;
  color:var(--soft-text,var(--text))!important;
}

body[data-client="android"] .android-bottom-nav button:not(.android-home-fab).active::before{
  content:""!important;
  position:absolute!important;
  top:2px!important;
  width:18px!important;
  height:3px!important;
  border-radius:999px!important;
  background:var(--primary)!important;
}

/* Central Beranda is intentionally dominant. */
body[data-client="android"] .android-bottom-nav .android-home-fab{
  position:relative!important;
  z-index:3!important;
  min-height:68px!important;
  height:68px!important;
  margin-top:-24px!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:2px!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--text)!important;
  box-shadow:none!important;
  transform:none!important;
}

body[data-client="android"] .android-bottom-nav .android-home-fab::before{
  content:none!important;
  display:none!important;
}

body[data-client="android"] .android-home-circle{
  width:var(--android-home-size)!important;
  height:var(--android-home-size)!important;
  flex:0 0 var(--android-home-size)!important;
  display:grid!important;
  place-items:center!important;
  border:5px solid var(--panel)!important;
  border-radius:50%!important;
  background:var(--primary)!important;
  color:var(--on-primary)!important;
  box-shadow:
    0 8px 22px rgba(var(--theme-rgb),.28),
    0 2px 8px rgba(15,23,42,.15)!important;
  transition:transform 150ms ease,box-shadow 150ms ease,background 150ms ease!important;
}

body[data-client="android"] .android-home-circle .android-nav-icon{
  width:26px!important;
  height:26px!important;
  color:inherit!important;
}

body[data-client="android"] .android-home-circle .android-nav-icon svg{
  width:26px!important;
  height:26px!important;
  stroke:currentColor!important;
}

body[data-client="android"] .android-home-fab.active .android-home-circle{
  background:var(--primary)!important;
  color:var(--on-primary)!important;
  transform:translateY(-2px) scale(1.045)!important;
  box-shadow:
    0 10px 26px rgba(var(--theme-rgb),.34),
    0 3px 10px rgba(15,23,42,.17)!important;
}

body[data-client="android"] .android-home-fab:active .android-home-circle{
  transform:scale(.96)!important;
}

body[data-client="android"] .android-home-label{
  margin-top:1px!important;
  max-width:72px!important;
  color:var(--text)!important;
  font-size:8.5px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
}

/* Make the four secondary items clearly subordinate to Home. */
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab) .android-nav-icon{
  width:21px!important;
  height:21px!important;
}
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab) .android-nav-icon svg{
  width:21px!important;
  height:21px!important;
}
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab)>span:last-child{
  font-size:7.8px!important;
  font-weight:800!important;
}

/* More sheet no longer contains a switch-back-to-web action. */
body[data-client="android"] .android-more-mode{
  grid-template-columns:1fr!important;
}

@media(max-width:380px){
  body[data-client="android"]{
    --android-home-size:58px;
  }
  body[data-client="android"] .android-bottom-nav{
    padding-inline:4px!important;
  }
  body[data-client="android"] .android-bottom-nav button:not(.android-home-fab)>span:last-child{
    font-size:7.2px!important;
  }
}


/* =========================================================
   OFEDA ANDROID CLIENT V4 — NATIVE LOGIN + ICON-ONLY NAV
   ========================================================= */

/* ---------- Android-only login: app lock screen ---------- */
html[data-client="android"] body.auth-body,
body[data-client="android"].auth-body{
  min-height:100dvh!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  overflow-x:hidden!important;
  background:#f3f5f2!important;
  background-image:none!important;
  color:#17242a!important;
  font-family:"Segoe UI Variable Text","Segoe UI",system-ui,sans-serif!important;
}

html[data-client="android"] body.auth-body::before,
html[data-client="android"] body.auth-body::after,
body[data-client="android"].auth-body::before,
body[data-client="android"].auth-body::after{
  content:none!important;
  display:none!important;
}

html[data-client="android"] .auth-shell,
body[data-client="android"] .auth-shell{
  width:100%!important;
  max-width:520px!important;
  min-height:100dvh!important;
  margin:0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background:#f3f5f2!important;
  box-shadow:none!important;
}

html[data-client="android"] .brutal-brand-panel,
html[data-client="android"] .auth-brand-panel,
body[data-client="android"] .brutal-brand-panel,
body[data-client="android"] .auth-brand-panel{
  position:relative!important;
  flex:0 0 auto!important;
  min-height:clamp(265px,38dvh,350px)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:calc(30px + env(safe-area-inset-top,0px)) 24px 58px!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background:#0f2d3e!important;
  color:#f8fbfa!important;
  text-align:center!important;
}

html[data-client="android"] .brutal-brand-panel::before,
body[data-client="android"] .brutal-brand-panel::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  width:240px!important;
  height:240px!important;
  right:-112px!important;
  top:-82px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.025)!important;
  transform:none!important;
}
html[data-client="android"] .brutal-brand-panel::after,
body[data-client="android"] .brutal-brand-panel::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  width:150px!important;
  height:150px!important;
  left:-74px!important;
  bottom:30px!important;
  top:auto!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:50%!important;
  background:rgba(46,125,91,.17)!important;
  transform:none!important;
}

html[data-client="android"] .brand-mark.ofeda-login-logo,
body[data-client="android"] .brand-mark.ofeda-login-logo,
html[data-client="android"] .auth-brand-panel .brand-mark,
body[data-client="android"] .auth-brand-panel .brand-mark{
  position:relative!important;
  z-index:2!important;
  width:86px!important;
  height:86px!important;
  display:grid!important;
  place-items:center!important;
  margin:0 0 17px!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:24px!important;
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  box-shadow:0 14px 35px rgba(0,0,0,.22)!important;
  backdrop-filter:blur(10px)!important;
  transform:none!important;
}
html[data-client="android"] .brand-mark.ofeda-login-logo img,
body[data-client="android"] .brand-mark.ofeda-login-logo img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:contain!important;
}

html[data-client="android"] .brutal-brand-panel>.eyebrow,
html[data-client="android"] .auth-brand-panel>.eyebrow,
html[data-client="android"] .brutal-brand-panel>.local-badge,
html[data-client="android"] .auth-brand-panel>.local-badge,
body[data-client="android"] .brutal-brand-panel>.eyebrow,
body[data-client="android"] .auth-brand-panel>.eyebrow,
body[data-client="android"] .brutal-brand-panel>.local-badge,
body[data-client="android"] .auth-brand-panel>.local-badge,
html[data-client="android"] .brutal-sticker,
body[data-client="android"] .brutal-sticker{
  display:none!important;
}

html[data-client="android"] .brutal-brand-panel h1,
html[data-client="android"] .auth-brand-panel h1,
body[data-client="android"] .brutal-brand-panel h1,
body[data-client="android"] .auth-brand-panel h1{
  position:relative!important;
  z-index:2!important;
  max-width:100%!important;
  margin:0!important;
  color:#fff!important;
  font-family:"Segoe UI Variable Display","Segoe UI",system-ui,sans-serif!important;
  font-size:26px!important;
  font-weight:800!important;
  line-height:1.05!important;
  letter-spacing:.025em!important;
  text-transform:none!important;
}
.android-login-app-label{
  position:relative;
  z-index:2;
  display:grid;
  gap:4px;
  margin-top:8px;
  color:#fff;
}
.android-login-app-label span{
  color:#dce8e4!important;
  font-size:12px!important;
  font-weight:680!important;
  letter-spacing:.02em!important;
}
.android-login-app-label small{
  color:#8eb8a8!important;
  font-size:9px!important;
  font-weight:800!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
}

html[data-client="android"] .brutal-auth-card,
html[data-client="android"] .auth-card,
body[data-client="android"] .brutal-auth-card,
body[data-client="android"] .auth-card{
  position:relative!important;
  z-index:4!important;
  flex:1 0 auto!important;
  width:100%!important;
  margin:-28px 0 0!important;
  padding:31px 22px calc(26px + env(safe-area-inset-bottom,0px))!important;
  border:0!important;
  border-radius:30px 30px 0 0!important;
  background:#f9faf7!important;
  color:#17242a!important;
  box-shadow:0 -10px 32px rgba(7,26,35,.12)!important;
}

html[data-client="android"] .brutal-card-label,
body[data-client="android"] .brutal-card-label{
  display:none!important;
}

html[data-client="android"] .brutal-auth-card form,
html[data-client="android"] .auth-card form,
body[data-client="android"] .brutal-auth-card form,
body[data-client="android"] .auth-card form{
  width:100%!important;
  max-width:430px!important;
  margin:0 auto!important;
  display:grid!important;
  gap:15px!important;
}

html[data-client="android"] .brutal-auth-card .eyebrow,
html[data-client="android"] .auth-card .eyebrow,
body[data-client="android"] .brutal-auth-card .eyebrow,
body[data-client="android"] .auth-card .eyebrow{
  width:max-content!important;
  margin:0 0 -5px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#2e7d5b!important;
  box-shadow:none!important;
  font-size:10px!important;
  font-weight:900!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}

html[data-client="android"] .brutal-auth-card h2,
html[data-client="android"] .auth-card h2,
body[data-client="android"] .brutal-auth-card h2,
body[data-client="android"] .auth-card h2{
  margin:0 0 3px!important;
  color:#17242a!important;
  font-family:"Segoe UI Variable Display","Segoe UI",system-ui,sans-serif!important;
  font-size:26px!important;
  font-weight:780!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
  text-transform:none!important;
}

html[data-client="android"] .brutal-auth-card p.muted,
html[data-client="android"] .auth-card p.muted,
body[data-client="android"] .brutal-auth-card p.muted,
body[data-client="android"] .auth-card p.muted{
  margin:-5px 0 2px!important;
  color:#6c7b79!important;
  font-size:12px!important;
  line-height:1.45!important;
}

html[data-client="android"] .brutal-auth-card label,
html[data-client="android"] .auth-card label,
body[data-client="android"] .brutal-auth-card label,
body[data-client="android"] .auth-card label{
  position:relative!important;
  display:grid!important;
  gap:7px!important;
  color:#354643!important;
  font-size:11px!important;
  font-weight:750!important;
  letter-spacing:0!important;
  text-transform:none!important;
}

html[data-client="android"] .brutal-auth-card input,
html[data-client="android"] .auth-card input,
body[data-client="android"] .brutal-auth-card input,
body[data-client="android"] .auth-card input{
  width:100%!important;
  min-height:52px!important;
  padding:12px 48px 12px 14px!important;
  border:1px solid #d6dedb!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#17242a!important;
  box-shadow:none!important;
  font-size:16px!important;
  outline:none!important;
  transform:none!important;
}
html[data-client="android"] .brutal-auth-card input:focus,
html[data-client="android"] .auth-card input:focus,
body[data-client="android"] .brutal-auth-card input:focus,
body[data-client="android"] .auth-card input:focus{
  border-color:#2e7d5b!important;
  box-shadow:0 0 0 3px rgba(46,125,91,.13)!important;
  transform:none!important;
}

.android-password-field{position:relative!important}
.android-password-toggle{
  position:absolute!important;
  z-index:4!important;
  right:8px!important;
  bottom:7px!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  display:grid!important;
  place-items:center!important;
  padding:9px!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#667773!important;
  box-shadow:none!important;
}
.android-password-toggle:active{background:#edf2ef!important}
.android-password-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

html[data-client="android"] .brutal-auth-card .primary-btn,
html[data-client="android"] .auth-card .primary-btn,
body[data-client="android"] .brutal-auth-card .primary-btn,
body[data-client="android"] .auth-card .primary-btn{
  width:100%!important;
  min-height:52px!important;
  margin-top:2px!important;
  border:0!important;
  border-radius:15px!important;
  background:#0f2d3e!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(15,45,62,.18)!important;
  font-family:"Segoe UI Variable Text","Segoe UI",system-ui,sans-serif!important;
  font-size:14px!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
  transform:none!important;
}
html[data-client="android"] .brutal-auth-card .primary-btn:active,
html[data-client="android"] .auth-card .primary-btn:active,
body[data-client="android"] .brutal-auth-card .primary-btn:active,
body[data-client="android"] .auth-card .primary-btn:active{
  transform:scale(.985)!important;
  background:#173b4d!important;
}

html[data-client="android"] .brutal-auth-card .loading,
html[data-client="android"] .auth-card .loading,
body[data-client="android"] .brutal-auth-card .loading,
body[data-client="android"] .auth-card .loading{
  max-width:430px!important;
  margin:0 auto!important;
  padding:16px!important;
  border:1px solid #dbe3df!important;
  border-radius:15px!important;
  background:#fff!important;
  color:#354643!important;
  box-shadow:none!important;
  font-weight:700!important;
}
html[data-client="android"] .brutal-auth-card .message,
html[data-client="android"] .auth-card .message,
body[data-client="android"] .brutal-auth-card .message,
body[data-client="android"] .auth-card .message{
  max-width:430px!important;
  margin:12px auto 0!important;
  padding:12px 13px!important;
  border:1px solid #e2b8af!important;
  border-radius:13px!important;
  background:#fff2ef!important;
  color:#7b3428!important;
  box-shadow:none!important;
  font-size:11px!important;
  font-weight:700!important;
}
html[data-client="android"] .brutal-auth-card>small,
html[data-client="android"] .auth-card>small,
body[data-client="android"] .brutal-auth-card>small,
body[data-client="android"] .auth-card>small{
  display:block!important;
  max-width:430px!important;
  margin:18px auto 0!important;
  color:#84918e!important;
  text-align:center!important;
  font-size:9px!important;
}

/* ---------- V4 bottom navigation: icons only ---------- */
body[data-client="android"]{
  --android-nav-height:68px;
  --android-home-size:60px;
}
body[data-client="android"] .android-bottom-nav{
  height:calc(var(--android-nav-height) + var(--android-safe-bottom))!important;
  padding:8px 10px calc(8px + var(--android-safe-bottom))!important;
  align-items:center!important;
}
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab){
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  justify-self:center!important;
  align-self:center!important;
  display:grid!important;
  place-items:center!important;
  padding:12px!important;
  border-radius:16px!important;
}
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab).active{
  background:var(--theme-soft)!important;
  color:var(--primary)!important;
}
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab).active::before{
  content:none!important;
  display:none!important;
}
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab) .android-nav-icon{
  width:24px!important;
  height:24px!important;
}
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab) .android-nav-icon svg{
  width:24px!important;
  height:24px!important;
}
body[data-client="android"] .android-bottom-nav .android-home-fab{
  min-height:66px!important;
  height:66px!important;
  margin-top:-28px!important;
  justify-content:flex-start!important;
}
body[data-client="android"] .android-home-circle{
  width:var(--android-home-size)!important;
  height:var(--android-home-size)!important;
  flex-basis:var(--android-home-size)!important;
  border-width:5px!important;
}
body[data-client="android"] .android-home-circle .android-nav-icon,
body[data-client="android"] .android-home-circle .android-nav-icon svg{
  width:27px!important;
  height:27px!important;
}
/* Safety: no text labels can appear in V4 nav, even if stale markup is cached. */
body[data-client="android"] .android-bottom-nav button>span:not(.android-nav-icon):not(.android-home-circle),
body[data-client="android"] .android-home-label{
  display:none!important;
}

@media(max-width:360px){
  html[data-client="android"] .brutal-auth-card,
  html[data-client="android"] .auth-card,
  body[data-client="android"] .brutal-auth-card,
  body[data-client="android"] .auth-card{
    padding-inline:17px!important;
  }
  body[data-client="android"] .android-bottom-nav{
    padding-inline:5px!important;
  }
  body[data-client="android"] .android-bottom-nav button:not(.android-home-fab){
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
  }
}

/* =========================================================
   OFEDA ANDROID CLIENT V5 — SIMPLE LOGIN + STATE ISOLATION
   Fix: form .hidden must always beat the Android form layout.
   ========================================================= */

/* Critical auth-state fix: never render setup + login together. */
html[data-client="android"] .auth-card form.hidden,
html[data-client="android"] .brutal-auth-card form.hidden,
body[data-client="android"] .auth-card form.hidden,
body[data-client="android"] .brutal-auth-card form.hidden,
html[data-client="android"] .auth-card .loading.hidden,
html[data-client="android"] .brutal-auth-card .loading.hidden,
body[data-client="android"] .auth-card .loading.hidden,
body[data-client="android"] .brutal-auth-card .loading.hidden,
html[data-client="android"] .auth-card .message.hidden,
html[data-client="android"] .brutal-auth-card .message.hidden,
body[data-client="android"] .auth-card .message.hidden,
body[data-client="android"] .brutal-auth-card .message.hidden{
  display:none!important;
}

/* Login is intentionally simpler: one strong brand block + one clean form. */
html[data-client="android"] body.auth-body,
body[data-client="android"].auth-body{
  background:#eef2ef!important;
}

html[data-client="android"] .auth-shell,
body[data-client="android"] .auth-shell{
  max-width:480px!important;
  background:#eef2ef!important;
}

html[data-client="android"] .brutal-brand-panel,
html[data-client="android"] .auth-brand-panel,
body[data-client="android"] .brutal-brand-panel,
body[data-client="android"] .auth-brand-panel{
  min-height:210px!important;
  justify-content:flex-start!important;
  padding:calc(34px + env(safe-area-inset-top,0px)) 22px 42px!important;
  background:#0f2d3e!important;
}

/* Keep atmosphere subtle instead of decorative clutter. */
html[data-client="android"] .brutal-brand-panel::before,
body[data-client="android"] .brutal-brand-panel::before{
  width:180px!important;
  height:180px!important;
  right:-90px!important;
  top:-92px!important;
  opacity:.72!important;
}
html[data-client="android"] .brutal-brand-panel::after,
body[data-client="android"] .brutal-brand-panel::after{
  display:none!important;
}

html[data-client="android"] .brand-mark.ofeda-login-logo,
body[data-client="android"] .brand-mark.ofeda-login-logo,
html[data-client="android"] .auth-brand-panel .brand-mark,
body[data-client="android"] .auth-brand-panel .brand-mark{
  width:66px!important;
  height:66px!important;
  margin:0 0 14px!important;
  border-radius:18px!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
}

html[data-client="android"] .brutal-brand-panel h1,
html[data-client="android"] .auth-brand-panel h1,
body[data-client="android"] .brutal-brand-panel h1,
body[data-client="android"] .auth-brand-panel h1{
  max-width:300px!important;
  font-size:24px!important;
  font-weight:800!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
  text-align:left!important;
  align-self:flex-start!important;
}

.android-login-app-label{
  display:none!important;
}

html[data-client="android"] .brutal-auth-card,
html[data-client="android"] .auth-card,
body[data-client="android"] .brutal-auth-card,
body[data-client="android"] .auth-card{
  margin:-20px 12px 0!important;
  width:auto!important;
  min-height:0!important;
  padding:28px 20px calc(24px + env(safe-area-inset-bottom,0px))!important;
  border-radius:24px!important;
  background:#fbfcfa!important;
  box-shadow:0 14px 38px rgba(15,45,62,.12)!important;
}

html[data-client="android"] .brutal-auth-card form,
html[data-client="android"] .auth-card form,
body[data-client="android"] .brutal-auth-card form,
body[data-client="android"] .auth-card form{
  max-width:none!important;
  gap:13px!important;
}

/* Remove duplicate small heading. The state title is enough. */
html[data-client="android"] #loginForm>.eyebrow,
html[data-client="android"] #setupForm>.eyebrow,
body[data-client="android"] #loginForm>.eyebrow,
body[data-client="android"] #setupForm>.eyebrow{
  display:none!important;
}

html[data-client="android"] .brutal-auth-card h2,
html[data-client="android"] .auth-card h2,
body[data-client="android"] .brutal-auth-card h2,
body[data-client="android"] .auth-card h2{
  margin:0 0 5px!important;
  font-size:23px!important;
  font-weight:780!important;
  letter-spacing:-.025em!important;
}

html[data-client="android"] #setupForm p.muted,
body[data-client="android"] #setupForm p.muted{
  margin:-2px 0 4px!important;
  font-size:11.5px!important;
  line-height:1.4!important;
}

html[data-client="android"] .brutal-auth-card label,
html[data-client="android"] .auth-card label,
body[data-client="android"] .brutal-auth-card label,
body[data-client="android"] .auth-card label{
  gap:6px!important;
  font-size:10.5px!important;
  font-weight:760!important;
}

html[data-client="android"] .brutal-auth-card input,
html[data-client="android"] .auth-card input,
body[data-client="android"] .brutal-auth-card input,
body[data-client="android"] .auth-card input{
  min-height:50px!important;
  border-radius:13px!important;
  border-color:#d7dfdc!important;
  background:#fff!important;
}

.android-password-toggle{
  right:7px!important;
  bottom:6px!important;
  width:38px!important;
  height:38px!important;
}

html[data-client="android"] .brutal-auth-card .primary-btn,
html[data-client="android"] .auth-card .primary-btn,
body[data-client="android"] .brutal-auth-card .primary-btn,
body[data-client="android"] .auth-card .primary-btn{
  min-height:50px!important;
  margin-top:4px!important;
  border-radius:13px!important;
  box-shadow:none!important;
}

/* Loading/error occupy the same clean card instead of creating another layer. */
html[data-client="android"] .brutal-auth-card .loading,
html[data-client="android"] .auth-card .loading,
body[data-client="android"] .brutal-auth-card .loading,
body[data-client="android"] .auth-card .loading{
  padding:4px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#52635f!important;
}
html[data-client="android"] .brutal-auth-card .message,
html[data-client="android"] .auth-card .message,
body[data-client="android"] .brutal-auth-card .message,
body[data-client="android"] .auth-card .message{
  margin-top:12px!important;
  padding:10px 12px!important;
  border:1px solid #efc8c4!important;
  border-radius:11px!important;
  background:#fff2f0!important;
  color:#8a3028!important;
  box-shadow:none!important;
}

html[data-client="android"] .brutal-auth-card>small,
html[data-client="android"] .auth-card>small,
body[data-client="android"] .brutal-auth-card>small,
body[data-client="android"] .auth-card>small{
  display:block!important;
  margin-top:17px!important;
  color:#7b8985!important;
  font-size:9.5px!important;
  text-align:center!important;
}

@media(max-width:360px){
  html[data-client="android"] .brutal-auth-card,
  html[data-client="android"] .auth-card,
  body[data-client="android"] .brutal-auth-card,
  body[data-client="android"] .auth-card{
    margin-inline:8px!important;
    padding-inline:16px!important;
  }
}

/* =========================================================
   OFEDA ANDROID CLIENT V6 — COMPLETE POPUP / MODAL AUDIT
   Goal: every popup fits the visible Android viewport, only its
   content scrolls, and action buttons remain permanently visible.
   ========================================================= */
html[data-client="android"]{
  --android-visual-height:100dvh;
  --android-visual-top:0px;
  --android-modal-gap:8px;
}

body[data-client="android"].android-modal-open{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}

/* Always place application modals above header, bottom navigation and
   Android account/more sheets. */
body[data-client="android"] #modalRoot{
  position:relative!important;
  z-index:980!important;
}
body[data-client="android"] .modal-backdrop{
  position:fixed!important;
  z-index:980!important;
  left:0!important;
  right:0!important;
  top:var(--android-visual-top)!important;
  bottom:auto!important;
  width:100%!important;
  height:var(--android-visual-height)!important;
  min-height:0!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:center!important;
  padding:var(--android-modal-gap) 0 0!important;
  overflow:hidden!important;
  overscroll-behavior:contain!important;
  background:rgba(8,14,22,.62)!important;
  backdrop-filter:blur(4px)!important;
  -webkit-backdrop-filter:blur(4px)!important;
}

body[data-client="android"] .modal,
body[data-client="android"] .modal.wide{
  position:relative!important;
  width:100%!important;
  max-width:760px!important;
  height:auto!important;
  max-height:calc(var(--android-visual-height) - var(--android-modal-gap))!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-width:1px 0 0!important;
  border-radius:22px 22px 0 0!important;
  background:var(--panel)!important;
  color:var(--text)!important;
  box-shadow:0 -18px 64px rgba(8,14,22,.30)!important;
}

body[data-client="android"] .modal-header{
  position:relative!important;
  z-index:3!important;
  flex:0 0 auto!important;
  min-width:0!important;
  padding:14px 14px 12px!important;
  border-bottom:1px solid var(--theme-border)!important;
  background:var(--panel)!important;
}
body[data-client="android"] .modal-header>div{
  min-width:0!important;
}
body[data-client="android"] .modal-header h2{
  margin:0!important;
  font-size:18px!important;
  line-height:1.18!important;
  overflow-wrap:anywhere!important;
}
body[data-client="android"] .modal-header p{
  margin:4px 0 0!important;
  max-width:100%!important;
  font-size:9.5px!important;
  line-height:1.4!important;
  overflow-wrap:anywhere!important;
}
body[data-client="android"] .modal-header .icon-btn{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  flex:0 0 38px!important;
}

/* Only this region scrolls. Header and docked footer stay visible. */
body[data-client="android"] .modal-body{
  position:relative!important;
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  width:100%!important;
  padding:13px 13px 16px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-gutter:auto!important;
  scroll-padding-top:12px!important;
  scroll-padding-bottom:20px!important;
}

/* V6 JS moves .modal-footer outside the scrolling body while preserving
   form association for submit buttons. This rule also safely handles a
   legacy footer that has not been docked yet. */
body[data-client="android"] .modal-footer,
body[data-client="android"] .android-modal-docked-footer{
  position:relative!important;
  z-index:8!important;
  flex:0 0 auto!important;
  width:100%!important;
  margin:0!important;
  padding:10px 13px calc(10px + var(--android-safe-bottom))!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:7px!important;
  flex-wrap:wrap!important;
  border-top:1px solid var(--theme-border)!important;
  background:color-mix(in srgb,var(--panel) 97%,transparent)!important;
  box-shadow:0 -7px 22px rgba(15,23,42,.08)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
body[data-client="android"] .modal-footer button,
body[data-client="android"] .android-modal-docked-footer button{
  min-width:0!important;
  min-height:44px!important;
  flex:1 1 125px!important;
  margin:0!important;
}

/* If a footer is still inside modal-body for a few milliseconds before the
   observer docks it, do not use the old negative-margin implementation. */
body[data-client="android"] .modal-body>.modal-footer,
body[data-client="android"] .modal-body form>.modal-footer{
  margin:14px -13px -16px!important;
  width:calc(100% + 26px)!important;
}

/* ---------- Form safety inside every Android popup ---------- */
body[data-client="android"] .modal-body form,
body[data-client="android"] .modal-body fieldset,
body[data-client="android"] .modal-body label,
body[data-client="android"] .modal-body .form-grid,
body[data-client="android"] .modal-body .filters{
  min-width:0!important;
  max-width:100%!important;
}
body[data-client="android"] .modal-body form{
  width:100%!important;
}
body[data-client="android"] .modal-body .form-grid,
body[data-client="android"] .modal-body .filters{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:10px!important;
}
body[data-client="android"] .modal-body .span-2{
  grid-column:1!important;
}
body[data-client="android"] .modal-body input,
body[data-client="android"] .modal-body select,
body[data-client="android"] .modal-body textarea{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  font-size:16px!important;
}
body[data-client="android"] .modal-body textarea{
  resize:vertical!important;
  min-height:96px!important;
  max-height:220px!important;
}

/* Long/complex popup layouts are flattened into one readable phone column. */
body[data-client="android"] .modal-body .expense-common-fields,
body[data-client="android"] .modal-body .payment-settings-layout,
body[data-client="android"] .modal-body .profile-photo-editor,
body[data-client="android"] .modal-body .invoice-payment-grid,
body[data-client="android"] .modal-body .invoice-pro-bottom-compact,
body[data-client="android"] .modal-body .settings-grid,
body[data-client="android"] .modal-body .client-grid,
body[data-client="android"] .modal-body .budget-usage-grid,
body[data-client="android"] .modal-body .shopping-history-grid{
  width:100%!important;
  max-width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:10px!important;
}

/* Multi-expense rows are one of the widest desktop popup structures. */
body[data-client="android"] .modal-body .expense-entry-list{
  width:100%!important;
  max-width:100%!important;
  display:grid!important;
  gap:10px!important;
}
body[data-client="android"] .modal-body .expense-entry-row{
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:9px!important;
  padding:12px!important;
  border:1px solid var(--theme-border)!important;
  border-radius:13px!important;
  background:var(--theme-pale)!important;
  color:var(--pale-text,var(--text))!important;
}
body[data-client="android"] .modal-body .expense-row-number{
  justify-self:start!important;
  align-self:auto!important;
}
body[data-client="android"] .modal-body .expense-remove-row{
  position:absolute!important;
  top:9px!important;
  right:9px!important;
  width:36px!important;
  height:36px!important;
  min-height:36px!important;
}
body[data-client="android"] .modal-body .expense-entry-row label{
  padding-right:0!important;
}
body[data-client="android"] .modal-body .expense-entry-row label:first-of-type{
  padding-right:40px!important;
}
body[data-client="android"] .modal-body .expense-total-box{
  width:100%!important;
  min-height:58px!important;
  padding:10px 12px!important;
}

/* Bulk/category tools and search bars must not overflow a phone modal. */
body[data-client="android"] .modal-body .expense-bulk-tools,
body[data-client="android"] .modal-body .expense-search-control,
body[data-client="android"] .modal-body .expense-search-box,
body[data-client="android"] .modal-body .plan-history-search,
body[data-client="android"] .modal-body .client-popup-toolbar,
body[data-client="android"] .modal-body .settings-popup-head,
body[data-client="android"] .modal-body .qris-settings-actions,
body[data-client="android"] .modal-body .profile-photo-actions,
body[data-client="android"] .modal-body .receipt-ocr-controls{
  width:100%!important;
  max-width:100%!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
body[data-client="android"] .modal-body .expense-bulk-tools>*,
body[data-client="android"] .modal-body .expense-search-control>*,
body[data-client="android"] .modal-body .expense-search-box>*,
body[data-client="android"] .modal-body .receipt-ocr-controls>*{
  min-width:0!important;
  max-width:100%!important;
  flex:1 1 150px!important;
}

/* Profile, source and settings cards in popup. */
body[data-client="android"] .modal-body .profile-item,
body[data-client="android"] .modal-body .source-setting-card,
body[data-client="android"] .modal-body .funding-history-item,
body[data-client="android"] .modal-body .invoice-payment-job-list>button{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}
body[data-client="android"] .modal-body .profile-item,
body[data-client="android"] .modal-body .source-setting-card{
  grid-template-columns:auto minmax(0,1fr)!important;
  gap:9px!important;
}
body[data-client="android"] .modal-body .profile-item .row-actions,
body[data-client="android"] .modal-body .source-setting-card>button,
body[data-client="android"] .modal-body .source-setting-card .row-actions{
  grid-column:1/-1!important;
  width:100%!important;
}

/* Images/previews cannot dictate modal width. */
body[data-client="android"] .modal-body img,
body[data-client="android"] .modal-body canvas,
body[data-client="android"] .modal-body svg,
body[data-client="android"] .modal-body .qris-settings-preview,
body[data-client="android"] .modal-body .receipt-ocr-preview,
body[data-client="android"] .modal-body .profile-photo-preview{
  max-width:100%!important;
}
body[data-client="android"] .modal-body .receipt-ocr-preview img,
body[data-client="android"] .modal-body .qris-settings-preview img{
  height:auto!important;
  object-fit:contain!important;
}

/* Tables inside popup remain tables but get their own horizontal scroller. */
body[data-client="android"] .modal-body .table-wrap,
body[data-client="android"] .modal-body .invoice-pro-table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}

/* Invoice/report preview should never force the modal beyond the viewport. */
body[data-client="android"] .modal-body .report-paper,
body[data-client="android"] .modal-body .invoice-paper,
body[data-client="android"] .modal-body .invoice-pro-paper,
body[data-client="android"] .modal-body #invoicePaper{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:auto!important;
}

/* Small phones: action footer becomes one-column when needed. */
@media(max-width:390px){
  body[data-client="android"] .modal-footer button,
  body[data-client="android"] .android-modal-docked-footer button{
    flex-basis:calc(50% - 4px)!important;
  }
  body[data-client="android"] .modal-footer button:only-child,
  body[data-client="android"] .android-modal-docked-footer button:only-child{
    flex-basis:100%!important;
  }
}

/* Landscape / tablet preview: keep the bottom sheet compact and centered. */
@media(min-width:761px){
  body[data-client="android"] .modal,
  body[data-client="android"] .modal.wide{
    border-left-width:1px!important;
    border-right-width:1px!important;
    border-radius:22px 22px 0 0!important;
  }
}

/* =========================================================
   OFEDA ANDROID CLIENT V7 — DARK AUTH + RUNTIME SAFETY
   Android login only. Web login and desktop application are untouched.
   ========================================================= */

/* Auth states remain mutually exclusive. */
html[data-client="android"] .auth-card form.hidden,
html[data-client="android"] .brutal-auth-card form.hidden,
body[data-client="android"] .auth-card form.hidden,
body[data-client="android"] .brutal-auth-card form.hidden,
html[data-client="android"] .auth-card .loading.hidden,
html[data-client="android"] .brutal-auth-card .loading.hidden,
body[data-client="android"] .auth-card .loading.hidden,
body[data-client="android"] .brutal-auth-card .loading.hidden,
html[data-client="android"] .auth-card .message.hidden,
html[data-client="android"] .brutal-auth-card .message.hidden,
body[data-client="android"] .auth-card .message.hidden,
body[data-client="android"] .brutal-auth-card .message.hidden{
  display:none!important;
}
html[data-client="android"] .auth-card form:not(.hidden),
html[data-client="android"] .brutal-auth-card form:not(.hidden),
body[data-client="android"] .auth-card form:not(.hidden),
body[data-client="android"] .brutal-auth-card form:not(.hidden){
  display:grid!important;
}

/* Full dark app-login canvas. No gradient, no decorative clutter. */
html[data-client="android"] body.auth-body,
body[data-client="android"].auth-body{
  min-height:100dvh!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  overflow-x:hidden!important;
  background:#090f14!important;
  background-image:none!important;
  color:#f3f7f8!important;
  color-scheme:dark!important;
}
html[data-client="android"] body.auth-body::before,
html[data-client="android"] body.auth-body::after,
body[data-client="android"].auth-body::before,
body[data-client="android"].auth-body::after{
  content:none!important;
  display:none!important;
}

html[data-client="android"] .auth-shell,
body[data-client="android"] .auth-shell{
  width:100%!important;
  max-width:480px!important;
  min-height:100dvh!important;
  margin:0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:0!important;
  padding:calc(28px + env(safe-area-inset-top,0px)) 18px calc(26px + env(safe-area-inset-bottom,0px))!important;
  border:0!important;
  border-radius:0!important;
  background:#090f14!important;
  box-shadow:none!important;
  overflow:visible!important;
}

/* Compact brand block. */
html[data-client="android"] .brutal-brand-panel,
html[data-client="android"] .auth-brand-panel,
body[data-client="android"] .brutal-brand-panel,
body[data-client="android"] .auth-brand-panel{
  position:relative!important;
  min-height:0!important;
  width:100%!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 8px 24px!important;
  border:0!important;
  border-radius:0!important;
  background:#090f14!important;
  color:#f3f7f8!important;
  text-align:center!important;
  overflow:visible!important;
}
html[data-client="android"] .brutal-brand-panel::before,
html[data-client="android"] .brutal-brand-panel::after,
body[data-client="android"] .brutal-brand-panel::before,
body[data-client="android"] .brutal-brand-panel::after{
  content:none!important;
  display:none!important;
}
html[data-client="android"] .brutal-brand-panel>.eyebrow,
html[data-client="android"] .auth-brand-panel>.eyebrow,
html[data-client="android"] .brutal-brand-panel>.local-badge,
html[data-client="android"] .auth-brand-panel>.local-badge,
body[data-client="android"] .brutal-brand-panel>.eyebrow,
body[data-client="android"] .auth-brand-panel>.eyebrow,
body[data-client="android"] .brutal-brand-panel>.local-badge,
body[data-client="android"] .auth-brand-panel>.local-badge,
html[data-client="android"] .brutal-sticker,
body[data-client="android"] .brutal-sticker,
.android-login-app-label{
  display:none!important;
}

html[data-client="android"] .brand-mark.ofeda-login-logo,
body[data-client="android"] .brand-mark.ofeda-login-logo,
html[data-client="android"] .auth-brand-panel .brand-mark,
body[data-client="android"] .auth-brand-panel .brand-mark{
  position:relative!important;
  width:72px!important;
  height:72px!important;
  margin:0 0 15px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  border:1px solid #28343d!important;
  border-radius:18px!important;
  background:#111a21!important;
  color:#f6fbf9!important;
  box-shadow:0 10px 28px rgba(0,0,0,.28)!important;
  transform:none!important;
}
html[data-client="android"] .brand-mark.ofeda-login-logo img,
body[data-client="android"] .brand-mark.ofeda-login-logo img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:contain!important;
}
html[data-client="android"] .brutal-brand-panel h1,
html[data-client="android"] .auth-brand-panel h1,
body[data-client="android"] .brutal-brand-panel h1,
body[data-client="android"] .auth-brand-panel h1{
  max-width:320px!important;
  margin:0!important;
  color:#f3f7f8!important;
  font-family:"Segoe UI Variable Display","Segoe UI",system-ui,sans-serif!important;
  font-size:23px!important;
  font-weight:780!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
  text-transform:none!important;
  text-align:center!important;
}

/* One dark card for whichever auth state is active. */
html[data-client="android"] .brutal-auth-card,
html[data-client="android"] .auth-card,
body[data-client="android"] .brutal-auth-card,
body[data-client="android"] .auth-card{
  position:relative!important;
  width:100%!important;
  max-width:444px!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:22px 18px!important;
  border:1px solid #24313a!important;
  border-radius:18px!important;
  background:#10181f!important;
  color:#eef4f5!important;
  box-shadow:0 16px 42px rgba(0,0,0,.24)!important;
}
html[data-client="android"] .brutal-card-label,
body[data-client="android"] .brutal-card-label{
  display:none!important;
}
html[data-client="android"] .brutal-auth-card form,
html[data-client="android"] .auth-card form,
body[data-client="android"] .brutal-auth-card form,
body[data-client="android"] .auth-card form{
  width:100%!important;
  max-width:none!important;
  gap:12px!important;
}
html[data-client="android"] #loginForm>.eyebrow,
html[data-client="android"] #setupForm>.eyebrow,
body[data-client="android"] #loginForm>.eyebrow,
body[data-client="android"] #setupForm>.eyebrow{
  display:none!important;
}
html[data-client="android"] .brutal-auth-card h2,
html[data-client="android"] .auth-card h2,
body[data-client="android"] .brutal-auth-card h2,
body[data-client="android"] .auth-card h2{
  margin:0 0 4px!important;
  color:#f5f8f9!important;
  font-family:"Segoe UI Variable Display","Segoe UI",system-ui,sans-serif!important;
  font-size:21px!important;
  font-weight:760!important;
  line-height:1.16!important;
  letter-spacing:-.02em!important;
  text-align:left!important;
}
html[data-client="android"] #setupForm p.muted,
body[data-client="android"] #setupForm p.muted{
  margin:-2px 0 3px!important;
  color:#94a5ae!important;
  font-size:11px!important;
  line-height:1.45!important;
}
html[data-client="android"] .brutal-auth-card label,
html[data-client="android"] .auth-card label,
body[data-client="android"] .brutal-auth-card label,
body[data-client="android"] .auth-card label{
  position:relative!important;
  display:grid!important;
  gap:6px!important;
  color:#b9c5ca!important;
  font-size:10.5px!important;
  font-weight:720!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
html[data-client="android"] .brutal-auth-card input,
html[data-client="android"] .auth-card input,
body[data-client="android"] .brutal-auth-card input,
body[data-client="android"] .auth-card input{
  width:100%!important;
  min-height:50px!important;
  padding:12px 46px 12px 13px!important;
  border:1px solid #2b3943!important;
  border-radius:12px!important;
  background:#0b1218!important;
  color:#f2f7f8!important;
  caret-color:#67b38d!important;
  box-shadow:none!important;
  font-size:16px!important;
  outline:none!important;
  transform:none!important;
}
html[data-client="android"] .brutal-auth-card input::placeholder,
html[data-client="android"] .auth-card input::placeholder,
body[data-client="android"] .brutal-auth-card input::placeholder,
body[data-client="android"] .auth-card input::placeholder{
  color:#667781!important;
}
html[data-client="android"] .brutal-auth-card input:focus,
html[data-client="android"] .auth-card input:focus,
body[data-client="android"] .brutal-auth-card input:focus,
body[data-client="android"] .auth-card input:focus{
  border-color:#4e9b75!important;
  box-shadow:0 0 0 3px rgba(78,155,117,.16)!important;
  transform:none!important;
}
.android-password-toggle{
  right:6px!important;
  bottom:6px!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  padding:9px!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#8fa0a8!important;
  box-shadow:none!important;
}
.android-password-toggle:active{
  background:#18242c!important;
  color:#d8e2e5!important;
}
html[data-client="android"] .brutal-auth-card .primary-btn,
html[data-client="android"] .auth-card .primary-btn,
body[data-client="android"] .brutal-auth-card .primary-btn,
body[data-client="android"] .auth-card .primary-btn{
  width:100%!important;
  min-height:50px!important;
  margin-top:2px!important;
  border:1px solid #397f5f!important;
  border-radius:12px!important;
  background:#2e7d5b!important;
  color:#ffffff!important;
  box-shadow:none!important;
  font-family:"Segoe UI Variable Text","Segoe UI",system-ui,sans-serif!important;
  font-size:14px!important;
  font-weight:800!important;
  letter-spacing:.005em!important;
  transform:none!important;
}
html[data-client="android"] .brutal-auth-card .primary-btn:active,
html[data-client="android"] .auth-card .primary-btn:active,
body[data-client="android"] .brutal-auth-card .primary-btn:active,
body[data-client="android"] .auth-card .primary-btn:active{
  background:#276e50!important;
  transform:scale(.99)!important;
}
html[data-client="android"] .brutal-auth-card .loading,
html[data-client="android"] .auth-card .loading,
body[data-client="android"] .brutal-auth-card .loading,
body[data-client="android"] .auth-card .loading{
  width:100%!important;
  margin:0!important;
  padding:14px!important;
  border:1px solid #26343d!important;
  border-radius:12px!important;
  background:#0b1218!important;
  color:#c7d2d6!important;
  box-shadow:none!important;
}
html[data-client="android"] .brutal-auth-card .message,
html[data-client="android"] .auth-card .message,
body[data-client="android"] .brutal-auth-card .message,
body[data-client="android"] .auth-card .message{
  width:100%!important;
  margin:12px 0 0!important;
  padding:11px 12px!important;
  border:1px solid #6f3d3b!important;
  border-radius:12px!important;
  background:#251718!important;
  color:#f0b7b2!important;
  box-shadow:none!important;
}
html[data-client="android"] .brutal-auth-card .muted,
html[data-client="android"] .auth-card .muted,
html[data-client="android"] .brutal-auth-card small,
html[data-client="android"] .auth-card small,
body[data-client="android"] .brutal-auth-card .muted,
body[data-client="android"] .auth-card .muted,
body[data-client="android"] .brutal-auth-card small,
body[data-client="android"] .auth-card small{
  color:#8798a1!important;
}
html[data-client="android"] .brutal-auth-card .spinner,
html[data-client="android"] .auth-card .spinner,
body[data-client="android"] .brutal-auth-card .spinner,
body[data-client="android"] .auth-card .spinner{
  border-color:#2b3943!important;
  border-top-color:#67b38d!important;
}

@media(max-width:360px){
  html[data-client="android"] .auth-shell,
  body[data-client="android"] .auth-shell{
    padding-inline:14px!important;
  }
  html[data-client="android"] .brutal-auth-card,
  html[data-client="android"] .auth-card,
  body[data-client="android"] .brutal-auth-card,
  body[data-client="android"] .auth-card{
    padding:20px 15px!important;
  }
}



/* =========================================================
   OFEDA ANDROID REBUILD — FINANCE LOGIN + KEYBOARD SAFE
   Scoped Android-only. No gradients.
   ========================================================= */
html[data-client="android"] body.auth-body,
body[data-client="android"].auth-body{
  min-height:var(--android-auth-vh,100dvh)!important;
  padding:max(18px,env(safe-area-inset-top,0px)) 16px max(20px,env(safe-area-inset-bottom,0px))!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
  overflow-y:auto!important;
  background:#091118!important;
  color:#eff6f3!important;
  color-scheme:dark!important;
}
html[data-client="android"] body.auth-body::before,
body[data-client="android"].auth-body::before{
  content:""!important;
  display:block!important;
  position:fixed!important;
  right:22px!important;
  top:22px!important;
  width:72px!important;
  height:50px!important;
  border-left:7px solid #224d3a!important;
  border-bottom:7px solid #224d3a!important;
  box-shadow:18px -11px 0 -2px #2e6e50,36px -25px 0 -2px #3d8c66,54px -39px 0 -2px #5abc88!important;
  opacity:.5!important;
  background:none!important;
  pointer-events:none!important;
}
html[data-client="android"] body.auth-body::after,
body[data-client="android"].auth-body::after{
  content:"OFEDA  •  FINANCE"!important;
  display:block!important;
  position:fixed!important;
  left:18px!important;
  bottom:max(10px,env(safe-area-inset-bottom,0px))!important;
  color:#536a74!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
  pointer-events:none!important;
}
html[data-client="android"] .auth-shell,
body[data-client="android"] .auth-shell{
  width:min(430px,100%)!important;
  max-width:430px!important;
  min-height:0!important;
  margin:clamp(22px,6vh,58px) auto 30px!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  border:1px solid #243642!important;
  border-radius:22px!important;
  background:#111a22!important;
  box-shadow:0 20px 56px rgba(0,0,0,.38)!important;
  overflow:hidden!important;
}
html[data-client="android"] .brutal-brand-panel,
html[data-client="android"] .auth-brand-panel,
body[data-client="android"] .brutal-brand-panel,
body[data-client="android"] .auth-brand-panel{
  width:100%!important;
  min-height:0!important;
  padding:18px 20px 14px!important;
  display:grid!important;
  grid-template-columns:auto 1fr!important;
  align-items:center!important;
  column-gap:13px!important;
  border:0!important;
  border-bottom:1px solid #263844!important;
  background:#16232c!important;
  text-align:left!important;
}
html[data-client="android"] .brand-mark.ofeda-login-logo,
body[data-client="android"] .brand-mark.ofeda-login-logo,
html[data-client="android"] .auth-brand-panel .brand-mark,
body[data-client="android"] .auth-brand-panel .brand-mark{
  width:56px!important;
  height:56px!important;
  margin:0!important;
  grid-row:1 / span 2!important;
  border:1px solid #355143!important;
  border-radius:16px!important;
  background:#0d171d!important;
  box-shadow:none!important;
}
html[data-client="android"] .brutal-brand-panel h1,
html[data-client="android"] .auth-brand-panel h1,
body[data-client="android"] .brutal-brand-panel h1,
body[data-client="android"] .auth-brand-panel h1{
  max-width:none!important;
  margin:0!important;
  font-size:18px!important;
  line-height:1.12!important;
  text-align:left!important;
  color:#f2f7f5!important;
}
html[data-client="android"] .brutal-brand-panel>.eyebrow,
html[data-client="android"] .auth-brand-panel>.eyebrow,
body[data-client="android"] .brutal-brand-panel>.eyebrow,
body[data-client="android"] .auth-brand-panel>.eyebrow{
  display:block!important;
  margin:4px 0 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#90a4ad!important;
  font-size:10px!important;
  letter-spacing:.06em!important;
  text-align:left!important;
}
html[data-client="android"] .local-badge,
body[data-client="android"] .local-badge,
html[data-client="android"] .brutal-sticker,
body[data-client="android"] .brutal-sticker{
  display:none!important;
}
html[data-client="android"] .brutal-auth-card,
html[data-client="android"] .auth-card,
body[data-client="android"] .brutal-auth-card,
body[data-client="android"] .auth-card{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:20px!important;
  border:0!important;
  border-radius:0!important;
  background:#111a22!important;
  box-shadow:none!important;
}
html[data-client="android"] .brutal-auth-card .loading,
html[data-client="android"] .auth-card .loading,
body[data-client="android"] .brutal-auth-card .loading,
body[data-client="android"] .auth-card .loading{
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:14px!important;
  border:1px solid #263944!important;
  border-radius:14px!important;
  background:#0d151b!important;
  color:#b9c8cd!important;
}
html[data-client="android"] #loadingAuth .ofeda-couple-loader,
body[data-client="android"] #loadingAuth .ofeda-couple-loader{
  width:118px!important;
  height:74px!important;
}
html[data-client="android"] .brutal-auth-card h2,
html[data-client="android"] .auth-card h2,
body[data-client="android"] .brutal-auth-card h2,
body[data-client="android"] .auth-card h2{
  font-size:23px!important;
  color:#f5f9f7!important;
}
html[data-client="android"] .brutal-auth-card input,
html[data-client="android"] .auth-card input,
body[data-client="android"] .brutal-auth-card input,
body[data-client="android"] .auth-card input{
  min-height:50px!important;
  border:1px solid #314550!important;
  border-radius:12px!important;
  background:#0b141a!important;
  color:#f4f8f6!important;
  box-shadow:none!important;
}
html[data-client="android"] .brutal-auth-card input:focus,
html[data-client="android"] .auth-card input:focus,
body[data-client="android"] .brutal-auth-card input:focus,
body[data-client="android"] .auth-card input:focus{
  border-color:#58b986!important;
  box-shadow:0 0 0 3px rgba(88,185,134,.15)!important;
}
html[data-client="android"] .brutal-auth-card .primary-btn,
html[data-client="android"] .auth-card .primary-btn,
body[data-client="android"] .brutal-auth-card .primary-btn,
body[data-client="android"] .auth-card .primary-btn{
  border:1px solid #38825f!important;
  border-radius:12px!important;
  background:#2f805d!important;
  color:#fff!important;
  box-shadow:none!important;
}
body[data-client="android"].android-auth-keyboard{
  padding-top:max(6px,env(safe-area-inset-top,0px))!important;
}
body[data-client="android"].android-auth-keyboard .auth-shell{
  margin-top:6px!important;
  margin-bottom:8px!important;
}
body[data-client="android"].android-auth-keyboard .brutal-brand-panel,
body[data-client="android"].android-auth-keyboard .auth-brand-panel{
  padding:8px 14px!important;
}
body[data-client="android"].android-auth-keyboard .brand-mark.ofeda-login-logo,
body[data-client="android"].android-auth-keyboard .auth-brand-panel .brand-mark{
  width:40px!important;
  height:40px!important;
  border-radius:11px!important;
}
body[data-client="android"].android-auth-keyboard .brutal-brand-panel h1,
body[data-client="android"].android-auth-keyboard .auth-brand-panel h1{
  font-size:15px!important;
}
body[data-client="android"].android-auth-keyboard .brutal-brand-panel>.eyebrow,
body[data-client="android"].android-auth-keyboard .auth-brand-panel>.eyebrow{
  display:none!important;
}
body[data-client="android"].android-auth-keyboard .brutal-auth-card,
body[data-client="android"].android-auth-keyboard .auth-card{
  padding:12px 14px 16px!important;
}
@media(max-height:620px){
  html[data-client="android"] .auth-shell,
  body[data-client="android"] .auth-shell{
    margin-top:8px!important;
  }
}


/* =========================================================
   OFEDA FULL BUILD — TRUE CIRCLE BOTTOM NAV
   Final override; must remain at the end of android-client.css.
   ========================================================= */

body[data-client="android"] .android-bottom-nav{
  overflow:visible!important;
}

/* Never allow a rectangular button shadow behind the circle. */
body[data-client="android"] .android-bottom-nav button,
body[data-client="android"] .android-bottom-nav button.active,
body[data-client="android"][data-ofeda-theme="brutalism"] .android-bottom-nav button{
  box-sizing:border-box!important;
  box-shadow:none!important;
  outline:none!important;
}

/* Four secondary items: 48 x 48 real circles. */
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab){
  position:relative!important;
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  max-width:48px!important;
  max-height:48px!important;
  aspect-ratio:1 / 1!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  transform:none!important;
}

/* Active secondary item: circle + circular shadow. */
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab).active{
  border-radius:50%!important;
  background:var(--theme-soft)!important;
  color:var(--primary)!important;
  box-shadow:
    0 5px 14px rgba(15,23,42,.14),
    0 2px 5px rgba(var(--theme-rgb),.13)!important;
}

body[data-client="android"] .android-bottom-nav button:not(.android-home-fab).active::before,
body[data-client="android"] .android-bottom-nav button:not(.android-home-fab).active::after{
  content:none!important;
  display:none!important;
}

/* Home parent is only a transparent circular hit area.
   No background or shadow here: avoids the old square shadow artifact. */
body[data-client="android"] .android-bottom-nav .android-home-fab,
body[data-client="android"] .android-bottom-nav .android-home-fab.active,
body[data-client="android"][data-ofeda-theme="brutalism"] .android-bottom-nav .android-home-fab{
  position:relative!important;
  z-index:5!important;
  width:66px!important;
  height:66px!important;
  min-width:66px!important;
  min-height:66px!important;
  max-width:66px!important;
  max-height:66px!important;
  aspect-ratio:1 / 1!important;
  margin-top:-28px!important;
  padding:3px!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  color:var(--text)!important;
  box-shadow:none!important;
  transform:none!important;
}

body[data-client="android"] .android-bottom-nav .android-home-fab::before,
body[data-client="android"] .android-bottom-nav .android-home-fab::after{
  content:none!important;
  display:none!important;
}

/* The visible Home surface itself is exactly 60 x 60. */
body[data-client="android"] .android-home-circle{
  position:relative!important;
  box-sizing:border-box!important;
  width:60px!important;
  height:60px!important;
  min-width:60px!important;
  min-height:60px!important;
  max-width:60px!important;
  max-height:60px!important;
  flex:0 0 60px!important;
  aspect-ratio:1 / 1!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  border:5px solid var(--panel)!important;
  border-radius:50%!important;
  background:var(--primary)!important;
  color:var(--on-primary)!important;
  box-shadow:
    0 8px 20px rgba(var(--theme-rgb),.28),
    0 3px 7px rgba(15,23,42,.16)!important;
  transform:none!important;
  transition:
    transform 150ms ease,
    box-shadow 150ms ease,
    background 150ms ease!important;
}

/* Active Home remains a circle; only scale changes. */
body[data-client="android"] .android-home-fab.active .android-home-circle{
  border-radius:50%!important;
  background:var(--primary)!important;
  color:var(--on-primary)!important;
  transform:translateY(-2px) scale(1.045)!important;
  box-shadow:
    0 10px 24px rgba(var(--theme-rgb),.34),
    0 4px 9px rgba(15,23,42,.18)!important;
}

body[data-client="android"] .android-home-fab:active .android-home-circle{
  border-radius:50%!important;
  transform:scale(.96)!important;
}

/* Make SVG/icon boxes square and centered too. */
body[data-client="android"] .android-bottom-nav .android-nav-icon,
body[data-client="android"] .android-bottom-nav .android-nav-icon svg{
  display:block!important;
  aspect-ratio:1 / 1!important;
  margin:auto!important;
}

/* Small-screen circles remain circles, only diameter changes. */
@media(max-width:360px){
  body[data-client="android"] .android-bottom-nav button:not(.android-home-fab){
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    max-width:44px!important;
    max-height:44px!important;
    border-radius:50%!important;
  }

  body[data-client="android"] .android-bottom-nav .android-home-fab{
    width:62px!important;
    height:62px!important;
    min-width:62px!important;
    min-height:62px!important;
    max-width:62px!important;
    max-height:62px!important;
    border-radius:50%!important;
  }

  body[data-client="android"] .android-home-circle{
    width:56px!important;
    height:56px!important;
    min-width:56px!important;
    min-height:56px!important;
    max-width:56px!important;
    max-height:56px!important;
    flex-basis:56px!important;
    border-radius:50%!important;
  }
}
