@import url("/phosphor-hardware.css");
@layer familyLegacy {
@font-face{font-family:"RR UI";src:url("/fonts/DMSans-400.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"RR UI";src:url("/fonts/DMSans-600.ttf") format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:"RR Mono";src:url("/fonts/JetBrainsMono-400.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"RR Mono";src:url("/fonts/JetBrainsMono-700.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:"RR Condensed";src:url("/fonts/BigShouldersDisplay-700.ttf") format("truetype");font-weight:700;font-display:swap}

:root{color-scheme:dark light;background:#040705}
*{box-sizing:border-box}
html,body{min-width:0;min-height:100%;margin:0}
body{background:#040705}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed}

.family-app{
  --r-sm:4px;--r-md:7px;--r-lg:11px;
  --mono:"RR Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ui:"RR UI",system-ui,-apple-system,"Segoe UI",sans-serif;
  --cond:"RR Condensed","Arial Narrow",sans-serif;
  --glow:none;--wordmark-spacing:.01em;
  min-height:100dvh;background:var(--bg);color:var(--text-hi);font-family:var(--ui);font-size:14px;
  line-height:1.45;-webkit-font-smoothing:antialiased;transition:background .18s ease,color .18s ease
}
.family-app[data-skin="amber"][data-mode="dark"]{
  --bg:#07080a;--panel:#141719;--panel-2:#0d0f12;--sunk:#1b1f23;--rule:#23282d;
  --border:rgba(255,255,255,.09);--border-hi:rgba(255,255,255,.16);
  --text-hi:#f2f4f6;--text-mid:#9aa4ad;--text-lo:#6b757e;
  --brand:#f0871f;--brand-soft:rgba(240,135,31,.14);--on-brand:#07080a;
  --live:#35d07f;--danger:#f2564d;--pending:#8b96a0;--story:#07080a;--story-text:#f2f4f6
}
.family-app[data-skin="amber"][data-mode="light"]{
  --bg:#efe6d4;--panel:#fbf6ec;--panel-2:#f5eee0;--sunk:#e7dcc6;--rule:#d9cbb0;
  --border:rgba(40,30,18,.14);--border-hi:rgba(40,30,18,.26);
  --text-hi:#1e1710;--text-mid:#5c5140;--text-lo:#867a66;
  --brand:#b8620c;--brand-soft:rgba(184,98,12,.12);--on-brand:#fbf6ec;
  --live:#137a4c;--danger:#a92e28;--pending:#7f8a93;--story:#11110f;--story-text:#fbf6ec
}
.family-app[data-skin="phosphor"][data-mode="dark"]{
  --rule:#16281c;



  --danger:#ff5f57;--pending:#6f8f80;--story:#020403;--story-text:#d8ffe9;
  }
.family-app[data-skin="phosphor"][data-mode="light"]{
  --rule:#cbd7c5;



  --danger:#a92e28;--pending:#7d9186;--story:#07100b;--story-text:#e3ffed;
  }
.family-app *:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.wordmark{font-family:var(--cond);font-size:20px;font-weight:700;letter-spacing:var(--wordmark-spacing);white-space:nowrap}
.family-app[data-skin="phosphor"] .wordmark{font-family:var(--mono);font-size:15px}
.env-badge{display:inline-flex;min-height:28px;align-items:center;border:1px solid var(--brand);padding:3px 8px;color:var(--brand);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.brand-lockup{display:flex;align-items:center;gap:11px;min-width:0}


.field-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.field-link,.text-action{border:0;background:transparent;padding:0;color:var(--brand);font-size:12px;font-weight:600;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--brand) 45%,transparent);text-underline-offset:3px}
.primary-action,.secondary-action{display:flex;width:100%;min-height:48px;align-items:center;justify-content:center;border-radius:var(--r-sm);padding:10px 16px;font-size:14px;font-weight:600;text-decoration:none}
.primary-action{border:1px solid var(--brand);background:var(--brand);color:var(--on-brand)}
.provider-action{gap:11px;border-color:var(--border-hi);background:var(--sunk);color:var(--text-hi);box-shadow:none}
.provider-mark{width:18px;height:18px;flex:none}
.primary-action:hover{filter:brightness(1.06)}
.secondary-action{border:1px solid var(--border-hi);background:transparent;color:var(--text-hi)}
.secondary-action:hover{border-color:var(--brand);background:var(--brand-soft)}
.primary-action:disabled{border-color:var(--border);background:var(--sunk);color:var(--text-lo);box-shadow:none;opacity:.7}
.code-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.code-grid .auth-input{padding-inline:0;text-align:center;font-family:var(--mono);font-weight:700}
.status-panel{border:1px solid var(--border);background:var(--panel-2);padding:18px}
.status-line{display:flex;align-items:center;gap:10px;color:var(--text-hi);font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.status-dot{width:9px;height:9px;border-radius:50%;background:var(--pending)}
.status-dot.live{background:var(--live);box-shadow:var(--glow)}
.status-panel p{margin:12px 0 0;color:var(--text-mid);font-size:13px;line-height:1.65}
.auth-actions{display:grid;gap:9px;margin-top:18px}
.auth-progress{display:flex;gap:5px;margin-top:22px}
.auth-progress span{height:3px;flex:1;background:var(--rule)}
.auth-progress span.on{background:var(--brand);box-shadow:var(--glow)}

@media (max-width:860px){
  .field-link,.auth-help button,.auth-back{display:inline-flex;min-height:44px;align-items:center}
}
@media (max-width:420px){
  .env-badge{min-height:27px;padding-inline:7px;font-size:9px}
  .code-grid{gap:5px}
}
@media (max-width:340px){
}
@media (max-width:420px){
  .mobile-app-nav a{font-size:10px;letter-spacing:.03em}
}
@media (prefers-reduced-motion:reduce){
  .family-app{transition:none}
}

/* Shared authenticated application shell */
.application-shell{position:relative;display:flex;min-height:100dvh;flex-direction:column;background:var(--bg)}
.application-header{position:sticky;top:0;z-index:30;display:flex;min-height:76px;align-items:center;gap:14px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--panel) 96%,transparent);padding:10px 20px}
.application-brand{display:flex;min-height:44px;align-items:center;color:var(--text-hi);text-decoration:none}
/* Breadcrumb links use console tokens — never the default browser blue —
   with hover, focus, and visited treatments that hold contrast in every
   theme. */
.application-global-nav{display:flex;align-self:stretch;align-items:center;margin-left:8px;border-left:1px solid var(--border)}
.application-global-nav a{display:flex;min-height:44px;align-items:center;border-right:1px solid var(--border);padding:8px 12px;color:var(--text-lo);font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.09em;text-decoration:none;text-transform:uppercase}
.application-global-nav a:hover{background:var(--brand-soft);color:var(--text-hi)}
.application-global-nav a.is-active{color:var(--brand);box-shadow:inset 0 -2px var(--brand)}
.location-switcher{display:flex;min-width:0;height:44px;align-items:center;border:1px solid var(--border-hi);border-radius:var(--r-sm);background:var(--sunk);color:var(--text-hi)}
.location-switcher select{width:clamp(132px,14vw,174px);height:42px;min-width:0;border:0;background:transparent;padding:0 28px 0 10px;color:inherit;font-family:var(--mono);font-size:16px;font-weight:700;letter-spacing:.03em;outline:0}
.location-switcher:focus-within{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft)}
.profile-trigger{display:grid;width:48px;height:48px;place-items:center;border:1px solid var(--border-hi);border-radius:var(--r-sm);background:var(--sunk);color:var(--text-mid);font-family:var(--mono);font-size:12px;font-weight:700}
.profile-trigger:hover,.profile-trigger[aria-expanded="true"]{border-color:var(--brand);color:var(--brand)}
.header-menu{position:absolute;top:64px;right:20px;z-index:40;width:210px;border:1px solid var(--border-hi);background:var(--panel);box-shadow:0 22px 50px -28px rgba(0,0,0,.85);padding:8px}
.header-menu[hidden]{display:none}
.header-menu a{display:flex;min-height:44px;align-items:center;padding:8px 11px;color:var(--text-mid);font-size:13px;text-decoration:none}
.header-menu a:hover{background:var(--brand-soft);color:var(--brand)}

/* Fleet family */
.page-eyebrow{margin:0;color:var(--brand);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.page-intro{max-width:650px;margin:13px 0 0;color:var(--text-mid);font-size:15px;line-height:1.65}
.mobile-app-nav{display:none}

/* Shared modal treatment */

@media (max-width:960px){
  .application-global-nav{display:none}
}
@media (max-width:720px){
  .application-header{min-height:64px;gap:8px;padding:8px 10px}
  .location-switcher select{width:clamp(108px,34vw,142px);padding-left:8px;font-size:9px}
  .profile-trigger{width:44px;height:44px}
  .header-menu{top:58px;right:14px}
  .page-intro{font-size:14px}
}
@media (max-width:340px){
  .location-switcher select{width:104px;font-size:8px}
  .mobile-app-nav a{font-size:11px;letter-spacing:-.025em}
}

/* Approved Investigation family extension. Kept in the shared shell so every
   family uses the same tokens; family-specific rules below preserve DOM hooks. */
.family-app[data-skin="phosphor"][data-mode="light"] {

  --rule:#dce4d7;



}
.family-app[data-skin="phosphor"][data-mode="dark"] {

  --rule:#344238;



}
.family-app {font-size:15px}
.family-app .application-header{min-height:60px;padding:6px 24px;background:var(--bg);gap:16px}
.family-app .application-global-nav{border:0;margin:0;gap:4px}
.family-app .application-global-nav a{border:0;border-radius:6px;font:600 14px var(--ui);letter-spacing:0;text-transform:none;color:var(--text-mid)}
.family-app .application-global-nav a.is-active{background:var(--brand-soft);box-shadow:none}
.family-app .profile-trigger{width:40px;height:40px;min-height:40px;border-radius:50%;font:600 13px var(--ui)}
.family-app .location-switcher{background:transparent;border-color:var(--border)}
.family-app .location-switcher select{font:400 16px var(--ui);letter-spacing:0}
.family-app .fleet-main,.family-app .store-main,.family-app .evidence-main,.family-app .operations-main,.family-app .settings-main{width:min(1240px,100%);padding:30px 28px 70px}
.family-app .fleet-heading h1,.family-app .store-heading h1,.family-app .evidence-heading h1,.family-app .operations-heading h1,.family-app .settings-heading h1{font:600 30px/1.2 var(--ui);letter-spacing:-.8px;text-transform:none;margin:0}
.family-app .page-eyebrow,.family-app .auth-eyebrow{font:400 13px/1.5 var(--ui);letter-spacing:0;text-transform:none;color:var(--text-mid)}
.family-app .page-intro{margin-top:8px;font-size:14px;max-width:720px}
.family-app .preview-mode button,.family-app .camera-groups button{font:400 13px var(--ui);text-transform:none;letter-spacing:0}
.family-app .evidence-tabs,.family-app .operations-tabs{border:0;border-bottom:1px solid var(--border);background:transparent;margin-top:22px}
.family-app .evidence-tabs a,.family-app .operations-tabs a{border-left:0;font:600 14px var(--ui);text-transform:none;letter-spacing:0;min-width:0;padding-inline:20px}
.family-app .evidence-view-heading h2,.family-app .evidence-view-heading .page-eyebrow{display:none}
.family-app .evidence-view-heading p{margin:0;font-size:14px}
.family-app .evidence-saved{font:400 12px var(--ui);letter-spacing:0;text-transform:none}
.family-app .evidence-results{grid-template-columns:1fr;gap:0}
.family-app .evidence-card,.family-app .evidence-card.transaction{min-height:0;border:0;border-bottom:1px solid var(--border);background:transparent;display:grid;grid-template-columns:104px minmax(0,1fr);padding:14px 0;gap:16px}
.family-app .evidence-card-media{aspect-ratio:1.3;border-radius:5px;align-self:start}
.family-app .evidence-card-placeholder{font:400 11px var(--ui);letter-spacing:0;text-transform:none;background:var(--panel-2)}
.family-app .evidence-card-copy{padding:0;min-height:0}
.family-app .evidence-card-copy strong{font-size:15px}
.family-app .evidence-card-meta{font:400 13px var(--ui)}
.family-app .evidence-card-context{border:0;padding-top:8px;font:400 12px var(--ui);letter-spacing:0;text-transform:none}
.family-app .evidence-control>span{font:400 12px var(--ui);letter-spacing:0;text-transform:none}
.family-app .settings-section-nav a,.family-app .settings-label,.family-app .settings-button{font:400 14px var(--ui);letter-spacing:0;text-transform:none}
.family-app .auth-story{background:var(--bg);color:var(--text-hi)}
.family-app .auth-story::after,.family-app .auth-story-index,.family-app .auth-kicker::before{display:none}
.family-app .auth-story h1{font-size:44px}
.family-app .auth-story-main>p{color:var(--text-mid)}
.family-app .auth-card{border:0;box-shadow:none;background:transparent}
.family-app .auth-label{font:400 14px var(--ui);text-transform:none;letter-spacing:0}
.family-app .auth-card h2{font-size:28px}
.family-app .auth-kicker,.family-app .auth-divider,.family-app .auth-back{font:400 13px var(--ui);letter-spacing:0;text-transform:none}
.family-app .mobile-app-nav a{font:600 12px var(--ui);letter-spacing:0;text-transform:none}
@media(max-width:760px){
 .family-app .application-header{padding:6px 14px;gap:10px}
 .family-app .fleet-main,.family-app .store-main,.family-app .evidence-main,.family-app .operations-main,.family-app .settings-main{padding:22px 16px calc(84px + env(safe-area-inset-bottom))}
 .family-app .fleet-heading h1,.family-app .store-heading h1,.family-app .evidence-heading h1,.family-app .operations-heading h1,.family-app .settings-heading h1{font-size:26px}
 .family-app .evidence-tabs{top:60px;margin-inline:0}
 .family-app .evidence-controls{display:grid;grid-template-columns:1fr 1fr;overflow:visible}
 .family-app .evidence-control,.family-app .evidence-control:first-child{width:auto}
 .family-app .evidence-control:first-child{grid-column:1/-1}
 .family-app .evidence-card,.family-app .evidence-card.transaction{grid-template-columns:78px minmax(0,1fr);gap:12px}
 .family-app .evidence-card-kind{position:static;background:var(--panel-2);color:var(--text-mid);font-size:10px}
}
.family-app .evidence-card.transaction{grid-template-columns:1fr}
.family-app .transaction-lines{font-size:13px}
.family-app .transaction-tender{font:400 12px var(--ui);text-transform:none}.store-connected-status{position:absolute;inset:30px 12px;display:grid;place-items:center;text-align:center;color:#bdcbbf;font:400 13px var(--ui)}.store-connected-label{position:absolute;bottom:8px;left:8px;background:#18221bdd;color:#edf4ee;padding:3px 6px;font:400 11px var(--ui)}
#connectedReceipts{display:none}.family-app[data-connected-evidence="true"][data-evidence-view="transactions"] #connectedReceipts{display:block}.family-app[data-connected-evidence="true"][data-evidence-view="transactions"] :is(#evidenceControls,.evidence-summary,#evidenceResults,#evidenceEmpty,#evidenceLoading,#evidenceError,.evidence-saved){display:none}
.connected-receipt-controls{display:grid;grid-template-columns:1fr 1fr 2fr;gap:12px;margin-top:20px}.connected-receipt-controls label{display:grid;gap:6px;font-size:13px;color:var(--text-mid)}.connected-receipt-controls :is(input,select){min-height:44px;width:100%;background:var(--panel);color:var(--text-hi);border:1px solid var(--border-hi);border-radius:6px;padding:8px;font:400 16px var(--ui)}.connected-receipt-context{font-size:13px;color:var(--text-mid)}.connected-receipt-row{display:grid;grid-template-columns:1fr auto auto;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--border);color:var(--text-hi);text-decoration:none}.connected-receipt-row span span{display:block;font-size:13px;color:var(--text-mid);margin-top:5px}.connected-receipt-row>span:last-child{color:var(--brand);font-size:13px}.connected-receipt-actions{display:flex;gap:12px;margin-top:18px}@media(max-width:760px){.connected-receipt-controls{grid-template-columns:1fr 1fr}.connected-receipt-controls label:last-child{grid-column:1/-1}.connected-receipt-row{grid-template-columns:1fr auto;gap:12px}.connected-receipt-row>span:last-child{grid-column:1/-1}.connected-receipt-row strong{overflow-wrap:anywhere}}

/* Match the desktop-navigation cutoff: landscape phones must not fall into
   a width where both desktop and mobile navigation are hidden. */
@media (max-width:960px){
  .mobile-app-nav{position:fixed;inset:auto 0 0;z-index:35;display:grid;min-height:60px;grid-template-columns:repeat(var(--app-nav-count,3),minmax(0,1fr));border-top:1px solid var(--border);background:var(--panel);padding-bottom:env(safe-area-inset-bottom)}
  .mobile-app-nav a{display:flex;min-height:60px;align-items:center;justify-content:center;color:var(--text-mid);font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.035em;text-decoration:none;text-transform:uppercase}
  .mobile-app-nav a.is-active{color:var(--brand);box-shadow:inset 0 2px var(--brand)}
  .header-menu{max-height:calc(100dvh - 80px);overflow-y:auto}
}

/* Find owns mobile text entry; keep input text at the native readable size. */
@media(max-width:999px){
  .evidence-control input,.connected-receipt-controls input{font-size:16px;scroll-margin-top:calc(env(safe-area-inset-top) + 12px)}
}

/* Keep the authorized store selector in the existing mobile header row. */
@media(max-width:760px){.family-app .application-header .location-switcher{flex:1 1 auto;min-width:0;max-width:none}.family-app .application-header .location-switcher select{width:100%;min-width:0;max-width:none;text-overflow:ellipsis}}

/* Opaque installed-app status area stays above scrolling account/store content. */
.family-app:has(.account-shell,.stores-shell)::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:100;pointer-events:none}
.stores-shell{padding-top:calc(16px + env(safe-area-inset-top,0px))}

/* Shared hardware rules follow family layout rules. */

}
