/* iPhone app "Liquid Glass" look (iOS 26 style), Zevy 2026-11-11: iPhone APP ONLY.
   Every rule is under html.in-app (set only inside the app: window.Capacitor / "MMLApp" user agent), so the computer
   portal and phone browsers are unchanged. Loaded after /theme.css. Look only: no page structure, data or logic changes.
   Header stays maroon-tinted glass because the app always draws a white clock/battery (AppDelegate .lightContent). */

/* ---------- tokens: light ---------- */
html.in-app{
  --g-bg:#f4efeb;--g-ink:#22100f;--g-ink2:rgba(60,32,33,.62);--g-ink3:rgba(60,32,33,.38);
  --g-sep:rgba(60,32,33,.13);--g-fill:rgba(118,92,88,.12);--g-fill2:rgba(118,92,88,.08);
  --g-card:rgba(255,255,255,.74);--g-card2:rgba(255,255,255,.9);--g-hi:rgba(255,255,255,.85);
  --g-glass:rgba(255,255,255,.58);--g-glass-brd:rgba(255,255,255,.75);--g-glass-sh:0 10px 34px -8px rgba(46,17,19,.22),0 1px 3px rgba(46,17,19,.08);
  --g-card-sh:0 1px 1px rgba(46,17,19,.03),0 10px 28px -16px rgba(46,17,19,.22);
  --g-tint:#f05222;--g-tint-ink:#d2421a;--g-sheet:rgba(252,249,247,.96);--g-input:rgba(255,255,255,.88);--g-seg:#fff;
  --g-red:#e5382a;--g-grn:#22a356;
  --g-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",system-ui,Inter,"Helvetica Neue",sans-serif;
  --g-r:22px;
  /* old theme variables, so the many small rules that use them follow light/dark too */
  --bg:var(--g-bg);--card:var(--g-card);--line:var(--g-sep);--line-soft:var(--g-sep);--mut:var(--g-ink2);--ink:var(--g-ink);
  color-scheme:light;background:var(--g-bg)!important}
/* ---------- tokens: dark ---------- */
@media (prefers-color-scheme:dark){
  html.in-app{
    --g-bg:#0b0708;--g-ink:#f6ecea;--g-ink2:rgba(240,222,219,.62);--g-ink3:rgba(240,222,219,.36);
    --g-sep:rgba(255,255,255,.11);--g-fill:rgba(255,255,255,.1);--g-fill2:rgba(255,255,255,.06);
    --g-card:rgba(40,32,33,.66);--g-card2:rgba(52,42,43,.92);--g-hi:rgba(255,255,255,.1);
    --g-glass:rgba(38,30,31,.55);--g-glass-brd:rgba(255,255,255,.16);--g-glass-sh:0 12px 36px -8px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.4);
    --g-card-sh:0 10px 28px -16px rgba(0,0,0,.7);
    --g-tint:#ff6a3d;--g-tint-ink:#ff8a63;--g-sheet:rgba(36,28,29,.97);--g-input:rgba(255,255,255,.07);--g-seg:rgba(255,255,255,.2);
    --g-red:#ff5a4c;--g-grn:#3ad07a;
    color-scheme:dark}
}

/* ---------- page background: soft brand light behind the glass ---------- */
html.in-app body{background:transparent!important;color:var(--g-ink)!important;font-family:var(--g-font)!important;font-size:15.5px;letter-spacing:-.01em;-webkit-font-smoothing:antialiased}
html.in-app body::before{content:'';position:fixed;inset:-10vh -10vw;z-index:-1;pointer-events:none;
  background:radial-gradient(55% 32% at 8% 4%,rgba(240,82,34,.16),transparent 70%),radial-gradient(48% 30% at 96% 22%,rgba(208,152,197,.22),transparent 72%),
  radial-gradient(60% 34% at 20% 70%,rgba(255,180,120,.12),transparent 70%),radial-gradient(55% 30% at 90% 96%,rgba(240,82,34,.10),transparent 70%),var(--g-bg)}
@media (prefers-color-scheme:dark){html.in-app body::before{
  background:radial-gradient(55% 32% at 8% 4%,rgba(240,82,34,.20),transparent 70%),radial-gradient(48% 30% at 96% 22%,rgba(150,60,110,.22),transparent 72%),
  radial-gradient(60% 34% at 20% 70%,rgba(120,40,30,.18),transparent 70%),radial-gradient(55% 30% at 90% 96%,rgba(240,82,34,.10),transparent 70%),var(--g-bg)}}
html.in-app .wrap,html.in-app .main{background:transparent!important}
html.in-app input,html.in-app select,html.in-app textarea,html.in-app button,html.in-app .btn,html.in-app .cnt{font-family:var(--g-font)!important}

/* ---------- navigation bar: maroon-tinted glass (white clock stays readable) ---------- */
html.in-app .main>.top{background:linear-gradient(180deg,rgba(40,13,16,.9),rgba(46,17,19,.72))!important;
  -webkit-backdrop-filter:blur(28px) saturate(190%);backdrop-filter:blur(28px) saturate(190%);
  box-shadow:inset 0 -.5px 0 rgba(255,255,255,.14),0 6px 24px -10px rgba(46,17,19,.45)!important;padding:var(--sat) 8px 0 8px!important}
@media (prefers-color-scheme:dark){html.in-app .main>.top{background:linear-gradient(180deg,rgba(24,12,13,.88),rgba(30,14,16,.66))!important}}
html.in-app .main>.top>.app-title{text-align:center!important;font:600 17px/var(--hdr) var(--g-font)!important;letter-spacing:-.02em;transition:opacity .2s,transform .2s}
/* large title on the page; the small one in the bar fades in once it scrolls under */
html.in-app:has(.page>.app-lt):not(.app-scrolled) .main>.top>.app-title{opacity:0;transform:translateY(4px)}
html.in-app .page>.app-lt{display:block;font:700 33px/1.12 var(--g-font);letter-spacing:-.025em;color:var(--g-ink);margin:2px 4px 12px;
  overflow-wrap:anywhere;transition:opacity .2s}
html.in-app.app-scrolled .page>.app-lt{opacity:.35}
html.in-app .page>.app-lt+h1.app-dup{display:none}
/* bar buttons: glass circles / one glass capsule on the right, like iOS 26 */
html.in-app .app-right{background:rgba(255,255,255,.12);border-radius:999px;padding:0 3px;height:42px!important;margin-right:2px;
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.28),inset 0 0 0 .5px rgba(255,255,255,.14)}
html.in-app .app-ib{width:40px!important;height:40px!important;border-radius:20px}
html.in-app .app-ib svg{width:21px!important;height:21px!important}
html.in-app .app-ib:active{background:rgba(255,255,255,.2)!important;transform:scale(.92);transition:transform .1s}
html.in-app .app-ib i{background:var(--g-tint)!important;box-shadow:0 0 0 1.5px rgba(46,17,19,.9)}
html.in-app .app-back{width:42px!important;height:42px!important;border-radius:21px!important;margin-left:2px;background:rgba(255,255,255,.12)!important;
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.28),inset 0 0 0 .5px rgba(255,255,255,.14);padding:0!important}
html.in-app .app-back:active{transform:scale(.92);background:rgba(255,255,255,.22)!important}
html.in-app .app-back svg{width:12px!important;height:20px!important;margin-left:-2px}
html.in-app .app-mark{margin-left:6px;border-radius:9px}
/* "Emails on hold / preview" strip under the bar */
html.in-app .testbar{background:rgba(255,232,170,.82)!important;color:#7a4f00!important;-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);
  box-shadow:inset 0 -.5px 0 rgba(122,79,0,.15);font-family:var(--g-font);font-weight:600;letter-spacing:0}
@media (prefers-color-scheme:dark){html.in-app .testbar{background:rgba(92,66,8,.72)!important;color:#ffd98a!important}}
html.in-app .app-load{background:linear-gradient(90deg,#ff9a6b,var(--g-tint));height:2.5px;border-radius:2px}

/* ---------- floating glass tab bar ---------- */
html.in-app .bnav{left:12px!important;right:12px!important;bottom:max(8px,calc(var(--sab) - 16px))!important;padding:5px!important;gap:0;
  border-radius:999px!important;border:0!important;background:var(--g-glass)!important;
  -webkit-backdrop-filter:blur(26px) saturate(200%)!important;backdrop-filter:blur(26px) saturate(200%)!important;
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),var(--g-glass-sh)!important}
html.in-app .bnav a{flex:1;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:54px;border-radius:999px;
  color:var(--g-ink)!important;opacity:.82;font:600 10.5px/1.1 var(--g-font)!important;transition:background .2s,color .2s,transform .12s}
html.in-app .bnav a.on{color:var(--g-tint)!important;opacity:1;background:var(--g-fill)}
html.in-app .bnav a:active{transform:scale(.94);opacity:1}
html.in-app .bnav .ni{margin:0!important}
html.in-app .bnav .ni svg{width:24px!important;height:24px!important}
html.in-app .page{padding:14px 16px calc(100px + var(--sab))!important}

/* ---------- headings + text ---------- */
html.in-app h1{font:700 26px/1.15 var(--g-font)!important;letter-spacing:-.025em!important;color:var(--g-ink)!important;text-transform:none!important}
html.in-app h2{font-family:var(--g-font)!important;letter-spacing:-.015em!important;text-transform:none!important}
html.in-app .sub,html.in-app .muted{color:var(--g-ink2)!important}
html.in-app .page a:not(.btn):not(.chip):not(.lc):not(.kpi){color:inherit}
html.in-app .red{color:var(--g-red)!important}html.in-app .green{color:var(--g-grn)!important}
html.in-app .grp{font:600 12.5px/1.2 var(--g-font)!important;letter-spacing:.02em!important;text-transform:uppercase;color:var(--g-ink2)!important;margin:20px 6px 6px!important}
html.in-app .grp i,html.in-app .cnt{background:var(--g-fill)!important;color:var(--g-ink2)!important;font-family:var(--g-font)!important}

/* ---------- cards = inset grouped glass ---------- */
html.in-app .page .card,html.in-app .facts,html.in-app .moneybar,html.in-app .sumstrip,html.in-app .stages,html.in-app .adv .vcard{
  background:var(--g-card)!important;border:0!important;border-radius:var(--g-r)!important;
  -webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),var(--g-card-sh)!important;color:var(--g-ink)}
html.in-app .page .card{padding:14px 16px!important;margin-bottom:14px}
html.in-app .page .card .card{background:var(--g-fill2)!important;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none!important;border-radius:16px!important}
html.in-app .card h3{font:600 17px/1.25 var(--g-font)!important;letter-spacing:-.02em!important;text-transform:none!important;color:var(--g-ink)!important;border-bottom:.5px solid var(--g-sep)!important}
html.in-app .card h3 span,html.in-app .card h3 a.lk{font-family:var(--g-font)!important;color:var(--g-ink2)!important}
html.in-app .card h3 a.lk{background:var(--g-fill)!important;border:0!important;border-radius:999px;padding:4px 11px}
html.in-app .row,html.in-app .tl,html.in-app .kv,html.in-app .props div,html.in-app .srow,html.in-app .adv .q{border-bottom:.5px solid var(--g-sep)!important}
html.in-app .row:last-child,html.in-app .tl:last-child,html.in-app .kv:last-child,html.in-app .props div:last-child{border-bottom:0!important}
html.in-app .row[data-href]:active,html.in-app .t tbody tr.app-row:active{background:var(--g-fill)!important}
html.in-app .facts div,html.in-app .moneybar a,html.in-app .sumstrip div{border-color:var(--g-sep)!important}
html.in-app .facts span,html.in-app .moneybar .l,html.in-app .sumstrip span{font-family:var(--g-font)!important;letter-spacing:0!important;text-transform:none!important;color:var(--g-ink2)!important;font-size:12.5px!important}
html.in-app .bigamt,html.in-app .moneybar .n,html.in-app .kpi .n{font-family:var(--g-font)!important;letter-spacing:-.03em!important}

/* Dashboard boxes */
html.in-app .kpi,html.in-app .main .kpis.dashk .kpi{border-radius:var(--g-r)!important;border:0!important;background:var(--g-card)!important;
  -webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),var(--g-card-sh)!important}
html.in-app .main .kpis.dashk .kpi .n{color:var(--g-ink)!important;font-size:24px!important;font-weight:700!important}
html.in-app .main .kpis.dashk .kpi .l,html.in-app .kpi .l{color:var(--g-ink2)!important;font-family:var(--g-font)!important;text-transform:none!important;letter-spacing:0!important}
html.in-app .main .kpis.dashk .kpi.kred{background:linear-gradient(135deg,rgba(226,58,36,.92),rgba(186,36,22,.88))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 12px 30px -12px rgba(192,50,30,.6)!important}
html.in-app .main .kpis.dashk .kpi.kred .n{color:#fff!important}html.in-app .main .kpis.dashk .kpi.kred .l{color:rgba(255,235,230,.92)!important}
html.in-app .main .kpis.dashk .kpi.korg{box-shadow:inset 0 0 0 1.5px var(--g-tint),var(--g-card-sh)!important}
html.in-app .main .kpis.dashk .kpi.korg .n{color:var(--g-tint-ink)!important}
html.in-app a.kpi:active{transform:scale(.97)}
html.in-app .page .card.dashurg{box-shadow:inset 0 0 0 1.5px rgba(229,56,42,.55),var(--g-card-sh)!important}
html.in-app .main .dashurg h3{color:var(--g-red)!important}
html.in-app .page .card.dashok{background:rgba(34,163,86,.12)!important;color:var(--g-grn)!important}

/* next step, warnings, bubbles */
html.in-app .nextbar{border:0!important;border-radius:var(--g-r)!important;background:linear-gradient(135deg,rgba(255,226,208,.82),rgba(255,246,238,.7))!important;
  -webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 1px rgba(240,82,34,.28),0 12px 30px -16px rgba(240,82,34,.45)!important;padding:14px 16px!important}
html.in-app .nextbar .nt:before{color:var(--g-tint-ink)!important;font-family:var(--g-font)!important}
html.in-app .redrow{background:rgba(229,56,42,.08)!important;border:0!important;box-shadow:inset 0 0 0 .5px rgba(229,56,42,.35);border-radius:16px!important}
html.in-app .statebar{border-radius:18px!important}
html.in-app .bubble{background:var(--g-fill)!important;border-radius:16px!important;color:var(--g-ink)}
html.in-app .flash{border:0!important;border-radius:999px!important;padding:11px 18px!important;top:calc(var(--top,0px) + 10px)!important;
  background:rgba(225,247,233,.86)!important;color:#14532d!important;-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),var(--g-glass-sh)!important;font-family:var(--g-font)}
html.in-app .flash.err{background:rgba(253,226,220,.9)!important;color:#7f1d1d!important}
html.in-app .hold{border-radius:18px!important}
html.in-app .draft{border-radius:18px!important;background:rgba(255,240,230,.6)!important}

/* ---------- buttons: capsules ---------- */
html.in-app .page .btn{border-radius:999px!important;min-height:44px;padding:0 18px;font:600 15.5px/1 var(--g-font)!important;letter-spacing:-.01em!important;text-transform:none!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 6px 16px -8px rgba(240,82,34,.6)!important;transition:transform .12s,opacity .15s}
html.in-app .page .btn:active{transform:scale(.97);opacity:.85}
html.in-app .page .btn.sm{min-height:36px;padding:0 14px;font-size:14px!important}
html.in-app .page .card .btn:not(.ghost):not(.green),html.in-app .page .btn.dark{background:#3a1519!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 4px 12px -8px rgba(46,17,19,.6)!important;color:#fff!important}
html.in-app .page .btn.green{background:var(--g-grn)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 6px 16px -8px rgba(34,163,86,.6)!important}
html.in-app .page .btn.ghost,html.in-app .ibtn{background:var(--g-glass)!important;color:var(--g-ink)!important;border:0!important;
  -webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px rgba(60,32,33,.14),0 2px 8px -4px rgba(46,17,19,.18)!important}
html.in-app .page .btn[disabled]{background:var(--g-fill)!important;color:var(--g-ink3)!important;box-shadow:none!important}
html.in-app details summary:not(.helpword){display:inline-flex;align-items:center;border:0!important;border-radius:999px!important;background:var(--g-fill)!important;color:var(--g-ink)!important;font-family:var(--g-font)!important;min-height:34px;padding:6px 14px!important}
html.in-app details.row>summary,html.in-app details.mp>summary,html.in-app details.help>summary{background:none!important;padding:2px 0!important;min-height:0}
html.in-app .dmore summary{background:none!important;color:var(--g-tint-ink)!important;padding:8px 0!important}

/* ---------- chips ---------- */
html.in-app .chip{border-radius:999px!important;padding:3px 9px!important;font:600 11.5px/1.3 var(--g-font)!important}
html.in-app .dtag,html.in-app .lc .src{background:var(--g-fill)!important;color:var(--g-ink2)!important;border-radius:999px!important;font-family:var(--g-font)!important}

/* ---------- segmented control (page tabs) ---------- */
html.in-app .page .tabs{background:var(--g-glass)!important;border-radius:999px!important;padding:3px!important;gap:2px!important;
  -webkit-backdrop-filter:blur(24px) saturate(190%);backdrop-filter:blur(24px) saturate(190%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),var(--g-glass-sh)!important;scrollbar-width:none}
html.in-app .page .tabs::-webkit-scrollbar{display:none}
html.in-app .page .tabs a{border-radius:999px!important;color:var(--g-ink2)!important;font:600 13.5px/1.2 var(--g-font)!important;padding:8px 14px!important;transition:background .2s,color .2s}
html.in-app .page .tabs a.on{background:var(--g-seg)!important;color:var(--g-ink)!important;box-shadow:0 2px 8px -2px rgba(46,17,19,.22),inset 0 .5px 0 var(--g-hi)!important}
/* stage tracker */
html.in-app .stages button{font-family:var(--g-font)!important;color:var(--g-ink2)!important}
html.in-app .stages button:before{background:var(--g-card2)!important;border-color:var(--g-sep)!important;color:var(--g-ink2)!important}
html.in-app .stages button:after{background:var(--g-sep)!important}
html.in-app .stages .done,html.in-app .stages .now{color:var(--g-ink)!important}
html.in-app .stages .done:before{background:var(--g-tint)!important;border-color:var(--g-tint)!important;color:#fff!important}html.in-app .stages .done:after{background:var(--g-tint)!important}
html.in-app .stages .now:before{border-color:var(--g-tint)!important;color:var(--g-tint)!important;box-shadow:0 0 0 4px rgba(240,82,34,.2)!important}
html.in-app .prog div,html.in-app form.prog button{border-radius:999px!important;background:var(--g-fill)!important}
html.in-app .prog .done,html.in-app form.prog .done{background:#5a2a2f!important}html.in-app .prog .now,html.in-app form.prog .now{background:var(--g-tint)!important}
html.in-app .bar{background:var(--g-fill)!important;border-radius:99px}

/* ---------- switches + ticks (iOS) ---------- */
html.in-app .switch{width:51px;height:31px}
html.in-app .switch input{background:var(--g-fill)!important;box-shadow:inset 0 0 0 .5px var(--g-sep)}
html.in-app .switch input:checked{background:#34c759!important}
html.in-app .switch i{top:2px;left:2px;width:27px;height:27px;box-shadow:0 3px 8px rgba(0,0,0,.15),0 1px 1px rgba(0,0,0,.16)!important;transition:left .22s cubic-bezier(.3,.7,.3,1.2)}
html.in-app .switch input:checked+i{left:22px}
html.in-app .tick{border-radius:50%!important;width:26px;height:26px;border:1.5px solid var(--g-ink3)!important;background:transparent!important}
html.in-app .tick.on{background:#34c759!important;border-color:#34c759!important}
html.in-app .chips-pick span:not(.muted){background:var(--g-fill)!important;border:0!important;border-radius:999px!important;color:var(--g-ink)!important;min-height:34px;display:inline-flex!important;align-items:center}
html.in-app .chips-pick input:checked+span{background:var(--g-ink)!important;color:var(--g-bg)!important}

/* ---------- form fields ---------- */
html.in-app .page input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]),html.in-app .page select,html.in-app .page textarea,
html.in-app .app-sheet-body input:not([type=checkbox]):not([type=radio]):not([type=file]),html.in-app .app-sheet-body select,html.in-app .app-sheet-body textarea{
  background:var(--g-input)!important;color:var(--g-ink)!important;border:0!important;border-radius:14px!important;box-shadow:inset 0 0 0 .5px var(--g-sep)}
html.in-app .page input:focus,html.in-app .page select:focus,html.in-app .page textarea:focus{outline:0!important;box-shadow:inset 0 0 0 1.5px var(--g-tint),0 0 0 4px rgba(240,82,34,.15)!important}
html.in-app label{color:var(--g-ink2)!important;font-family:var(--g-font)}
html.in-app .fsec{border-color:var(--g-sep)!important;color:var(--g-ink2)!important}
html.in-app input[type=checkbox],html.in-app input[type=radio]{accent-color:var(--g-tint)}

/* ---------- lists ---------- */
html.in-app .page .card:has(>table.t){padding:0!important}
html.in-app .t tbody tr{border-bottom:0!important;box-shadow:inset 16px -.5px 0 -16px var(--g-sep)}
html.in-app .t tbody tr:last-child{box-shadow:none}
html.in-app .t td,html.in-app .t th{background:transparent!important;color:inherit}
html.in-app .t tbody tr.app-row::after{border-color:var(--g-ink3)!important;width:7px;height:7px}
html.in-app .board .col h4{background:transparent!important;-webkit-backdrop-filter:none;backdrop-filter:none;position:static!important;margin:0 4px 8px!important;padding:6px 4px!important;
  font:600 12.5px/1.2 var(--g-font)!important;letter-spacing:.02em!important;text-transform:uppercase;color:var(--g-ink2)!important}
html.in-app .board .lc{background:var(--g-card)!important;border:0!important;border-radius:var(--g-r)!important;padding:13px 15px!important;
  -webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),var(--g-card-sh)!important}
html.in-app .board .lc[style*="border-left"]{box-shadow:inset 3px 0 0 var(--g-tint),inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),var(--g-card-sh)!important}
html.in-app .board .lc .n{font-size:16.5px;letter-spacing:-.02em}
html.in-app .ic{background:var(--g-fill)!important;color:var(--g-ink2)}
html.in-app .ic.pay{background:rgba(34,163,86,.15)!important;color:var(--g-grn)}html.in-app .ic.doc{background:rgba(10,110,230,.12)!important;color:#2f6fc0}
html.in-app .ic.call{background:rgba(240,82,34,.14)!important;color:var(--g-tint-ink)}html.in-app .ic.auto{background:rgba(255,170,0,.16)!important;color:#b07000}
html.in-app .settings .snav a{border-radius:999px;font-family:var(--g-font)}

/* ---------- sheets, menus, search: glass ---------- */
html.in-app .app-sheet-scrim{background:rgba(10,4,5,.32)!important}
html.in-app details[open]>.app-sheet-body{left:6px!important;right:6px!important;bottom:calc(var(--kb,0px) + 6px)!important;border-radius:32px!important;
  background:var(--g-sheet)!important;color:var(--g-ink);-webkit-backdrop-filter:blur(40px) saturate(190%);backdrop-filter:blur(40px) saturate(190%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),0 -4px 50px rgba(0,0,0,.25)!important;
  padding:6px 18px calc(16px + max(0px,calc(var(--sab) - 6px)))!important;animation:sheetUp .24s cubic-bezier(.2,.8,.2,1)!important}
html.in-app .app-sheet-grab{background:var(--g-ink3)!important;width:36px}
html.in-app .app-sheet-head{border-bottom:.5px solid var(--g-sep)!important}
html.in-app .app-sheet-head b{font-family:var(--g-font)!important;color:var(--g-ink)!important}
html.in-app .app-sheet-head button{color:var(--g-tint-ink)!important;font-family:var(--g-font)!important}
html.in-app .app-menu,html.in-app .more .menu,html.in-app .help .menu{background:var(--g-card2)!important;border:0!important;border-radius:22px!important;padding:6px!important;
  -webkit-backdrop-filter:blur(36px) saturate(190%);backdrop-filter:blur(36px) saturate(190%);
  box-shadow:inset 0 1px 0 var(--g-hi),inset 0 0 0 .5px var(--g-glass-brd),0 18px 50px -10px rgba(0,0,0,.35)!important;animation:appPop .2s cubic-bezier(.2,.9,.3,1.1)}
html.in-app .app-menu a,html.in-app .more .menu a,html.in-app .more .menu button,html.in-app .help .menu a{color:var(--g-ink)!important;border-radius:14px!important;border-bottom:0!important;font-family:var(--g-font)!important;min-height:44px;display:flex!important;align-items:center}
html.in-app .app-menu a:active,html.in-app .more .menu a:active,html.in-app .more .menu button:active{background:var(--g-fill)!important}
html.in-app .qs{background:var(--g-bg)!important}
html.in-app .qs-box{background:var(--g-card2)!important;-webkit-backdrop-filter:blur(40px) saturate(190%);backdrop-filter:blur(40px) saturate(190%);color:var(--g-ink)}
html.in-app .qs-in{border-bottom:.5px solid var(--g-sep)!important;color:var(--g-ink2)!important}
html.in-app .qs-in input{background:transparent!important;color:var(--g-ink)!important;box-shadow:none!important}
html.in-app .qs-i{color:var(--g-ink)!important;border-bottom:.5px solid var(--g-sep)!important}
html.in-app .qs-i.sel,html.in-app .qs-i:active{background:var(--g-fill)!important}
html.in-app .qs-i .qs-n{color:var(--g-ink)!important}html.in-app .qs-x{color:var(--g-tint-ink)!important}
html.in-app .app-ptr{background:var(--g-card2)!important;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}

/* a blur (backdrop-filter) or transform on a box makes it the frame for position:fixed children: an open sheet inside a glass
   card would be trapped under the dim layer. Boxes that hold an open sheet drop their blur while it is open. */
html.in-app :has(details[open]>.app-sheet-body){-webkit-backdrop-filter:none!important;backdrop-filter:none!important;transform:none!important;animation:none!important}

/* ---------- smooth page changes ---------- */
@media (prefers-reduced-motion:no-preference){
  html.in-app .main>.page{animation:glassIn .26s cubic-bezier(.2,.8,.2,1)}
}
@keyframes glassIn{from{opacity:.4}to{opacity:1}}

/* ================= dark mode: colours the light theme hard-codes ================= */
@media (prefers-color-scheme:dark){
  html.in-app .page,html.in-app .app-sheet-body,html.in-app .qs-box{color:var(--g-ink)}
  html.in-app .page b,html.in-app .page strong,html.in-app .lc .n,html.in-app .nextbar .nt,html.in-app .props b,html.in-app .kv,html.in-app .qs-i b{color:var(--g-ink)}
  html.in-app .nextbar{background:linear-gradient(135deg,rgba(120,40,20,.6),rgba(60,26,22,.55))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 0 1px rgba(255,106,61,.35)!important}
  html.in-app .nextbar .nd{color:var(--g-ink2)!important}
  html.in-app .redrow{background:rgba(255,90,76,.12)!important}
  html.in-app .c-red{background:rgba(255,69,58,.2)!important;color:#ff9087!important}
  html.in-app .c-org{background:rgba(255,130,60,.2)!important;color:#ffab7a!important}
  html.in-app .c-grn{background:rgba(48,209,88,.18)!important;color:#6fe39a!important}
  html.in-app .c-blu{background:rgba(64,156,255,.2)!important;color:#8cc4ff!important}
  html.in-app .c-gry{background:rgba(255,255,255,.1)!important;color:#dccdca!important}
  html.in-app .c-wa{background:rgba(48,209,88,.18)!important;color:#6fe39a!important}
  html.in-app .c-dark{background:rgba(255,255,255,.16)!important;color:#fff!important}
  html.in-app .statebar{background:rgba(255,130,60,.18)!important;color:#ffbf96!important}
  html.in-app .statebar.g{background:rgba(48,209,88,.16)!important;color:#7fe7a5!important}
  html.in-app .statebar.r{background:rgba(255,69,58,.18)!important;color:#ff9a91!important}
  html.in-app .statebar.n{background:var(--g-fill)!important;color:var(--g-ink2)!important}
  html.in-app .flash{background:rgba(24,70,44,.82)!important;color:#c9f5d8!important}
  html.in-app .flash.err{background:rgba(90,24,20,.85)!important;color:#ffd3cc!important}
  html.in-app .page .card.dashok{background:rgba(48,209,88,.14)!important;color:#7fe7a5!important}
  html.in-app .hold{background:#8f2416!important}
  html.in-app .draft{background:rgba(255,106,61,.1)!important}
  html.in-app .org{color:#ff9d6b!important}
  html.in-app .dot{color:var(--g-ink2)}html.in-app .dot.r{color:#ff8a80}
  html.in-app .page .card .btn:not(.ghost):not(.green),html.in-app .page .btn.dark{background:rgba(255,255,255,.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 .5px rgba(255,255,255,.12)!important}
  html.in-app .page .btn.ghost,html.in-app .ibtn{box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 .5px rgba(255,255,255,.14)!important}
  html.in-app .tabs a.on,html.in-app .crumb{color:var(--g-ink)!important}
  html.in-app .prog .done,html.in-app form.prog .done{background:#7a3a40!important}
  html.in-app .main .kpis.dashk .kpi.kred{background:linear-gradient(135deg,rgba(200,48,30,.85),rgba(140,26,16,.85))!important}
  html.in-app .lc .m,html.in-app .props span,html.in-app .kv>span:first-child{color:var(--g-ink2)!important}
  html.in-app .card .card,html.in-app .mp form{background:var(--g-fill2)!important}
  html.in-app .adv .urg{background:rgba(255,69,58,.18)!important;color:#ffb3ab!important}
  html.in-app mark{background:rgba(255,130,60,.35);color:inherit}
  html.in-app hr{border-color:var(--g-sep)}
  /* inline colours written into a few pages */
  html.in-app .page [style*="background:#fff"],html.in-app .page [style*="background: #fff"],html.in-app .page [style*="background:white"]{background:var(--g-fill2)!important}
  html.in-app .page [style*="background:#f"]:not([style*="background:#f0522"]):not([style*="background:#f05"]){background:var(--g-fill)!important}
  html.in-app .page [style*="background:#e"],html.in-app .page [style*="background:#d"]{background:var(--g-fill)!important}
  html.in-app .page [style*="color:#2"],html.in-app .page [style*="color:#3"],html.in-app .page [style*="color:#4"],html.in-app .page [style*="color:#5"],html.in-app .page [style*="color:#6"]{color:var(--g-ink)!important}
  html.in-app .page [style*="border:1px solid #"],html.in-app .page [style*="border-top:1px solid #"],html.in-app .page [style*="border-bottom:1px solid #"]{border-color:var(--g-sep)!important}
}
/* logo "me" menu (native.js openMe) */
html.in-app .app-menu.app-me{left:8px!important;right:auto!important}
html.in-app .app-me .app-me-hd{border-bottom:.5px solid var(--g-sep)!important;border-radius:16px!important;min-height:58px}
html.in-app .app-me-nm small,html.in-app .app-me-lab{color:var(--g-ink2)!important;font-family:var(--g-font)!important}
html.in-app .app-me .app-me-out{color:#d6402c!important}