/* TagVomo garage: mobile app shell (tab bar, More sheet), safe-area insets, touch targets, dark mode.
   Loaded after the shared bundle; only touches .owner-* / .gm-* selectors. */
:root{--gm-bar-h:62px}
.gm-tabbar,.gm-overlay,.gm-sheet{display:none}

/* ---------- dark mode for the owner workspace (variables drive most surfaces) ---------- */
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]) .owner-body{--g-bg:#0a1420;--g-card:#111c2b;--g-text:#e8f0ec;--g-muted:#9fb3ab;--g-line:#2b3d4f;--g-primary:#2a78a8;--gm-active:#8fd0f7;--g-green:#5fd08a;--g-danger:#ff8a80;--g-shadow:0 18px 48px rgba(0,0,0,.4);color-scheme:dark}
  :root:not([data-theme=light]) .owner-body :is(input,select,textarea){background:#0d1826;color:var(--g-text);border-color:var(--g-line)}
  :root:not([data-theme=light]) .owner-body :is(.owner-login-form,.owner-login-form .portal-login-card,.owner-card,.stat-card,.doc-row,.thread-card,.alert-row,.activity-row,.qr-card){background:var(--g-card);color:var(--g-text);border-color:var(--g-line)}
  :root:not([data-theme=light]) .owner-body :is(.owner-main .portal-top-bar h1,.owner-card .card-header h3,h2,h3,h4,label,strong,b){color:var(--g-text)}
  :root:not([data-theme=light]) .owner-body :is(.btn.outline,.btn:not(.primary):not(.lime)){background:#16273a;color:var(--g-text);border-color:var(--g-line)}
  :root:not([data-theme=light]) .owner-body .owner-card .card-header{border-color:var(--g-line)}
  /* surfaces that were still white with light text in dark mode */
  :root:not([data-theme=light]) .owner-body :is(.qr-tile,.tab-btn){background:var(--g-card);color:var(--g-text);border-color:var(--g-line)}
  :root:not([data-theme=light]) .owner-body .g-mode-btn.active{background:#24405c;color:#fff;border-color:#3d6a91}
  :root:not([data-theme=light]) .owner-body .tab-btn.active{background:#1d3248;color:#fff}
  :root:not([data-theme=light]) .owner-body .qr-tile-icon{background:#1a2b3e;color:var(--g-text)}
  :root:not([data-theme=light]) .owner-body :is(.qr-tile .muted,.qr-tile small){color:var(--g-muted)}
  :root:not([data-theme=light]) .owner-body .card-link{color:var(--gm-active)}
  :root:not([data-theme=light]) .owner-body .gm-badge{background:#c62828;color:#fff}
}

/* ---------- mobile app experience ---------- */
@media (max-width:900px){
  .owner-body{padding-bottom:calc(var(--gm-bar-h) + env(safe-area-inset-bottom));-webkit-tap-highlight-color:transparent;overscroll-behavior-y:contain}
  .owner-body.gm-lock{overflow:hidden}
  /* top bar: title + notif badge; hamburger and drawer replaced by tab bar */
  .mobile-top-bar{padding:calc(10px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left))}
  .mobile-hamburger,.owner-sidebar,.portal-overlay{display:none!important}
  .mt-brand{font-size:16px;font-weight:800;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .owner-main{padding:16px max(16px,env(safe-area-inset-right)) 28px max(16px,env(safe-area-inset-left));max-width:100%}
  .owner-main .portal-top-bar{padding-bottom:12px;margin-bottom:16px}
  .owner-main .portal-top-bar h1{font-size:26px!important}
  .owner-main .portal-top-bar-right{gap:8px}
  .gm-ptr{position:fixed;left:50%;top:calc(58px + env(safe-area-inset-top));z-index:80;translate:-50% -60px;padding:8px 14px;border-radius:999px;background:var(--g-navy,#061b31);color:#fff;font:700 12px Inter,system-ui,sans-serif;opacity:0;pointer-events:none;transition:opacity .15s}
  .gm-ptr.show{opacity:1;translate:-50% 0}
  #owner-flash{position:sticky;top:60px;z-index:20}

  /* touch targets and iOS zoom prevention */
  .owner-body :is(.btn,button.btn,.tab-btn){min-height:44px}
  .owner-body :is(input:not([type=checkbox]):not([type=radio]),select,textarea){min-height:46px;font-size:16px}
  .owner-body .toggle-row{min-height:52px;gap:14px}
  .owner-body input[type=checkbox].toggle{width:22px;height:22px}
  .owner-body :is(pre,code,.mono,.field input){overflow-wrap:anywhere;word-break:break-word}
  .owner-body :is(img,video,canvas,svg){max-width:100%}
  .owner-body .form-actions{display:flex;flex-direction:column;gap:10px}
  .owner-body .form-actions .btn{width:100%}
  .owner-body .owner-card{border-radius:16px}
  .owner-body .card-header{flex-wrap:wrap}
  .owner-body table{display:block;max-width:100%;overflow-x:auto}

  /* tab bar */
  .gm-tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--g-card,#fff);border-top:1px solid var(--g-line,#d8e2dc);padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);box-shadow:0 -6px 24px rgba(6,27,49,.10)}
  .gm-tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:var(--gm-bar-h);padding:6px 2px;border:0;background:none;color:var(--g-muted,#667870);font:700 11px/1.1 Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer;transition:color .15s}
  .gm-tab svg{transition:transform .15s}
  .gm-tab.active{color:var(--gm-active,var(--g-primary,#0a3654))}
  .gm-tab.active svg{transform:translateY(-1px)}
  .gm-tab.active::before{content:"";position:absolute;top:0;left:22%;right:22%;height:3px;border-radius:0 0 3px 3px;background:var(--g-lime,#b9ff3d);box-shadow:0 0 0 1px var(--g-navy,#061b31)}
  .gm-tab:active{background:rgba(6,27,49,.06)}
  .gm-tab:focus-visible{outline:3px solid #2b8cff;outline-offset:-3px;border-radius:10px}
  .gm-label{font:700 11px/1.1 Inter,system-ui,sans-serif}
  .gm-badge{position:absolute;top:6px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--g-danger,#c5362d);color:#fff;font:800 11px/18px Inter,system-ui,sans-serif;text-align:center}
  .gm-badge[hidden]{display:none}

  /* More sheet */
  .gm-overlay{display:block;position:fixed;inset:0;z-index:95;background:rgba(6,20,34,.55);opacity:0;transition:opacity .2s}
  .gm-overlay[hidden],.gm-sheet[hidden]{display:none}
  .gm-overlay.open{opacity:1}
  .gm-sheet{display:block;position:fixed;left:0;right:0;bottom:0;z-index:100;max-height:88vh;max-height:88dvh;overflow-y:auto;overscroll-behavior:contain;background:var(--g-bg,#f3f6f4);color:var(--g-text,#0a241e);border-radius:22px 22px 0 0;padding:8px max(16px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));transform:translateY(100%);transition:transform .22s ease;box-shadow:0 -18px 48px rgba(6,27,49,.3)}
  .gm-sheet.open{transform:none}
  .gm-grab{width:44px;height:5px;border-radius:3px;background:var(--g-line,#d8e2dc);margin:4px auto 12px}
  .gm-sheet-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
  .gm-sheet-head>div{min-width:0;flex:1}
  .gm-sheet-head b{display:block;font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .gm-sheet-head small{display:block;color:var(--g-muted,#667870);font:600 12px ui-monospace,Menlo,monospace}
  .gm-pill{font:800 11px/1 Inter,system-ui,sans-serif;padding:6px 10px;border-radius:999px}
  .gm-pill.ok{background:#e1f4e6;color:#1f7a45}.gm-pill.bad{background:#fdeceb;color:#b3261e}
  .gm-close{width:44px;height:44px;border:0;border-radius:12px;background:var(--g-card,#fff);color:inherit;font-size:26px;line-height:1;cursor:pointer;border:1px solid var(--g-line,#d8e2dc)}
  .gm-switch{display:block;margin-bottom:12px}
  .gm-switch span{display:block;font-size:12px;font-weight:700;color:var(--g-muted,#667870);margin-bottom:4px}
  .gm-switch select{width:100%;border:1px solid var(--g-line,#d8e2dc);border-radius:12px;padding:0 12px;background:var(--g-card,#fff);color:inherit}
  .gm-group{margin:0 0 14px}
  .gm-group h3{margin:0 0 8px;font:800 11px/1 ui-monospace,Menlo,monospace;letter-spacing:1.4px;text-transform:uppercase;color:var(--g-muted,#667870)}
  .gm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .gm-item{display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 12px;border:1px solid var(--g-line,#d8e2dc);border-radius:14px;background:var(--g-card,#fff);color:inherit;text-decoration:none;font:700 13.5px/1.2 Inter,system-ui,sans-serif;text-align:left;cursor:pointer}
  .gm-item:active{background:rgba(6,27,49,.06)}
  .gm-item:focus-visible,.gm-btn:focus-visible,.gm-close:focus-visible{outline:3px solid #2b8cff;outline-offset:2px}
  .gm-item[aria-current=page]{border-color:var(--gm-active,var(--g-primary,#0a3654));box-shadow:0 0 0 2px rgba(10,54,84,.15)}
  .gm-ico{flex:none;width:28px;height:28px;border-radius:9px;background:var(--g-bg,#f3f6f4);display:grid;place-items:center;font-size:15px}
  .gm-txt{min-width:0;overflow-wrap:anywhere}
  .gm-foot{display:grid;gap:8px;margin-top:6px}
  .gm-btn{min-height:48px;border-radius:14px;border:1px solid var(--g-line,#d8e2dc);background:var(--g-card,#fff);color:inherit;font:800 14px Inter,system-ui,sans-serif;cursor:pointer}
  .gm-btn.danger{color:var(--g-danger,#c5362d);border-color:currentColor}

  /* login screen on phones */
  .owner-login-story{min-height:0!important;padding:24px 20px!important}
  .owner-login-hero h1{font-size:34px!important;letter-spacing:-1.2px!important}
  .owner-login-form{padding:20px 14px calc(20px + env(safe-area-inset-bottom))!important}
}
@media (max-width:339px){.gm-grid{grid-template-columns:1fr}.gm-tab{font-size:10.5px}}
@media (min-width:901px){.gm-tabbar,.gm-overlay,.gm-sheet{display:none!important}}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]) .gm-tabbar{box-shadow:0 -6px 24px rgba(0,0,0,.5)}
  :root:not([data-theme=light]) .gm-pill.ok{background:#12301f;color:#7fe0a3}
  :root:not([data-theme=light]) .gm-pill.bad{background:#3a1512;color:#ff9a90}
  :root:not([data-theme=light]) .gm-tab:active,:root:not([data-theme=light]) .gm-item:active{background:rgba(255,255,255,.08)}
}
@media (prefers-reduced-motion:reduce){.gm-sheet,.gm-overlay,.gm-tab,.gm-tab svg{transition:none!important}}

/* two-tap confirmation state */
.is-armed { outline: 2px solid #b45309; outline-offset: 2px; color: #b45309 !important; font-weight: 700; }

/* conversation bubbles in Alerts & Inbox */
.thread-messages .msg { margin: 6px 0; padding: 8px 12px; border-radius: 12px; max-width: 90%; }
.thread-messages .msg p { margin: 2px 0 0; }
.thread-messages .msg-finder { background: rgba(127, 127, 127, .14); }
.thread-messages .msg-owner { background: rgba(185, 255, 61, .18); margin-left: auto; }

.owner-login-hero .portal-kicker,.portal-kicker{font-size:12px}
.brand b>span,.owner-brand b>span{font-size:inherit}
.owner-login-form .eyebrow{font-size:12px}
/* Owner sign-in polish */
.owner-login-story .brand-wordmark{display:inline-flex;align-self:flex-start;background:#fff;border-radius:14px;padding:8px 14px;box-shadow:0 10px 30px -12px rgba(0,0,0,.5)}
.owner-login-story .brand-wordmark img{display:block;width:clamp(120px,12vw,150px);height:auto}
.owner-login-hero h1,.owner-login-form h2{font-family:"Plus Jakarta Sans",inherit;letter-spacing:-.025em}
.owner-login-form input{min-height:48px}
.login-new{margin-top:18px;padding:14px;border-radius:14px;background:rgba(200,255,61,.16);border:1px solid rgba(15,110,61,.25);display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-size:14px}
.login-new b{flex-basis:100%}
.login-new a{font-weight:700}
.login-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px;font-size:14px}
.login-foot a{font-weight:600}

/* ===================== Design system v2 — owner garage (Oct 2026) =====================
   Same tokens as the public site and partner portals: ink, road green, paper; sentence-case labels. */
.owner-body{--g-green:#17803d;--g-navy:#0f1e2e;--g-bg:#f4f6f2;--g-line:#dce2da;--g-muted:#55655f;--g-radius:18px;font-feature-settings:"tnum" 1}
.mt-brand small{font-size:13px;font-weight:600;opacity:.75;margin-left:6px}
.mt-brand::before{content:none!important}

/* Labels: sentence case, readable */
.owner-body .field>span,.owner-body .eyebrow,.owner-body .portal-kicker,.owner-body .stat-label,.owner-body .profile-row span{text-transform:none!important;letter-spacing:0!important;font-family:inherit!important}
.owner-body .field>span{font-size:13.5px;font-weight:650;color:var(--g-text);margin-bottom:6px}
.owner-body .eyebrow,.owner-body .portal-kicker{font-size:14px!important;font-weight:650!important;color:var(--g-green)!important}

/* Sign-in: light page, the form first on phones, brand story beside it on desktop */
.owner-login-story{background:var(--g-bg)!important;color:var(--g-text)!important}
.owner-login-story::before,.owner-login-story::after{display:none!important}
.owner-login-story .brand img{background:none!important;padding:0!important;box-shadow:none!important}
.owner-login-story h1{color:var(--g-text)!important;font-size:clamp(30px,4vw,48px)!important;line-height:1.08!important;letter-spacing:-.02em}
.owner-login-story p{color:var(--g-muted)!important}
.owner-trust span{background:var(--g-card,#fff)!important;color:var(--g-text)!important;border:1px solid var(--g-line)!important;font-weight:600!important}
@media (max-width:900px){
  .owner-login{display:flex!important;flex-direction:column}
  .owner-login-story{padding:20px 16px 8px!important}
  .owner-login-story .owner-login-hero h1{font-size:28px!important;margin:10px 0 6px}
  .owner-login-story .owner-login-hero p{font-size:15px;margin:0}
  .owner-trust{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
  .owner-login-form{padding:8px 16px 32px!important;background:var(--g-bg)!important}
  .owner-login-form .portal-login-card{border-radius:var(--g-radius);box-shadow:0 1px 2px rgba(9,29,53,.05)!important}
  .owner-login-form a{display:inline-block;padding:10px 0}
}

/* Overview: the tag's real printed design, then the label, then a 2×2 summary */
.overview-hero{background:var(--g-card)!important;color:var(--g-text)!important;border:1px solid var(--g-line);box-shadow:none!important}
.overview-hero :is(h1,h2,h3,b,strong){color:var(--g-text)!important}
.overview-hero :is(p,small,.muted,#ov-sub){color:var(--g-muted)!important}
.overview-qr-badge{background:var(--g-bg)!important;height:auto!important;padding:10px;border-radius:14px}
.overview-qr-badge .ov-card-img{display:block;width:100%;height:auto;max-height:200px;object-fit:contain;border-radius:10px}
.overview-hero .btn{min-height:44px}
.overview-hero .btn:not(.primary){background:var(--g-card)!important;color:var(--g-text)!important;border:1.5px solid var(--g-line)!important}
.overview-stats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
@media (min-width:900px){.overview-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
.overview-stats .stat-card{display:block;padding:14px 16px!important;border:1px solid var(--g-line);border-radius:16px;background:var(--g-card);color:var(--g-text);text-decoration:none;min-height:0!important}
.overview-stats .stat-card::before,.overview-stats .stat-card::after{display:none!important}
.overview-stats .stat-label{font-size:13px;font-weight:600;color:var(--g-muted);margin:0 0 6px}
.overview-stats .stat-value{font-size:24px;font-weight:800;line-height:1;color:var(--g-text)}

/* Cards and headings */
.owner-card{border-radius:var(--g-radius)!important}
.owner-card .card-header h3{font-size:16.5px;font-weight:750}
.owner-body input[type=checkbox]{width:22px;height:22px;accent-color:var(--g-green)}
.owner-body .btn{min-height:44px;border-radius:12px}
.owner-body .btn.sm{min-height:36px}
.owner-body a.view-all,.owner-body .card-header a{display:inline-flex;align-items:center;min-height:40px}
.owner-card .card-desc{margin:0 0 16px!important}
/* Inbox thread header: avatar circle beside the name and reason */
.thread-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.thread-avatar{flex:0 0 40px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--g-bg);color:var(--g-text);font-weight:800;border:1px solid var(--g-line)}
.thread-meta{flex:1 1 auto;min-width:0}
.thread-head .pill{margin-left:auto}
/* Unread count in the phone top bar: a proper badge */
.mt-right .nav-count{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 7px;border-radius:999px;background:#c2362b;color:#fff;font-size:12.5px;font-weight:800}
.mt-right .nav-count[hidden]{display:none}
/* Any label inside the owner workspace: sentence case (older rules uppercase bare labels) */
.owner-body label,.owner-body label>span:first-child{text-transform:none!important;letter-spacing:0!important}
.owner-body .reply-box label,.owner-body form label{font-size:14px;font-weight:650;color:var(--g-text)}
/* Pills in sentence case; renewal hero without the floating badge, heading at card size */
.owner-body .pill{text-transform:none!important;letter-spacing:0!important}
.renewal-hero .renewal-badge{display:none!important}
.renewal-hero-inner{display:block!important;padding-left:0!important}
.renewal-hero h2{font-size:clamp(22px,5.5vw,28px)!important;line-height:1.15!important;letter-spacing:-.01em!important;margin:0 0 10px!important}
/* Sidebar wordmark on one line: "Tag" white, "Vomo" brand green (the old rule stacked "VOMO" as a caption) */
.ps-brand b{display:inline!important;white-space:nowrap}
.ps-brand b span{display:inline!important;font-size:inherit!important;letter-spacing:inherit!important;text-transform:none!important;color:#7fcf6b!important;font-weight:inherit!important}
/* Pull-to-refresh hint exists only in the phone app shell */
@media (min-width:901px){.gm-ptr{display:none!important}}
.gm-ptr:not(.show){visibility:hidden}
/* Emergency alerts: scene photos and map link */
.alert-photos{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.alert-photo{display:block;width:96px;height:72px;border-radius:10px;overflow:hidden;border:1px solid var(--g-line);background:var(--g-bg)}
.alert-photo img{width:100%;height:100%;object-fit:cover;display:block}
.alert-photo.gone{width:auto;height:auto;padding:6px 10px;font-size:12.5px;color:var(--g-muted)}
.alert-map{display:inline-block;margin-top:6px;font-weight:650;color:var(--g-green)}

/* ---------- owner sign-in: mobile number / tag ID + owner key ---------- */
.g-mode{display:flex;gap:4px;padding:4px;margin:4px 0 16px;border:1px solid var(--g-line,#dce2da);border-radius:12px;background:rgba(127,140,150,.08)}
.g-mode-btn{flex:1 1 0;min-width:0;min-height:44px;border:0;border-radius:9px;background:transparent;color:var(--g-muted,#5b6b66);font:700 14px/1.2 inherit;cursor:pointer}
.g-mode-btn.active{background:var(--g-card,#fff);color:var(--g-text,#0f1e2e);border:1px solid transparent;box-shadow:0 1px 4px rgba(6,27,49,.14)}
.g-mode-btn:focus-visible{outline:2px solid var(--g-primary,#17803d);outline-offset:2px}
:is(#g-phone-box,#g-email-box) .btn{margin-top:10px}
:is(#g-phone-otp-wrap,#g-email-otp-wrap){margin-top:14px}
:is(#g-phone-otp,#g-email-otp){letter-spacing:.4em;font-size:20px;text-align:center}
.g-mode-btn[hidden]{display:none}