/* ==========================================================================
   BidYT utility layer (Tailwind-compatible subset, self-hosted)
   --------------------------------------------------------------------------
   Generated for the exact utility classes used by index.php, about.php,
   includes/header.php and includes/footer.php.

   Why this file instead of the Tailwind CDN script:
     - no external request on every page load (faster, works offline/intranet)
     - no flash of unstyled content before the CDN JS boots
     - the CDN build is explicitly not meant for production

   Tailwind's "preflight" reset is intentionally NOT included: the site's own
   design system lives in style.css and a global reset would fight it. Because
   of that, border utilities below set border-style themselves.

   Colour tokens resolve to the CSS variables declared in style.css, so light
   and dark themes keep working automatically.
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

/* ---------- display / position ---------- */
.block{display:block}
.inline-flex{display:inline-flex}
.flex{display:flex}
.grid{display:grid}
.hidden{display:none}
.relative{position:relative}
.absolute{position:absolute}
.inset-x-0{left:0;right:0}
.top-0{top:0}
.overflow-hidden{overflow:hidden}
.pointer-events-none{pointer-events:none}
.place-items-center{place-items:center}
.scroll-mt-24{scroll-margin-top:6rem}

/* ---------- flex / grid ---------- */
.flex-1{flex:1 1 0%}
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.shrink-0{flex-shrink:0}
.min-w-0{min-width:0}
.items-center{align-items:center}
.items-end{align-items:flex-end}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.ml-auto{margin-left:auto}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.col-span-2{grid-column:span 2/span 2}

.gap-1{gap:.25rem}
.gap-1\.5{gap:.375rem}
.gap-2{gap:.5rem}
.gap-3{gap:.75rem}
.gap-4{gap:1rem}
.gap-x-2{column-gap:.5rem}
.gap-x-6{column-gap:1.5rem}
.gap-y-1{row-gap:.25rem}
.gap-y-2{row-gap:.5rem}

/* ---------- margin / padding ---------- */
.mx-auto{margin-left:auto;margin-right:auto}
.ml-1{margin-left:.25rem}
.mt-0\.5{margin-top:.125rem}
.mt-1{margin-top:.25rem}
.mt-1\.5{margin-top:.375rem}
.mt-2{margin-top:.5rem}
.mt-3{margin-top:.75rem}
.mt-4{margin-top:1rem}
.mt-5{margin-top:1.25rem}
.mt-6{margin-top:1.5rem}
.mt-7{margin-top:1.75rem}
.mt-8{margin-top:2rem}
.mt-10{margin-top:2.5rem}
.mt-12{margin-top:3rem}
.mt-14{margin-top:3.5rem}
.mt-16{margin-top:4rem}

.p-0{padding:0}
.p-1{padding:.25rem}
.p-1\.5{padding:.375rem}
.p-4{padding:1rem}
.p-5{padding:1.25rem}
.px-2{padding-left:.5rem;padding-right:.5rem}
.px-2\.5{padding-left:.625rem;padding-right:.625rem}
.px-3{padding-left:.75rem;padding-right:.75rem}
.px-3\.5{padding-left:.875rem;padding-right:.875rem}
.px-4{padding-left:1rem;padding-right:1rem}
.px-5{padding-left:1.25rem;padding-right:1.25rem}
.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem}
.py-11{padding-top:2.75rem;padding-bottom:2.75rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.py-16{padding-top:4rem;padding-bottom:4rem}
.pt-0{padding-top:0}
.pt-3{padding-top:.75rem}
.pt-5{padding-top:1.25rem}
.pt-6{padding-top:1.5rem}
.pt-12{padding-top:3rem}
.pb-6{padding-bottom:1.5rem}

/* ---------- sizing ---------- */
.h-px{height:1px}
.h-1{height:.25rem}
.h-9{height:2.25rem}
.h-10{height:2.5rem}
.h-11{height:2.75rem}
.h-14{height:3.5rem}
.h-16{height:4rem}
.w-9{width:2.25rem}
.w-10{width:2.5rem}
.w-11{width:2.75rem}
.w-36{width:9rem}
.w-full{width:100%}
.max-w-sm{max-width:24rem}
.max-w-md{max-width:28rem}
.max-w-xl{max-width:36rem}
.max-w-2xl{max-width:42rem}
.max-w-3xl{max-width:48rem}

/* ---------- typography ---------- */
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.font-display{font-family:'Sora',ui-sans-serif,system-ui,sans-serif}
.font-body{font-family:'Manrope',ui-sans-serif,system-ui,sans-serif}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.font-extrabold{font-weight:800}
.italic{font-style:italic}
.uppercase{text-transform:uppercase}
.text-center{text-align:center}
.tracking-tight{letter-spacing:-.025em}
.tracking-wide{letter-spacing:.025em}
.tracking-wider{letter-spacing:.05em}
.leading-none{line-height:1}
.leading-tight{line-height:1.25}
.leading-relaxed{line-height:1.625}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.line-clamp-2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}

.text-xs{font-size:.75rem;line-height:1rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.text-5xl{font-size:3rem;line-height:1.05}
.text-6xl{font-size:3.75rem;line-height:1.05}
.text-\[10\.5px\]{font-size:10.5px}
.text-\[11px\]{font-size:11px}
.text-\[11\.5px\]{font-size:11.5px}
.text-\[12px\]{font-size:12px}
.text-\[12\.5px\]{font-size:12.5px}
.text-\[13px\]{font-size:13px}
.text-\[13\.5px\]{font-size:13.5px}
.text-\[15px\]{font-size:15px}
.text-\[15\.5px\]{font-size:15.5px}
.text-\[16px\]{font-size:16px}

/* ---------- colours ---------- */
.text-ink{color:var(--text)}
.text-ink2{color:var(--text-2)}
.text-ink3{color:var(--text-3)}
.text-accent{color:var(--accent)}
.text-gold{color:var(--accent-2)}
.text-white{color:#fff}
.text-white\/80{color:rgba(255,255,255,.8)}

.bg-transparent{background-color:transparent}
.bg-canvas{background-color:var(--canvas)}
.bg-canvas2{background-color:var(--canvas-2)}
.bg-surface{background-color:var(--surface)}
.bg-surface2{background-color:var(--surface-2)}
.bg-raised{background-color:var(--raised)}
.bg-line{background-color:var(--line)}
.bg-accent{background-color:var(--accent)}
.bg-accent\/10{background-color:var(--accent-soft)}

/* ---------- borders / rings ---------- */
.border{border-width:1px;border-style:solid;border-color:var(--line)}
.border-t{border-top-width:1px;border-top-style:solid;border-top-color:var(--line)}
.border-b{border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:var(--line)}
.border-0{border-width:0}
.border-none{border-style:none}
.border-dashed{border-style:dashed}
.border-line{border-color:var(--line)}
.border-lineStrong{border-color:var(--line-strong)}
.border-transparent{border-color:transparent}
.border-accent{border-color:var(--accent)}

.divide-y > * + *{border-top-width:1px;border-top-style:solid;border-top-color:var(--line)}
.divide-line > * + *{border-top-color:var(--line)}

.rounded-xl{border-radius:.75rem}
.rounded-2xl{border-radius:1rem}
.rounded-3xl{border-radius:1.5rem}
.rounded-4xl{border-radius:28px}
.rounded-full{border-radius:9999px}
.rounded-\[22px\]{border-radius:22px}

.ring-2{box-shadow:0 0 0 2px var(--ring,var(--line-strong))}
.ring-4{box-shadow:0 0 0 4px var(--ring,var(--line-strong))}
.ring-gold\/60{--ring:var(--gold-soft)}
.ring-accent\/10{--ring:var(--accent-soft)}
.focus-within\:ring-accent\/10:focus-within{--ring:var(--accent-soft)}

/* gold outline for the #1 row: a border is used rather than a ring so it cannot
   be cancelled out by the card's box-shadow */
.border-gold{border-color:var(--accent-2)}

/* ---------- effects ---------- */
.shadow-soft{box-shadow:var(--shadow)}
.shadow-lift{box-shadow:var(--shadow-lg)}
.outline-none{outline:2px solid transparent;outline-offset:2px}
.transition{transition-property:color,background-color,border-color,fill,stroke,opacity,box-shadow,transform,filter;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}
.transition-all{transition-property:all;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}
.duration-300{transition-duration:.3s}

.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-from,transparent),var(--tw-via,transparent),var(--tw-to,transparent))}
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-from,transparent),var(--tw-to,transparent))}
.from-accent{--tw-from:var(--accent)}
.from-gold{--tw-from:var(--accent-2)}
.via-accent{--tw-via:var(--accent)}
.to-gold{--tw-to:var(--accent-2)}
.to-\[\#8c0018\]{--tw-to:#8c0018}
.bg-\[length\:200\%_100\%\]{background-size:200% 100%}

/* two-stop gradients must not render a transparent middle band */
.bg-gradient-to-r:not(.via-accent){background-image:linear-gradient(to right,var(--tw-from,transparent),var(--tw-to,transparent))}

@keyframes by-rise{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:none}}
@keyframes by-shine{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.animate-rise{animation:by-rise .6s cubic-bezier(.2,.9,.25,1) both}
.animate-shine{animation:by-shine 6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){
  .animate-rise,.animate-shine{animation:none}
}

/* ---------- placeholder ---------- */
.placeholder\:text-ink3::placeholder{color:var(--text-3)}

/* ---------- states ---------- */
.hover\:text-ink:hover{color:var(--text)}
.hover\:text-accent:hover{color:var(--accent)}
.hover\:text-white:hover{color:#fff}
.hover\:underline:hover{text-decoration-line:underline}
.hover\:bg-raised:hover{background-color:var(--raised)}
.hover\:bg-accent:hover{background-color:var(--accent)}
.hover\:border-accent:hover{border-color:var(--accent)}
.hover\:border-lineStrong:hover{border-color:var(--line-strong)}
.hover\:shadow-lift:hover{box-shadow:var(--shadow-lg)}
.hover\:-translate-y-0\.5:hover{transform:translateY(-.125rem)}
.active\:scale-95:active{transform:scale(.95)}
.group:hover .group-hover\:text-accent{color:var(--accent)}
.focus-within\:border-accent:focus-within{border-color:var(--accent)}
.focus-within\:ring-4:focus-within{box-shadow:0 0 0 4px var(--ring,var(--accent-soft))}

/* ---------- responsive: sm (>=640px) ---------- */
@media (min-width:640px){
  .sm\:hidden{display:none}
  .sm\:inline{display:inline}
  .sm\:inline-flex{display:inline-flex}
  .sm\:flex{display:flex}
  .sm\:flex-row{flex-direction:row}
  .sm\:flex-col{flex-direction:column}
  .sm\:items-center{align-items:center}
  .sm\:items-end{align-items:flex-end}
  .sm\:justify-center{justify-content:center}
  .sm\:gap-5{gap:1.25rem}
  .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .sm\:col-span-1{grid-column:span 1/span 1}
  .sm\:p-5{padding:1.25rem}
  .sm\:pt-0{padding-top:0}
  .sm\:border-0{border-width:0}
  .sm\:text-right{text-align:right}
  .sm\:text-5xl{font-size:3rem;line-height:1.05}
  .sm\:text-6xl{font-size:3.75rem;line-height:1.05}
  .sm\:w-44{width:11rem}
}

/* ---------- responsive: md (>=768px) ---------- */
@media (min-width:768px){
  .md\:flex{display:flex}
  .md\:inline{display:inline}
  .md\:hidden{display:none}
}

/* ---------- additions used by rules.php ---------- */
.h-1\.5{height:.375rem}
.w-1\.5{width:.375rem}
.h-6{height:1.5rem}
.w-6{width:1.5rem}
.h-7{height:1.75rem}
.w-7{width:1.75rem}
.h-8{height:2rem}
.w-8{width:2rem}
.mb-1{margin-bottom:.25rem}
.mb-2{margin-bottom:.5rem}
.mb-3{margin-bottom:.75rem}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.space-y-2 > * + *{margin-top:.5rem}
.space-y-3 > * + *{margin-top:.75rem}
.space-y-4 > * + *{margin-top:1rem}
.space-y-6 > * + *{margin-top:1.5rem}
.underline{text-decoration-line:underline}
.bg-gold\/10{background-color:var(--gold-soft)}
.text-\[14px\]{font-size:14px}
.text-\[17px\]{font-size:17px}
.text-\[26px\]{font-size:26px}
.text-\[34px\]{font-size:34px}

/* ---------- additions used by the homepage "total collected" band ---------- */
.inline-block{display:inline-block}
.py-14{padding-top:3.5rem;padding-bottom:3.5rem}
.px-8{padding-left:2rem;padding-right:2rem}
.text-\[44px\]{font-size:44px}
/* Fixed-width digits: without this the big total visibly jitters every time
   app.js repaints it with a different number. */
.tabular-nums{font-variant-numeric:tabular-nums}

@media (min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:text-\[42px\]{font-size:42px}
  .sm\:text-\[64px\]{font-size:64px}
}

/* ---------- !important overrides (Tailwind "!" prefix) ---------- */
.\!px-2\.5{padding-left:.625rem !important;padding-right:.625rem !important}
.\!py-0\.5{padding-top:.125rem !important;padding-bottom:.125rem !important}
.\!py-3\.5{padding-top:.875rem !important;padding-bottom:.875rem !important}
.\!text-\[10\.5px\]{font-size:10.5px !important}
.\!text-\[15px\]{font-size:15px !important}