Something went wrong. Try again.
gotta store my records
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108/* --- design-engineering baseline: focus, tap targets, motion ----------- *//* Last in the concat on purpose: the :focus-visible rules below must beat the equal-specificity `input:focus { outline: none }` in 05-forms.css. */
button,a,input,select,textarea { touch-action: manipulation;}
.btn:focus-visible,.chip:focus-visible,.icon-btn:focus-visible,.display-toggle__btn:focus-visible,.segment button:focus-visible,.tab:focus-visible,.tab-add:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px;}
/* Tap-target floor (44px) via an invisible halo, opted into by name: an absent halo only leaves a control small, an unwanted one steals taps from whatever the control stacks against. Everything else earns 44px in padding. */.icon-btn,button.chip,.display-toggle__btn,.notice__dismiss { position: relative;}.display-toggle__btn::before,.notice__dismiss::before { content: ""; position: absolute; inset: -5px;}/* 7px, not 5px: an absolute ::before is inset from the padding box, so a 2px border eats 2px of any halo drawn over it. */.icon-btn::before,button.chip::before { content: ""; position: absolute; inset: -7px;}/* Two halves of one control behind a shared 2px divider: grow outward only, or each half's halo lands on the other. */.display-toggle__btn:first-child::before { inset: -5px 0 -5px -5px;}.display-toggle__btn:last-child::before { inset: -5px -5px -5px 0;}
/* 35px visual (11px font + 10px×2 padding + 2px×2 border), 45px with the halo. Applies to `.chip` broadly so a static badge chip matches a clickable one. */.chip { padding: 10px 11px;}
/* Press feedback for the button-like controls .btn doesn't already cover (it has its own shadow-squash :active). Never scale(0): .97 reads as a press, not a disappearance. */.icon-btn,button.chip,.display-toggle__btn,.tab,.tab-add,.segment button { transition: transform 100ms ease;}.icon-btn:active,button.chip:active,.display-toggle__btn:active,.tab:active,.tab-add:active,.segment button:active { transform: scale(0.97);}
@media (prefers-reduced-motion: reduce) { .notice, .edit-panel, .dropdown-panel { animation: none; } /* `animation: none` here would also drop the 200ms delay, reintroducing the one-frame flash on a fast load that the delay exists to prevent. A 1ms animation keeps the delayed appearance without any motion. */ .skeleton-card, .skeleton-row { animation: skeleton-in 1ms linear 200ms both; } .btn, .icon-btn, button.chip, .display-toggle__btn, .tab, .tab-add, .segment button { transition: none; }}