.missing-card-overlay {
  position: fixed; inset: 0; z-index: 9990; background: rgba(0, 0, 0, .65);
  overflow: hidden; overscroll-behavior: none; color: #FAFAF9;
}
.missing-card-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; max-width: 500px; margin: auto;
  padding: 10px 18px max(22px, env(safe-area-inset-bottom)); border-radius: 28px 28px 0 0;
  background: linear-gradient(180deg, #1c1817, #161312);
  border-top: 1px solid rgba(255, 255, 255, .07); box-shadow: 0 -24px 60px rgba(0, 0, 0, .5);
  max-height: 100%; box-sizing: border-box; display: flex; flex-direction: column;
}
.missing-card-handle { width: 34px; height: 4px; border-radius: 8px; background: #5e5550; margin: 0 auto 15px; flex-shrink: 0; }
.missing-card-title { margin: 0 35px 12px; text-align: center; font-size: 16px; font-weight: 700; letter-spacing: 3px; color: #D6B88C; }
.missing-card-close { position: absolute; top: 16px; right: 12px; width: 40px; height: 40px; border: 0; background: transparent; color: #D6B88C; font-size: 24px; cursor: pointer; }
.missing-card-warning { margin: 0 0 12px; color: #FCD34D; font-size: 12px; text-align: center; }
.missing-card-warning[hidden] { display: none; }
.missing-card-wheels { position: relative; display: grid; grid-template-columns: 1fr 1fr; height: 108px; flex-shrink: 0; border-radius: 20px; background: rgba(255, 255, 255, .02); border: 1px solid rgba(255, 255, 255, .07); overflow: hidden; }
.missing-card-band { position: absolute; top: 36px; left: 10px; right: 10px; height: 36px; border-radius: 12px; background: rgba(214, 184, 140, .1); pointer-events: none; }
.missing-card-wheel { height: 108px; overflow-y: auto; scroll-snap-type: y mandatory; overscroll-behavior: contain; scrollbar-width: none; padding: 36px 0; box-sizing: border-box; perspective: 420px; position: relative; z-index: 1; touch-action: pan-y; }
.missing-card-wheel::-webkit-scrollbar, .missing-card-list::-webkit-scrollbar { display: none; }
.missing-card-wheel-item { display: block; height: 36px; min-height: 36px; width: 100%; margin: 0; padding: 0; scroll-snap-align: center; border: 0; background: transparent; color: #D6B88C; font: inherit; font-size: 18px; line-height: 36px; font-weight: 700; cursor: pointer; }
.missing-card-month-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; margin-left: 8px; border-radius: 10px; background: #C13B35; color: #fff; font-size: 11px; line-height: 20px; vertical-align: middle; }
.missing-card-subtitle { margin: 24px 0 14px; font-size: 16px; font-weight: 700; letter-spacing: 3px; color: #D6B88C; text-align: center; }
.missing-card-box { position: relative; height: 258px; min-height: 100px; }
.missing-card-frames { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; pointer-events: none; }
.missing-card-frame { border-radius: 16px; background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .07); overflow: hidden; box-sizing: border-box; }
.missing-card-list { position: absolute; left: 0; right: 0; top: 35px; bottom: 1px; height: auto; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; padding: 0 0 14px; box-sizing: border-box; touch-action: pan-y; -webkit-mask-image: linear-gradient(#000 calc(100% - 22px), transparent); mask-image: linear-gradient(#000 calc(100% - 22px), transparent); }
.missing-card-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; min-height: 0; }
.missing-card-column { border-radius: 0; background: transparent; border: 0; padding: 10px 9px 0; min-height: 100%; box-sizing: border-box; }
.missing-card-column-heading { display: flex; justify-content: center; align-items: center; gap: 3px; margin-bottom: 0; height: 34px; font-size: 12px; font-weight: 700; letter-spacing: 1px; white-space: nowrap; }
.missing-card-column-heading .material-icons { font-size: 16px; }
.missing-card-column.in { color: #86EFAC; }
.missing-card-column.out { color: #FECACA; }
.missing-card-column.both { color: #FCD34D; }
.missing-card-date { width: 100%; height: 40px; border-radius: 12px; margin: 0 0 8px; display: flex; gap: 7px; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; cursor: pointer; }
.missing-card-date.in { background: linear-gradient(135deg, #14532D, #166534); border: 1px solid rgba(74, 222, 128, .3); color: #86EFAC; }
.missing-card-date.out { background: linear-gradient(135deg, #7F1D1D, #991B1B); border: 1px solid rgba(248, 113, 113, .3); color: #FECACA; }
.missing-card-date.both { background: linear-gradient(135deg, #713F12, #854D0E); border: 1px solid rgba(252, 211, 77, .3); color: #FCD34D; }
.missing-card-date small { font-size: 10px; font-weight: 500; }
.missing-card-empty { padding: 14px 0; text-align: center; color: #B7ADA7; font-size: 12px; }
.missing-card-toast { display: flex; align-items: center; justify-content: center; height: 40px; min-height: 40px; flex-shrink: 0; margin-top: 12px; text-align: center; }
.missing-card-result { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 8px 14px; border-radius: 12px; background: rgba(34, 197, 94, .16); border: 1px solid rgba(74, 222, 128, .5); color: #BBF7D0; font-size: 15px; font-weight: 700; white-space: nowrap; opacity: 1; transition: opacity .3s ease-out; }
.missing-card-result .material-icons { font-size: 22px; color: #4ADE80; }
.missing-card-result.is-failure { background: rgba(239, 68, 68, .16); border-color: rgba(248, 113, 113, .5); color: #F87171; }
.missing-card-result.is-failure .material-icons { color: inherit; }
.missing-card-result.is-failure .missing-card-result-label { color: #FECACA; }
.missing-card-result.is-fading { opacity: 0; }
.missing-card-overlay button:focus-visible { outline: 2px solid #D6B88C; outline-offset: -2px; }
.missing-card-frame.in .missing-card-column-heading { background: rgba(22, 101, 52, .28); color: #86EFAC; }
.missing-card-frame.out .missing-card-column-heading { background: rgba(153, 27, 27, .28); color: #FECACA; }
.missing-card-frame.both .missing-card-column-heading { background: rgba(133, 77, 14, .32); color: #FCD34D; }
