/**
 * GLITZY BINGO MAGAZINE
 * glitzy-magazine.css — March 2026
 */

/* ============================================
   CSS VARIABLES
   ============================================ */

:root {
  /* Colors */
  --pink: #E91E8C;
  --pink-dark: #C71585;
  --pink-light: #ff6b9d;
  --pink-bg: #fdf4f7;
  --cyan: #00BCD4;
  --cyan-dark: #0097A7;
  --teal: #0d4f4f;
  --teal-light: #2d8a8a;
  --gold: #FFD700;
  --purple: #9c27b0;

  /* Card accent colours — decorative use only, not nav/section colours */
  --card-coral:   #E8472A;
  --card-amber:   #F59E0B;
  --card-lime:    #65A30D;
  --card-sky:     #0EA5E9;
  --card-rose:    #F43F5E;
  --card-violet:  #7C3AED;
  --black: #1a1a1a;
  --dark: #333333;
  --grey: #555555;
  --grey-light: #888888;
  --border: #e0e0e0;
  --bg: #fafafa;
  --white: #ffffff;
  --danger: #c62828;
  --danger-bg: #ffebee;
  --success: #2e7d32;
  --success-bg: #e8f5e9;
  
  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-editorial: 'Lora', Georgia, serif;
  /* ─────────────────────────────────────────────────────
     BINGLE GAME FONT — always use Cinzel for:
     · game tile letters  · popup headlines
     · "Today's Word Was" · "Meaning" labels
     · scoreboard labels  · weekly word list
     Never use Lora or system sans for Bingle UI labels.
     ───────────────────────────────────────────────────── */
  --font-bingle: 'Cinzel', Georgia, serif;
  
  /* Shadows - consolidated */
  --shadow-sm: 0 2px 4px rgba(0,0,0,0.08);
  --shadow-md: 0 3px 8px rgba(0,0,0,0.1);
  --shadow-lg: 0 4px 12px rgba(0,0,0,0.12);
  --shadow-dark: 0 3px 10px rgba(0,0,0,0.15);
}

/* ============================================
   RESET & BASE
   ============================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-font-smoothing: antialiased; }
body { 
  font-family: var(--font-sans); 
  font-size: 14px; 
  line-height: 1.6; 
  color: var(--dark); 
  background: var(--black) url('/assets/images/bg-glitzy-bingo.webp') 4px 0 repeat;
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; }
button { font-family: inherit; cursor: pointer; border: none; }

/* Screen reader only */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Text utilities */
.text-pink { color: var(--pink); }
.text-cyan { color: var(--cyan); }
.text-purple { color: var(--purple); }
.text-red { color: var(--danger); }
.text-green { color: #16A34A; }

/* Shared typography patterns */
.mag-card-title {
  font-family: var(--font-editorial);
  font-size: 17px;
  font-weight: 700;
  margin: 0;
}

.mag-card-title--white { color: #fff; }
.mag-card-title--black { color: var(--black); }
.mag-card-title--pink { color: var(--pink); }
.mag-card-title--teal { color: var(--teal); }
.mag-card-title--danger { color: var(--danger); }
.text-center { text-align: center; }

/* Link utilities - pink CTA style */
.link-pink { 
  color: var(--pink); 
  font-weight: 600; 
  transition: color 0.15s; 
}
.link-pink:hover { color: var(--pink-dark); }

/* Site wrapper */
.site-wrapper { max-width: 1200px; margin: 0 auto; background: var(--white); box-shadow: 0 0 40px rgba(0,0,0,0.3); border-top: 4px solid var(--pink); }

/* ============================================
   MASTHEAD
   ============================================ */

/* Black issue bar at top */
.mag-issue-bar {
  background: #000;
  padding: 0.5rem 1rem;
  text-align: center;
}

.mag-issue-bar p {
  font-size: 10px;
  color: rgba(255,255,255,0.8);
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 0;
}

.mag-issue-bar__star {
  font-size: 6px;
  vertical-align: middle;
  opacity: 0.7;
}

.mag-masthead {
  background: url('/assets/images/glitzy-bingo-header.webp') center center / cover no-repeat;
  background-color: var(--pink);
  /* padding: 0 1.5rem 0; */
  text-align: center;
  position: relative;
  overflow: hidden;
}

/* Colour shift overlay - pinks to purples */
.mag-masthead::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(
    90deg,
    rgba(233, 30, 140, 0.3) 0%,
    rgba(156, 39, 176, 0.4) 25%,
    rgba(199, 21, 133, 0.35) 50%,
    rgba(139, 92, 246, 0.4) 75%,
    rgba(233, 30, 140, 0.3) 100%
  );
  background-size: 300% 100%;
  -webkit-animation: gradient-shift 6s ease-in-out infinite;
  animation: gradient-shift 6s ease-in-out infinite;
  z-index: 1;
  will-change: background-position;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.mag-masthead::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  opacity: 0.03;
  z-index: 2;
  pointer-events: none;
}

@keyframes gradient-shift {
  0% { background-position: 0% 0%; }
  50% { background-position: 100% 0%; }
  100% { background-position: 0% 0%; }
}

@-webkit-keyframes gradient-shift {
  0% { background-position: 0% 0%; }
  50% { background-position: 100% 0%; }
  100% { background-position: 0% 0%; }
}

.mag-masthead__logo-link,
.mag-masthead__logo,
.mag-masthead__tagline {
  position: relative;
  z-index: 3;
}

.mag-masthead__logo-link {
  display: block;
}

.mag-masthead__logo {
  max-width: 380px;
  width: 90%;
  height: auto;
  margin: 0 auto 0.15rem;
  display: block;
}

.mag-masthead__tagline {
  font-family: var(--font-editorial);
  font-size: 14px;
  font-weight: 700;
  width: 95%;
  color: rgba(255,255,255,0.95);
  font-style: italic;
  margin: -15px auto 10px auto;
  letter-spacing: 0.5px;
  background-color: rgba(255, 255, 255, 0.16);
}

.mag-masthead__star {
  font-size: 8px;
  vertical-align: middle;
}

.mag-masthead__title {
  font-family: var(--font-editorial); font-size: 40px; font-weight: 700; font-style: italic; color: #fff; margin: 0 0 0.375rem; text-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* Visually hidden for SEO */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ============================================
   GLOSSY NAV with Bingo Balls
   ============================================ */

.mag-nav-glossy {
  background: #1a1a1a;
  border-bottom: 4px solid var(--pink);
  position: relative;
  display: flex;
  align-items: stretch;
}

/* Home - always visible on left */
.nav-item--home {
  background: var(--pink);
  color: #fff;
  flex-shrink: 0;
  z-index: 2;
}

.nav-item--home:hover {
  background: var(--pink-dark);
}

/* Scrollable area for other items */
.mag-nav-glossy__inner {
  display: flex; 
  flex-wrap: nowrap; 
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.mag-nav-glossy__inner::-webkit-scrollbar {
  display: none;
}

.nav-item {
  display: flex; align-items: center; gap: 0.4rem;
  color: rgba(255,255,255,0.9); font-size: 15px; font-weight: 600; 
  padding: 0.875rem 1rem; letter-spacing: 0.5px; 
  transition: all 0.25s ease; position: relative;
  font-family: var(--font-editorial);
  text-transform: uppercase;
  white-space: nowrap;
}

.nav-item:hover {
  color: #fff; 
  background: rgba(255,255,255,0.1);
}

.nav-item--active {
  color: #fff;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,0.6);
}

@media (max-width: 900px) {
  .nav-item { padding: 0.75rem 0.875rem; font-size: 12px; }
  .nav-item--home { padding: 0.75rem 1rem; }
}

/* Coloured dots */
.nav-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.nav-dot--blue   { background: #3B82F6; }
.nav-dot--cyan   { background: var(--cyan); }
.nav-dot--pink   { background: var(--pink); }
.nav-dot--purple { background: #8B5CF6; }
.nav-dot--orange { background: #F97316; }
.nav-dot--gold   { background: var(--gold); }
.nav-dot--teal   { background: var(--teal-light); }
.nav-dot--white  { background: #e0e0e0; }
.nav-dot--red    { background: var(--danger); }

/* Bingo ball numbers */
.nav-ball {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  font-size: 10px; font-weight: 800; font-family: var(--font-sans);
  color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  box-shadow: inset 0 -2px 4px rgba(0,0,0,0.2), inset 0 2px 4px rgba(255,255,255,0.3), 0 2px 4px rgba(0,0,0,0.3);
  transition: all 0.25s;
}

.nav-item:hover .nav-ball {
  transform: scale(1.15) rotate(-5deg);
  box-shadow: inset 0 -2px 4px rgba(0,0,0,0.2), inset 0 2px 4px rgba(255,255,255,0.4), 0 0 12px currentColor;
}

/* Ball colours - proper bingo style */
.nav-ball--pink { background: linear-gradient(135deg, #ff6b9d 0%, #E91E8C 50%, #C71585 100%); }
.nav-ball--blue { background: linear-gradient(135deg, #64b5f6 0%, #1976d2 50%, #0d47a1 100%); }
.nav-ball--purple { background: linear-gradient(135deg, #ce93d8 0%, #9c27b0 50%, #6a1b9a 100%); }
.nav-ball--orange { background: linear-gradient(135deg, #ffb74d 0%, #f57c00 50%, #e65100 100%); }
.nav-ball--gold { background: linear-gradient(135deg, #fff59d 0%, #fdd835 50%, #f9a825 100%); color: #5d4037; }
.nav-ball--teal { background: linear-gradient(135deg, #4db6ac 0%, #00897b 50%, #004d40 100%); }
.nav-ball--green { background: linear-gradient(135deg, #81c784 0%, #43a047 50%, #2e7d32 100%); }

/* Underline animation */
.nav-item::before {
  content: ''; position: absolute; bottom: 4px; left: 50%; width: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--pink), transparent);
  transition: all 0.3s ease; transform: translateX(-50%);
}

.nav-item:hover::before { width: 80%; }

/* ============================================
   TICKER
   ============================================ */

.mag-ticker {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(90deg, var(--pink) 0%, var(--purple) 50%, var(--pink) 100%);
  background-size: 200% 100%;
  overflow: hidden;
  z-index: 1000;
  display: flex;
  align-items: stretch;
}

.mag-ticker__label {
  background: var(--black);
  color: #fff;
  font-family: var(--font-editorial);
  font-size: 12px;
  font-weight: 700;
  font-style: italic;
  padding: 0.5rem 1.5rem;
  white-space: nowrap;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

@media (min-width: 701px) {
  .mag-ticker__label {
    padding: 0.5rem 2rem;
  }
}

.mag-ticker__scroll {
  flex: 1;
  overflow: hidden;
  display: flex;
  align-items: center;
}

/* Add padding to body so content isn't hidden behind ticker */
body {
  padding-bottom: 40px;
}

.mag-ticker__track {
  display: flex;
  white-space: nowrap;
  animation: ticker 20s linear infinite;
  will-change: transform;
}

.mag-ticker__item {
  flex-shrink: 0; padding: 0 2.5rem; font-size: 12px; color: #fff;
}

.mag-ticker__item strong { font-weight: 700; }

@keyframes ticker {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

.mag-ticker__social {
  background: var(--black);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0 1rem;
  flex-shrink: 0;
}

@media (min-width: 701px) {
  .mag-ticker__social {
    padding: 0 2rem;
    gap: 1rem;
  }
}

.mag-ticker__social-link {
  transition: opacity 0.2s, transform 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mag-ticker__social-link svg {
  width: 18px;
  height: 18px;
}

@media (min-width: 701px) {
  .mag-ticker__social-link svg {
    width: 22px;
    height: 22px;
  }
}

.mag-ticker__social-link:hover {
  opacity: 0.8;
  transform: scale(1.1);
}

/* Facebook - cyan */
.mag-ticker__social-link[aria-label="Facebook"] {
  color: var(--cyan);
}

/* X/Twitter - white */
.mag-ticker__social-link[aria-label="X/Twitter"] {
  color: #fff;
}

/* Instagram - gradient effect via pink */
.mag-ticker__social-link[aria-label="Instagram"] {
  color: #E91E8C;
}

/* ============================================
   SECTIONS & LAYOUT
   ============================================ */

.mag-section {
  padding: 2rem 1.5rem;
}

.mag-section--alt { background: var(--bg); }
.mag-section--dark { background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%); }
.mag-section--pink { background: var(--pink-bg); }

.mag-section__title {
  font-family: var(--font-editorial); font-size: 22px; font-weight: 700; color: var(--black); text-align: center; margin: 0 0 0.25rem;
}

.mag-section__title--light { color: #fff; }

.mag-section__subtitle {
  font-size: 13px; color: var(--grey-light); text-align: center; font-style: italic; margin: 0 0 0.5rem;
}

.mag-section__stars {
  font-size: 10px; color: var(--pink); letter-spacing: 6px; text-align: center; margin: 0 0 1.5rem;
}

.mag-row {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 2rem;
}

.mag-row--equal {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.mag-col {
  min-width: 0;
}

/* ============================================
   SECTION BREAK
   ============================================ */

.mag-break {
  padding: 0; background: linear-gradient(90deg, transparent 5%, var(--pink) 50%, transparent 95%); height: 3px;
}

.mag-break--light {
  background: linear-gradient(90deg, transparent 5%, var(--border) 50%, transparent 95%);
}

.mag-divider-pink {
  height: 6px;
  background: linear-gradient(90deg, transparent 0%, var(--pink) 10%, var(--pink) 90%, transparent 100%);
  margin: 0;
}

/* ============================================
   SECTION 1: COVER + EDITOR
   ============================================ */

.mag-label {
  display: inline-block; background: var(--pink); color: #fff; font-size: 10px; font-weight: 700;
  letter-spacing: 1.5px; padding: 4px 12px; margin-bottom: 1rem;
  transform: rotate(-2deg);
}

@media (min-width: 768px) {
  .mag-label {
    font-size: 12px;
    padding: 5px 14px;
  }
}

.mag-label--alert {
  background: #c62828;
  animation: pulse-alert 2s infinite;
}

.mag-label--cyan   { background: var(--cyan); }
.mag-label--purple { background: var(--purple); }
.mag-label--pink   { background: var(--pink); }
.mag-label--red    { background: var(--danger); }

@keyframes pulse-alert {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.8; }
}

.mag-cover__title {
  font-family: var(--font-editorial); font-size: 30px; font-weight: 700; line-height: 1.2; color: var(--black); margin: 0 0 1rem;
}

.mag-cover__title--pink {
  color: var(--pink);
  font-weight: 900;
}

.mag-cover__standfirst {
  font-size: 15px; color: #333; line-height: 1.6; margin: 0 0 1rem; font-weight: 800;
}

/* Drop cap for editorial style */
.drop-cap {
  float: left;
  font-family: var(--font-editorial);
  font-size: 6.5em;
  line-height: 0.8;
  padding-right: 0.2em;
  margin-top: 0.02em;
  color: var(--pink);
  font-weight: 700;
}

.drop-cap--purple {
  color: var(--purple);
  font-size: 2.5em;
  padding-right: 0.1em;
}

/* Section header - full width */
.mag-section-header {
  margin-bottom: 1rem;
}

.mag-section-header--split {
  display: grid;
  grid-template-columns: 2fr 5fr;
  gap: 1.25rem;
  align-items: start;
}

.mag-section-header__left,
.mag-section-header__right {
  min-width: 0;
}

/* Thick border divider */
.mag-thick-border {
  height: 4px;
  background: var(--purple);
  margin: 0 0 1.5rem;
}

/* Faded border divider */
.mag-faded-border {
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, var(--pink) 20%, var(--pink) 80%, transparent 100%);
  margin: 1rem 0 1.5rem;
}

.mag-faded-border--purple {
  background: linear-gradient(90deg, transparent 0%, var(--purple) 20%, var(--purple) 80%, transparent 100%);
}

.mag-faded-border--top {
  margin: 0 0 1rem;
}

/* Top Prize box */
.mag-top-prize {
  display: inline-block;
  background: rgba(156, 39, 176, 0.1);
  border: 1px solid var(--purple);
  padding: 0.25rem 0.75rem;
  font-size: 12px;
  font-weight: 600;
  color: var(--purple);
  margin-top: 0.5rem;
}

.mag-top-prize__star {
  font-size: 8px;
}

@media (max-width: 800px) {
  .mag-section-header--split {
    grid-template-columns: 1fr 2fr;
    gap: 1rem;
  }
}

.mag-cover__meta {
  font-size: 12px; color: var(--grey-light); margin: 0 0 0.5rem; font-style: italic;
}

.mag-cover__meta a {
  color: var(--pink);
  text-decoration: none;
}

.mag-cover__meta a:hover {
  text-decoration: underline;
}

.mag-cover__stars {
  font-size: 10px;
  color: var(--pink);
  letter-spacing: 3px;
  margin: 0 0 1rem;
}

.mag-cover__cta {
  display: inline-block; background: var(--pink); color: #fff; font-size: 13px; font-weight: 600;
  padding: 0.75rem 1.5rem; border-radius: 4px; transition: background 0.2s;
}

.mag-cover__cta:hover { background: var(--pink-dark); color: #fff; }

a.mag-cover__continue {
  font-family: var(--font-editorial);
  font-size: 14px;
  font-style: italic;
  font-weight: 600;
  color: var(--pink);
}

a.mag-cover__continue:hover {
  color: var(--pink-dark);
  text-decoration: underline;
}

/* Cover body text */
.mag-cover__body {
  font-size: 15px; color: #333; line-height: 1.6; margin: 0 0 1rem; font-weight: 500;
}

/* Highlight text - deep pink italic */
.mag-highlight {
  color: var(--pink-dark);
  font-style: italic;
  font-weight: 600;
}

/* Mini heading for inline sections */
.mag-mini-heading {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  color: var(--black);
  margin: 1.25rem 0 0.5rem;
}

/* Mini list for Q&A style content */
.mag-mini-list {
  margin: 0.75rem 0 1.25rem;
  padding-left: 0;
}

.mag-mini-list p {
  font-size: 14px;
  color: #444;
  margin: 0 0 0.5rem;
  line-height: 1.5;
}

.mag-mini-list p strong {
  color: var(--pink);
}

/* Editorial pull quote */
.mag-editorial-pull {
  background: rgba(252, 244, 247, 0.66);
  border-top: 2px solid var(--pink);
  border-bottom: 2px solid var(--pink);
  padding: 1.25rem 1.5rem;
  margin: 1.25rem 0;
}

.mag-editorial-pull p {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-style: italic;
  font-weight: 700;
  color: var(--pink-dark);
  line-height: 1.4;
  margin: 0;
}

/* More From Daily Daub divider */
.mag-more-divider {
  text-align: center;
  padding: 1rem 0;
  margin: 1rem 0 0.5rem;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}

/* Section Stars Divider */
.mag-section-stars {
  text-align: center;
  color: var(--pink);
  font-size: 12px;
  letter-spacing: 8px;
  margin: 1.5rem 0 0.5rem;
  opacity: 0.7;
}

.mag-more-label {
  margin: 1rem 0;
}

.mag-more-divider span {
  font-family: var(--font-editorial);
  font-size: 14px;
  font-weight: 700;
  font-style: italic;
  color: var(--cyan-dark);
  text-transform: uppercase;
  letter-spacing: 1px;
  display: inline-block;
  padding: 0 1rem;
  position: relative;
}

.mag-more-divider span::before {
  content: '✦';
  position: absolute;
  left: -0.5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  color: var(--cyan);
}

.mag-more-divider span::after {
  content: '✦';
  position: absolute;
  right: -0.5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  color: var(--cyan);
}

/* Editor Box */
.mag-editor {
  background: linear-gradient(135deg, var(--pink) 0%, var(--pink-dark) 100%);
  padding: 1.25rem; border-radius: 8px; margin-bottom: 1rem;
}

.mag-editor__header {
  display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem;
}

.mag-editor__avatar {
  width: 48px; height: 48px; border-radius: 50%; background: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-editorial); font-size: 20px; font-weight: 700; color: var(--pink);
}

.mag-editor__name {
  font-size: 14px; font-weight: 700; color: #fff; margin: 0;
}

.mag-editor__role {
  font-size: 11px; color: rgba(255,255,255,0.8); margin: 0;
}

.mag-editor__note {
  font-size: 13px; color: #fff; font-style: italic; line-height: 1.5; margin: 0;
}

/* This Issue Box */
.mag-this-issue {
  background: #fff; border: 2px solid var(--border); border-radius: 8px; padding: 1rem;
}

.mag-this-issue__title {
  font-family: var(--font-editorial); font-size: 14px; font-weight: 700; color: var(--black);
  margin: 0 0 0.75rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--pink);
}

.mag-this-issue__list {
  list-style: none; padding: 0; margin: 0;
}

.mag-this-issue__list li {
  padding: 0.5rem 0; border-bottom: 1px solid var(--border);
}

.mag-this-issue__list li:last-child {
  border-bottom: none; padding-bottom: 0;
}

.mag-this-issue__list a {
  font-size: 12px; color: var(--dark); transition: color 0.15s;
}

.mag-this-issue__list a:hover {
  color: var(--pink);
}

/* Credentials Box */
.mag-credentials {
  background: #fff; border: 2px solid var(--border); border-radius: 8px; padding: 1rem; margin-bottom: 1rem;
  border-left: 4px solid var(--teal);
}

.mag-credentials__title {
  font-family: var(--font-editorial); font-size: 14px; font-weight: 700; color: var(--teal);
  margin: 0 0 0.75rem;
}

.mag-credentials__list {
  list-style: none; padding: 0; margin: 0 0 0.75rem;
}

.mag-credentials__list li {
  font-size: 12px; color: var(--dark); padding: 0.375rem 0; line-height: 1.4;
  display: flex; align-items: flex-start; gap: 0.5rem;
}

.mag-credentials__list li strong {
  color: var(--black);
}

.mag-credentials__icon {
  color: var(--teal); font-weight: 700; flex-shrink: 0;
}

.mag-credentials__link {
  font-size: 12px; font-weight: 600; color: var(--teal);
}

.mag-credentials__link:hover {
  color: var(--pink);
}

/* Hello Glitzy Fans Greeting */
.mag-greeting {
  background: #fafafa;
  padding: 1.25rem;
  margin-bottom: 1rem;
  border-bottom: 3px solid var(--pink);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

.mag-greeting--purple {
  border-bottom-color: var(--purple);
}

.mag-greeting--purple .mag-greeting__h1,
.mag-greeting--purple .mag-greeting__stars,
.mag-greeting--purple .mag-greeting__stars-bottom {
  color: var(--purple);
}

.mag-greeting--star-border {
  border: none;
  position: relative;
  padding: 1.5rem 1.5rem 1.5rem 2rem;
}

.mag-greeting--star-border::before,
.mag-greeting--star-border::after {
  content: '✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦';
  display: block;
  text-align: center;
  font-size: 8px;
  letter-spacing: 4px;
  color: var(--purple);
  position: absolute;
  left: 0;
  right: 0;
}

.mag-greeting--star-border::before {
  top: 6px;
}

.mag-greeting--star-border::after {
  bottom: 6px;
}

.mag-greeting__left-stars {
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 8px;
  letter-spacing: 6px;
  color: var(--purple);
}

.mag-greeting__mascot {
  float: right;
  width: 120px;
  height: auto;
  margin: 1rem -0.5rem 0.5rem 0.75rem;
  shape-outside: url('/assets/images/bingo-lady.webp');
  shape-margin: 10px;
}

.mag-greeting__h1 {
  font-family: var(--font-editorial);
  font-size: 20px;
  font-weight: 600;
  color: var(--pink);
  margin: 0;
  line-height: 1.3;
}

.mag-greeting__stars {
  font-size: 15px;
  color: var(--pink);
  margin: 0.5rem 0;
  letter-spacing: 4px;
}

.mag-greeting__sub {
  font-size: 17px;
  color: #000;
  font-weight: 800;
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

.mag-greeting__desc {
  font-size: 14px;
  color: #555;
  line-height: 1.5;
  margin: 0.5rem 0 0;
}

.mag-greeting__stars-bottom {
  font-size: 10px;
  color: var(--pink);
  letter-spacing: 4px;
  margin: 0.5rem 0 0;
  text-align: center;
}

/* Hello text for variant greetings */
.mag-greeting__hello {
  font-family: var(--font-editorial);
  font-size: 20px;
  font-weight: 700;
  font-style: italic;
  color: var(--pink);
  margin: 0;
}

/* Cover story - thin right border for sidebar separation */
.mag-cover {
  padding-right: 2rem;
  border-right: 1px solid #ddd;
}

/* Greeting variants */
.mag-greeting--sm {
  padding: 0.75rem 1rem;
}

.mag-greeting--sm .mag-greeting__hello {
  font-size: 16px;
  margin-bottom: 0.25rem;
}

.mag-greeting--sm .mag-greeting__stars {
  font-size: 8px;
}

.mag-greeting--sm .mag-greeting__sub {
  font-size: 11px;
}

.mag-greeting--lg {
  padding: 2rem 2.5rem;
}

.mag-greeting--lg .mag-greeting__hello {
  font-size: 32px;
  margin-bottom: 0.5rem;
}

.mag-greeting--lg .mag-greeting__stars {
  font-size: 16px;
}

.mag-greeting--lg .mag-greeting__sub {
  font-size: 16px;
  line-height: 1.8;
}

/* Editor's Picks - Vertical List */
.mag-picks-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.mag-pick-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid #eee;
  transition: background 0.2s;
}

.mag-pick-item:last-child {
  border-bottom: none;
}

.mag-pick-item:hover {
  background: #fdf2f8;
}

.mag-pick-item__num {
  width: 24px;
  height: 24px;
  background: var(--pink);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.mag-pick-item__name {
  font-size: 15px;
  font-weight: 600;
  color: var(--black);
}

/* Coloured bingo balls */
.mag-pick-item__num--teal { background: var(--teal); }
.mag-pick-item__num--purple { background: #8B5CF6; }
.mag-pick-item__num--orange { background: #F97316; }
.mag-pick-item__num--gold { background: var(--gold); color: #333; }
.mag-pick-item__num--red { background: #DC2626; }

/* Editor's Picks Panel - cleaner */
.mag-picks-panel {
  background: #fafafa;
  padding: 1.25rem;
}

.mag-picks-panel__title {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  color: var(--pink);
  margin: 0 0 0.25rem;
}

.mag-picks-panel__sub {
  font-size: 12px;
  color: #666;
  font-style: italic;
  margin: 0 0 1rem;
}

.mag-picks-panel__more {
  display: inline-block;
  font-size: 13px;
  color: var(--pink);
  font-weight: 600;
  margin-top: 0.75rem;
}

/* Editor's Picks Magazine Box */
.mag-picks-box {
  background: #fff;
  border: 3px solid var(--pink);
  border-radius: 0;
  padding: 0;
  position: relative;
  box-shadow: var(--shadow-md);
}

.mag-picks-box__header {
  background: var(--pink);
  padding: 1rem 1rem 0.75rem;
  text-align: center;
}

.mag-picks-box__stars {
  font-size: 12px;
  display: block;
  color: #fff;
  letter-spacing: 2px;
  margin-top: 0;
}

.mag-picks-box__stars span {
  background: #000;
  padding: 3px 6px;
  display: inline-block;
}

.mag-picks-box__title {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 0;
  line-height: 1.8;
}

.mag-picks-box__title span {
  background: #000;
  padding: 4px 8px;
  display: inline;
}

.mag-picks-box__sub {
  font-size: 14px;
  color: #333;
  font-weight: 600;
  font-style: italic;
  padding: 0.5rem 1rem 0;
  margin: 0;
  text-align: center;
}

.mag-picks-box .mag-picks-list {
  padding: 0.4rem;
}

.mag-picks-box .mag-pick-item {
  padding: 0.6rem 0.5rem;
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.mag-picks-box .mag-pick-info {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.mag-picks-box .mag-pick-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--black);
  line-height: 1.2;
}

.mag-picks-box .mag-pick-meta {
  font-size: 11px;
  color: #888;
  line-height: 1.2;
}

.mag-picks-box .mag-pick-ukgc {
  font-size: 10px;
  color: var(--teal);
  font-weight: 600;
  line-height: 1.2;
}

.mag-picks-box__more {
  display: block;
  text-align: center;
  font-size: 13px;
  color: var(--pink);
  font-weight: 600;
  padding: 0.75rem 1rem;
  border-top: 1px solid #eee;
  background: #fafafa;
}

.mag-picks-box__more:hover {
  background: var(--pink-bg);
}

.mag-picks-box__footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding: 0.5rem;
  border-top: 1px solid #eee;
  background: #f5f5f5;
}

.mag-picks-box__18 {
  background: var(--black);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 3px;
}

.mag-picks-box__bga {
  font-size: 10px;
  font-weight: 600;
  color: #888;
}

.mag-picks-box__bga:hover {
  color: var(--pink);
}

/* Bigger bingo balls for box */
.mag-pick-ball {
  width: 28px;
  height: 28px;
  font-size: 13px;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #fff;
}

.mag-pick-ball--pink { background: var(--pink); }
.mag-pick-ball--teal { background: var(--teal); }
.mag-pick-ball--purple { background: #8B5CF6; }
.mag-pick-ball--orange { background: #F97316; }
.mag-pick-ball--gold { background: var(--gold); color: #333; }
.mag-pick-ball--red { background: #DC2626; }
.mag-pick-ball--blue { background: #2563EB; }
.mag-pick-ball--green { background: #16A34A; }
.mag-pick-ball--yellow { background: #FBBF24; color: #333; }
.mag-pick-ball--cyan { background: var(--cyan); }
.mag-pick-ball--hotpink { background: #FF1493; }

/* Sidebar Ad Banner */
.mag-ad-sidebar {
  background: #f5f5f5;
  padding: 0.75rem;
  text-align: center;
  margin-top: 1rem;
}

.mag-ad-sidebar__label {
  display: block;
  font-size: 9px;
  color: #999;
  letter-spacing: 1px;
  margin-bottom: 0.5rem;
}

.mag-ad-sidebar__box {
  background: #e0e0e0;
  color: #999;
  font-size: 12px;
  padding: 3rem 1rem;
  border: 1px dashed #ccc;
}

/* Full Width Ad */
.mag-ad-full {
  background: #f5f5f5;
  padding: 0.75rem;
  text-align: center;
  margin: 0;
}

.mag-ad-full__label {
  display: block;
  font-size: 9px;
  color: #999;
  letter-spacing: 1px;
  margin-bottom: 0.25rem;
}

.mag-ad-full__box {
  background: #e0e0e0;
  color: #999;
  font-size: 12px;
  padding: 1.25rem 1rem;
  border: 1px dashed #ccc;
  max-width: 728px;
  margin: 0 auto;
}

/* Mini Ad (above content) */
.mag-mini-ad {
  background: #f5f5f5;
  padding: 0.5rem;
  text-align: center;
  margin-bottom: 1rem;
}

.mag-mini-ad__label {
  display: block;
  font-size: 8px;
  color: #999;
  letter-spacing: 1px;
  margin-bottom: 0.25rem;
}

.mag-mini-ad__content {
  background: #e0e0e0;
  color: #999;
  font-size: 11px;
  padding: 1rem;
  border: 1px dashed #ccc;
}

/* Quick Links Box */
.mag-quick-box {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.mag-quick-box__link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  background: #f9f9f9;
  border-left: 3px solid var(--pink);
  transition: all 0.15s;
}

.mag-quick-box__link:hover {
  background: var(--pink-bg);
  transform: translateX(4px);
}

.mag-quick-box__icon {
  font-size: 18px;
}

.mag-quick-box__text {
  font-size: 13px;
  font-weight: 600;
  color: var(--black);
}

/* Promo Box (editorial style) */
.mag-promo-box {
  margin-top: 1rem;
  padding: 1.25rem;
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  border: 3px solid var(--pink);
  text-align: center;
  box-shadow: var(--shadow-dark);
}

/* Angled label variant */
.mag-promo-box--angled .mag-label {
  margin-bottom: 0.75rem;
}

.mag-promo-box__label {
  display: inline-block;
  background: var(--pink);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  padding: 4px 10px;
  margin-bottom: 0.75rem;
}

.mag-promo-box__text {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  margin: 0 0 0.75rem;
  line-height: 1.3;
}

.mag-promo-box__link {
  display: inline-block;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: var(--pink);
  padding: 0.5rem 1.25rem;
  border-radius: 3px;
  transition: background 0.2s;
}

.mag-promo-box__link:hover {
  background: var(--pink-dark);
  color: #fff;
}

/* Lotto Results Mini */
.mag-lotto-results {
  margin-top: 1rem;
  padding: 1.25rem;
  background: #000;
  border: 3px solid var(--pink);
  text-align: center;
  box-shadow: var(--shadow-dark);
}

.mag-lotto-results__inner {
  max-width: 400px;
  margin: 0 auto;
}

.mag-lotto-results__title {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  margin: 0.5rem 0 1rem;
}

.mag-lotto-results__links {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0.75rem 0;
}

.mag-lotto-results__links a {
  color: rgba(255,255,255,0.8);
  font-size: 14px;
  text-decoration: underline;
}

.mag-lotto-results__links a:hover {
  color: #fff;
}

.mag-lotto-results__sponsor {
  font-size: 13px;
  color: rgba(255,255,255,0.6);
  margin: 1rem 0 0;
}

.mag-lotto-results__sponsor a {
  color: var(--pink-light);
  text-decoration: none;
}

.mag-lotto-results__sponsor a:hover {
  color: var(--pink);
  text-decoration: underline;
}

.mag-lotto-mini {
  background: #000;
  border: 3px solid var(--pink);
  padding: 1rem;
  margin-top: 1rem;
  text-align: center;
  box-shadow: var(--shadow-dark);
}

.mag-lotto-mini__title {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 0 0 0.75rem;
}

.mag-lotto-mini__balls {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 0.75rem;
}

/* Flat lotto balls */
.mag-lotto-mini__ball {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
}

/* National Lottery number range colours - flat solid */
.mag-lotto-mini__ball--1-9   { background: #e0e0e0 !important; color: #333 !important; }
.mag-lotto-mini__ball--10-19 { background: #2196f3 !important; color: #fff !important; }
.mag-lotto-mini__ball--20-29 { background: #e91e8c !important; color: #fff !important; }
.mag-lotto-mini__ball--30-39 { background: #4caf50 !important; color: #fff !important; }
.mag-lotto-mini__ball--40-49 { background: #ffc107 !important; color: #333 !important; }
.mag-lotto-mini__ball--50-59 { background: #9c27b0 !important; color: #fff !important; }

.mag-lotto-mini__ball--bonus {
  outline: 3px solid #ffd700 !important;
  outline-offset: 2px !important;
  border: none !important;
}

.mag-lotto-mini__links {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.mag-lotto-mini__links a {
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  background: #333;
  padding: 0.25rem 0.5rem;
  border-radius: 3px;
  transition: background 0.2s;
}

.mag-lotto-mini__links a:hover {
  background: var(--pink);
  color: #fff;
}

.mag-lotto-mini__credit {
  font-size: 12px;
  color: #aaa;
  margin: 0;
  line-height: 1.4;
}

.mag-lotto-mini__credit a {
  color: var(--pink);
  font-weight: 600;
}

/* Social Media Box - Magazine Style */
.mag-social-box {
  background: #000;
  margin-top: 1rem;
  overflow: hidden;
}

.mag-social-box__header {
  background: var(--pink);
  padding: 0.75rem 1rem;
}

.mag-social-box__title {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  margin: 0;
  text-transform: uppercase;
}

.mag-social-box__sub {
  font-size: 12px;
  color: rgba(255,255,255,0.8);
  padding: 0.75rem 1rem 0.5rem;
  margin: 0;
  line-height: 1.5;
}

.mag-social-box__links {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.mag-social-btn {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  transition: background 0.2s ease;
}

.mag-social-btn:last-child {
  border-bottom: none;
}

.mag-social-btn:hover {
  background: rgba(255,255,255,0.1);
}

.mag-social-btn__icon {
  width: 28px;
  height: 28px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 16px;
}

.mag-social-btn--fb .mag-social-btn__icon { background: #1877F2; }
.mag-social-btn--ig .mag-social-btn__icon { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); }
.mag-social-btn--x .mag-social-btn__icon { background: #000; border: 1px solid #fff; }
.mag-social-btn--yt .mag-social-btn__icon { background: #FF0000; }

.mag-social-btn__label {
  flex: 1;
}

/* Section Finish - full width pink border */
.mag-section-finish {
  display: block;
  width: 100%;
  text-align: center;
  padding: 1rem;
  margin-top: 1.5rem;
  border-top: 3px solid var(--pink);
  border-bottom: 3px solid var(--pink);
  font-family: var(--font-editorial);
  font-size: 14px;
  font-weight: 600;
  color: var(--pink);
  background: #fdf4f7;
}

.mag-section-finish:hover {
  background: var(--pink);
  color: #fff;
}

/* Editor's Picks Sidebar */
.mag-picks-sidebar {
  background: #fff;
  border: 2px solid var(--border);
  border-top: 4px solid var(--pink);
  border-radius: 0 0 8px 8px;
  padding: 1rem;
  margin-bottom: 1rem;
}

.mag-picks-sidebar__title {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-weight: 700;
  color: var(--pink);
  margin: 0 0 0.125rem;
}

.mag-picks-sidebar__sub {
  font-size: 11px;
  color: var(--grey-light);
  font-style: italic;
  margin: 0 0 0.75rem;
}

.mag-picks-sidebar__list {
  list-style: none;
  padding: 0;
  margin: 0 0 0.75rem;
  counter-reset: picks;
}

.mag-picks-sidebar__list li {
  counter-increment: picks;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border);
}

.mag-picks-sidebar__list li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.mag-picks-sidebar__list li a {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  font-size: 12px;
  color: var(--dark);
  transition: color 0.15s;
}

.mag-picks-sidebar__list li a::before {
  content: counter(picks);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  background: var(--pink);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  border-radius: 50%;
  flex-shrink: 0;
}

.mag-picks-sidebar__list li a strong {
  color: var(--black);
}

.mag-picks-sidebar__list li a span {
  color: var(--grey-light);
  font-size: 11px;
}

.mag-picks-sidebar__list li a:hover strong {
  color: var(--pink);
}

.mag-picks-sidebar__more {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--pink);
  text-align: center;
}

.mag-picks-sidebar__more:hover {
  color: var(--pink-dark);
}

/* More From Section Header */
.mag-more-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  margin: 1.5rem 0 0.75rem;
  padding: 0 1rem;
}

.mag-more-header__line-top,
.mag-more-header__line-bottom {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--pink-dark) 15%, var(--pink-dark) 85%, transparent 100%);
}

.mag-more-header__text {
  font-family: var(--font-editorial);
  font-size: 15px;
  font-weight: 700;
  font-style: italic;
  color: var(--pink-dark);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  white-space: nowrap;
  margin-top: 0.25rem;
}

.mag-more-header__stars {
  font-size: 12px;
  color: var(--pink-dark);
  letter-spacing: 3px;
  margin-bottom: 0.25rem;
}

/* Catch Up Box */
.mag-catchup-box {
  margin: 1.5rem 0 1rem;
  padding: 0.75rem 1rem;
  border: 3px solid var(--pink);
  background: #fff;
  text-align: center;
}

.mag-catchup-box__text {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-weight: 700;
  font-style: italic;
  color: var(--pink-dark);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Mini Stories */
.mag-minis { display: flex; flex-direction: column; gap: 0; margin-top: 0.75rem; }

.mag-mini {
  display: block; padding: 0.875rem 1rem; background: #fafafa;
  transition: all 0.15s; margin-bottom: 0.5rem;
  border: 1px solid #e5e5e5;
  box-shadow: var(--shadow-sm);
}

.mag-mini:hover { background: var(--pink-bg); transform: translateX(4px); box-shadow: var(--shadow-md); }

.mag-mini__cat { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: 1px; color: var(--pink); margin-bottom: 0.25rem; transform: rotate(-2deg); }

@media (min-width: 701px) {
  .mag-mini__cat { max-width: 60%; font-size: 11px; }
}
.mag-mini__title { display: block; font-family: var(--font-editorial); font-size: 15px; font-weight: 600; color: var(--black); line-height: 1.4; }
.mag-mini__title::first-letter { font-size: 1.4em; color: var(--pink); font-weight: 700; }
.mag-section--purple-accent .mag-mini__title::first-letter,
.pick-n-mix .mag-mini__title::first-letter { color: var(--purple); }
.mag-section--cyan .mag-mini__title::first-letter,
.daily-daub .mag-mini__title::first-letter { color: var(--cyan); }
.online-bingo .mag-mini__title::first-letter { color: var(--pink); }

/* Mini story modifiers - Take a Break style */
.mag-mini--feature { background: linear-gradient(135deg, #fff9e6 0%, #fff 100%); border-left: 3px solid var(--gold); }
.mag-mini--feature:hover { background: linear-gradient(135deg, #fff3cc 0%, #fff9e6 100%); }

/* Badge base - shared padding/radius */
.mag-mini__cat[class*="--"] { padding: 2px 6px; border-radius: 2px; }

.mag-mini__cat--hot { background: #c62828; color: #fff; }
.mag-mini__cat--red { background: var(--danger); color: #fff; }
.mag-mini__cat--gold { background: var(--gold); color: #1a1a1a; }
.mag-mini__cat--teal { background: var(--teal); color: #fff; }
.mag-mini__cat--pink { background: var(--pink); color: #fff; }
.mag-mini__cat--purple { background: var(--purple); color: #fff; }

.mag-mini__teaser { display: none; font-size: 13px; color: var(--grey); margin-top: 0.375rem; line-height: 1.5; }
.mag-mini__continue { display: none; font-size: 13px; font-style: italic; font-weight: 600; color: var(--pink); margin-top: 0.5rem; }

@media (min-width: 768px) {
  .mag-mini__teaser { display: block; margin-top: 0.5rem; font-size: 14px; }
  .mag-mini__continue { display: block; text-align: right; margin-top: 0.75rem; font-size: 13px; }
  .mag-mini__title { margin-bottom: 0; font-size: 16px; }
  .mag-mini__cat { font-size: 11px; }
}

@media (min-width: 1000px) {
  .mag-mini { padding: 1rem 1.25rem; }
  .mag-mini__title { font-size: 17px; }
  .mag-mini__teaser { font-size: 14px; }
}

@media (min-width: 1000px) {
  .mag-mini { padding: 1rem 1.25rem; }
}

/* More Button */
.mag-more-btn {
  display: block;
  width: fit-content;
  margin: 0.75rem auto 0;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 700;
  font-style: normal;
  padding: 0.75rem 1.5rem;
  background: var(--pink);
  color: #fff;
  border-radius: 4px;
  text-decoration: none;
  text-align: center;
  transition: background 0.15s;
}

.mag-more-btn:hover {
  background: var(--pink-dark);
}

.mag-more-btn--cyan {
  background: var(--cyan);
}

.mag-more-btn--cyan:hover {
  background: var(--cyan-dark);
}

/* ============================================
   SECTION 2: PICKS + ABOUT
   ============================================ */

.mag-picks-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.625rem; margin-bottom: 1rem; }

.mag-pick-card {
  display: flex; align-items: center; gap: 0.625rem; padding: 0.75rem; background: var(--bg); border-radius: 6px; transition: all 0.15s;
}

.mag-pick-card:hover { background: var(--pink-bg); transform: translateX(3px); }

.mag-pick-card__num {
  width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(145deg, var(--pink-light), var(--pink));
  color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex-shrink: 0;
}

.mag-pick-card__num--teal { background: linear-gradient(145deg, var(--teal-light), var(--teal)); }
.mag-pick-card__num--purple { background: linear-gradient(145deg, #ab47bc, var(--purple)); }
.mag-pick-card__num--orange { background: linear-gradient(145deg, #ff8c00, #e65100); }
.mag-pick-card__num--gold { background: linear-gradient(145deg, var(--gold), #daa520); color: #333; }

.mag-pick-card__name { display: block; font-size: 13px; font-weight: 600; color: var(--black); }
.mag-pick-card__why { display: block; font-size: 10px; color: var(--grey-light); }

.mag-picks-panel__more {
  display: block; text-align: center; font-size: 12px; font-weight: 600; color: var(--pink);
  padding-top: 1rem; border-top: 1px solid var(--border);
}

/* About Box */
.mag-about-box {
  background: linear-gradient(135deg, var(--pink-bg) 0%, #fff 100%); padding: 1.25rem; border-left: 3px solid var(--pink); margin-bottom: 1rem;
}

.mag-about-box__title { font-family: var(--font-editorial); font-size: 15px; font-weight: 700; color: var(--pink); margin: 0 0 0.5rem; }
.mag-about-box__text { font-size: 12px; color: var(--grey); line-height: 1.6; margin: 0 0 0.5rem; }
.mag-about-box__link { font-size: 11px; font-weight: 600; color: var(--pink); }

/* Ad Slot */
.mag-ad-slot { text-align: center; }
.mag-ad-slot__label { font-size: 9px; font-weight: 600; letter-spacing: 1px; color: #aaa; display: block; margin-bottom: 0.5rem; }
.mag-ad-slot__box { background: #f0f0f0; border: 1px dashed #ccc; padding: 3.5rem 1rem; color: #999; font-size: 13px; }

/* ============================================
   LOTTO SECTION
   ============================================ */

.mag-lotto-panel {
  background: rgba(255,255,255,0.05); padding: 1.25rem; border-radius: 8px;
}

.mag-lotto-panel__title { font-family: var(--font-editorial); font-size: 17px; font-weight: 700; color: #fff; margin: 0 0 0.25rem; }
.mag-lotto-panel__date { font-size: 11px; color: rgba(255,255,255,0.6); margin: 0 0 1rem; }

.mag-lotto-draw {
  display: flex; align-items: center; gap: 0.875rem; margin-bottom: 0.875rem; flex-wrap: wrap;
}

.mag-lotto-draw:last-child { margin-bottom: 0; }

.mag-lotto-draw__name { font-size: 11px; font-weight: 600; color: rgba(255,255,255,0.7); min-width: 80px; }
.mag-lotto-draw__balls { display: flex; gap: 4px; }

.ball {
  width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; color: #fff; box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.ball--sm { width: 24px; height: 24px; font-size: 10px; }
.ball--pink { background: linear-gradient(145deg, var(--pink-light), var(--pink)); }
.ball--blue { background: linear-gradient(145deg, #42a5f5, #1976d2); }
.ball--purple { background: linear-gradient(145deg, #ab47bc, #7b1fa2); }
.ball--teal { background: linear-gradient(145deg, #26a69a, #00897b); }
.ball--gold { background: linear-gradient(145deg, var(--gold), #ffa000); color: #333; }

.mag-lotto-draw__jp { font-size: 12px; font-weight: 700; color: var(--gold); margin-left: auto; }

/* Lotto Feature Cards */
.mag-lotto-feature {
  display: flex; gap: 1rem; background: rgba(255,255,255,0.08); padding: 1.25rem; border-radius: 8px; margin-bottom: 1rem;
}

.mag-lotto-feature--health { border-left: 3px solid #26a69a; }
.mag-lotto-feature--lottogo { border-left: 3px solid var(--pink); background: rgba(233,30,140,0.1); }

.mag-lotto-feature__logo { font-size: 28px; flex-shrink: 0; }
.mag-lotto-feature__name { font-size: 15px; font-weight: 700; color: #fff; margin: 0 0 0.25rem; }
.mag-lotto-feature__desc { font-size: 11px; color: rgba(255,255,255,0.8); line-height: 1.5; margin: 0 0 0.625rem; }
.mag-lotto-feature__balls { display: flex; gap: 4px; margin-bottom: 0.5rem; }

.mag-lotto-feature__cta {
  display: inline-block; background: var(--pink); color: #fff; font-size: 11px; font-weight: 600;
  padding: 0.5rem 1rem; border-radius: 4px; transition: background 0.15s;
}

.mag-lotto-feature__cta:hover { background: var(--pink-dark); color: #fff; }

.mag-lotto-disclaimer { font-size: 10px; color: rgba(255,255,255,0.4); text-align: center; margin: 1.25rem 0 0; }

/* ============================================
   PICK 'N' MIX (Games Section)
   ============================================ */

.mag-games-col { display: flex; flex-direction: column; gap: 1rem; }

/* Quiz Card */
.mag-quiz-card {
  background: #fff; padding: 1.5rem; border-radius: 8px; border-left: 4px solid var(--pink);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.mag-quiz-card__header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.mag-quiz-card__icon { font-size: 26px; }
.mag-quiz-card__title { font-family: var(--font-editorial); font-size: 17px; font-weight: 700; color: var(--black); margin: 0; }
.mag-quiz-card__meta { font-size: 11px; color: var(--grey-light); margin: 0; }

.mag-quiz-card__q { font-size: 14px; font-weight: 600; color: #333; line-height: 1.4; margin: 0 0 1rem; }

.mag-quiz-card__opts { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-bottom: 0.5rem; }

.mag-quiz-card__opt {
  background: var(--bg); border: 2px solid var(--border); padding: 0.625rem; font-size: 12px; font-weight: 500;
  color: #333; cursor: pointer; border-radius: 4px; transition: all 0.15s;
}

.mag-quiz-card__opt:hover:not(:disabled) { border-color: var(--pink); background: var(--pink-bg); }
.mag-quiz-card__opt:disabled { opacity: 0.7; cursor: default; }
.mag-quiz-card__opt.correct { background: var(--success-bg); border-color: var(--success); color: var(--success); }
.mag-quiz-card__opt.wrong { background: var(--danger-bg); border-color: var(--danger); color: var(--danger); }

.mag-quiz-card__result { font-size: 12px; padding: 0.625rem; border-radius: 4px; margin: 0 0 0.75rem; }
.mag-quiz-card__result:empty { display: none; }
.mag-quiz-card__result.correct { background: var(--success-bg); color: var(--success); }
.mag-quiz-card__result.wrong { background: var(--danger-bg); color: var(--danger); }

.mag-quiz-card__cta {
  display: block; font-size: 12px; font-weight: 600; color: var(--pink); text-align: center;
  padding-top: 0.75rem; border-top: 1px solid var(--border);
}

/* Call of the Day */
.mag-callofday {
  background: linear-gradient(135deg, var(--pink) 0%, var(--pink-dark) 100%); padding: 1.25rem; border-radius: 8px; text-align: center;
}

.mag-callofday__label { font-size: 9px; font-weight: 700; letter-spacing: 2px; color: rgba(255,255,255,0.7); display: block; margin-bottom: 0.625rem; }

.mag-callofday__ball {
  width: 56px; height: 56px; border-radius: 50%; background: #fff; color: var(--pink);
  font-family: var(--font-editorial); font-size: 24px; font-weight: 700; display: flex; align-items: center; justify-content: center;
  margin: 0 auto 0.625rem; box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

.mag-callofday__name { font-family: var(--font-editorial); font-size: 16px; font-weight: 700; color: #fff; margin: 0 0 0.25rem; }
.mag-callofday__origin { font-size: 12px; color: rgba(255,255,255,0.9); margin: 0 0 0.5rem; }
.mag-callofday__link { font-size: 11px; font-weight: 600; color: #fff; opacity: 0.8; }

/* Fact Card */
.mag-fact-card {
  background: #fff; padding: 1.25rem; border-radius: 8px; border-top: 3px solid var(--gold);
}

.mag-fact-card__icon { font-size: 22px; display: block; margin-bottom: 0.375rem; }
.mag-fact-card__title { font-family: var(--font-editorial); font-size: 15px; font-weight: 700; color: var(--black); margin: 0 0 0.375rem; }
.mag-fact-card__text { font-size: 13px; color: var(--grey); line-height: 1.6; margin: 0 0 0.625rem; }
.mag-fact-card__link { font-size: 11px; font-weight: 600; color: var(--pink); }

/* Game Card (Word Search etc) */
.mag-game-card {
  background: #fff; padding: 1.5rem; border-radius: 8px; border-left: 4px solid var(--purple);
  margin-bottom: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.mag-game-card--teal { border-left-color: var(--teal); }

.mag-game-card__header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.mag-game-card__icon { font-size: 26px; }
.mag-game-card__title { font-family: var(--font-editorial); font-size: 17px; font-weight: 700; color: var(--black); margin: 0; }
.mag-game-card__meta { font-size: 11px; color: var(--grey-light); margin: 0; }
.mag-game-card__desc { font-size: 14px; color: #555; line-height: 1.5; margin: 0 0 1rem; }
.mag-game-card__cta {
  display: block; font-size: 13px; font-weight: 600; color: var(--purple); text-align: center;
  padding: 0.75rem; background: rgba(139, 92, 246, 0.1); border-radius: 4px;
}
.mag-game-card__cta:hover { background: rgba(139, 92, 246, 0.2); }
.mag-game-card__cta--teal { color: var(--teal); background: rgba(20, 184, 166, 0.1); }
.mag-game-card__cta--teal:hover { background: rgba(20, 184, 166, 0.2); }

/* Trivia Preview */
.mag-trivia-preview {
  background: #fff; padding: 1.5rem; border-radius: 8px; border-left: 4px solid var(--pink);
  margin-bottom: 1rem;
}

.mag-trivia-preview__header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.mag-trivia-preview__icon { font-size: 26px; }
.mag-trivia-preview__title { font-family: var(--font-editorial); font-size: 17px; font-weight: 700; color: var(--black); margin: 0; }
.mag-trivia-preview__meta { font-size: 11px; color: var(--grey-light); margin: 0; }

.mag-trivia-preview__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem;
}

.mag-trivia-preview__q {
  background: #f9f9f9; padding: 0.75rem; border-radius: 4px;
}

.mag-trivia-preview__num {
  display: inline-block; background: var(--pink); color: #fff;
  font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 3px;
  margin-bottom: 0.25rem;
}

.mag-trivia-preview__q p {
  font-size: 12px; color: #333; line-height: 1.4; margin: 0;
}

.mag-trivia-preview__cta {
  display: block; font-size: 13px; font-weight: 600; color: var(--pink); text-align: center;
  padding: 0.75rem; background: var(--pink-bg); border-radius: 4px;
}
.mag-trivia-preview__cta:hover { background: rgba(233, 30, 140, 0.15); }

/* ============================================
   QUIZ JEEVES SECTION
   ============================================ */

/* Quiz Jeeves Sidebar Box */
.mag-quiz-jeeves-box {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  border: 3px solid var(--purple);
  padding: 1.5rem;
  text-align: center;
  box-shadow: var(--shadow-dark);
}

.mag-quiz-jeeves-box__img {
  width: 180px;
  height: auto;
  margin-bottom: 1rem;
}

.mag-quiz-jeeves-box__text {
  font-family: var(--font-editorial);
  font-size: 15px;
  font-style: italic;
  color: #fff;
  margin: 0;
  line-height: 1.5;
}

.mag-quiz-jeeves-box__text strong {
  color: var(--purple);
}

@media (max-width: 800px) {
  .mag-quiz-jeeves-box__img {
    width: 140px;
  }
}

/* Word of the Day */
.mag-wordofday {
  background: linear-gradient(135deg, var(--teal) 0%, #0d9488 100%); padding: 1.25rem; border-radius: 8px; text-align: center;
}

.mag-wordofday__label { font-size: 9px; font-weight: 700; letter-spacing: 2px; color: rgba(255,255,255,0.7); display: block; margin-bottom: 0.5rem; }
.mag-wordofday__word { font-family: var(--font-editorial); font-size: 24px; font-weight: 700; font-style: italic; color: #fff; margin: 0 0 0.5rem; }
.mag-wordofday__def { font-size: 13px; color: rgba(255,255,255,0.95); line-height: 1.5; margin: 0 0 0.75rem; }
.mag-wordofday__link { font-size: 11px; font-weight: 600; color: #fff; opacity: 0.8; }

/* Browse Tags */
.mag-browse {
  background: #fff; padding: 1.25rem; border-radius: 8px;
}

.mag-browse--alt { background: var(--bg); }

.mag-browse__title { font-size: 13px; font-weight: 700; color: var(--black); margin: 0 0 0.25rem; }
.mag-browse__sub { font-size: 10px; color: var(--grey-light); margin: 0 0 0.625rem; }

.mag-browse__tags { display: flex; flex-wrap: wrap; gap: 0.375rem; }

.mag-browse__tags a {
  font-size: 10px; color: var(--grey); padding: 0.375rem 0.625rem; background: #f0f0f0; border-radius: 20px; transition: all 0.15s;
}

.mag-browse__tags a:hover { background: var(--pink); color: #fff; }

/* ============================================
   WHAT'S ON
   ============================================ */

.mag-whatson-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.25rem;
}

.mag-whatson-card {
  background: #fff; border-radius: 8px; padding: 1rem; display: flex; align-items: flex-start; gap: 0.75rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05); transition: transform 0.15s;
}

.mag-whatson-card:hover { transform: translateY(-2px); }

.mag-whatson-card__day { font-size: 10px; font-weight: 700; color: var(--pink); text-transform: uppercase; }
.mag-whatson-card__date { font-family: var(--font-editorial); font-size: 26px; font-weight: 700; color: var(--black); line-height: 1; }
.mag-whatson-card__title { display: block; font-size: 12px; font-weight: 600; color: var(--black); margin-bottom: 0.125rem; }
.mag-whatson-card__where { display: block; font-size: 10px; color: var(--grey-light); }

.mag-whatson-more { display: block; text-align: center; font-size: 12px; font-weight: 600; color: var(--pink); }

/* ============================================
   SAFETY SECTION
   ============================================ */

.mag-rogue {
  background: #fff; padding: 1.5rem; border-top: 4px solid var(--danger); border-radius: 0 0 8px 8px;
}

.mag-rogue__header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.625rem; }
.mag-rogue__icon { font-size: 22px; }
.mag-rogue__title { font-family: var(--font-editorial); font-size: 17px; font-weight: 700; color: var(--danger); margin: 0; }
.mag-rogue__intro { font-size: 12px; color: var(--grey); margin: 0 0 0.875rem; }

.mag-rogue__list { list-style: none; padding: 0; margin: 0 0 0.875rem; }

.mag-rogue__list li {
  display: flex; justify-content: space-between; align-items: center; padding: 0.625rem 0.75rem;
  background: var(--danger-bg); margin-bottom: 0.375rem; border-radius: 4px;
}

.mag-rogue__name { font-size: 12px; font-weight: 600; color: #333; }
.mag-rogue__status { font-size: 9px; font-weight: 700; color: var(--danger); background: #fff; padding: 0.25rem 0.5rem; border-radius: 3px; }
.mag-rogue__link { font-size: 12px; font-weight: 600; color: var(--danger); }

/* Checker */
.mag-checker {
  background: #fff; padding: 1.5rem; border-top: 4px solid var(--teal); border-radius: 0 0 8px 8px;
}

.mag-checker__header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.625rem; }
.mag-checker__icon { font-size: 22px; }
.mag-checker__title { font-family: var(--font-editorial); font-size: 17px; font-weight: 700; color: var(--teal); margin: 0; }
.mag-checker__intro { font-size: 12px; color: var(--grey); margin: 0 0 0.875rem; }

.mag-checker__form { display: flex; gap: 0.5rem; margin-bottom: 0.5rem; }

.mag-checker__input {
  flex: 1; padding: 0.75rem 1rem; font-size: 13px; border: 2px solid var(--border); border-radius: 4px; transition: border-color 0.15s;
}

.mag-checker__input:focus { outline: none; border-color: var(--teal); }

.mag-checker__btn {
  background: var(--teal); color: #fff; font-size: 13px; font-weight: 600; padding: 0.75rem 1.25rem;
  border: none; border-radius: 4px; cursor: pointer; transition: background 0.15s;
}

.mag-checker__btn:hover { background: var(--teal-light); }

.mag-checker__note { font-size: 10px; color: var(--grey-light); margin: 0; }

/* ============================================
   BRAND STATEMENT
   ============================================ */

.mag-statement {
  background: var(--black); padding: 1.75rem 1.5rem; text-align: center;
}

.mag-statement p {
  font-family: var(--font-editorial); font-size: 15px; color: rgba(255,255,255,0.8); max-width: 580px; margin: 0 auto; line-height: 1.7;
}

/* ============================================
   FOOTER
   ============================================ */

.site-footer {
  background: var(--black); color: rgba(255,255,255,0.6); padding: 1.5rem; text-align: center; font-size: 12px;
}

.site-footer a { color: var(--pink); }
.site-footer a:hover { color: var(--pink-light); }

/* ============================================
   RESPONSIVE
   ============================================ */

/* Desktop - ensure two columns */
@media (min-width: 901px) {
  .mag-row {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 2rem;
  }
  .mag-row--equal {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
}

/* Tablet - narrower sidebar */
@media (max-width: 900px) {
  .mag-row { 
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 1.5rem;
  }
  .mag-row--equal { 
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
  }
  .mag-whatson-grid { grid-template-columns: repeat(2, 1fr); }
  .mag-picks-grid { grid-template-columns: 1fr; }
}

/* Mobile - keep two columns, tighten up */
@media (max-width: 640px) {
  .site-wrapper {
    max-width: 94%;
    margin-left: auto;
    margin-right: 0;
  }
  .mag-row {
    grid-template-columns: 1fr 160px;
    gap: 0.75rem;
  }
  .mag-row--equal { 
    display: block;
  }
  .mag-row--equal .mag-col {
    margin-bottom: 1rem;
  }
  .mag-section {
    padding: 1rem 0.5rem;
  }
  .mag-masthead { background-position: left center; }
  .mag-masthead__title { font-size: 30px; }
  .mag-cover__title { font-size: 20px; }
  .mag-cover__standfirst { font-size: 15px; line-height: 1.5; }
  .mag-cover__body { font-size: 15px; }
  .mag-cover__meta { font-size: 12px; }
  .mag-cover { padding-right: 0.5rem; }
  .mag-greeting { padding: 0.5rem; }
  .mag-greeting__mascot { width: 90px; margin: 0 -0.25rem 0.25rem 0.5rem; }
  .mag-greeting__h1 { font-size: 17px; line-height: 1.25; }
  .mag-greeting__hello { font-size: 18px; }
  .mag-greeting__sub { font-size: 14px; }
  .mag-greeting__desc { font-size: 13px; }
  .mag-picks-panel { padding: 0.75rem; }
  .mag-picks-panel__title { font-size: 15px; }
  .mag-pick-item { padding: 0.4rem 0; }
  .mag-pick-item__num { width: 22px; height: 22px; font-size: 11px; }
  .mag-pick-item__name { font-size: 14px; }
  .mag-pick-name { font-size: 14px; }
  .mag-mini__cat { font-size: 10px; }
  .mag-label { font-size: 12px; padding: 5px 14px; }
  .drop-cap { font-size: 2.5em; }
  .mag-whatson-grid { grid-template-columns: 1fr; }
  .mag-nav-glossy a { padding: 0.75rem 1rem; font-size: 13px; }
  .mag-quiz-card__opts { grid-template-columns: 1fr; }
  .mag-more-header__text { font-size: 13px; }
  .mag-more-header__stars { font-size: 11px; }
  .mag-lotto-mini__title { font-size: 16px; }
  .mag-lotto-mini__ball { width: 38px; height: 38px; font-size: 16px; }
  .mag-lotto-mini__links a { font-size: 12px; }
  .mag-lotto-mini__credit { font-size: 12px; }
  .mag-picks-box__sub { font-size: 13px; }
  .mag-picks-box__title { font-size: 14px; }
  .mag-picks-box .mag-pick-name { font-size: 14px; }
  .mag-picks-box .mag-pick-meta { font-size: 10px; }
  .mag-picks-box .mag-pick-ukgc { font-size: 9px; }
  .mag-catchup-box__text { font-size: 14px; }
  .mag-section-link { font-size: 14px; }
  .mag-contributor-cta__text { font-size: 15px; }
}

/* ============================================
   LIVE GAME SHOWS
   ============================================ */

.mag-shows-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 1rem;
}

.mag-show-card {
  background: #fff;
  padding: 1.25rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  position: relative;
  transition: all 0.15s;
}

.mag-show-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.mag-show-card--bingo {
  border-left: 4px solid var(--pink);
}

.mag-show-card__live {
  position: absolute;
  top: 1rem;
  right: 1rem;
  font-size: 9px;
  font-weight: 700;
  color: #c62828;
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.mag-show-card__title {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-weight: 700;
  color: var(--black);
  margin: 0 0 0.25rem;
}

.mag-show-card__provider {
  font-size: 11px;
  font-weight: 600;
  color: var(--pink);
  margin: 0 0 0.5rem;
}

.mag-show-card__desc {
  font-size: 12px;
  color: var(--grey);
  line-height: 1.5;
  margin: 0 0 0.75rem;
}

.mag-show-card__tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 0.25rem 0.625rem;
  border-radius: 20px;
  background: var(--bg);
  color: var(--grey);
}

.mag-show-card--bingo .mag-show-card__tag {
  background: var(--pink-bg);
  color: var(--pink);
}

.mag-shows-note {
  font-size: 11px;
  color: var(--grey-light);
  text-align: center;
  margin: 0;
}

@media (max-width: 900px) {
  .mag-shows-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .mag-shows-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   SECTION 1: COVER FULL + MINIS ROW
   ============================================ */

.mag-cover--full {
  border-right: none;
  padding-right: 0;
  border-bottom: 3px solid var(--pink);
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
}

.mag-minis-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 1rem;
}

.mag-section-link {
  display: block;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--pink);
  padding: 0.75rem;
  background: var(--pink-bg);
  border-radius: 6px;
  transition: background 0.15s;
}

.mag-section-link:hover {
  background: var(--pink);
  color: #fff;
}

/* Contributor CTA */
.mag-contributor-cta {
  padding: 1.25rem;
  background: #f9f9f9;
  text-align: center;
  margin-top: 1rem;
  box-shadow: var(--shadow-sm);
}

.mag-contributor-cta--full {
  margin-top: 1.5rem;
  width: 100%;
}

.mag-contributor-cta__stars {
  display: block;
  font-size: 10px;
  color: var(--pink);
  letter-spacing: 6px;
  margin: 0.25rem 0;
}

.mag-contributor-cta__text {
  font-family: var(--font-editorial);
  font-size: 17px;
  font-style: italic;
  font-weight: 600;
  color: #222;
  margin: 0.5rem 0;
  line-height: 1.5;
}

.mag-contributor-cta__text a {
  color: var(--pink);
  font-weight: 700;
}

.mag-contributor-cta__text a:hover {
  text-decoration: underline;
}

/* Full-width row layout */
.mag-contributor-cta--row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: 1.5rem 0;
  padding: 1rem 1.5rem;
}

.mag-contributor-cta--row .mag-contributor-cta__stars {
  display: inline;
  margin: 0;
}

.mag-contributor-cta--row .mag-contributor-cta__text {
  margin: 0;
}

/* Bordered style (below ad, smaller) */
.mag-contributor-cta--bordered {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: 1rem 0 0;
  padding: 0;
  background: #fafafa;
  position: relative;
}

/* Fading border effect - top */
.mag-contributor-cta--bordered::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, var(--pink) 15%, var(--pink) 85%, transparent 100%);
}

/* Fading border effect - bottom */
.mag-contributor-cta--bordered::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, var(--pink) 15%, var(--pink) 85%, transparent 100%);
}

.mag-contributor-cta--bordered .mag-contributor-cta__stars {
  display: inline;
  margin: 0;
  font-size: 9px;
}

.mag-contributor-cta--bordered .mag-contributor-cta__text {
  margin: 0;
  font-size: 15px;
}

/* With reporter image - CSS GRID forces two columns always */
.mag-contributor-cta--with-reporter {
  display: grid !important;
  grid-template-columns: 210px 1fr;
  align-items: end;
  gap: 0.5rem;
  padding: 0 1.5rem 0 0;
  position: relative;
}

.mag-contributor-cta--with-reporter .mag-contributor-cta__reporter {
  width: 130px;
  max-width: none;
  height: auto;
  margin-bottom: 0;
  margin-left: 80px;
  margin-top: 10px;
}

.mag-contributor-cta--with-reporter .mag-contributor-cta__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.4rem;
  padding: 1.5rem 0 1rem;
}

.mag-contributor-cta--with-reporter .mag-contributor-cta__stars {
  font-size: 10px;
  color: var(--pink);
  letter-spacing: 6px;
}

.mag-contributor-cta--with-reporter .mag-contributor-cta__text {
  margin: 0;
  font-size: 22px;
  font-weight: 600;
  font-style: italic;
  color: var(--black);
  line-height: 1.4;
}

.mag-contributor-cta--with-reporter .mag-contributor-cta__btn {
  display: inline-block;
  background: var(--pink);
  color: #fff;
  font-family: var(--font-editorial);
  font-size: 14px;
  font-weight: 700;
  padding: 0.4rem 1rem;
  border-radius: 4px;
  text-decoration: none;
  margin-top: 0.25rem;
}

.mag-contributor-cta--with-reporter .mag-contributor-cta__btn:hover {
  background: var(--pink-dark);
}

@media (max-width: 700px) {
  .mag-contributor-cta--bordered.mag-contributor-cta--with-reporter {
    display: grid !important;
    grid-template-columns: 130px 1fr;
    align-items: end;
    gap: 0.25rem;
    padding: 0 0.5rem 0 0;
  }
  .mag-contributor-cta--bordered.mag-contributor-cta--with-reporter .mag-contributor-cta__reporter {
    width: 110px;
    max-width: none;
    margin-bottom: 0;
    margin-left: 15px;
  }
  .mag-contributor-cta--bordered.mag-contributor-cta--with-reporter .mag-contributor-cta__content {
    padding: 1.25rem 0 0.75rem;
  }
  .mag-contributor-cta--bordered.mag-contributor-cta--with-reporter .mag-contributor-cta__text {
    font-size: 18px;
    line-height: 1.3;
  }
  .mag-contributor-cta--bordered.mag-contributor-cta--with-reporter .mag-contributor-cta__btn {
    font-size: 13px;
    padding: 0.35rem 0.85rem;
  }
  .mag-contributor-cta--bordered.mag-contributor-cta--with-reporter .mag-contributor-cta__stars {
    font-size: 9px;
  }
}

@media (max-width: 700px) {
  .mag-contributor-cta--row {
    flex-direction: column;
    gap: 0.5rem;
  }
}

@media (max-width: 700px) {
  .mag-minis-row {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════
   LOTTO PAGES STYLES
   ═══════════════════════════════════════════════════════════ */

.lotto-hub { max-width: 1000px; margin: 0 auto; }

.lotto-hub__header {
  text-align: center; padding: 2rem 1.5rem;
  background: linear-gradient(135deg, #1a1a1a 0%, #000 100%);
  position: relative;
}

.lotto-balls-deco {
  display: flex; justify-content: center; gap: 0.5rem; margin-bottom: 1rem;
}

.deco-ball {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  font-size: 16px; font-weight: 800; color: #fff;
  box-shadow: inset 0 -3px 6px rgba(0,0,0,0.2), inset 0 3px 6px rgba(255,255,255,0.3), 0 4px 8px rgba(0,0,0,0.3);
}

.deco-ball--pink { background: linear-gradient(135deg, #ff6b9d, #C71585); }
.deco-ball--blue { background: linear-gradient(135deg, #64b5f6, #0d47a1); }
.deco-ball--gold { background: linear-gradient(135deg, #fff59d, #f9a825); color: #5d4037; }

.lotto-hub__title {
  font-family: var(--font-editorial); font-size: 32px; font-weight: 700;
  color: #fff; margin: 0 0 0.25rem;
}

.lotto-hub__date {
  font-size: 14px; color: rgba(255,255,255,0.8); margin: 0;
}

/* Lotto Sections */
.lotto-section { padding: 2rem 1.5rem; }
.lotto-section--alt { background: var(--bg); }
.lotto-section--dark { background: var(--black); }

.lotto-section__title {
  font-family: var(--font-editorial); font-size: 22px; font-weight: 700;
  color: var(--black); margin: 0 0 1.25rem;
}

.lotto-section__title--light { color: #fff; }

.lotto-section__sub {
  font-size: 14px; color: var(--grey-light); font-style: italic; margin: -1rem 0 1.5rem;
}

/* Draw Cards */
.draws-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem;
}

.draw-card {
  background: #fff; padding: 1.5rem; border-radius: 12px;
  border: 1px solid var(--border); text-align: center;
}

.draw-card--lotto { border-top: 4px solid #E91E8C; }
.draw-card--euro { border-top: 4px solid #1976d2; }
.draw-card--thunder { border-top: 4px solid #9c27b0; }
.draw-card--life { border-top: 4px solid #00897b; }

.draw-card__header { margin-bottom: 1rem; }

.draw-card__name {
  font-family: var(--font-editorial); font-size: 20px; font-weight: 700;
  color: var(--black); margin: 0 0 0.125rem;
}

.draw-card__day {
  font-size: 11px; color: var(--grey-light);
}

.draw-card__balls {
  display: flex; justify-content: center; gap: 0.375rem;
  margin-bottom: 1rem;
}

.lotto-ball {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  font-size: 14px; font-weight: 800; color: #fff;
  box-shadow: none;
}

.lotto-ball--star { background: #ffd700; color: #333; width: 32px; height: 32px; font-size: 12px; }

.draw-card__jackpot {
  background: var(--bg); padding: 0.75rem; border-radius: 8px; margin-bottom: 0.5rem;
}

.draw-card__jp-label {
  display: block; font-size: 10px; font-weight: 600; color: var(--grey-light); text-transform: uppercase;
}

.draw-card__jp-amount {
  font-size: 22px; font-weight: 800; color: var(--black);
}

.draw-card__note {
  font-size: 11px; color: var(--grey-light); margin: 0;
}

.lotto-disclaimer {
  font-size: 11px; color: var(--grey-light); text-align: center; margin-top: 1.5rem;
}

.lotto-disclaimer a { color: var(--pink); }

/* Other Lotteries */
.other-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem;
}

.other-card {
  background: #fff; padding: 1.25rem; border-radius: 10px;
  border: 1px solid var(--border);
}

.other-card__icon { font-size: 28px; display: block; margin-bottom: 0.5rem; }

.other-card__name {
  font-family: var(--font-editorial); font-size: 16px; font-weight: 700;
  color: var(--black); margin: 0 0 0.375rem;
}

.other-card__desc {
  font-size: 13px; color: var(--grey); line-height: 1.5; margin: 0 0 0.75rem;
}

.other-card__balls { display: flex; gap: 0.25rem; }

.mini-ball {
  width: 24px; height: 24px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 800; color: #fff;
}

.mini-ball--teal { background: linear-gradient(135deg, #4db6ac, #004d40); }

.other-card__tag {
  display: inline-block; font-size: 10px; font-weight: 600;
  padding: 0.2rem 0.6rem; background: var(--bg); color: var(--grey); border-radius: 4px;
}

/* Lotto Picks */
.picks-grid { display: flex; flex-direction: column; gap: 0.75rem; }

.pick-card {
  display: flex; align-items: center; gap: 1rem;
  background: #fff; padding: 1rem 1.25rem; border-radius: 10px;
  border: 1px solid var(--border); transition: all 0.15s;
}

.pick-card:hover {
  border-color: var(--pink); transform: translateX(4px);
}

.pick-card__rank {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), #f9a825);
  font-size: 16px; font-weight: 800; color: #5d4037;
}

.pick-card__info { flex: 1; }

.pick-card__name {
  font-family: var(--font-editorial); font-size: 16px; font-weight: 700;
  color: var(--black); margin: 0 0 0.125rem;
}

.pick-card__why {
  font-size: 13px; color: var(--grey); margin: 0;
}

.pick-card__cta {
  font-size: 13px; font-weight: 600; color: var(--pink);
}

.picks-note {
  font-size: 11px; color: var(--grey-light); text-align: center; margin-top: 1rem;
}

/* World Lotteries Grid */
.world-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}

.world-card {
  background: rgba(255,255,255,0.05); padding: 1rem; border-radius: 8px;
  text-align: center; border: 1px solid rgba(255,255,255,0.1);
}

.world-card__flag { font-size: 28px; display: block; margin-bottom: 0.375rem; }

.world-card__name {
  font-size: 14px; font-weight: 700; color: #fff; margin: 0 0 0.125rem;
}

.world-card__jp {
  font-size: 12px; color: var(--gold); margin: 0;
}

/* Lotto Schedule */
.schedule-table {
  max-width: 500px; margin: 0 auto;
}

.schedule-row {
  display: flex; justify-content: space-between; padding: 0.75rem 0;
  border-bottom: 1px solid var(--border); font-size: 14px;
}

.schedule-row--header {
  font-weight: 700; color: var(--black);
}

.schedule-row span:first-child { font-weight: 600; }
.schedule-row span:last-child { color: var(--grey); }

@media (max-width: 700px) {
  .draws-grid, .other-grid { grid-template-columns: 1fr; }
  .world-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================
   AGE GATE
   ============================================ */

.age-gate {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 1rem;
}

.age-gate.hidden {
  display: none;
}

.age-gate__box {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  border: 3px solid var(--pink);
  border-radius: 12px;
  padding: 2.5rem 2rem;
  max-width: 420px;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(233, 30, 140, 0.2);
  animation: gateSlideIn 0.3s ease-out;
}

@keyframes gateSlideIn {
  from { opacity: 0; transform: scale(0.95) translateY(-20px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

.age-gate__logo {
  font-family: var(--font-editorial);
  font-size: 22px;
  font-weight: 700;
  color: var(--pink);
  letter-spacing: 2px;
  margin-bottom: 1.5rem;
}

.age-gate__title {
  font-family: var(--font-editorial);
  font-size: 28px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 1rem;
}

.age-gate__text {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.5;
  margin: 0 0 1.5rem;
}

.age-gate__buttons {
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin-bottom: 1.5rem;
}

.age-gate__btn {
  padding: 0.875rem 2rem;
  font-size: 15px;
  font-weight: 700;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.15s;
  cursor: pointer;
  border: none;
}

.age-gate__btn--yes {
  background: var(--pink);
  color: #fff;
}

.age-gate__btn--yes:hover {
  background: var(--pink-dark);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(233, 30, 140, 0.4);
}

.age-gate__btn--no {
  background: transparent;
  color: rgba(255, 255, 255, 0.7);
  border: 2px solid rgba(255, 255, 255, 0.3);
}

.age-gate__btn--no:hover {
  border-color: rgba(255, 255, 255, 0.5);
  color: #fff;
}

.age-gate__footer {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
  margin: 0;
}

@media (max-width: 480px) {
  .age-gate__box {
    padding: 2rem 1.5rem;
  }
  .age-gate__title {
    font-size: 24px;
  }
  .age-gate__buttons {
    flex-direction: column;
  }
  .age-gate__btn {
    width: 100%;
  }
}

/* ============================================
   PICK N MIX — LAYOUT
   ============================================ */

.mag-section--pnm { background: transparent; }

.mag-row--pnm {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 2rem;
  align-items: start;
  padding: 1.25rem 0 0.5rem;
}

.mag-col--pnm-games {
  min-width: 0;
  border-right: 1px solid var(--border);
}

.mag-col--pnm-id {
  min-width: 0;
  display: block;
  text-align: left;
  padding-top: 0.25rem;
}

.mag-col--pnm-id .pnm-mascot {
  width: 150px;
  margin: 0.5rem 0;
}

.mag-col--pnm-id .mag-cover__standfirst {
  text-align: left;
  margin: 0;
}

/* Top prize sits below grid */
.mag-section--alt .mag-top-prize {
  display: block;
  text-align: center;
  margin: 0.75rem 0 1rem;
}

/* Purple section stars */
.mag-section-stars--purple { color: var(--purple); opacity: 1; }
.mag-section-stars--left   { text-align: left; }

/* Purple faded border */
.mag-faded-border--purple {
  background: linear-gradient(90deg, transparent 0%, var(--purple) 20%, var(--purple) 80%, transparent 100%);
}
.mag-faded-border--top { margin: 0 0 1rem; }

/* Mobile layout */
@media (max-width: 640px) {
  .mag-row--pnm { gap: 0.75rem; }
  .mag-col--pnm-games { padding: 0.75rem 0.75rem 0.75rem 0.875rem; }
}

/* ============================================
   PICK N MIX — DID U KNOW BOX
   ============================================ */

.pnm-did-you-know {
  background: var(--black);
  border: 3px solid var(--purple);
  padding: 1rem 1.25rem;
  margin-bottom: 0.75rem;
  text-align: center;
  display: flex;
  flex-direction: column;
}

.pnm-did-you-know__fact {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-style: italic;
  color: var(--white);
  margin: 0;
  line-height: 1.6;
  flex: 1;
  min-height: 80px;
  height: 80px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 768px) {
  .pnm-did-you-know__fact { font-size: 17px; line-height: 1.65; }
}

.pnm-did-you-know__title {
  text-align: center;
  margin: 0 0 0.75rem;
}

.pnm-did-you-know__title span {
  display: inline-block;
  background: var(--cyan);
  color: var(--white);
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 700;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 4px 14px;
  transform: skewX(-6deg);
}

.pnm-did-you-know__title span em {
  display: inline-block;
  transform: skewX(6deg);
  font-style: normal;
}

/* ============================================
   PICK N MIX — SCOREBOARD
   ============================================ */

.pnm-scoreboard {
  background: var(--black);
  border: 2px solid var(--purple);
  padding: 1rem;
  width: 100%;
}

.pnm-scoreboard--full {
  display: block;
  border: none;
  border-top: 2px solid var(--purple);
  border-bottom: 2px solid var(--purple);
  padding: 0.75rem 1rem;
  margin: 0.75rem 0 0.5rem;
}

.pnm-scoreboard__title {
  margin: 0 0 0.75rem;
  line-height: 1.8;
  text-align: center;
}

.pnm-scoreboard__game {
  display: inline-block;
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 4px 14px;
}

.pnm-scoreboard__game em { display: inline-block; font-style: normal; }

.pnm-scoreboard__game--pink   { background: var(--pink);       color: var(--white); }
.pnm-scoreboard__game--purple { background: var(--purple);     color: var(--white); }
.pnm-scoreboard__game--teal   { background: var(--teal);       color: var(--white); }
.pnm-scoreboard__game--violet { background: var(--card-violet);color: var(--white); }
.pnm-scoreboard__game--rose   { background: var(--card-rose);  color: var(--white); }

.pnm-scoreboard__label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--white);
  margin-top: 0.25rem;
}

.pnm-scoreboard__row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-size: 13px;
}

.pnm-scoreboard__row:last-of-type { border-bottom: none; }

.pnm-scoreboard__pos {
  width: 22px;
  height: 22px;
  background: var(--purple);
  color: var(--white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}

.pnm-pos--pink   { background: var(--pink)         !important; }
.pnm-pos--purple { background: var(--purple)       !important; }
.pnm-pos--teal   { background: var(--teal)         !important; }
.pnm-pos--violet { background: var(--card-violet)  !important; }
.pnm-pos--rose   { background: var(--card-rose)    !important; }

.pnm-scoreboard__name  { flex: 1; font-weight: 600; font-size: 13px; color: var(--white); }
.pnm-scoreboard__score { font-weight: 700; font-size: 13px; color: var(--white); }

.pnm-scoreboard__prize {
  font-size: 11px;
  text-align: center;
  color: rgba(255,255,255,0.5);
  font-style: italic;
  margin: 0.6rem 0 0;
  letter-spacing: 1px;
}

/* Full scoreboard overrides */
.pnm-scoreboard--full .pnm-scoreboard__title { color: var(--white); }
.pnm-scoreboard--full .pnm-scoreboard__row   { border-bottom-color: rgba(255,255,255,0.08); }

/* Rotating boards */
.pnm-board-panel { display: none; animation: pnm-slide-in 0.4s ease; }
.pnm-board-panel--active { display: block; }

@keyframes pnm-slide-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.pnm-board-nav {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin: 0.6rem 0 0.25rem;
}

.pnm-board-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.25);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s;
}

.pnm-board-dot--active { background: var(--purple); }

/* ============================================
   PICK N MIX — JEEVES COLUMN
   ============================================ */

.mag-greeting__h1--jeeves { font-size: 28px; line-height: 1.2; }

.mag-greeting--purple .mag-greeting__mascot {
  width: 220px;
  shape-outside: url('/assets/images/quiz-jeeves.webp');
}

.mag-greeting__mascot--jeeves {
  margin-top: 20px;
  position: relative;
}

.pnm-jeeves-trivia { padding: 0.5rem 0 0.5rem 0.75rem; }

.pnm-jeeves-trivia__beat { font-size: 13px; margin: 0.6rem 0 0; color: var(--purple); }
.pnm-jeeves-trivia__beat a { color: var(--purple); text-decoration: none; }
.pnm-jeeves-trivia__beat a:hover { text-decoration: underline; }

.mag-mini__jeeves-q {
  display: block;
  background: var(--black);
  border: 2px solid var(--purple);
  color: var(--white);
  font-family: var(--font-editorial);
  font-size: 14px;
  font-style: italic;
  font-weight: 600;
  line-height: 1.4;
  padding: 1rem 1.25rem;
  margin: 0.75rem 0;
}

/* ============================================
   PICK N MIX — AD BOX & DISCLAIMER
   ============================================ */

.pnm-ad-box {
  margin-top: 0.75rem;
  background: #f5f5f5;
  border: 1px dashed #ccc;
  padding: 0.6rem;
  text-align: center;
  position: relative;
}

.pnm-ad-box__placeholder { font-size: 11px; color: #aaa; margin: 0; padding: 0.75rem 0; }

.pnm-disclaimer {
  font-size: 11px;
  color: var(--grey-light);
  text-align: center;
  margin: 0.5rem 0 0.75rem;
  line-height: 1.6;
}

.pnm-disclaimer a { color: var(--grey-light); text-decoration: underline; }

/* ============================================
   RESPONSIBLE GAMBLING BAR
   ============================================ */

.responsible {
  background: var(--black);
  padding: 0.75rem 1rem;
  text-align: center;
}

.responsible__text {
  font-size: 12px;
  color: rgba(255,255,255,0.7);
  margin: 0;
}

.responsible__text strong { color: var(--white); }
.responsible__text a { color: var(--cyan); }
.responsible__text a:hover { color: var(--white); }

.responsible--games { background: #f0f7f0; }
.responsible--games .responsible__text { color: #2d6a2d; }

/* ============================================
   PURPLE BUTTON & LINK VARIANTS
   ============================================ */

.mag-more-btn--purple { background: var(--purple); display: block; margin-top: 0.75rem; }
.mag-more-btn--purple:hover { background: #6d28d9; }

.mag-cover__continue--purple { color: var(--purple); }
.mag-cover__continue--purple:hover { color: #6d28d9; }

/* ============================================
   MOBILE — PNM OVERRIDES
   ============================================ */

@media (max-width: 640px) {
  .pnm-did-you-know       { padding: 0.6rem; min-height: 170px; }
  .pnm-did-you-know__title span { font-size: 11px; padding: 2px 6px; }
  .pnm-did-you-know__fact { font-size: 13px; line-height: 1.3; }
  .pnm-scoreboard__name   { font-size: 14px; }
  .pnm-scoreboard__score  { font-size: 14px; }
  .pnm-scoreboard__pos    { width: 24px; height: 24px; font-size: 13px; }
  .pnm-scoreboard__row    { padding: 0.4rem 0; }
  .pnm-scoreboard__label  { font-size: 10px; letter-spacing: 1px; }
  .mag-greeting__mascot--jeeves { margin-top: 0; width: 160px; }
}

/* Nav social icons */
.mag-nav-social {
  display: flex;
  align-items: center;
  gap: 0;
  margin-left: auto;
  flex-shrink: 0;
}

.mag-nav-social__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 100%;
  color: rgba(255,255,255,0.6);
  transition: color 0.2s;
}

.mag-nav-social__link:hover { color: var(--pink); }

@media (max-width: 640px) {
  .mag-nav-social { display: none; }
}

/* ============================================
   SECTION MASTHEAD — per-section hero
   ============================================ */

.mag-section-masthead {
  padding: 2rem 0 1.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 3px solid var(--pink);
}

.mag-section-masthead--pink  { border-bottom-color: var(--pink); }
.mag-section-masthead--blue  { border-bottom-color: #3B82F6; }
.mag-section-masthead--gold  { border-bottom-color: var(--gold); }
.mag-section-masthead--purple { border-bottom-color: var(--purple); }
.mag-section-masthead--red   { border-bottom-color: var(--danger); }
.mag-section-masthead--teal  { border-bottom-color: var(--teal); }

.mag-section-masthead__title {
  font-family: var(--font-editorial);
  font-size: 42px;
  font-weight: 700;
  color: var(--black);
  margin: 0.5rem 0 0.25rem;
  line-height: 1.1;
}

.mag-section-masthead__sub {
  font-size: 16px;
  font-style: italic;
  color: var(--grey);
  margin: 0;
}

/* ============================================
   PAGE LAYOUT — main + sidebar
   ============================================ */

/* Width wrapper */
.w {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

/* Pink more button */
.mag-more-btn--pink {
  background: var(--pink);
}

.mag-more-btn--pink:hover {
  background: var(--pink-dark);
}

@media (max-width: 900px) {
  .mag-row--sidebar {
    grid-template-columns: 1fr;
  }

  .mag-col--sidebar {
    order: -1;
  }

  .mag-section-masthead__title {
    font-size: 30px;
  }
}

/* ============================================
   PAGE HEADER — section h1 + sub, full width
   ============================================ */

.mag-page-header {
  padding: 1.5rem 1.25rem 1rem;
  border-bottom: 3px solid var(--pink);
  margin-bottom: 1.5rem;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

.mag-page-header__title {
  font-family: var(--font-editorial);
  font-size: 38px;
  font-weight: 700;
  color: var(--black);
  margin: 0.25rem 0 0.25rem;
  line-height: 1.1;
}

.mag-page-header__sub {
  font-size: 15px;
  font-style: italic;
  color: var(--grey);
  margin: 0;
}

@media (max-width: 640px) {
  .mag-page-header__title { font-size: 26px; }
}

/* ============================================
   SECTION BANNER — above sidebar greeting
   ============================================ */

.mag-section-banner {
  padding: 1rem 1.25rem;
  text-align: center;
  margin-bottom: 0;
}

.mag-section-banner--pink   { background: var(--pink); }
.mag-section-banner--blue   { background: #3B82F6; }
.mag-section-banner--gold   { background: var(--gold); }
.mag-section-banner--purple { background: var(--purple); }
.mag-section-banner--red    { background: var(--danger); }
.mag-section-banner--teal   { background: var(--teal); }

.mag-section-banner__label {
  display: block;
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  letter-spacing: 1px;
}

.mag-section-banner__sub {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.75);
  margin: 0.2rem 0 0;
}

/* ============================================
   BINGO FACTS SIDEBAR STRIP
   ============================================ */

.mag-bingo-facts {
  background: var(--black);
  padding: 0.75rem 1rem;
  margin-bottom: 0;
}

.mag-bingo-fact {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.mag-bingo-fact:last-child {
  border-bottom: none;
}

.mag-bingo-fact__stat {
  font-family: var(--font-editorial);
  font-size: 17px;
  font-weight: 700;
  color: var(--pink);
  white-space: nowrap;
  flex-shrink: 0;
  min-width: 65px;
}

.mag-bingo-fact__text {
  font-size: 12px;
  color: rgba(255,255,255,0.8);
  line-height: 1.4;
}

.pnm-did-you-know__link {
  display: block;
  margin-top: 0.75rem;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: #fff;
  text-align: center;
  background: var(--purple);
  padding: 0.5rem 1rem;
}

.pnm-did-you-know__link:hover {
  background: #6d28d9;
  color: #fff;
}

/* Mini card border colour variants — card accent colours only */
.mag-mini--pink   { border-left: 4px solid var(--card-rose); }
.mag-mini--cyan   { border-left: 4px solid var(--card-sky); }
.mag-mini--teal   { border-left: 4px solid var(--card-lime); }
.mag-mini--gold   { border-left: 4px solid var(--card-amber); }
.mag-mini--purple { border-left: 4px solid var(--card-violet); }
.mag-mini--red    { border-left: 4px solid var(--card-coral); }

.mag-mini--pink   .mag-mini__title::first-letter { color: var(--card-rose); }
.mag-mini--cyan   .mag-mini__title::first-letter { color: var(--card-sky); }
.mag-mini--teal   .mag-mini__title::first-letter { color: var(--card-lime); }
.mag-mini--gold   .mag-mini__title::first-letter { color: var(--card-amber); }
.mag-mini--purple .mag-mini__title::first-letter { color: var(--card-violet); }
.mag-mini--red    .mag-mini__title::first-letter { color: var(--card-coral); }

/* Daily Daub blue label */
.mag-label--cyan { background: var(--cyan); }

/* ============================================
   DAILY DAUB — MIXED LAYOUT
   ============================================ */

/* 3-column news grid */
.daub-news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 1rem;
}

.daub-story-card {
  display: flex;
  flex-direction: column;
  padding: 1rem;
  background: #fff;
  border: 1px solid var(--border);
  border-top: 3px solid var(--border);
  transition: all 0.15s;
}

.daub-story-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.daub-story-card__cat {
  font-family: var(--font-sans);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
  display: block;
}

/* Category colours — top border + label */
.daub-story-card__cat--news     { color: var(--cyan); }
.daub-story-card__cat--rogue    { color: var(--danger); }
.daub-story-card__cat--nostalgia{ color: var(--card-amber); }
.daub-story-card__cat--brand    { color: var(--card-violet); }
.daub-story-card__cat--player   { color: var(--card-lime); }
.daub-story-card__cat--whatson  { color: var(--cyan); }

.daub-story-card:has(.daub-story-card__cat--news)     { border-top-color: var(--cyan); }
.daub-story-card:has(.daub-story-card__cat--rogue)    { border-top-color: var(--danger); }
.daub-story-card:has(.daub-story-card__cat--nostalgia){ border-top-color: var(--card-amber); }
.daub-story-card:has(.daub-story-card__cat--brand)    { border-top-color: var(--card-violet); }
.daub-story-card:has(.daub-story-card__cat--player)   { border-top-color: var(--card-lime); }
.daub-story-card:has(.daub-story-card__cat--whatson)  { border-top-color: var(--cyan); }

.daub-story-card__title {
  font-family: var(--font-editorial);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--black);
  margin: 0 0 0.5rem;
  flex: 1;
}

.daub-story-card__teaser {
  font-size: 12px;
  color: var(--grey);
  line-height: 1.4;
  margin: 0 0 0.5rem;
}

.daub-story-card__read {
  font-size: 11px;
  font-weight: 700;
  color: var(--pink);
  margin-top: auto;
}

/* Feature blocks — What's On + Why We Picked */
.daub-feature-block {
  padding: 1.25rem;
  height: 100%;
}

.daub-feature-block--cyan { background: #e0f7fa; border-left: 4px solid var(--cyan); }
.daub-feature-block--pink { background: var(--pink-bg); border-left: 4px solid var(--pink); }

.daub-feature-block__title {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  color: var(--black);
  margin: 0.5rem 0 0.75rem;
}

.daub-feature-block__body {
  font-size: 13px;
  color: var(--grey);
  line-height: 1.6;
  margin: 0 0 0.75rem;
}

/* What's On list */
.daub-whatson-list {
  list-style: none;
  padding: 0;
  margin: 0 0 0.75rem;
}

.daub-whatson-item {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  font-size: 12px;
  line-height: 1.4;
}

.daub-whatson-item:last-child { border-bottom: none; }

.daub-whatson-item__day {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.5px;
  background: var(--cyan);
  color: #fff;
  padding: 2px 5px;
  border-radius: 2px;
  white-space: nowrap;
  margin-top: 2px;
  flex-shrink: 0;
}

.daub-whatson-item p { margin: 0.1rem 0 0; color: var(--grey); }
.daub-whatson-item strong { color: var(--black); }

/* Mobile */
@media (max-width: 640px) {
  .daub-news-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 400px) {
  .daub-news-grid { grid-template-columns: 1fr; }
}

/* ============================================
   BLUE SECTION MODIFIERS — Daily Daub
   ============================================ */

.mag-section--cyan .drop-cap               { color: var(--cyan); }
.mag-section--cyan a.mag-cover__continue   { color: var(--cyan); }
.mag-section--cyan a.mag-cover__continue:hover { color: var(--cyan-dark); }
.mag-section--cyan .mag-editorial-pull     { background: #e0f7fa; border-top-color: var(--cyan); border-bottom-color: var(--cyan); }
.mag-section--cyan .mag-section-stars      { color: var(--cyan); opacity: 1; }
.mag-section--cyan .mag-more-label         { color: var(--cyan); }
.mag-section--cyan .mag-cover__title--pink { color: var(--cyan); }

/* ============================================
   HAPPY FAMILIES — Family cards
   ============================================ */

.hf-family {
  margin-bottom: 1.5rem;
}

.hf-family__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-left: 5px solid var(--pink);
  padding-left: 1rem;
  margin-bottom: 0.875rem;
  gap: 1rem;
}

.hf-family__name {
  font-family: var(--font-editorial);
  font-size: 24px;
  font-weight: 700;
  color: var(--black);
  margin: 0.3rem 0 0.1rem;
  line-height: 1.2;
}

.hf-family__tagline {
  font-size: 13px;
  font-style: italic;
  color: var(--grey);
  margin: 0;
}

.hf-family__meta {
  text-align: right;
  flex-shrink: 0;
}

.hf-family__parent {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--dark);
}

.hf-family__licence {
  display: block;
  font-size: 10px;
  color: var(--grey-light);
  margin-top: 2px;
}

.hf-family__about {
  font-size: 14px;
  color: var(--dark);
  line-height: 1.65;
  margin: 0 0 0.875rem;
}

/* Member list */
.hf-members {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.hf-member {
  background: var(--bg);
  border: 1px solid var(--border);
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  position: relative;
}

.hf-member--nobingo { opacity: 0.6; }

.hf-member__name {
  font-size: 13px;
  font-weight: 700;
  color: var(--black);
}

.hf-member__note {
  font-size: 11px;
  color: var(--grey);
}

.hf-member__tag {
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.5px;
  color: #fff;
  padding: 1px 5px;
  border-radius: 2px;
}

.hf-footer-note {
  font-size: 13px;
  color: var(--grey);
  line-height: 1.6;
  padding: 1rem;
  background: var(--bg);
  border: 1px solid var(--border);
  margin-top: 0.5rem;
}

.hf-footer-note a { color: var(--pink); }

/* Mobile */
@media (max-width: 640px) {
  .hf-members { grid-template-columns: 1fr 1fr; }
  .hf-family__header { flex-direction: column; gap: 0.25rem; }
  .hf-family__meta { text-align: left; }
}

/* ============================================
   BRAND DIRECTORY — A-Z telephone style
   ============================================ */

.dir-az-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 1rem 0 1.5rem;
  padding: 0.75rem;
  background: var(--black);
  border: 2px solid var(--pink);
}

.dir-az-nav__letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  font-family: var(--font-editorial);
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: rgba(255,255,255,0.1);
  transition: background 0.15s;
}

.dir-az-nav__letter:hover { background: var(--pink); color: #fff; }

.dir-letter-group {
  margin-bottom: 1.5rem;
}

.dir-letter-group__letter {
  font-family: var(--font-editorial);
  font-size: 28px;
  font-weight: 700;
  color: var(--pink);
  border-bottom: 2px solid var(--pink);
  padding-bottom: 0.25rem;
  margin: 0 0 0.5rem;
}

.dir-listing {
  border: 1px solid var(--border);
}

.dir-entry {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.6rem 0.875rem;
  border-bottom: 1px solid var(--border);
  gap: 1rem;
}

.dir-entry:last-child { border-bottom: none; }
.dir-entry--affiliate { background: #fafafa; }

.dir-entry__main {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  flex-wrap: wrap;
  flex: 1;
}

.dir-entry__name {
  font-size: 14px;
  font-weight: 700;
  color: var(--black);
}

.dir-entry__star { color: var(--pink); margin-left: 2px; }

.dir-entry__platform {
  font-size: 11px;
  color: var(--grey-light);
  background: #f0f0f0;
  padding: 1px 6px;
  border-radius: 2px;
}

.dir-entry__tagline {
  font-size: 12px;
  color: var(--grey);
  font-style: italic;
}

.dir-entry__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.dir-entry__rating {
  font-size: 12px;
  font-weight: 700;
  color: var(--pink);
  white-space: nowrap;
}

.dir-entry__count { color: var(--grey-light); font-weight: 400; }

.dir-entry__link {
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background: var(--pink);
  padding: 3px 10px;
  white-space: nowrap;
  transition: background 0.15s;
}

.dir-entry__link:hover { background: var(--pink-dark); }

/* ============================================
   PLAYER REVIEW FORM
   ============================================ */

.player-review-form {
  background: var(--bg);
  border: 2px solid var(--pink);
  padding: 1.5rem;
  margin: 1.5rem 0;
}

.player-review-form__header { margin-bottom: 1.25rem; }

.player-review-form__title {
  font-family: var(--font-editorial);
  font-size: 22px;
  font-weight: 700;
  color: var(--black);
  margin: 0.4rem 0 0.25rem;
}

.player-review-form__sub {
  font-size: 13px;
  color: var(--grey);
  margin: 0;
}

.prf-field {
  margin-bottom: 1rem;
}

.prf-field--half {
  display: inline-block;
  width: calc(50% - 0.5rem);
  vertical-align: top;
}

.prf-field--half + .prf-field--half { margin-left: 0.75rem; }

.prf-label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--dark);
  margin-bottom: 0.4rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.prf-label__note { font-weight: 400; color: var(--grey-light); text-transform: none; }

.prf-thumbs {
  display: flex;
  gap: 0.75rem;
}

.prf-thumb {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 1.25rem;
  border: 2px solid var(--border);
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  transition: all 0.15s;
}

.prf-thumb input { display: none; }
.prf-thumb--yes:has(input:checked) { border-color: var(--success); background: var(--success-bg); color: var(--success); }
.prf-thumb--no:has(input:checked)  { border-color: var(--danger); background: var(--danger-bg); color: var(--danger); }
.prf-thumb:hover { border-color: var(--pink); }

.prf-stars {
  display: flex;
  gap: 4px;
}

.prf-star {
  cursor: pointer;
  font-size: 26px;
  color: #ddd;
  transition: color 0.1s;
}

.prf-star input { display: none; }
.prf-star:has(input:checked) ~ .prf-star span,
.prf-star:has(input:checked) span { color: var(--gold); }
.prf-stars:has(.prf-star:hover) .prf-star:not(:hover) ~ .prf-star span { color: #ddd; }
.prf-stars .prf-star:hover span,
.prf-stars .prf-star:hover ~ .prf-star span { color: #ddd; }
.prf-stars .prf-star span:hover,
.prf-stars:hover .prf-star:hover span { color: var(--gold); }

.prf-select,
.prf-input,
.prf-textarea {
  width: 100%;
  padding: 0.6rem 0.75rem;
  border: 2px solid var(--border);
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--dark);
  background: #fff;
  transition: border-color 0.15s;
}

.prf-select:focus,
.prf-input:focus,
.prf-textarea:focus {
  outline: none;
  border-color: var(--pink);
}

.prf-textarea { resize: vertical; }

.prf-terms {
  font-size: 12px;
  color: var(--grey);
  margin-bottom: 1rem;
}

.prf-terms label { display: flex; gap: 0.5rem; align-items: flex-start; cursor: pointer; }
.prf-terms input { flex-shrink: 0; margin-top: 2px; }

.prf-note {
  font-size: 11px;
  color: var(--grey-light);
  text-align: center;
  margin: 0.5rem 0 0;
}

@media (max-width: 640px) {
  .prf-field--half { width: 100%; margin-left: 0; display: block; }
  .dir-entry { flex-direction: column; align-items: flex-start; gap: 0.4rem; }
  .dir-entry__main { flex-direction: column; gap: 0.2rem; }
}

/* ============================================
   LOTTO CROSSOVER STRIP — compact, gold
   ============================================ */

.ob-lotto-strip {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: var(--black);
  border: 2px solid var(--gold);
  padding: 0.6rem 0.875rem;
  margin-top: 1rem;
  transition: background 0.15s;
}

.ob-lotto-strip:hover { background: #1a1a1a; }

.ob-lotto-strip__label {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1px;
  background: var(--gold);
  color: var(--black);
  padding: 3px 8px;
  white-space: nowrap;
  flex-shrink: 0;
}

.ob-lotto-strip__balls {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

/* Override standard ball size for strip */
.ob-lotto-strip__balls .mag-lotto-mini__ball {
  width: 28px;
  height: 28px;
  font-size: 12px;
}

.ob-lotto-strip__content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}

.ob-lotto-strip__text {
  font-size: 12px;
  color: rgba(255,255,255,0.8);
  line-height: 1.3;
}

.ob-lotto-strip__text strong { color: var(--gold); }

.ob-lotto-strip__cta {
  font-size: 11px;
  font-weight: 700;
  color: var(--gold);
}

/* ============================================
   SCAM CHECK BAR — red clickable header
   ============================================ */

.scam-check-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--danger);
  padding: 0.75rem 1rem;
  margin-bottom: 0;
  transition: background 0.15s;
}

.scam-check-bar:hover { background: #b71c1c; }

.scam-check-bar__icon { font-size: 12px; flex-shrink: 0; }

.scam-check-bar__text {
  font-family: var(--font-editorial);
  font-size: 15px;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  letter-spacing: 0.5px;
  flex: 1;
  text-align: center;
}

.scam-check-bar__arrow {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255,255,255,0.7);
  flex-shrink: 0;
}

.mag-faded-border--lotto {
  height: 4px;
  background: linear-gradient(90deg, transparent 0%, #e0e0e0 20%, #e0e0e0 80%, transparent 100%);
  margin: 1.5rem 0 0;
}

/* ============================================
   BRITISH BINGO SITES — Magazine hub grid
   ============================================ */

.bbs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  margin-bottom: 1rem;
}

.bbs-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border);
  overflow: hidden;
  transition: all 0.15s;
  box-shadow: var(--shadow-sm);
}

.bbs-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
  border-color: var(--pink);
}

.bbs-card__stripe {
  height: 5px;
  width: 100%;
}

.bbs-card__body {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem;
  flex: 1;
}

.bbs-card__logo {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex-shrink: 0;
  border: 1px solid var(--border);
  padding: 4px;
}

.bbs-card__initial {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-editorial);
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
}

.bbs-card__info { flex: 1; min-width: 0; }

.bbs-card__name {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-weight: 700;
  color: var(--black);
  margin: 0 0 0.2rem;
  line-height: 1.2;
}

.bbs-card__tagline {
  font-size: 12px;
  font-style: italic;
  color: var(--grey);
  margin: 0 0 0.4rem;
  line-height: 1.3;
}

.bbs-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.bbs-card__platform,
.bbs-card__operator {
  font-size: 10px;
  font-weight: 600;
  background: #f0f0f0;
  color: var(--grey);
  padding: 1px 6px;
  border-radius: 2px;
}

.bbs-card__footer {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 1rem;
  background: var(--bg);
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}

.bbs-card__stars {
  font-size: 12px;
  color: var(--gold);
  flex-shrink: 0;
}

.bbs-card__score {
  color: var(--dark);
  font-weight: 700;
}

.bbs-card__reviews {
  font-size: 11px;
  color: var(--grey-light);
  flex: 1;
}

.bbs-card__cta {
  font-size: 11px;
  font-weight: 700;
  color: var(--pink);
  white-space: nowrap;
  margin-left: auto;
}

/* Others — compact list below the grid */
.bbs-others {
  border: 1px solid var(--border);
}

.bbs-other {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.875rem;
  border-bottom: 1px solid var(--border);
  transition: background 0.1s;
  font-size: 13px;
}

.bbs-other:last-child { border-bottom: none; }
.bbs-other:hover { background: var(--pink-bg); }

.bbs-other__name { font-weight: 600; color: var(--black); flex: 1; }
.bbs-other__platform { font-size: 10px; color: var(--grey-light); background: #f0f0f0; padding: 1px 5px; }
.bbs-other__reviews { font-size: 11px; color: var(--grey-light); }
.bbs-other__arrow { color: var(--pink); font-weight: 700; margin-left: auto; }

/* Mobile */
@media (max-width: 640px) {
  .bbs-grid { grid-template-columns: 1fr; }
}

/* Lotto slogan — appears in boxes and on lotto page */
.mag-lotto-results__slogan {
  font-family: var(--font-editorial);
  font-size: 14px;
  font-style: italic;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  margin: 0.4rem 0 0.5rem;
  letter-spacing: 0.3px;
}

.lotto-hub__slogan {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-style: italic;
  color: rgba(255,255,255,0.75);
  margin: 0.25rem 0 0.5rem;
}

/* ============================================
   BRAND REVIEW PAGE
   ============================================ */

.breadcrumb {
  font-size: 12px;
  color: var(--grey);
  padding: 0.75rem 0;
  margin: 0 auto;
  max-width: 1160px;
  padding-left: 1.25rem;
}

.breadcrumb a { color: var(--grey); text-decoration: underline; }
.breadcrumb a:hover { color: var(--pink); }

.brand-page {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 1.25rem 2rem;
}

/* Brand Header */
.brand-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.5rem;
  padding: 1.5rem 0 1rem;
  border-bottom: 3px solid var(--pink);
  margin-bottom: 1.5rem;
}

.brand-header__main {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
  flex: 1;
}

.brand-header__logo {
  width: 80px;
  height: 80px;
  object-fit: contain;
  border: 1px solid var(--border);
  background: #fff;
  padding: 0.5rem;
  flex-shrink: 0;
}

.brand-header__name {
  font-family: var(--font-editorial);
  font-size: 32px;
  font-weight: 700;
  color: var(--black);
  margin: 0 0 0.25rem;
  line-height: 1.1;
}

.brand-header__tagline {
  font-size: 14px;
  color: var(--grey);
  font-style: italic;
  margin: 0 0 0.5rem;
}

.brand-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  font-size: 12px;
  color: var(--grey);
  margin-bottom: 0.75rem;
}

.brand-header__meta a { color: var(--pink); }

.brand-header__ratings {
  display: flex;
  gap: 0.75rem;
}

.rating-badge {
  text-align: center;
  padding: 0.4rem 0.75rem;
  border: 2px solid var(--border);
  min-width: 60px;
}

.rating-badge--editor { border-color: var(--pink); }
.rating-badge--players { border-color: var(--cyan); }

.rating-badge__score {
  display: block;
  font-family: var(--font-editorial);
  font-size: 22px;
  font-weight: 700;
  color: var(--black);
  line-height: 1;
}

.rating-badge--editor .rating-badge__score { color: var(--pink); }
.rating-badge--players .rating-badge__score { color: var(--cyan); }

.rating-badge__label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--grey-light);
  margin-top: 2px;
}

/* CTA button */
.btn-cta {
  display: inline-block;
  background: var(--pink);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  padding: 0.875rem 1.75rem;
  text-align: center;
  white-space: nowrap;
  transition: background 0.15s;
}

.btn-cta:hover { background: var(--pink-dark); color: #fff; }

.brand-header__cta { text-align: center; flex-shrink: 0; }
.brand-header__terms { font-size: 10px; color: var(--grey-light); margin: 0.4rem 0 0; }

.brand-header__notice {
  flex-shrink: 0;
  max-width: 260px;
}

.notice { padding: 0.75rem 1rem; font-size: 13px; line-height: 1.5; }
.notice--info { background: #EFF6FF; border-left: 3px solid #3B82F6; color: var(--dark); }

/* Quick Facts */
.brand-facts {
  margin-bottom: 1.5rem;
}

.brand-facts h2 {
  font-family: var(--font-editorial);
  font-size: 18px;
  font-weight: 700;
  color: var(--black);
  margin: 0 0 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--border);
}

.facts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.75rem;
}

.fact {
  background: var(--bg);
  border: 1px solid var(--border);
  padding: 0.75rem;
}

.fact__label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--grey-light);
  margin-bottom: 0.25rem;
}

.fact__value {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--black);
}

/* Review content */
.brand-review {
  margin-bottom: 1.5rem;
}

.brand-review h2 {
  font-family: var(--font-editorial);
  font-size: 20px;
  font-weight: 700;
  color: var(--black);
  margin: 0 0 0.875rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--pink);
}

.review-content {
  font-size: 15px;
  line-height: 1.7;
  color: var(--dark);
}

.review-content p { margin-bottom: 1rem; }
.review-content h3 { font-family: var(--font-editorial); font-size: 18px; margin: 1.5rem 0 0.5rem; }

/* Player reviews list */
.player-reviews { margin: 1.5rem 0; }

.player-reviews h2 {
  font-family: var(--font-editorial);
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--cyan);
}

.player-review-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-left: 4px solid var(--cyan);
  padding: 1rem 1.25rem;
  margin-bottom: 0.75rem;
}

.player-review-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
  gap: 0.5rem;
}

.player-review-card__name {
  font-weight: 700;
  font-size: 14px;
  color: var(--black);
}

.player-review-card__stars {
  color: var(--gold);
  font-size: 14px;
}

.player-review-card__date {
  font-size: 11px;
  color: var(--grey-light);
}

.player-review-card__verdict {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 2px;
  margin-bottom: 0.5rem;
}

.player-review-card__verdict--yes { background: var(--success-bg); color: var(--success); }
.player-review-card__verdict--no  { background: var(--danger-bg); color: var(--danger); }

.player-review-card__text {
  font-size: 13px;
  color: var(--dark);
  line-height: 1.6;
  margin: 0;
}

.player-review-card__tags {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.5rem;
  flex-wrap: wrap;
}

.player-review-card__tag {
  font-size: 10px;
  background: #f0f0f0;
  color: var(--grey);
  padding: 2px 8px;
  border-radius: 2px;
}

/* Mobile */
@media (max-width: 640px) {
  .brand-header { flex-direction: column; }
  .brand-header__main { flex-direction: column; }
  .brand-header__logo { width: 60px; height: 60px; }
  .brand-header__name { font-size: 24px; }
  .brand-header__notice { max-width: 100%; }
  .facts-grid { grid-template-columns: 1fr 1fr; }
}

/* ============================================
   BINGO DIRECTORY — Magazine editorial style
   ============================================ */

/* Platform chips */
.bdir-platform-chip {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #fff;
  padding: 3px 8px;
  border-radius: 2px;
}

/* Page header */
.bdir-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2rem;
}

.bdir-header__title {
  font-family: var(--font-editorial);
  font-size: 42px;
  font-weight: 700;
  color: var(--black);
  margin: 0.4rem 0 0.25rem;
  line-height: 1;
}

.bdir-header__sub {
  font-size: 14px;
  font-style: italic;
  color: var(--grey);
  margin: 0;
}

.bdir-header__key { text-align: right; }

.bdir-header__key-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--grey-light);
  display: block;
  margin-bottom: 0.4rem;
}

.bdir-header__key .bdir-platform-chip { margin: 0 2px 4px 0; }

/* Featured picks */
.bdir-featured {
  padding: 0 0 1rem;
}

.bdir-featured__label { margin-bottom: 1rem; }

.bdir-featured__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}

.bdir-feat-card {
  display: flex;
  flex-direction: column;
  background: var(--black);
  padding: 1.25rem;
  border: 2px solid var(--pink);
  transition: border-color 0.2s;
  text-decoration: none;
}

.bdir-feat-card:hover { border-color: #fff; }

.bdir-feat-card__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.75rem;
}

.bdir-feat-card__badge {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--pink);
}

.bdir-feat-card__name {
  font-family: var(--font-editorial);
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.5rem;
  line-height: 1.1;
}

.bdir-feat-card__rating {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.75rem;
}

.bdir-feat-card__stars { color: var(--gold); font-size: 13px; }

.bdir-feat-card__score {
  font-family: var(--font-editorial);
  font-size: 20px;
  font-weight: 700;
  color: #fff;
}

.bdir-feat-card__count {
  font-size: 11px;
  color: rgba(255,255,255,0.5);
}

.bdir-feat-card__line {
  font-size: 13px;
  color: rgba(255,255,255,0.75);
  line-height: 1.5;
  margin: 0 0 1rem;
  flex: 1;
}

.bdir-feat-card__cta {
  font-size: 12px;
  font-weight: 700;
  color: var(--pink);
  margin-top: auto;
}

/* A-Z Jump nav */
.bdir-az-jump {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 1rem 0;
  flex-wrap: wrap;
}

.bdir-az-jump__label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--grey-light);
  margin-right: 0.5rem;
}

.bdir-az-jump__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  font-family: var(--font-editorial);
  font-size: 15px;
  font-weight: 700;
  color: var(--black);
  background: var(--bg);
  border: 1px solid var(--border);
  transition: all 0.15s;
}

.bdir-az-jump__btn:hover { background: var(--pink); color: #fff; border-color: var(--pink); }

/* A-Z sections */
.bdir-az__section { margin-bottom: 2rem; }

.bdir-az__letter-row {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.875rem;
}

.bdir-az__letter {
  font-family: var(--font-editorial);
  font-size: 36px;
  font-weight: 700;
  color: var(--pink);
  line-height: 1;
  flex-shrink: 0;
}

.bdir-az__rule {
  flex: 1;
  height: 2px;
  background: linear-gradient(90deg, var(--pink) 0%, transparent 100%);
}

.bdir-az__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}

/* Individual site card */
.bdir-card {
  display: flex;
  flex-direction: column;
  padding: 0.875rem 1rem;
  background: #fff;
  border: 1px solid var(--border);
  border-top: 3px solid var(--border);
  transition: all 0.15s;
}

.bdir-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }

.bdir-card--reviewed { border-top-color: var(--pink); }

.bdir-card__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
}

.bdir-card__tick {
  font-size: 11px;
  font-weight: 700;
  color: var(--pink);
}

.bdir-card__name {
  font-family: var(--font-editorial);
  font-size: 17px;
  font-weight: 700;
  color: var(--black);
  margin: 0 0 0.35rem;
  line-height: 1.2;
}

.bdir-card__rating {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.2rem;
}

.bdir-star--on  { color: var(--gold); font-size: 11px; }
.bdir-star--off { color: #ddd; font-size: 11px; }

.bdir-card__score {
  font-size: 13px;
  font-weight: 700;
  color: var(--black);
}

.bdir-card__reviews {
  font-size: 11px;
  color: var(--grey-light);
  margin: 0 0 0.5rem;
  flex: 1;
}

.bdir-card__link {
  font-size: 11px;
  font-weight: 700;
  color: var(--pink);
  margin-top: auto;
}

.bdir-footer-note {
  font-size: 12px;
  color: var(--grey-light);
  text-align: center;
  padding: 1.5rem 0;
  border-top: 1px solid var(--border);
}

.bdir-footer-note a { color: var(--pink); }

/* Mobile */
@media (max-width: 640px) {
  .bdir-header { flex-direction: column; gap: 0.75rem; }
  .bdir-header__key { text-align: left; }
  .bdir-header__title { font-size: 28px; }
  .bdir-featured__grid { grid-template-columns: 1fr; }
  .bdir-az__grid { grid-template-columns: 1fr 1fr; }
}

/* ============================================
   BDIR INTRO — full width intro with lady
   ============================================ */

.bdir-intro {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0.5rem 0 1rem;
}

.bdir-intro__text { flex: 1; min-width: 0; }

.bdir-intro__title {
  font-family: var(--font-editorial);
  font-size: 38px;
  font-weight: 700;
  color: var(--black);
  margin: 0.3rem 0 0.75rem;
  line-height: 1.1;
}

.bdir-intro__standfirst {
  font-family: var(--font-editorial);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.6;
  color: var(--black);
  margin: 0 0 0.75rem;
}

.bdir-intro__body {
  font-size: 14px;
  color: var(--grey);
  line-height: 1.65;
  margin: 0 0 0.875rem;
}

.bdir-intro__key {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

.bdir-intro__key-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--grey-light);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-right: 0.25rem;
}

.bdir-intro__mascot {
  flex-shrink: 0;
  width: 140px;
  padding-top: 0.5rem;
}

.bdir-intro__mascot .mag-greeting__mascot {
  width: 140px;
  float: none;
  margin: 0;
}

@media (max-width: 640px) {
  .bdir-intro { flex-direction: column; gap: 0.5rem; }
  .bdir-intro__mascot { display: none; }
  .bdir-intro__title { font-size: 26px; }
}

.bdir-intro__built {
  font-family: var(--font-editorial);
  font-size: 15px;
  font-weight: 700;
  font-style: italic;
  color: var(--pink);
  margin: 0 0 0.875rem;
}

.bdir-intro__lady {
  float: right;
  width: 180px;
  margin: 0.25rem 0 0.5rem 0.5rem;
  clear: none;
}

.bdir-intro .mag-editorial-pull {
  clear: none;
  overflow: hidden;
  margin: 0.5rem 0 !important;
}

@media (max-width: 640px) {
  .bdir-intro__lady { width: 130px; margin: 0 0 0.25rem 0.5rem; }
}

.bdir-intro > .mag-label {
  display: inline-block;
  margin-bottom: 0.75rem;
  width: auto;
}

.bdir-intro__float-wrap .drop-cap {
  float: left;
  font-size: 5em;
  line-height: 0.75;
  margin: 0.05em 0.1em 0 0;
}

.bdir-intro__float-wrap {
  overflow: hidden;
  margin-bottom: 0.75rem;
}

.bdir-intro__float-wrap .drop-cap {
  float: left;
  font-size: 5em;
  line-height: 0.75;
  margin: 0.05em 0.1em 0 0;
}

.bdir-intro__key--col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
}

.bdir-platform-chip--row {
  display: flex;
  align-items: center;
  width: 120px;
}

.mag-pick-platform {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #fff;
  padding: 2px 6px;
  border-radius: 2px;
  margin-top: 1px;
}

.bdir-sidebar-key {
  background: var(--black);
  border: 2px solid var(--pink);
  padding: 0.875rem 1rem;
  margin-bottom: 0;
}

.bdir-sidebar-key .bdir-intro__key-label {
  color: rgba(255,255,255,0.6);
  display: block;
  margin-bottom: 0.5rem;
}

.bdir-sidebar-key__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.mag-picks-box--reviewed .mag-picks-box__header {
  background: var(--pink);
}

.mag-picks-box--reviewed .mag-picks-box__title span {
  background: transparent;
}

/* ============================================
   PICK N MIX HUB — purple theme
   ============================================ */

.drop-cap--purple { color: var(--purple) !important; }

.mag-editorial-pull--purple {
  background: rgba(156, 39, 176, 0.05);
  border-top-color: var(--purple);
  border-bottom-color: var(--purple);
}

.mag-more-btn--purple:hover { background: #6d28d9; color: #fff; }

.mag-mini--bingle {
  border-left: 4px solid var(--card-violet);
  background: #faf5ff;
}

.mag-mini--bingle:hover { background: #f3e8ff; }

.mag-faded-border--purple {
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, var(--purple) 20%, var(--purple) 80%, transparent 100%);
  margin: 1rem 0 1.5rem;
}

/* ============================================
   BINGLE ATTRIBUTION FOOTER
   ============================================ */

.bingle-attribution {
  max-width: 520px;
  margin: 1rem auto 0;
  padding: 1rem 1.25rem;
  border-top: 1px solid rgba(255,255,255,0.08);
  text-align: center;
}

.bingle-attribution__copy {
  font-size: 10px;
  color: rgba(255,255,255,0.5);
  line-height: 1.6;
  margin-bottom: 0.5rem;
  font-family: var(--font-sans);
}

.bingle-attribution__wordle {
  font-size: 10px;
  color: rgba(255,255,255,0.35);
  line-height: 1.6;
  margin-bottom: 0.5rem;
  font-style: italic;
  font-family: var(--font-sans);
}

.bingle-attribution__links {
  font-size: 10px;
  color: rgba(255,255,255,0.4);
  font-family: var(--font-sans);
}

.bingle-attribution__links a {
  color: rgba(212,175,55,0.5);
  text-decoration: none;
}

.bingle-attribution__links a:hover {
  color: rgba(212,175,55,0.8);
}

/* ── CROSSWORD COMING SOON ── */
.pnm-coming-soon { text-align: center; }

.pnm-coming-soon__grid {
  display: flex;
  justify-content: center;
  gap: 4px;
  margin: 0.75rem 0 0.25rem;
}

.pnm-csq {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-serif);
  font-weight: 900;
  font-size: 18px;
  border: 2px solid var(--border);
  background: #fff;
  color: var(--black);
}

.pnm-csq--b { border-color: var(--pink);   color: var(--pink); }
.pnm-csq--i { border-color: var(--purple); color: var(--purple); }
.pnm-csq--n { border-color: var(--cyan);   color: var(--cyan); }
.pnm-csq--g { border-color: var(--teal);   color: var(--teal); }
.pnm-csq--o { border-color: var(--gold);   color: var(--gold); }

.mag-mini--violet {
  border-left: 4px solid var(--card-violet);
}
.mag-mini--violet:hover { background: #f5f0ff; }

.mag-mini-ad--featured .mag-mini-ad__content--tall {
  min-height: 250px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mag-mini--rose  { border-left: 4px solid var(--card-rose); }
.mag-mini--rose:hover  { background: #fff1f2; }
.mag-mini--sky   { border-left: 4px solid var(--card-sky); }
.mag-mini--sky:hover   { background: #f0f9ff; }

.pnm-jeeves-stats {
  display: flex;
  gap: 0.5rem;
  margin: 0.5rem 0;
}
.pnm-jeeves-stat {
  flex: 1;
  text-align: center;
  background: #fdf2f8;
  border: 1px solid var(--card-rose);
  padding: 0.4rem 0.25rem;
}
.pnm-jeeves-stat__val {
  display: block;
  font-family: var(--font-serif);
  font-size: 18px;
  font-weight: 700;
  color: var(--pink);
  line-height: 1;
}
.pnm-jeeves-stat__lbl {
  display: block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--grey-light);
  margin-top: 2px;
}

.mag-more-btn--pink {
  background: var(--pink);
  color: #fff;
  border-color: var(--pink);
}
.mag-more-btn--pink:hover { background: #c0166e; }

/* ── BUTTON FONT OVERRIDE — all CTAs must be sans-serif readable ── */
.mag-more-btn,
.mag-picks-box__more,
.mag-picks-box__more a,
.pnm-did-you-know__link,
.mag-promo-box__link,
.mag-cover__continue,
.mag-mini__continue,
.daub-story-card__continue,
.bdir-card__link,
.bdir-feat-card__link,
.scam-check__btn,
.scam-check-full__btn,
.pb-replay-btn,
.submit-btn,
button,
[type="submit"] {
  font-family: var(--font-sans) !important;
  font-style: normal !important;
  letter-spacing: 0.3px;
}

.drop-cap--pink { color: var(--pink) !important; }
.drop-cap--cyan { color: var(--cyan) !important; }

/* ============================================
   PICK N MIX DISCLAIMER
   ============================================ */

.pnm-disclaimer-section {
  background: #f5f0ff;
  padding: 1.5rem;
  width: 100%;
}

.pnm-disclaimer {
  max-width: 900px;
  margin: 0 auto;
}

.pnm-disclaimer__title {
  font-family: var(--font-editorial);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 1rem;
  text-align: center;
}

.pnm-disclaimer__cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

@media (max-width: 640px) {
  .pnm-disclaimer__cols { grid-template-columns: 1fr; gap: 0; }
}

.pnm-disclaimer__text {
  font-size: 14px;
  color: #222;
  line-height: 1.8;
  margin-bottom: 0.75rem;
}

.pnm-disclaimer__text a {
  color: var(--purple);
  text-decoration: underline;
}

.pnm-disclaimer__text strong {
  color: #000;
}

/* ============================================
   PICK N MIX — FULL WIDTH SCOREBOARD
   ============================================ */

.pnm-scoreboard-section {
  background: #faf7ff;
  padding: 1.5rem;
}

.pnm-scoreboard-full {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  max-width: 900px;
  margin: 0 auto;
}

.pnm-scoreboard-full .pnm-scoreboard__name  { color: var(--dark); }
.pnm-scoreboard-full .pnm-scoreboard__score { color: var(--purple); }
.pnm-scoreboard-full .pnm-scoreboard__row   { border-bottom-color: var(--border); }

@media (max-width: 640px) {
  .pnm-scoreboard-full { grid-template-columns: 1fr; gap: 1rem; }
}

.pnm-jeeves-dyk {
  background: var(--black);
  padding: 0.75rem 1rem;
  margin: 0.5rem 0 0;
}
.pnm-jeeves-dyk__label {
  display: block;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 0.3rem;
}
.pnm-jeeves-dyk__fact {
  font-size: 12px;
  color: rgba(255,255,255,0.85);
  font-style: italic;
  line-height: 1.6;
  margin: 0;
}

.pnm-jeeves-dyk {
  background: #1a1a1a;
  border-left: 3px solid var(--purple);
  padding: 0.6rem 0.75rem;
  margin: 0.5rem 0;
}

.pnm-jeeves-dyk__label {
  display: block;
  font-family: var(--font-sans);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 0.25rem;
}

.pnm-jeeves-dyk__fact {
  font-family: var(--font-editorial);
  font-size: 13px;
  font-style: italic;
  color: #f0e8d0;
  line-height: 1.55;
  margin: 0;
  min-height: 40px;
  transition: opacity 0.3s;
}

.bingle-tiles {
  display: inline-flex;
  gap: 3px;
  margin-left: 6px;
  vertical-align: middle;
}

.bingle-tile {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  border-radius: 2px;
  text-shadow: none;
  line-height: 1;
}

.mag-lotto-mini__balls--sm .mag-lotto-mini__ball {
  width: 28px !important;
  height: 28px !important;
  font-size: 10px !important;
  margin: 1px !important;
}

.mag-lotto-sidebar__title {
  font-size: 11px !important;
  letter-spacing: 1px;
  margin: 0.5rem 0 0.25rem !important;
  color: var(--grey);
}

.pnm-jeeves-trivia img,
.pnm-jeeves-img {
  display: block;
  width: 220px;
  max-width: 75%;
  margin: 0.75rem auto 1rem;
  float: none;
}

@media (max-width: 640px) {
  .pnm-jeeves-trivia img,
  .pnm-jeeves-img {
    width: 100%;
    max-width: 100%;
  }
}

/* ============================================
   WORD SEARCH PREVIEW DESIGN
   ============================================ */

.ws-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  margin: 0.5rem 0;
  font-family: var(--font-sans);
  font-weight: 800;
  letter-spacing: 1px;
}

.ws-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  font-size: 11px;
  border-radius: 2px;
}

.ws-letter--faded {
  color: var(--border);
  font-size: 12px;
}

.ws-circled {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  border: 2px solid var(--pink);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  min-width: 56px;
}

.ws-circled__inner {
  color: var(--black);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.5px;
}

/* ============================================
   CROSSWORD PREVIEW DESIGN
   ============================================ */

.cw-preview {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  margin: 0.5rem 0;
}

.cw-row {
  display: flex;
  gap: 2px;
}

.cw-cell {
  width: 20px;
  height: 20px;
  border: 1px solid var(--card-sky);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
  font-family: var(--font-sans);
  color: var(--black);
  background: #fff;
}

.cw-cell--blank {
  background: var(--black);
  border-color: var(--black);
  color: transparent;
}

.cw-cell--active {
  background: var(--card-sky);
  color: #fff;
}

.pnm-scoreboard__game--green { background: #2e7d32; color: #fff; }
.pnm-pos--green { background: #2e7d32 !important; }

.mag-mini--green { border-left: 4px solid #2e7d32; }
.mag-mini--green:hover { background: #f0fdf0; }