/* Shared receipt presentation. Keep data, seeking and player geometry in their owners. */
:root, .rr, .family-app {
  --receipt-primary: #f2f7f3;
  --receipt-secondary: #b8c8bd;
  --receipt-surface: #111a15;
  --receipt-active: #203c2d;
  --receipt-marker: #74d8a5;
  --receipt-list-size: 1rem;
  --receipt-detail-size: 1.0625rem;
  --receipt-meta-size: .875rem;
  --receipt-leading: 1.4;
}
[data-mode="light"], html[data-theme="light"] {
  --receipt-primary: #17251d;
  --receipt-secondary: #465b4e;
  --receipt-surface: #f7faf4;
  --receipt-active: #dfede2;
  --receipt-marker: #19754b;
}
/* Video remains a dark, bounded surface even in the light application theme. */
#hud.reals #receipt,
.hudhost.phone.phone-landscape #hud #receipt,
.txn-card {
  --receipt-primary: #f2f7f3;
  --receipt-secondary: #b8c8bd;
  --receipt-surface: rgba(5, 13, 9, .92);
  --receipt-active: #203c2d;
  --receipt-marker: #74d8a5;
  background: var(--receipt-surface) !important;
  color: var(--receipt-primary);
  text-shadow: none;
}
#hud #receipt, #hud .rcard, #hud .live-receipt-card, [data-receipt-panel] {
  color: var(--receipt-primary);
  background: var(--receipt-surface);
}
#hud #investigationPanel #receipt { background: var(--receipt-surface); }
#hud .rcard, #hud .live-receipt-card { padding: 12px; }
#hud .rcard .rc-h, #hud .live-receipt-card .rc-h {
  background: var(--receipt-surface);
  color: var(--receipt-primary);
  font: 600 var(--receipt-list-size)/var(--receipt-leading) var(--ui);
  gap: 12px;
  flex-wrap: wrap;
}
#hud .rcard .rc-s, #hud .live-receipt-card .rc-s,
#hud .receipt-line-time, #hud .receipt-list-status, #hud .receipt-playback-marker,
#hud .live-receipt-status, #hud #receipt .line-time {
  color: var(--receipt-secondary);
  font: 400 var(--receipt-meta-size)/var(--receipt-leading) var(--ui);
}
#hud .rcard .rc-l, #hud .live-receipt-card .rc-l {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
  min-height: 40px;
  padding: 8px 0;
  color: var(--receipt-primary);
  font: 500 var(--receipt-list-size)/var(--receipt-leading) var(--ui);
}
#hud .rcard .rc-l { grid-template-columns: 10px minmax(0, 1fr) auto; gap: 3px 8px; }
#hud .rcard .receipt-line-pointer { grid-column: 1; grid-row: 1; align-self: center; }
#hud .rcard .receipt-line-name { grid-column: 2; grid-row: 1; }
#hud .rcard .rc-l > span:last-child { grid-column: 3; grid-row: 1; }
#hud .receipt-line-name { white-space: normal; overflow-wrap: anywhere; }
#hud .receipt-line-time { grid-column: 2 / -1; grid-row: 2; }
#hud .rc-l > span:last-child, #hud .rline > span:last-child,
#hud .rc-t > span:last-child, #hud #rcAmt {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-family: var(--mono);
  color: var(--receipt-primary);
}
#hud .rcard .rc-t, #hud .live-receipt-card .rc-t, #hud #receipt .rtotal {
  font: 700 1.125rem/var(--receipt-leading) var(--ui);
  color: var(--receipt-primary);
  gap: 12px;
  padding-top: 10px;
}
#hud #receipt h4 { min-height: 44px; height: auto; color: var(--receipt-primary); }
#hud #rcTitle { font: 600 var(--receipt-list-size)/var(--receipt-leading) var(--ui); }
#hud #rcAmt { font-size: 1.125rem; font-weight: 700; }
/* The historical fixed-height rows clipped wrapped text and text enlargement. */
#hud #receipt .rline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
  height: auto !important;
  min-height: 44px !important;
  padding: 9px 8px !important;
  color: var(--receipt-primary);
  font: 500 var(--receipt-detail-size)/var(--receipt-leading) var(--ui);
}
#hud #receipt .line-copy { display: flex; flex-direction: column; align-items: start; min-width: 0; gap: 3px; }
#hud #receipt .rline .line-name {
  white-space: normal;
  overflow-wrap: anywhere;
  overflow: visible;
  font: inherit;
}
#hud #receipt .rline:disabled { opacity: 1; }
#hud #receipt .rline.void { color: var(--receipt-secondary); }
#hud #receipt .rline.on, #hud .rcard .at-playback-line {
  color: var(--receipt-primary);
  background: var(--receipt-active);
  border-left: 3px solid var(--receipt-marker);
}
#hud #receipt .live-receipt-status { background: var(--receipt-surface); }
#hud .live-receipt-open { font-size: var(--receipt-meta-size); color: var(--receipt-marker); }
/* Find results share the receipt hierarchy without changing filtering or paging. */
.family-app .connected-receipt-row {
  color: var(--receipt-primary);
  font: 500 var(--receipt-list-size)/var(--receipt-leading) var(--ui);
  grid-template-columns: minmax(0, 1fr) auto auto;
}
.family-app .connected-receipt-row strong { font-weight: 600; }
.family-app .connected-receipt-row > span:nth-child(2) { font-variant-numeric: tabular-nums; text-align: right; max-width: 12rem; }
.family-app .connected-receipt-row span span,
.family-app .connected-receipt-row > span:last-child,
.family-app .connected-receipt-context,
.family-app .connected-receipt-controls label {
  color: var(--receipt-secondary);
  font-size: var(--receipt-meta-size);
  line-height: var(--receipt-leading);
}
@media (max-width: 760px) {
  .family-app .connected-receipt-row { grid-template-columns: minmax(0, 1fr) auto; }
}
/* React playback surfaces use the same tokens as the shipped Investigation HUD. */
[data-receipt-panel] { font: 500 var(--receipt-detail-size)/var(--receipt-leading) var(--ui, "Barlow", sans-serif); }
[data-receipt-panel] .receipt-detail-line { color: var(--receipt-primary); font: 500 var(--receipt-detail-size)/var(--receipt-leading) var(--ui, "Barlow", sans-serif); opacity: 1; min-height: 44px; padding: 9px 8px; align-items: start; }
[data-receipt-panel] .receipt-detail-line[data-active="true"] { background: var(--receipt-active); border-left: 3px solid var(--receipt-marker); }
[data-receipt-panel] .receipt-detail-line > span:last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
[data-receipt-panel] .truncate { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
[data-receipt-panel] .text-muted-foreground { color: var(--receipt-secondary); font-size: var(--receipt-meta-size); line-height: var(--receipt-leading); }
[data-receipt-panel] .receipt-detail-line-total { font-weight: 700; font-size: 1.125rem; }
.txn-card .line { color: var(--receipt-primary); font: 500 var(--receipt-detail-size)/var(--receipt-leading) var(--ui, "Barlow", sans-serif); opacity: 1; padding: 8px; align-items: start; }
.txn-card .line:hover, .txn-card.expanded .line { opacity: 1; }
.txn-card .line-desc { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
.txn-card .line.current { color: var(--receipt-primary); background: var(--receipt-active); border-left: 3px solid var(--receipt-marker); }
.txn-card .line .amt { color: var(--receipt-primary); font-variant-numeric: tabular-nums; }
.txn-card .receipt-meta, .txn-card .expand, .txn-card .line-desc small { font-size: var(--receipt-meta-size); line-height: var(--receipt-leading); color: var(--receipt-secondary); opacity: 1; }
.txn-card .total { color: var(--receipt-primary); font-size: 1.125rem; }
.txn-card .receipt-lines-scroll { overflow-y: auto; }

.txn-card .line-desc small { display: block; margin-top: 3px; }

[data-receipt-panel] .scrollbar-container { font-size: var(--receipt-detail-size); }
#hud #receipt .receipt-jump-hint, #hud #receipt .receipt-filter { color: var(--receipt-secondary); font-size: var(--receipt-meta-size); }
/* Receipt cards in Find's mixed Recent view use the same readable hierarchy. */
.family-app .evidence-card:has(.evidence-card-kind.receipt) .evidence-card-copy strong {
  color: var(--receipt-primary);
  font-size: var(--receipt-list-size);
  line-height: var(--receipt-leading);
}
.family-app .evidence-card:has(.evidence-card-kind.receipt) :is(.evidence-card-meta, .evidence-card-context, .transaction-tender) {
  color: var(--receipt-secondary);
  font-size: var(--receipt-meta-size);
  line-height: var(--receipt-leading);
}
.family-app .evidence-card.transaction .transaction-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  color: var(--receipt-primary);
  font: 500 var(--receipt-list-size)/var(--receipt-leading) var(--ui);
}
.family-app .transaction-line > span:first-child { white-space: normal; overflow-wrap: anywhere; }
.family-app .transaction-line > span:last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Keep NVR timing for seeking; mobile only hides its visual metadata row. */
.hudhost.phone #hud .receipt-line-time,
.hudhost.phone #hud #receipt .line-time { display: none; }
.receipt-list-edge { width: 100%; min-height: 44px; flex: none; border: 1px solid var(--border); border-radius: 6px; background: transparent; color: var(--receipt-secondary); font: 500 .875rem var(--ui); padding: 10px; cursor: pointer; }
.receipt-list-edge:disabled { opacity: .6; cursor: wait; }

/* Match the playback capsule; equal side columns keep the total on center. */
#hud #receipt h4 {
  display: grid !important;
  grid-template-columns: minmax(88px, 1fr) minmax(0, auto) minmax(88px, 1fr);
  grid-template-rows: 44px auto;
  gap: 4px 6px !important;
  flex: none;
  padding: 4px 0 8px !important;
}
#hud #receipt h4 > .receipt-actions { display: none !important; }
#hud #receipt .receipt-nav, #hud #receipt .receipt-tools {
  display: flex; align-items: center; gap: 0; grid-row: 1;
}
#hud #receipt .receipt-nav { grid-column: 1; justify-self: start; border-radius: 14px; overflow: hidden; }
#hud #receipt .receipt-tools { grid-column: 3; justify-self: end; gap: 4px; }
#hud #receipt h4 .receipt-head-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; min-width: 44px; height: 44px; min-height: 44px;
  padding: 0 !important; margin: 0;
  border: 1px solid var(--border); border-radius: 12px;
  background: var(--receipt-active); color: var(--receipt-marker);
  touch-action: manipulation;
}
#hud #receipt .receipt-nav .receipt-head-btn { border-radius: 0; }
#hud #receipt .receipt-nav .receipt-head-btn + .receipt-head-btn { border-left: 0; }
#hud #receipt .receipt-head-btn .ricon { width: 24px !important; height: 24px !important; }
#hud #receipt .receipt-head-btn:hover { border-color: var(--receipt-marker); }
#hud #receipt .receipt-head-btn:focus-visible { outline: 2px solid var(--receipt-marker); outline-offset: 2px; }
#hud #receipt .receipt-head-btn:disabled { opacity: .4; }
#hud #rcAmt {
  grid-column: 2; grid-row: 1; margin: 0 !important; min-width: 0;
  text-align: center; overflow: hidden; text-overflow: ellipsis;
  font: 700 18px/1.2 var(--mono) !important;
}
#hud #rcTitle { grid-column: 1 / 3; grid-row: 2; font-size: 13px; color: var(--receipt-secondary); }
#hud #receipt #receiptLiveFollow {
  grid-column: 3; grid-row: 2; justify-self: end;
  width: auto; height: auto; min-height: 24px; padding: 0 4px !important;
  border: 0; border-radius: 4px; background: none; font-size: 12px;
}
#hud #receipt #receiptLiveFollow[hidden], #hud #receipt .receipt-head-btn[hidden] { display: none !important; }
#hud .rcard { touch-action: pan-y; }
/* The landscape card crosses the panel handle's band; its controls stay above it. */
.hudhost.phone.phone-landscape #hud #investigationPanel[data-receipt="true"] #receipt { z-index: 21; }
/* Landscape Reels shares the side-card footprint; a tall dock must not push it offscreen. */
.hudhost.phone.phone-landscape #hud.reals #receipt {
  inset: auto 12px 60px auto !important;
  width: clamp(280px, 34vw, 340px) !important;
  height: min(234px, calc(100dvh - 124px)) !important;
}
.hudhost.phone.phone-landscape #hud.reals #receipt[data-reals-position="top"] { top: 62px !important; bottom: auto !important; }
.hudhost #hud.reals #receipt #rcLines { flex: 1 1 auto !important; height: auto !important; min-height: 44px !important; max-height: none !important; }
.hudhost.phone.phone-landscape #hud.reals #dock { width: calc(100% - clamp(280px, 34vw, 340px) - 24px); align-self: flex-start; }

/* Reels flex layout must not override the receipt dismissal state. */
#hud.reals #receipt.hidden { display: none !important; }

/* Five ordinary mobile detail rows: keep typography and 44px controls, recover
   the second header band instead. Short viewports still scroll without clipping. */
.hudhost.phone #hud #receipt h4 {
  grid-template-rows: 20px 24px;
  height: 44px; min-height: 44px;
  gap: 0 6px !important;
  padding: 0 !important;
}
.hudhost.phone #hud #receipt .receipt-nav,
.hudhost.phone #hud #receipt .receipt-tools { grid-row: 1 / 3; }
.hudhost.phone #hud #receipt #rcTitle {
  grid-column: 2; grid-row: 1; align-self: center;
  max-width: 100%; text-align: center; font-size: 13px;
}
.hudhost.phone #hud #receipt #rcAmt { grid-row: 2; align-self: center; }
.hudhost.phone #hud #receipt #receiptLiveFollow {
  grid-column: 2; grid-row: 1; justify-self: center; align-self: center;
  min-height: 24px; max-width: 100%; padding: 0 !important;
  white-space: nowrap; font-size: 12px;
}
.hudhost.phone #hud #receipt h4:has(#receiptLiveFollow:not([hidden])) #rcTitle { visibility: hidden; }
.hudhost.phone:not(.phone-landscape) #hud:not(.reals) #receipt {
  height: 272px; min-height: 0; max-height: none; flex: 0 1 272px;
  padding-top: 4px; padding-bottom: 4px; gap: 0;
}
.hudhost.phone:not(.phone-landscape) #hud:not(.reals) #receipt #rcLines {
  flex: 1 1 220px !important; min-height: 0 !important;
}
/* A moved Reels card must stay above the timeline handle's stacking context. */
#hud.reals #receipt { z-index: 60; }

/* Independent mobile sheets. Export and Reels deliberately retain their own layouts. */
.hudhost.phone #hud[data-layered-sheets="true"] { --sheet-footer:calc(54px + env(safe-area-inset-bottom)); --sheet-top: min(34%, 240px); }
.hudhost.phone #hud[data-layered-sheets="true"] .stage { display:block!important; position:relative!important; flex:1; min-height:0; height:100%; }
.hudhost.phone #hud[data-layered-sheets="true"] .canvas-area { position:absolute!important; inset:0!important; width:100%!important; height:100%!important; margin:0!important; }
.hudhost.phone #hud[data-layered-sheets="true"]:not(.mode-quad):not(.mode-nine) #grid,
.hudhost.phone #hud[data-layered-sheets="true"].matrix-focus #grid { height:100%!important; max-height:none!important; }
.hudhost.phone #hud[data-layered-sheets="true"] #investigationPanel { position:absolute!important; inset:0!important; height:100%!important; max-height:none!important; display:block!important; pointer-events:none!important; background:transparent!important; border:0!important; border-radius:0!important; backdrop-filter:none!important; }
#hud[data-layered-sheets="true"] #cameraControlSheet,
#hud[data-layered-sheets="true"] #mobileEvidenceSheet { position:absolute; left:0; right:0; bottom:var(--sheet-footer); display:flex; flex-direction:column; pointer-events:auto; min-height:0; border:1px solid color-mix(in srgb,var(--brand) 24%,var(--border)); border-bottom:0; border-radius:20px 20px 0 0; background:color-mix(in srgb,var(--panel) 97%,transparent); overflow:visible; }
#hud[data-layered-sheets="true"] #cameraControlSheet { z-index:40; max-height:calc(100% - var(--sheet-footer) - 30px); box-shadow:0 -9px 26px #0006; }
#hud[data-layered-sheets="true"] #mobileEvidenceSheet { z-index:20; top:var(--sheet-top); box-shadow:0 -4px 16px #0004; overflow:hidden; }
#hud[data-layered-sheets="true"] #mobileEvidenceSheet[hidden],#hud[data-layered-sheets="true"] #cameraControlSheet[hidden],#hud[data-layered-sheets="true"] #mobileCameraSelector[hidden] { display:none!important; }
#hud[data-layered-sheets="true"] #evidenceSheetHandle { display:flex; align-items:center; justify-content:center; gap:12px; flex:none; min-height:44px; width:100%; background:transparent; border:0; color:var(--text-mid); font:13px var(--ui); }
#hud[data-layered-sheets="true"] .sheet-grip { width:26px; height:3px; border-radius:9px; background:var(--text-lo); }
#hud[data-layered-sheets="true"] #mobileCameraSelector { min-height:0; overflow:hidden; display:flex; flex-direction:column; padding:10px 10px 0; }
#hud[data-layered-sheets="true"] #mobileCameraQuery { width:100%; flex:none; min-height:44px; font:16px var(--ui); padding:8px 12px; border:1px solid var(--border); border-radius:10px; color:var(--text-hi); background:transparent; }
#hud[data-layered-sheets="true"] #mobileCameraList { display:grid; grid-template-rows:repeat(2,max-content); grid-auto-flow:column; grid-auto-columns:calc((100% - 16px)/3); gap:8px; padding:8px 0; max-height:29dvh; overflow:auto; overscroll-behavior:contain; touch-action:pan-x pan-y; }
#hud[data-layered-sheets="true"] #mobileCameraList .rail-card { display:flex; flex-direction:column; padding:0; min-width:0; border:1px solid var(--border); border-radius:8px; overflow:hidden; background:var(--panel); color:var(--text-hi); }
#hud[data-layered-sheets="true"] #mobileCameraList .rail-card.sel { border-color:var(--brand); }
#hud[data-layered-sheets="true"] #mobileCameraList .thumb { width:100%; height:auto!important; aspect-ratio:16/9; position:relative; overflow:hidden; }
#hud[data-layered-sheets="true"] #mobileCameraList .meta { min-height:28px; padding:4px; display:flex; align-items:center; font:12px var(--ui); }
#hud[data-layered-sheets="true"] #mobileCameraList .camera-state { display:none; }
#hud[data-layered-sheets="true"] #selectCameras { align-self:center; display:flex; gap:9px; align-items:center; justify-content:center; flex:none; min-height:44px; padding:0 16px; margin:5px 0 0; border-radius:24px; border:1px solid color-mix(in srgb,var(--brand) 45%,var(--border)); background:color-mix(in srgb,var(--brand) 10%,var(--panel)); color:var(--brand); font:500 14px var(--ui); }
#hud[data-layered-sheets="true"] #selectCameras[aria-expanded="true"] { background:color-mix(in srgb,var(--brand) 20%,var(--panel)); }
#hud[data-layered-sheets="true"] #selectCameras .ricon { width:20px; height:20px; }
#hud[data-layered-sheets="true"] .camera-chevron { width:7px; height:7px; border-left:1.5px solid currentColor; border-top:1.5px solid currentColor; transform:rotate(45deg); margin-left:6px; }
#hud[data-layered-sheets="true"] [aria-expanded="true"] .camera-chevron { transform:rotate(225deg); }
.hudhost.phone #hud[data-layered-sheets="true"] #panelHandle { position:static!important; display:flex!important; width:100%; height:22px; min-height:22px; background:transparent; order:initial; }
.hudhost.phone #hud[data-layered-sheets="true"] #dock { position:relative!important; inset:auto!important; width:100%!important; background:transparent!important; flex:none!important; order:initial!important; }
.hudhost.phone #hud[data-layered-sheets="true"] #mobileEvidenceSheet #rail { display:flex!important; position:relative!important; inset:auto!important; height:auto!important; max-height:none!important; flex:1 1 auto!important; min-height:0!important; width:100%!important; border:0!important; background:transparent!important; }
.hudhost.phone #hud[data-layered-sheets="true"] #mobileEvidenceSheet #rail .rail-content { display:flex!important; min-height:0; }
.hudhost.phone #hud[data-layered-sheets="true"] #mobileEvidenceSheet #railBody { display:grid!important; overflow:auto!important; min-height:0; touch-action:pan-y; padding-bottom:calc(var(--foreground-height,0px) + 16px); scroll-padding-bottom:var(--foreground-height,0px); }
.hudhost.phone #hud[data-layered-sheets="true"] #investigationPanel[data-timeline-presentation="hidden"] #railBody { padding-bottom:48px; }
.hudhost.phone #hud[data-layered-sheets="true"] #investigationPanel[data-receipt="true"] #rail { display:none!important; }
.hudhost.phone #hud[data-layered-sheets="true"] #receipt:not(.hidden) { display:flex!important; position:relative!important; inset:auto!important; flex:1 1 auto!important; width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; border:0!important; border-radius:0!important; margin:0!important; padding:4px 12px 12px!important; background:transparent!important; }
.hudhost.phone #hud[data-layered-sheets="true"] #receipt #rcLines { flex:1 1 auto!important; min-height:0!important; height:auto!important; max-height:none!important; padding-bottom:calc(var(--foreground-height,0px) + 16px); scroll-padding-bottom:var(--foreground-height,0px); }
.hudhost.phone #hud[data-layered-sheets="true"] #investigationPanel[data-timeline-presentation="hidden"] #rcLines { padding-bottom:44px; }
.hudhost.phone #hud[data-layered-sheets="true"] #receipt.hidden { display:none!important; }
.hudhost.phone #hud[data-layered-sheets="true"] .rail-tabs { position:absolute!important; inset:auto 0 0!important; height:var(--sheet-footer)!important; display:flex!important; background:var(--panel)!important; z-index:60; pointer-events:auto; padding:0 8px env(safe-area-inset-bottom); }
.hudhost.phone #hud[data-layered-sheets="true"] .rail-tabs [data-tab="cameras"],.hudhost.phone #hud[data-layered-sheets="true"] #railChev { display:none!important; }
#hud[data-layered-sheets="true"] #restoreTimeline { position:absolute; z-index:45; bottom:calc(var(--sheet-footer) + 4px); left:50%; transform:translateX(-50%); min-height:36px; padding:0 18px; border:1px solid var(--border); border-radius:20px; background:var(--panel); color:var(--brand); font:13px var(--ui); pointer-events:auto; }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] { --sheet-footer:env(safe-area-inset-bottom,0px); --sheet-top:58px; }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] .stage { position:absolute!important; inset:0!important; }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] .rail-tabs { display:none!important; }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] #mobileEvidenceSheet { left:auto; right:max(8px,env(safe-area-inset-right)); width:clamp(280px,38vw,420px); bottom:max(8px,env(safe-area-inset-bottom)); border-radius:16px; border-bottom:1px solid var(--border); }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] #cameraControlSheet { left:env(safe-area-inset-left); right:env(safe-area-inset-right); max-height:calc(100% - 64px); }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] #mobileCameraList { grid-template-rows:repeat(1,max-content); grid-auto-columns:120px; max-height:110px; }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] #mobileCameraQuery { display:none; }
.hudhost.phone #hud[data-layered-sheets="true"] #dock .cursor-header { display:block!important; }
.hudhost.phone #hud[data-layered-sheets="true"] #dock .ribbon-shell { display:block!important; }
.hudhost.phone #hud[data-layered-sheets="true"] #dock #tlScale { display:block!important; }
@media(prefers-reduced-motion:reduce){#hud[data-layered-sheets="true"] * { scroll-behavior:auto!important; transition:none!important; }}
/* Keep portrait video anchored above the sheets rather than vertically centering it behind them. */
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"] #grid { position:absolute!important; top:0!important; left:0!important; margin:0!important; }
/* Matrix dimensions come from sizeMatrixGrid, including the gaps between tiles. */
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"]:not(.mode-quad):not(.mode-nine) #grid,
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"].matrix-focus #grid { width:100%!important; height:auto!important; aspect-ratio:16/9!important; }
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"] #grid .cam { min-height:0!important; }
#hud[data-layered-sheets="true"] #restoreEvidence { position:absolute; top:var(--sheet-top); right:12px; z-index:25; pointer-events:auto; min-height:44px; padding:0 18px; border:1px solid var(--border); border-radius:24px; background:var(--panel); color:var(--brand); font:14px var(--ui); }
/* Visual-review revision: full timeline or hidden, with a compact camera recovery pill. */
#hud[data-layered-sheets="true"] #mobileCameraSelector { padding-top:0; }
#hud[data-layered-sheets="true"] #cameraSheetHandle { flex:none; width:100%; height:24px; display:flex; align-items:center; justify-content:center; background:transparent; border:0; touch-action:manipulation; }
#hud[data-layered-sheets="true"] #mobileCameraQuery { margin:0 0 6px; }
#hud[data-layered-sheets="true"] #selectCameras { position:absolute; right:10px; top:0; min-height:32px; padding:0 12px; margin:0; font-size:12px; gap:6px; z-index:2; }
#hud[data-layered-sheets="true"] #selectCameras[hidden] { display:none!important; }
#hud[data-layered-sheets="true"] #selectCameras .ricon { width:16px; height:16px; }
.hudhost.phone #hud[data-layered-sheets="true"] #panelHandle { height:34px; min-height:34px; }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] #cameraControlSheet { background:color-mix(in srgb,var(--panel) 66%,transparent); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] #dock .dock-inner { background:transparent!important; }
.hudhost.phone.phone-landscape #hud[data-layered-sheets="true"] #mobileCameraQuery { display:none!important; }
.evidence-find-chips { display:none; }
#evidenceFindChips { flex:1 1 0; min-width:0; }
.hudhost.phone #evidenceFindChips { overflow:hidden; flex-wrap:nowrap; }
.hudhost.phone #evidenceFindChips button { flex:none; max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#receiptFollow[role="switch"] { display:flex; align-items:center; gap:6px; flex:none; min-height:36px; padding:0 3px; border:0; background:transparent; color:var(--text-mid); border-radius:0; font:12px var(--ui); }
#receiptFollow[hidden] { display:none!important; }
.scroll-switch-track { position:relative; width:30px; height:18px; border-radius:12px; border:1px solid var(--border); background:var(--panel); }
.scroll-switch-track::after { content:""; position:absolute; width:12px; height:12px; top:2px; left:2px; border-radius:50%; background:var(--text-mid); }
[aria-checked="true"] .scroll-switch-track { background:var(--brand); border-color:var(--brand); }
[aria-checked="true"] .scroll-switch-track::after { left:14px; background:var(--panel); }
.evidence-find-heading { min-height:40px; gap:6px; }
#evidenceFindOpen { flex:none; }
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"] #grid .cam video,
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"] #grid .cam img { object-fit:contain!important; transform:none!important; }
#hud[data-layered-sheets="true"] #selectCameras { z-index:35; }
/* Second visual pass: preserve the video boundary, and keep one expanded-camera handle. */
.hudhost.phone #hud[data-layered-sheets="true"] #investigationPanel[data-cameras-open="true"] #panelHandle { display:none!important; }
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"] #investigationPanel[data-cameras-open="true"] #cameraControlSheet { top:auto; max-height:none; }
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"] #mobileCameraSelector { flex:0 0 auto; min-height:0; }
.hudhost.phone:not(.phone-landscape) #hud[data-layered-sheets="true"] #mobileCameraList { flex:0 0 auto; min-height:max-content; max-height:none; overflow-x:auto; overflow-y:hidden; }
#hud[data-layered-sheets="true"] #mobileCameraQuery { text-align:left; color:var(--text-mid); }
#hud[data-layered-sheets="true"] #rail[data-surface="receipts"] #railBody { touch-action:pan-y!important; scroll-behavior:auto!important; }
#hud .rcard[role="button"] { cursor:pointer; font-family:var(--ui); }
#hud .receipt-inline-controls { position:absolute; inset:0; z-index:3; display:flex; align-items:center; justify-content:center; gap:12px; background:rgba(4,12,8,.52); border-radius:inherit; }
#hud .receipt-inline-controls button { width:48px; min-width:48px; height:48px; min-height:48px; display:flex; align-items:center; justify-content:center; padding:0; border:1px solid var(--brand); border-radius:50%; background:var(--panel); color:var(--brand); font:24px var(--ui); }
#hud .receipt-inline-controls .ricon { width:22px; height:22px; }
#cameraSearchDialog { position:fixed; inset:12px 12px auto; width:auto; max-width:480px; margin:0 auto; box-sizing:border-box; padding:16px; border:1px solid #456751; border-radius:18px; background:#101c15; color:#e2efe6; overflow:auto; overscroll-behavior:contain; font:16px system-ui; }
#cameraSearchDialog::backdrop { background:rgba(0,0,0,.72); }
.camera-search-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
#cameraSearchDialog button { min-height:44px; padding:8px 12px; border:1px solid #456751; border-radius:12px; background:transparent; color:#9be1b9; font:16px system-ui; }
#cameraSearchInput { box-sizing:border-box; width:100%; min-height:44px; margin:12px 0; padding:10px; border:1px solid #719d82; border-radius:10px; background:#08110b; color:#eef7f1; font:16px system-ui; }
#cameraSearchResults { display:flex; flex-direction:column; gap:6px; }
#cameraSearchResults button { text-align:left; }

/* Contain receipt gestures and keep virtual spacers out of hit testing. */
#hud[data-layered-sheets="true"] #rail[data-surface="receipts"] #railBody { overscroll-behavior:contain; }
#hud .receipt-window-spacer { pointer-events:none; min-height:0; margin:0; padding:0; }
@media (max-height:650px) and (orientation:portrait) {
  .hudhost.phone #hud[data-layered-sheets="true"] #investigationPanel[data-cameras-open="true"] #dock #ribbon { height:56px!important; }
}

/* Fixed list header: transaction and line-crossing time, independent of playback. */
#hud #receiptBrowseStripe { display:none; }
.hudhost.phone #hud #rail[data-surface="receipts"] #receiptBrowseStripe { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); flex:none; align-items:center; gap:6px; min-height:36px; padding:3px 12px; margin:0 12px; border-radius:7px; background:#a6ebc8; color:#073523; border:1px solid #c3f7dd; font:700 18px/1.2 var(--mono); font-variant-numeric:tabular-nums; }
#hud #receiptBrowseNumber { font-size:clamp(12px,3.4vw,14px); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#hud #receiptBrowseTime { white-space:nowrap; flex:none; }
.hudhost.phone #hud #rail[data-surface="receipts"] .rc-h { position:static!important; }

#hud #receiptBrowseTotal { text-align:right; white-space:nowrap; font-size:clamp(12px,3.7vw,15px); }

/* Keep the open matrix chooser above the camera restore pill. */
#hud[data-layered-sheets="true"] #dock:has(.seek-more[open]) { z-index:36; }