/* AcuPrice finish: one layer loaded after each page's own styles. Crisper text, metallic gold buttons, hairline
   borders on sharp (Retina) screens, finer icons, no grey tap flash on phones and tablets. */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;text-size-adjust:100%}
*{-webkit-tap-highlight-color:transparent}
svg{shape-rendering:geometricPrecision}

/* Buttons: a faint top sheen on outlined ones, a polished metal face on gold ones, a small press-in when tapped. */
.btn{border-radius:10px;letter-spacing:.035em;background-image:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 60%);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 1px 2px rgba(0,0,0,.45);transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s,transform .12s,filter .18s}
.btn:active{transform:scale(.975)}
.btn:focus-visible{outline:2px solid var(--focus,#DDC488);outline-offset:3px}
.btn.primary{background:linear-gradient(180deg,#ECDEBC 0%,#DDC387 30%,#C6AA68 64%,#B69445 100%);border:1px solid #E3CD9B;color:#17110A;text-shadow:0 1px 0 rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(90,60,0,.28),0 10px 24px -10px rgba(201,169,94,.7),0 2px 6px rgba(0,0,0,.45)}
.btn.primary:hover{filter:brightness(1.05) saturate(1.05)}
.btn.primary:active{box-shadow:inset 0 2px 6px rgba(90,60,0,.35),0 4px 12px -6px rgba(201,169,94,.6)}
.btn.danger{background-image:none}

/* Inputs and cards: a clean edge and a soft inner depth. */
input,select,textarea{border-radius:10px;box-shadow:inset 0 1px 2px rgba(0,0,0,.35);transition:border-color .18s,box-shadow .18s}
input:focus,select:focus,textarea:focus{box-shadow:inset 0 1px 2px rgba(0,0,0,.35),0 0 0 3px rgba(201,169,94,.2)}
.card{box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 18px 40px -18px rgba(0,0,0,.75)}

/* Retina phones and tablets: half-pixel hairlines read as engraved rather than drawn. */
@media (min-resolution:2dppx),(-webkit-min-device-pixel-ratio:2){
  .card,input,select,textarea,.tabbar,.lotrow,.acttile,.actrow{border-width:.5px}
  .btn:not(.primary):not(.danger){border-width:.5px;border-color:rgba(213,185,121,.55)}
}

/* App tab bar (phones and tablets): finer icons, a gold-edged active tab with a thin gold bar under it. */
.ti{stroke-width:1.55}
@media (max-width:640px){
  .tabbtn{transition:color .18s,background-color .18s}
  .tabbtn[aria-selected="true"]{background:linear-gradient(180deg,rgba(201,169,94,.16),rgba(201,169,94,.05));box-shadow:inset 0 0 0 .5px rgba(213,185,121,.55),inset 0 1px 0 rgba(255,255,255,.06)}
  .tabbtn[aria-selected="true"]::after{content:"";position:absolute;left:30%;right:30%;bottom:5px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#DDC488,transparent)}
  .tabbtn[aria-selected="true"] .ti{filter:drop-shadow(0 0 6px rgba(221,196,136,.35))}
}

/* Accessibility layer (every page that loads this file). */
/* A clear gold ring on whatever the keyboard is on; mouse and touch clicks don't show it. */
:where(a,button,summary,select,textarea,input,[tabindex],[role="tab"],[role="button"]):focus-visible{outline:2px solid var(--focus,#DDC488);outline-offset:2px}
:where(input,select,textarea):focus-visible{outline-offset:1px}
/* "Skip to content": hidden until a keyboard user tabs to it. */
.skip-link{position:fixed;left:12px;top:-60px;z-index:1000;padding:10px 16px;border-radius:10px;background:#DDC488;color:#17110A;font-weight:700;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.45);transition:top .15s}
.skip-link:focus,.skip-link:focus-visible{top:12px;outline:2px solid #17110A;outline-offset:2px}
/* Phones: buttons and fields at least 44px tall, so they're easy to tap. */
@media (max-width:640px){
  .btn,button.btn,a.btn,.applink{min-height:44px!important}
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),select{min-height:44px}
}
/* Reduced motion: no slides, rises or glows for people who've asked their device for less motion. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
}
main[tabindex="-1"]:focus{outline:none}
/* Public pages on phones: taller tap areas on the top menu and footer links, same look. */
@media (max-width:640px){
  .nav-links a{display:inline-flex;align-items:center;min-height:44px}
  .nav-wrap .brand{min-height:44px}
  .footer-col{gap:0!important}
  .footer-col a{display:inline-flex;align-items:center;min-height:36px}
  .footer-col h4{margin-bottom:4px!important}
}
