/* LolaJack Casino – template v2 (reference: lolajack.com/en – navy stb "castle" theme: brick wall background, gold frames with pointed corners,
   violet/green buttons with textured borders, Beaufort Pro serif → Philosopher (free flared serif, latin + latin-ext)) */
@font-face { font-family: "Philosopher"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/philosopher-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Philosopher"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/philosopher-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Philosopher"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/philosopher-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Philosopher"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/philosopher-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* palette (lolajack.com --stb-* tokens, rgb triplets) */
  --n50: 247 247 250; --n100: 231 231 240; --n150: 214 214 230; --n200: 198 198 220; --n250: 182 182 210; --n300: 165 165 200; --n350: 149 149 190; --n400: 133 133 180; --n450: 116 116 170; --n500: 100 100 160; --n550: 89 89 145; --n600: 79 79 129; --n650: 69 69 112; --n700: 59 59 96; --n750: 49 49 80; --n800: 39 39 63; --n850: 29 29 47; --n900: 24 24 40; --n950: 16 16 27;
  --br50: 242 235 225; --br100: 233 222 207; --br150: 224 209 188; --br200: 215 196 170; --br250: 206 183 151; --br350: 190 158 116; --br400: 180 143 95; --br500: 162 117 58; --br600: 130 94 46; --br650: 113 82 40; --br700: 97 70 35; --br750: 82 60 30; --br800: 65 47 23; --br850: 57 41 20;
  --y150: 255 242 206; --y250: 255 236 184; --y500: 255 220 124;
  --ac500: 68 255 155; --ac800: 27 118 70; --ac850: 22 95 57; --ac900: 14 73 41; --ac950: 7 50 27;
  --g400: 46 222 117; --g500: 0 214 86; --g600: 0 171 69; --g750: 0 102 41; --g850: 0 61 24;
  --v450: 130 52 203; --v500: 118 33 198; --v600: 94 26 158; --v700: 71 20 119; --v850: 35 10 59;
  --b450: 108 84 227; --b500: 93 66 224; --b850: 34 23 85;
  --p300: 149 143 174; --p400: 116 109 149; --p600: 67 60 99; --p700: 50 45 74; --p800: 34 30 50;
  --red500: 247 67 112; --add500: 229 24 24;
  --white: 255 255 255; --black: 0 0 0;
  --text: rgb(var(--n200)); --text-2: rgb(var(--n300)); --text-3: rgb(var(--n250)); --accent: rgb(var(--y500)); --gold: rgb(var(--br350)); --link: rgb(var(--n150));
  --bg: rgb(var(--n900)); --bg-2: rgb(var(--n950)); --bg-3: rgb(var(--n800)); --bg-4: rgb(var(--n750));
  --font: "Philosopher", "Beaufort Pro", Georgia, "Times New Roman", serif;
  --tshadow: 0 2px 0 rgb(var(--n900));
  --grad-gold-1: linear-gradient(0deg, rgb(var(--br500)) -7.42%, rgb(var(--y500)) 4.87%, rgb(var(--br500)) 27%, rgb(var(--y500)) 47.89%, rgb(var(--br500)) 67.62%, rgb(var(--y500)) 90.91%);
  --grad-gold-2: linear-gradient(rgb(var(--y500)), rgb(var(--br500)));
  --grad-gold-4: linear-gradient(rgb(var(--br250)), rgb(var(--br500)), rgb(var(--br800)));
  --grad-gold-5: linear-gradient(rgb(var(--br750)), rgb(var(--br600)), rgb(var(--br250)));
  --grad-gold-7: linear-gradient(90deg, rgb(var(--br400)), rgb(var(--y150)), rgb(var(--br400)));
  --grad-o1: linear-gradient(rgb(var(--n800)), rgb(var(--n850)));
  --grad-o2: linear-gradient(rgb(var(--n800)), rgb(var(--n950)));
  --grad-o3: linear-gradient(rgb(var(--n750)), rgb(var(--n950)));
  --grad-o5: linear-gradient(rgb(var(--black)), rgb(var(--n800)));
  --grad-o10: linear-gradient(180deg, rgb(var(--n850)) 0%, rgb(var(--black)) 100%);
  --grad-o13: linear-gradient(270deg, rgb(var(--n550)) 0%, rgb(var(--n400)) 50%, rgb(var(--n550)) 100%);
  --grad-o15: linear-gradient(rgb(var(--n950)), rgb(var(--n800)));
  --grad-o16: linear-gradient(rgb(var(--n700)), rgb(var(--n850)));
  --grad-o19: linear-gradient(180deg, rgb(var(--n850) / 0) 0%, rgb(var(--n850) / .6) 15%, rgb(var(--n850)) 45%, rgb(var(--n850)) 100%);
  --grad-purple-2: linear-gradient(rgb(var(--p300)), rgb(var(--p600)));
  --frame-sharp: url("/images/ui/frame-sharp.webp");
  /* layout (desktop ≥1920: container 1920/16, 8 game columns, gap 12, ranked 7 columns with 56px index shift) */
  --hdr-h: 64px; --nav-h: 36px; --pad: 16px;
  --cols: 8; --cols-rank: 7; --cols-wide: 5; --cols-grid: 11; --cols-promo: 5; --cols-sport: 7; --cols-prov: 12;
  --gap: 12px; --gap-rank: 8px; --rank-shift: 56px; --row-gap: 16px; --grid-row-gap: 16px;
  --tile-in: 8px; --frame-w: 60px; --frame-slice: 60;
  /* legacy aliases for shared parts */
  --muted: var(--text-2); --radius: 8px; --radius-sm: 4px; --shadow: 0 2px 6px rgb(var(--n950) / .9);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 116px; min-width: 360px; }
body { margin: 0; min-height: 100%; background: var(--bg) url("/images/ui/bricks.webp") top left / 437px 175px repeat; color: var(--text); font-family: var(--font); font-size: 16px; line-height: 1.4; font-weight: 400; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; }
img, svg, video { display: block; max-width: 100%; }
a { color: var(--text); text-decoration: none; }
a:hover { color: var(--accent); }
button { font-family: inherit; }
h1, h2, h3, h4, .beck-shelf__title, .mill-perk__title, .mill-foot__col-title { margin: 0; line-height: 1.2; font-family: var(--font); font-weight: 700; color: #fff; }
p { margin: 0 0 12px; }
ul, ol { margin: 0; padding: 0; list-style: none; }
[role="button"] { cursor: pointer; user-select: none; }
.warden-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.guild-seal { text-shadow: var(--tshadow); }

/* ---------- Buttons (stb .button: shared button-bg strip – primary green top / secondary violet center / tertiary dark bottom, hover & active strips,
   textured border via border-image per palette & size, 900 → 700 text with 2px stroke + 1px shadow) ---------- */
.paddle-btn { --bgpos: center; --bi: url("/images/ui/btn-sec-xs.webp"); --biw: 18px; --bis: 36; --mh: 36px; --fs: 14px; --px: 12px; --pt: 2px; --stroke: rgb(var(--b850)); --bshadow: 0 1px 3px rgb(var(--black) / .5); --hop: 0; --rot: 0deg; --tcolor: #fff;
  position: relative; z-index: 1; display: inline-grid; grid-auto-flow: column; justify-content: center; align-items: center; justify-items: center; column-gap: 8px; min-height: var(--mh); padding: var(--pt) var(--px) 0; border: 0; border-radius: var(--mh); font-family: var(--font); font-weight: 700; font-size: var(--fs); line-height: 1; text-transform: uppercase; text-decoration: none; text-align: center; white-space: nowrap; color: var(--tcolor); background: url("/images/ui/btn-bg.webp") var(--bgpos) / auto 300% repeat-x; box-shadow: var(--bshadow); cursor: pointer; transform: translateZ(0); -webkit-user-select: none; user-select: none; }
.paddle-btn::before { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; opacity: var(--hop); background: var(--hbg, url("/images/ui/btn-bg-h.webp")) var(--bgpos) / auto 300% repeat-x; transition: opacity .2s; pointer-events: none; }
.paddle-btn::after { content: ""; position: absolute; inset: 0; z-index: 2; border-style: solid; border-width: var(--biw); border-image-source: var(--bi); border-image-slice: var(--bis) fill; border-image-width: var(--biw); border-image-repeat: stretch; border-radius: inherit; transform: rotate(var(--rot)) translateZ(0); pointer-events: none; }
.paddle-btn__t { position: relative; z-index: 3; display: inline-flex; align-items: center; gap: 6px; -webkit-text-stroke: 2px var(--stroke); paint-order: stroke fill; text-shadow: 0 1px 0 rgb(var(--n900)); }
.paddle-btn svg, .paddle-btn img { position: relative; z-index: 3; flex: 0 0 auto; filter: drop-shadow(0 1px 0 rgb(var(--n900))); }
.paddle-btn__ico { display: inline-flex; width: 24px; height: 24px; }
@media (hover: hover) and (pointer: fine) { .paddle-btn:hover { --hop: 1; color: var(--tcolor); } }
.paddle-btn:active { --hop: 1; --hbg: url("/images/ui/btn-bg-a.webp"); --rot: 180deg; }
/* palettes */
.paddle-btn--willow { --bgpos: top; --stroke: rgb(var(--ac850)); --bi: url("/images/ui/btn-prim-xs.webp"); }
.paddle-btn--slate { --bgpos: center; --stroke: rgb(var(--b850)); --bi: url("/images/ui/btn-sec-xs.webp"); }
.paddle-btn--chalk { --bgpos: bottom; --stroke: rgb(var(--b850)); --bi: url("/images/ui/btn-ter-xs.webp"); }
/* sizes */
.paddle-btn--l { --fs: 28px; --mh: 80px; --px: 40px; --biw: 40px; --bis: 80; --pt: 3px; --bshadow: 0 3px 6px rgb(var(--black) / .5); }
.paddle-btn--m { --fs: 20px; --mh: 56px; --px: 24px; --biw: 28px; --bis: 56; --pt: 3px; --bshadow: 0 2px 4px rgb(var(--black) / .5); }
.paddle-btn--s { --fs: 16px; --mh: 48px; --px: 24px; --biw: 24px; --bis: 48; --bshadow: 0 2px 4px rgb(var(--black) / .5); }
.paddle-btn--xs, .paddle-btn--xxs { --fs: 14px; --mh: 36px; --px: 12px; --biw: 18px; --bis: 36; column-gap: 6px; }
.paddle-btn--xxs { --fs: 12px; }
.paddle-btn--willow.paddle-btn--l { --bi: url("/images/ui/btn-prim-l.webp"); } .paddle-btn--willow.paddle-btn--m { --bi: url("/images/ui/btn-prim-m.webp"); } .paddle-btn--willow.paddle-btn--s { --bi: url("/images/ui/btn-prim-s.webp"); }
.paddle-btn--slate.paddle-btn--l { --bi: url("/images/ui/btn-sec-l.webp"); } .paddle-btn--slate.paddle-btn--m { --bi: url("/images/ui/btn-sec-m.webp"); } .paddle-btn--slate.paddle-btn--s { --bi: url("/images/ui/btn-sec-s.webp"); }
.paddle-btn--chalk.paddle-btn--l { --bi: url("/images/ui/btn-ter-l.webp"); } .paddle-btn--chalk.paddle-btn--m { --bi: url("/images/ui/btn-ter-m.webp"); } .paddle-btn--chalk.paddle-btn--s { --bi: url("/images/ui/btn-ter-s.webp"); }
.paddle-btn--wide { width: 100%; }
/* main-banner CTA (stb .action-button.button--m.button--primary): green plate 56px, gold CTA frame drawn 24px|4px outside the plate (cta-l at ≥1920, cta-m below,
   cta-s on phones), min-width 300 incl. frame; one-shot fire/ice sweep inside (72-frame spritesheet, 3.3s) + gold light running along the frame (37 frames, 1.6s, delay 3.4s)
   + soft glow fading in at 2.9s – restarted every time a slide becomes active, exactly like the original */
.paddle-btn--regatta { --fs: 24px; --mh: 56px; --px: 24px; --bgpos: top; --stroke: rgb(var(--ac850)); --fx: 24px; --fy: 4px; --cta: url("/images/ui/cta-l.webp"); --ctas: 76; --bshadow: none; min-width: 252px; }
.paddle-btn--regatta::after { display: none; }
.paddle-btn__frame { position: absolute; inset: calc(var(--fy) * -1) calc(var(--fx) * -1); z-index: 2; border-style: solid; border-width: 28px; border-image-source: var(--cta); border-image-slice: var(--ctas) fill; border-image-width: 28px; border-image-repeat: stretch; transform: rotate(var(--rot)) translateZ(0); pointer-events: none; }
.paddle-btn__glow { position: absolute; inset: calc(var(--fy) * -1) calc(var(--fx) * -1); z-index: 1; opacity: 0; background: url("/images/ui/cta-glow.webp") no-repeat center / 100% 96%; pointer-events: none; }
/* perf pass 11.10 (no visual change): the two CTA sprite sheets are child layers moved with transform (same frames / steps / timing), not background-position */
.paddle-btn__fire { position: absolute; inset: 1px 0; z-index: 1; border-radius: var(--mh); overflow: hidden; pointer-events: none; }
.paddle-btn__fire::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 7200%; background: url("/images/ui/cta-fire-in.webp") 0 0 / 100% 100% no-repeat; opacity: 0; will-change: transform, opacity; }
.paddle-btn__sweep { position: absolute; inset: calc(var(--fy) * -1) calc(var(--fx) * -1); z-index: 3; overflow: hidden; pointer-events: none; }
.paddle-btn__sweep::before { content: ""; position: absolute; left: 10px; top: 0; width: 93%; height: 3800%; background: url("/images/ui/cta-fire-out.webp") 0 0 / 100% 100% no-repeat; opacity: 0; will-change: transform, opacity; }
.meadow-slide.is-in-flow .paddle-btn__fire::before { animation: cta-fire-in 3.3s steps(72) forwards; }
.meadow-slide.is-in-flow .paddle-btn__sweep::before { animation: cta-fire-out 1.6s steps(37) 3.4s forwards; }
.meadow-slide.is-in-flow .paddle-btn__glow { animation: cta-glow 0s linear 2.9s forwards; }
@keyframes cta-fire-in { 0% { opacity: 1; transform: translateY(0); } 90% { opacity: 1; } 100% { opacity: 0; transform: translateY(-98.611111%); } }
@keyframes cta-fire-out { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 1; transform: translateY(-97.368421%); } }
@keyframes cta-glow { 0% { opacity: 0; } 100% { opacity: 1; } }
/* tabs/pills (TOC) */
.reach-tab { position: relative; z-index: 1; display: inline-grid; grid-auto-flow: column; align-items: center; gap: 4px; min-height: 32px; padding: 5px 7px; border: 1px solid rgb(var(--n750)); border-radius: 4px; font-size: 14px; font-weight: 700; text-transform: uppercase; white-space: nowrap; color: var(--text-2); background: var(--grad-o2); cursor: pointer; transition: color .2s, border-color .2s; }
.reach-tab:hover { color: var(--text); border-color: rgb(var(--n650)); }

/* ---------- Header (64px) + nav row (36px) on the header-bg texture (3840x200 → 1920x100); logo 101x42, search pill 300x48, log in / register 36px ---------- */
.bridge-bar { position: fixed; top: 0; left: 0; right: 0; z-index: 60; background: rgb(var(--n850)) url("/images/ui/header-bg.webp") top center / auto 100px repeat-x; }
.bridge-bar__inner { position: relative; display: flex; align-items: center; gap: 8px; height: var(--hdr-h); padding: 8px 20px; }
.sluice-toggle { display: none; }
.heron-logo { display: inline-flex; align-items: center; flex: 0 0 auto; }
.heron-logo img { width: 101px; height: 42px; }
.bridge-bar__spacer { flex: 1 1 auto; }
.fieldglass-search { position: relative; z-index: 1; display: flex; align-items: center; gap: 8px; min-width: 300px; height: 48px; padding: 0 12px; border: 1px solid transparent; border-radius: 100px; color: var(--text-2); font-family: var(--font); font-weight: 500; font-size: 16px; line-height: 1.2; white-space: nowrap; overflow: hidden; background: var(--grad-o2) padding-box, var(--grad-gold-4) border-box; box-shadow: 0 4px 4px rgb(var(--n950)); cursor: pointer; transition: color .2s; }
.fieldglass-search::before { content: ""; position: absolute; inset: 0; z-index: -1; border: 1px solid transparent; border-radius: inherit; background: var(--grad-o2) padding-box, var(--grad-gold-5) border-box; }
.fieldglass-search:hover::before { background: var(--grad-o3) padding-box, var(--grad-gold-5) border-box; }
.fieldglass-search > * { position: relative; z-index: 1; }
.fieldglass-search__ico { display: inline-flex; width: 20px; height: 20px; flex: 0 0 auto; background: rgb(var(--br150)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21'/%3E%3C/svg%3E") center / contain no-repeat; }
.bridge-bar__actions { display: flex; align-items: center; gap: 8px; }
.bridge-bar__login-m, .bridge-bar__reg-m { display: none; }
/* nav row: 14px 700 uppercase links, gap 24, active/hover gold underline (gradient-gold-7) */
.ford-nav { display: flex; justify-content: space-between; align-items: center; width: 100%; height: var(--nav-h); padding: 0 20px 0 28px; }
.ford-nav__list { display: flex; align-items: center; gap: 24px; }
.ford-nav__item { position: relative; }
.ford-nav__link { position: relative; display: flex; align-items: center; height: var(--nav-h); font-size: 15px; font-weight: 700; line-height: 1.2; text-transform: uppercase; white-space: nowrap; color: var(--link); cursor: pointer; transition: color .2s; }
.ford-nav__link > span { position: relative; display: inline-block; }
.ford-nav__link > span::after { content: ""; position: absolute; left: 0; bottom: -9px; width: 100%; height: 2px; border-radius: 4px 4px 0 0; background: var(--grad-o13); opacity: 0; transition: opacity .2s; }
.ford-nav__item:hover .ford-nav__link { color: #fff; }
.ford-nav__item:hover .ford-nav__link > span::after { opacity: 1; }
.ford-nav__link.is-in-flow { color: #fff; }
.ford-nav__link.is-in-flow > span::after { opacity: 1; background: var(--grad-gold-7); }
.ford-nav__flag { display: flex; align-items: center; justify-content: center; }
.ford-nav__flag img { width: 22px; height: 16px; border: 1px solid rgb(var(--n300)); border-radius: 2px; object-fit: cover; }
/* dropdown (desktop hover): strip of plate tiles in the brand's toggle style (the saved page is the mobile variant – desktop dropdown structure reconstructed) */
.ford-nav__drop { position: fixed; top: calc(var(--hdr-h) + var(--nav-h)); left: 0; right: 0; z-index: 70; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; padding: 12px 20px; background: rgb(var(--n850) / .97) url("/images/ui/footer-texture.png") top left / 29px 42px repeat; box-shadow: 0 2px 6px rgb(var(--n950) / .9); opacity: 0; visibility: hidden; transition: opacity .1s ease, visibility .1s; }
.ford-nav__drop::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--grad-gold-5); }
.ford-nav__item:hover .ford-nav__drop { opacity: 1; visibility: visible; }
.mill-plate { --pl-h: 58px; position: relative; z-index: 1; display: inline-grid; justify-items: center; align-content: center; gap: 4px; min-width: 52px; min-height: var(--pl-h); padding: 8px 10px; color: rgb(var(--n200)); font-size: 10px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; background: rgb(var(--n900)); box-shadow: 0 6px 6px rgb(var(--black) / .25); cursor: pointer; -webkit-user-select: none; user-select: none; transition: color .2s; }
.mill-plate::before { content: ""; position: absolute; inset: 0; z-index: 3; border-style: solid; border-width: 20px; border-image: var(--frame-sharp) 56 / 20px round; pointer-events: none; }  /* stb plate = dark navy + the "gothic" border-sharp frame (same as provider tiles), active = toggle-a gold frame + gold text */
.mill-plate::after { content: ""; position: absolute; inset: 4px; z-index: 3; opacity: .5; background: url("/images/ui/bg-pattern.webp") 0 0 / 48px repeat; mix-blend-mode: overlay; pointer-events: none; }
.mill-plate > * { position: relative; z-index: 4; }
.mill-plate img, .mill-plate svg { width: 32px; height: 32px; object-fit: contain; }
.mill-plate span { text-shadow: .5px .5px 0 rgb(var(--n600)); }
.mill-plate:hover { color: #fff; }
.mill-plate.is-in-flow { color: rgb(var(--y500)); background: url("/images/ui/toggle-a-l.webp") left / 15px 100% no-repeat, url("/images/ui/toggle-a-r.webp") right / 15px 100% no-repeat, url("/images/ui/toggle-a-c.webp") center / calc(100% - 28px) 100% no-repeat; box-shadow: 0 6px 6px rgb(var(--black) / .25); }
.mill-plate.is-in-flow::before { display: none; }
.milestone-tile { width: 124px; }
.milestone-tile__icon { display: flex; justify-content: center; align-items: flex-end; height: 32px; }
.milestone-tile__icon img { width: 32px; height: 32px; object-fit: contain; transform-origin: bottom; transition: transform .2s; }
.milestone-tile:hover .milestone-tile__icon img { transform: scale(1.15); }
.milestone-tile__text { display: flex; align-items: center; justify-content: center; min-height: 24px; max-width: 100%; }
.milestone-tile--text { min-height: 48px; width: auto; padding: 8px 14px; font-size: 12px; }

/* ---------- Mobile category strip (sticky under the header) ---------- */
.eddy-tabs { display: none; }

/* ---------- Main ---------- */
.stream-main { padding-top: calc(var(--hdr-h) + var(--nav-h)); }
.village-wrap { margin: 0; }
.bank-frame { width: 100%; max-width: 1920px; margin: 0 auto; padding: 0 var(--pad); }
.stream-page { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--row-gap); padding: 16px 0 32px; }

/* ---------- Main banner (1920 wide, aspect 3.456 → 555px, straight gold frame; text column 460 + 2x100 on the left, label ribbon, 52px title, CTA; dots 12px) ---------- */
.meadow-banner { margin-top: 12px; }
.meadow-banner .bank-frame { padding: 0; }
.meadow-carousel { --col: 660px; --hpad: 100px; position: relative; max-width: 1920px; margin: 0 auto; }
.meadow-carousel::before { content: ""; position: absolute; inset: 0; z-index: 3; border-style: solid; border-width: 16px; border-image: url("/images/ui/frame-straight.webp") 19 fill / 16px round; pointer-events: none; }
.meadow-carousel__track { position: relative; display: grid; overflow: hidden; }
.meadow-slide { grid-area: 1 / 1; position: relative; display: grid; grid-template-columns: var(--col) 1fr; overflow: hidden; opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility .5s; }
.meadow-slide.is-in-flow { opacity: 1; visibility: visible; z-index: 1; }
.meadow-slide__media { grid-area: 1 / 1 / -1 / -1; position: relative; overflow: hidden; background: var(--bg-2); }
.meadow-slide__media::before { content: ""; display: block; aspect-ratio: 3.456 / 1; }
.meadow-slide__media picture, .meadow-slide__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.meadow-slide__inner { grid-area: 1 / 1; position: relative; z-index: 2; display: grid; align-content: center; justify-items: center; gap: 38px; padding: 26px var(--hpad) 60px; text-align: center; }
.meadow-slide__card { position: relative; display: grid; gap: 2px; justify-items: center; }
.meadow-slide__label { position: relative; display: inline-flex; justify-content: center; align-items: center; width: fit-content; padding: 10px 54px 24px; font-size: 16px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; color: rgb(var(--n850)); background: url("/images/ui/hero-label.webp") no-repeat center / 100% 100%; }
.meadow-slide__title { --fs: 52px; position: relative; max-width: 100%; font-size: var(--fs); font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; white-space: nowrap; -webkit-text-stroke: 2px rgb(var(--n850)); paint-order: stroke fill; text-shadow: 0 2px 0 rgb(var(--n900)); color: #fff; }
.meadow-slide__action { position: relative; display: grid; gap: 20px; justify-items: center; }
.meadow-carousel__nav { position: absolute; left: 20px; right: 20px; top: 50%; z-index: 4; display: flex; justify-content: space-between; transform: translateY(-50%); pointer-events: none; }
.meadow-carousel__arrow { pointer-events: auto; display: flex; justify-content: center; align-items: center; width: 32px; height: 32px; border: 0; background: url("/images/ui/arrow.webp") center / contain no-repeat; color: transparent; cursor: pointer; transition: filter .2s; }
.meadow-carousel__arrow:hover { background-image: url("/images/ui/arrow-h.webp"); }
.meadow-carousel__arrow--next { transform: scaleX(-1); }
.meadow-carousel__arrow svg { display: none; }
.meadow-carousel__dots { position: absolute; left: var(--hpad); bottom: 40px; z-index: 4; display: flex; justify-content: center; align-items: center; width: 460px; pointer-events: none; }
.meadow-carousel__dot { position: relative; display: flex; padding: 8px; border: 0; background: transparent; cursor: pointer; pointer-events: auto; }
.meadow-carousel__dot::before { content: ""; display: block; width: 12px; height: 12px; border-radius: 50%; background: var(--grad-gold-2); box-shadow: 0 0 1px rgb(var(--black) / .5); -webkit-mask: radial-gradient(circle, transparent 50%, #000 60%); mask: radial-gradient(circle, transparent 50%, #000 60%); transition: opacity .2s; }
.meadow-carousel__dot:hover::before { opacity: .8; }
.meadow-carousel__dot.is-in-flow::before { -webkit-mask: none; mask: none; }

/* ---------- Rows (stb .title-block--m: 20px/1.2 700 uppercase, "SEE ALL" 14px 700 + gold arrow buttons 24px) ---------- */
.beck-shelf { position: relative; min-width: 0; }
.beck-shelf--games + .beck-shelf--games { margin-top: var(--row-gap); }
.beck-shelf__head { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 16px; margin-bottom: 13px; }
.beck-shelf__title { display: flex; align-items: center; min-height: 24px; font-size: 21px; font-weight: 700; line-height: 24px; text-transform: uppercase; color: var(--text); }
.beck-shelf__divider { display: none; }
.beck-shelf__more { display: flex; align-items: center; gap: 8px; justify-self: end; }
.beck-shelf__link { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; font-size: 14px; font-weight: 700; line-height: 1; text-transform: uppercase; color: rgb(var(--n100)); cursor: pointer; white-space: nowrap; transition: color .2s; }
.beck-shelf__link:hover { color: var(--accent); }
.beck-shelf__link svg { display: none; width: 16px; height: 16px; }
.beck-shelf__arrows { display: flex; gap: 8px; }
.beck-shelf__arrow { display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; padding: 0; border: 0; color: transparent; background: url("/images/ui/arrow.webp") center / 20px no-repeat; cursor: pointer; transition: opacity .2s; }
.beck-shelf__arrow:hover { background-image: url("/images/ui/arrow-h.webp"); }
.beck-shelf__arrow:disabled { background-image: url("/images/ui/arrow-dis.webp"); cursor: default; }
.beck-shelf__arrow--next { transform: scaleX(-1); }
.beck-shelf__arrow svg { display: none; }
.beck-scroll { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols)); gap: var(--gap); overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-padding: 4px; margin: -12px -4px -12px; padding: 12px 4px 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.beck-scroll::-webkit-scrollbar { display: none; }
.beck-scroll > * { scroll-snap-align: start; }
.beck-scroll.is-being-rowed { cursor: grabbing; scroll-snap-type: none; }
.beck-scroll.is-being-rowed > * { pointer-events: none; }
.beck-scroll--ranked { --cols: var(--cols-rank); --gap: var(--gap-rank); margin-bottom: -24px; padding-bottom: 24px; }
.beck-scroll--wide { --cols: var(--cols-wide); }

/* ---------- Game tile (stb thumbnail: cell 2:3 / 3:2, picture inset 8px (cover), sharp gold-navy frame ring 2–7px from the edge,
   NEW ribbon centred on the top edge, yellow jackpot plate, live: results chips + seats badge + blue bet-range plate overhanging the bottom; hover: blue rays + stained glass, play 90px + Demo) ---------- */
.game-pebble { position: relative; display: block; aspect-ratio: 2 / 3; width: 100%; color: var(--text); isolation: isolate; }
.game-pebble--wide { aspect-ratio: 3 / 2; }
.game-pebble::after { content: ""; position: absolute; inset: 1px; z-index: 4; border-style: solid; border-width: var(--frame-w); border-image: var(--frame-sharp) var(--frame-slice) / var(--frame-w) round; pointer-events: none; }
.game-pebble__pic { position: absolute; inset: var(--tile-in); z-index: 0; display: block; overflow: hidden; background: var(--bg-3) url("/images/ui/picture-load.webp") center / 78px 55px no-repeat; }
.game-pebble__pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.game-pebble__frame { display: none; }
.game-pebble__badge { position: absolute; left: 50%; top: -4px; z-index: 5; display: flex; justify-content: center; align-items: center; min-width: 54px; height: 20px; padding: 0 8px 1px; border-style: solid; border-width: 0; border-image: url("/images/ui/label-new.webp") 32 fill / 18px; transform: translateX(-50%); font-size: 14px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; white-space: nowrap; color: #fff; -webkit-text-stroke: 1px rgb(var(--g750)); paint-order: stroke fill; text-shadow: 0 1px rgb(var(--g850)); transition: opacity .2s; pointer-events: none; }
.game-pebble__dnw { position: absolute; left: var(--tile-in); top: var(--tile-in); z-index: 5; width: 44px; height: 44px; background: url("/images/ui/dropnwin.svg") center / contain no-repeat; pointer-events: none; }
.game-pebble__jackpot { position: absolute; left: var(--tile-in); right: var(--tile-in); bottom: var(--tile-in); z-index: 3; display: grid; place-items: center; min-height: 20px; padding: 3px 4px 0; font-size: 14px; font-weight: 700; font-variant-numeric: lining-nums tabular-nums; line-height: 1.4; text-align: center; color: rgb(var(--n900)); background: url("/images/ui/jackpot-bg.webp") center / 1px 100% repeat-x; transition: opacity .2s; pointer-events: none; }
/* live tables */
.game-pebble__live { position: absolute; inset: var(--tile-in); z-index: 3; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; pointer-events: none; transition: opacity .2s; }
.game-pebble__live::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 44px; background: linear-gradient(0deg, rgb(var(--n900)) 11%, rgb(var(--n900) / .6) 60%, rgb(var(--n900) / 0)); }
.game-pebble__results { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(auto-fit, 24px); grid-template-rows: 24px; grid-auto-rows: 0; justify-content: center; align-content: start; gap: 0 4px; overflow: hidden; width: 100%; height: 36px; padding: 6px 4px; }
.game-pebble__results span { display: flex; justify-content: center; align-items: center; overflow: hidden; width: 24px; height: 100%; padding: 1px 2px; border-radius: 50%; font-size: 16px; font-weight: 700; line-height: 1; text-align: center; color: #fff; background: rgb(var(--n900)); }
.game-pebble__results span.is-in-berry { background: rgb(var(--add500)); }
.game-pebble__results span.is-in-leaf { background: rgb(var(--g500)); }
.game-pebble__results span:first-child { box-shadow: 0 0 0 1px rgb(var(--n50) / .8), 0 0 0 2px transparent; outline: 1px solid rgb(var(--n50) / .8); outline-offset: 1px; }
.game-pebble__results span:nth-child(n+8) { display: none; }
.game-pebble--wide .game-pebble__results span:nth-child(n+8) { display: flex; }
.game-pebble--wide .game-pebble__results span:nth-child(n+14) { display: none; }
.game-pebble__seats { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 4px; min-height: 23px; margin-bottom: 6px; padding: 0 6px; border: 1px solid transparent; border-radius: 4px; font-size: 16px; font-weight: 700; line-height: 1; color: #fff; background: var(--grad-o1) padding-box, var(--grad-o2) border-box; }
.game-pebble__seats::before { content: ""; display: inline-block; width: 16px; height: 16px; background: rgb(var(--g500)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M2 20c0-4 3-7 7-7s7 3 7 7z'/%3E%3Ccircle cx='17' cy='8' r='3'/%3E%3Cpath d='M15 13.3c3 .4 6 2.9 6 6.7h-4.2c0-2.6-.7-4.9-1.8-6.7z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M2 20c0-4 3-7 7-7s7 3 7 7z'/%3E%3Ccircle cx='17' cy='8' r='3'/%3E%3Cpath d='M15 13.3c3 .4 6 2.9 6 6.7h-4.2c0-2.6-.7-4.9-1.8-6.7z'/%3E%3C/svg%3E") center / contain no-repeat; }
.game-pebble__seats.is-bank-full::before { background: rgb(var(--red500)); }
.game-pebble__limits { position: relative; z-index: 2; display: flex; justify-content: center; align-items: center; min-width: 88px; height: 24px; max-width: 100%; margin: 0 auto -12px; padding: 0 12px 3px; font-size: 14px; font-weight: 700; line-height: 1.2; white-space: nowrap; color: rgb(var(--y150)); background: url("/images/ui/bet-l.webp") left center / 30px 100% no-repeat, url("/images/ui/bet-r.webp") right center / 30px 100% no-repeat, url("/images/ui/bet-c.webp") center / calc(100% - 59px) 100% no-repeat; }
/* hover */
.game-pebble__hover { position: absolute; inset: var(--tile-in); z-index: 6; display: grid; justify-content: center; align-content: center; justify-items: center; grid-auto-rows: min-content; row-gap: 8px; opacity: 0; background: url("/images/ui/hover-anim.webp") center top / cover no-repeat; transition: opacity .2s; pointer-events: none; }
.game-pebble__hover::before { content: ""; position: absolute; inset: 0; opacity: .7; background: url("/images/ui/glass-2x3.webp") center / cover no-repeat; pointer-events: none; }
.game-pebble--wide .game-pebble__hover::before { background-image: url("/images/ui/glass-3x2.webp"); }
.game-pebble__play { position: relative; z-index: 1; display: inline-grid; width: 90px; height: 90px; background: url("/images/ui/play.webp") center / contain no-repeat; filter: drop-shadow(0 3px 17px rgb(var(--black) / .2)); pointer-events: all; }
.game-pebble__play::before { content: ""; position: absolute; inset: 0; opacity: 0; background: url("/images/ui/play-h.webp") center / contain no-repeat; transition: opacity .2s; }
.game-pebble__play:hover::before { opacity: 1; }
.game-pebble__play svg { display: none; }
.game-pebble__demo { position: relative; z-index: 1; font-size: 20px; font-weight: 700; line-height: 1.2; text-shadow: 0 1px rgb(var(--n900)); color: #fff; pointer-events: all; }
.game-pebble__demo:hover { color: var(--accent); }
.game-pebble__name, .game-pebble__provider { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (hover: hover) and (pointer: fine) {
  .game-pebble:hover .game-pebble__hover { opacity: 1; pointer-events: auto; }
  .game-pebble:hover .game-pebble__badge, .game-pebble:hover .game-pebble__jackpot, .game-pebble:hover .game-pebble__live, .game-pebble:hover .game-pebble__dnw { opacity: 0; }
}
/* ranked row: stained-glass plate (30 %) shifted 56px to the left behind the tile + 70px gold index rotated −5° at the bottom-left */
.numbered-lock { position: relative; display: block; padding-left: var(--rank-shift); }
.numbered-lock::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 10px; width: calc(100% - 22px); z-index: 0; opacity: .3; background: url("/images/ui/glass-2x3.webp") center top / cover no-repeat; pointer-events: none; }
.numbered-lock::after { content: ""; position: absolute; left: 0; top: 8px; bottom: 10px; width: calc(100% - 22px); z-index: 0; border-style: solid; border-width: var(--frame-w); border-image: var(--frame-sharp) var(--frame-slice) / var(--frame-w) round; opacity: .3; pointer-events: none; }
.lock-number { position: absolute; left: 16px; bottom: 0; z-index: 1; display: inline-flex; font-size: 70px; font-weight: 700; line-height: 1.2; transform: rotate(-5deg) translate(0, 8px); filter: drop-shadow(0 -1.5px 0 rgb(var(--white) / .7)) drop-shadow(0 2px 0 rgb(var(--br650))); pointer-events: none; }
.lock-number i { position: relative; display: inline-block; font-style: normal; color: transparent; -webkit-text-stroke: 1px rgb(var(--br50)); paint-order: stroke fill; background: var(--grad-gold-1); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.lock-number i:first-child { transform: translateX(-8px); }
.lock-number i + i { transform: translateX(-14px); }
.lock-number--small { left: 8px; }
.lock-number--small i:first-child { transform: translateX(-2px); }
.numbered-lock .game-pebble { position: relative; z-index: 2; }

/* ---------- Providers (2 rows x 12 tiles 148x78: dark plate texture + sharp frame, icon 28 + name 10px) ---------- */
.guild-crests__grid { display: grid; grid-template-rows: repeat(2, 78px); grid-template-columns: repeat(var(--cols-prov), minmax(0, 1fr)); grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 10px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; margin: -2px -2px 0; padding: 2px 2px 0; }
.guild-crests__grid::-webkit-scrollbar { display: none; }
.beck-shelf[data-providers] { padding-bottom: 2px; }
.guild-crest { position: relative; z-index: 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; row-gap: 1px; width: 100%; height: 100%; padding: 6px 2px 4px; border: 1.5px solid transparent; border-radius: 4px; font-size: 10px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; color: var(--text-2); background: url("/images/ui/tile-bg.webp") center / cover no-repeat padding-box; isolation: isolate; transition: color .2s; cursor: pointer; }
.guild-crest::after { content: ""; position: absolute; inset: -1.5px; z-index: 2; border-style: solid; border-width: 28px; border-image: var(--frame-sharp) 56 / 28px round; pointer-events: none; }
.guild-crest__hover { position: absolute; inset: 0; z-index: -1; background: url("/images/ui/tile-bg-h.webp") center / cover no-repeat; opacity: 0; transition: opacity .2s; }
.guild-crest:hover { color: var(--accent); }
.guild-crest:hover .guild-crest__hover { opacity: 1; }
.guild-crest__logo { width: 29px; height: 29px; object-fit: contain; }
.guild-crest__name { display: flex; align-items: center; justify-content: center; height: 28px; max-width: 100%; white-space: nowrap; }
.guild-crest__meta { display: none; }
.guild-crest--more .guild-crest__logo { color: rgb(var(--br250)); }

/* ---------- Sport (7 cols: phone card 2x2 on the arena texture + 1:1 discipline cards, each card inset 5px inside its sharp frame) ---------- */
.green-fixtures__grid { --cols: var(--cols-sport); --sgap: 12px; display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); grid-auto-flow: row dense; gap: var(--sgap); overflow-x: auto; overflow-y: hidden; scrollbar-width: none; margin: -2px; padding: 2px; }
.green-fixtures__grid::-webkit-scrollbar { display: none; }
.green-fixture { position: relative; display: grid; aspect-ratio: 1; padding: 5px; cursor: pointer; }
.green-fixture::after { content: ""; position: absolute; inset: 0; z-index: 3; border-style: solid; border-width: 32px; border-image: var(--frame-sharp) 60 / 32px round; pointer-events: none; }
.green-fixture__pic { grid-area: 1 / 1 / -1 / -1; position: relative; overflow: hidden; background: url("/images/ui/sport-bg.webp") center / cover no-repeat; }
.green-fixture__pic img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.green-fixture:hover .green-fixture__pic img { transform: scale(1.05); }
.green-fixture__name { grid-area: 1 / 1 / -1 / -1; z-index: 1; display: flex; justify-content: center; align-items: center; align-self: end; min-height: 40px; margin: 0 0 0; padding: 2px 4px; font-size: 14px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; text-wrap: balance; color: #fff; background: linear-gradient(180deg, rgb(var(--n850) / 0) .44%, rgb(var(--n850) / .6) 27.79%, rgb(var(--n850)) 67.45% 100%); transition: color .2s; }
.green-fixture:hover .green-fixture__name { color: var(--accent); }
.green-fixture--featured { grid-row: span 2; grid-column: span 2; aspect-ratio: auto; }
.green-fixture__bg { display: none; }
.green-fixture--featured .green-fixture__pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; transform-origin: center bottom; }
.green-fixture--featured:hover .green-fixture__pic img { transform: scale(1.03); }
.green-fixture__action { grid-area: 1 / 1 / -1 / -1; position: relative; z-index: 2; display: flex; justify-content: center; align-self: end; width: 100%; padding: 40px 7px 14px; background: linear-gradient(180deg, rgb(var(--n850) / 0), rgb(var(--n850) / .6) 40%, rgb(var(--n850))); }
.green-fixture__action .paddle-btn { width: 100%; max-width: 260px; }

/* ---------- Rewards (6-col grid: 2 x span 3 + 3 x span 2; 164px cards on the rewards texture with sharp frame, picture 182px on the right) ---------- */
.harvest-prizes { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px 12px; margin-top: 8px; }  /* ref block 3201-3536 = 2 x 164 + 8 */
.harvest-prize { grid-column: span 2; position: relative; display: flex; align-items: flex-end; overflow: hidden; min-height: 164px; padding: 16px; color: var(--text); box-shadow: 0 2px 8px rgb(88 72 55 / .2); cursor: pointer; }
.harvest-prize:nth-child(1), .harvest-prize:nth-child(2) { grid-column: span 3; }
.harvest-prize::before { content: ""; position: absolute; inset: 1px; z-index: 0; background: url("/images/ui/rewards-bg.webp") center / cover no-repeat, var(--grad-o10); box-shadow: inset 4px 4px 4px rgb(var(--black) / .25); pointer-events: none; }
.harvest-prize::after { content: ""; position: absolute; inset: 0; z-index: 3; border-style: solid; border-width: 6px; border-image: var(--frame-sharp) 14 fill / 6px round; pointer-events: none; }
.harvest-prize__wrap { display: contents; }
.harvest-prize__img { position: absolute; right: 3px; top: 2px; bottom: 2px; z-index: 1; width: 182px; height: calc(100% - 4px); object-fit: contain; object-position: right; transition: scale .2s; }
.harvest-prize:hover .harvest-prize__img { scale: 1.04; }
.harvest-prize__content { position: relative; z-index: 2; display: flex; flex-direction: column; row-gap: 4px; max-width: calc(100% - 140px); }
.harvest-prize__content::before { content: ""; position: absolute; inset: -14px; z-index: -1; opacity: 0; background: radial-gradient(64% 100% at 74% 0%, rgb(var(--n500) / .3), rgb(var(--n650) / 0)); transition: opacity .2s; pointer-events: none; }
.harvest-prize:hover .harvest-prize__content::before { opacity: 1; }
.harvest-prize__title { font-size: 20px; font-weight: 700; line-height: 1.2; text-transform: uppercase; -webkit-text-stroke: 2px rgb(var(--n850)); paint-order: stroke fill; text-shadow: 0 2px 0 rgb(var(--n900)); color: #fff; transition: color .2s; }
.harvest-prize:hover .harvest-prize__title { color: var(--accent); }
.harvest-prize__desc { font-size: 14px; font-weight: 700; line-height: 1.4; text-decoration: underline; color: var(--text); transition: color .2s; }
.harvest-prize__desc::after { content: ""; display: inline; margin-inline-start: 4px; padding-inline: 8px; background: url("/images/ui/arrow-reward.webp") center / 16px 16px no-repeat; }  /* inline (not inline-block) like stb: no line-break opportunity between the last word and the arrow */
.harvest-prize:hover .harvest-prize__desc { color: #fff; }

/* ---------- Promo cards (235/350, purple plate + vertical straight frame 7px, ribbon label top-right, name 15 / title 22, "READ MORE" secondary s) ---------- */
.beck-scroll--bonuses { --cols: var(--cols-promo); --gap: 12px; }  /* ref: 5 x 368 + 4 x 12 = 1888 */
.mill-perk { position: relative; z-index: 0; display: grid; grid-template-columns: minmax(0, 1fr); overflow: hidden; width: 100%; height: 100%; aspect-ratio: 235 / 350; padding: 3px 4px; background: var(--grad-purple-2); cursor: pointer; }
.mill-perk::after { content: ""; position: absolute; inset: 0; z-index: 3; border-style: solid; border-width: 7px; border-image: url("/images/ui/frame-straight-v.webp") 30 / 7px round; pointer-events: none; }
.mill-perk__wrap { display: contents; }
.mill-perk__media { grid-area: 1 / 1 / -1 / -1; position: relative; overflow: hidden; background: var(--bg-2); }
.mill-perk__media img { width: 100%; height: 100%; object-fit: cover; object-position: center top; transform: scale(1); transition: transform .2s; }
.mill-perk:hover .mill-perk__media img { transform: scale(1.08); }
.mill-perk__tag { position: absolute; right: 0; top: 9px; z-index: 2; display: flex; align-items: center; padding: 3px 6px 5px 8px; border-style: solid; border-width: 0; border-image: url("/images/ui/label-casino.webp") 27 fill / 9px / 2px stretch; font-size: 14px; font-weight: 700; line-height: 1.2; text-transform: uppercase; color: #fff; -webkit-text-stroke: 1px rgb(var(--g750)); paint-order: stroke fill; text-shadow: 0 1px 0 rgb(var(--n800)); filter: drop-shadow(0 1px 2px rgb(var(--n950) / .9)); }
.mill-perk__tag--sport { border-image-source: url("/images/ui/label-sport.webp"); -webkit-text-stroke-color: rgb(var(--b850)); }
.mill-perk__body { grid-area: 1 / 1 / -1 / -1; position: relative; z-index: 1; display: grid; align-content: space-between; align-self: end; gap: 12px; margin-bottom: -1px; padding: 37px 16px 16px; background: var(--grad-o19); }
.mill-perk__text-wrap { display: grid; align-content: start; gap: 2px; color: #fff; }
.mill-perk__name { font-size: 15px; line-height: 1.4; color: #fff; }
.mill-perk__title { font-size: 22px; font-weight: 700; line-height: 1.2; text-transform: uppercase; color: #fff; }
.mill-perk__amount, .mill-perk__text, .mill-perk__terms { display: none; }
.mill-perk__cta { display: grid; }
.mill-perk__cta .paddle-btn { width: 100%; }
.mill-perks__terms { margin: 10px 0 0; font-size: 12px; color: var(--text-2); }

/* ---------- Special banner (shop): 1720/390, straight frame 14px, text column 520 with dark fade on the left, primary s button ---------- */
.fair-banner { position: relative; display: grid; grid-template-rows: 1fr; overflow: hidden; width: 100%; aspect-ratio: 1720 / 390; cursor: pointer; }
.fair-banner::after { content: ""; position: absolute; inset: 0; z-index: 3; border-style: solid; border-width: 14px; border-image: url("/images/ui/frame-straight.webp") 12 / 14px round; pointer-events: none; }
.fair-banner__pic { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.fair-banner__pic img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.fair-banner__content { position: relative; z-index: 1; grid-row: 1 / -1; display: grid; grid-template-columns: 520px; align-content: center; justify-content: start; justify-items: center; row-gap: 8px; width: 800px; max-width: 100%; padding: 16px 48px; background: linear-gradient(270deg, rgb(37 47 88 / 0) 1.29%, rgb(30 32 69 / .7) 42.22%); }
.fair-banner__content > * { max-width: 100%; }
.fair-banner__title { width: 100%; margin-bottom: 12px; font-size: 36px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; text-wrap: balance; -webkit-text-stroke: 2px rgb(var(--n850)); paint-order: stroke fill; text-shadow: 0 2px 0 rgb(var(--n900)); color: #fff; }
.fair-banner__btn { min-width: 120px; justify-self: center; }
.fair-banner__clip { display: none; }

/* ---------- All games grid (11 cols, gap 12/16, 3 rows, bottom fade + "more games") ---------- */
.beck-shelf--grid { position: relative; padding-bottom: 0; }
.pebble-grid { display: grid; grid-template-columns: repeat(var(--cols-grid), minmax(0, 1fr)); gap: var(--grid-row-gap) var(--gap); margin: 0 -2px; padding: 0 2px; }
.pebble-grid::after { content: ""; position: absolute; left: -2px; right: -2px; bottom: -8px; height: 120px; background: var(--bg); -webkit-mask-image: linear-gradient(to bottom, rgb(var(--white) / 0) 0, #000 60px); mask-image: linear-gradient(to bottom, rgb(var(--white) / 0) 0, #000 60px); pointer-events: none; z-index: 7; }
.pebble-grid .game-pebble:nth-child(n+34) { display: none; }
.pebble-grid__more { position: absolute; left: 0; right: 0; bottom: 0; z-index: 8; display: flex; justify-content: center; align-items: flex-end; }
.pebble-grid__more .paddle-btn { min-width: 155px; }

/* ---------- SEO / content boxes (dark panels with the brand's straight frame) ---------- */
.weir-panel { position: relative; margin: 16px 0 0; padding: 24px 28px 28px; background: rgb(var(--n900) / .92); box-shadow: 0 0 0 1px rgb(var(--n750)) inset; }
.weir-panel::before { content: ""; position: absolute; inset: 0; z-index: 2; border-style: solid; border-width: 14px; border-image: url("/images/ui/frame-straight.webp") 12 / 14px round; pointer-events: none; }
.weir-panel > *, .riverbank-phone__grid > * { position: relative; z-index: 3; min-width: 0; }
.weir-panel--foreword { padding: 24px 28px; }
.weir-panel--foreword h1 { margin-bottom: 14px; font-size: 24px; font-weight: 700; line-height: 1.2; text-transform: uppercase; color: #fff; }
.weir-panel--foreword p { margin: 0 0 10px; font-size: 15px; font-weight: 400; line-height: 1.55; color: var(--text); }
.weir-panel--almanac.is-dammed .weir-panel__body { max-height: 120px; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, #000 40%, transparent); mask-image: linear-gradient(180deg, #000 40%, transparent); }
.weir-panel__more { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; padding: 0; border: 0; background: transparent; font-family: var(--font); font-size: 14px; font-weight: 700; color: var(--text); cursor: pointer; transition: color .2s; }
.weir-panel__more:hover { color: var(--accent); }
.weir-panel__more svg { width: 12px; height: 12px; transition: transform .2s; }
.weir-panel--almanac:not(.is-dammed) .weir-panel__more svg { transform: rotate(180deg); }
.almanac-title { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 24px; font-weight: 700; line-height: 1.2; text-transform: uppercase; color: #fff; }
.almanac-title img, .almanac-title svg { display: none; }
.almanac-subtitle { margin: 22px 0 10px; font-size: 18px; font-weight: 700; text-transform: uppercase; color: var(--accent); }
.almanac-lead { margin: 0 0 12px; font-size: 15px; line-height: 1.55; color: var(--text); }
.weir-panel > p.almanac-lead:last-child { padding: 14px 16px; background: rgb(var(--n850)); box-shadow: inset 0 0 0 1px rgb(var(--n750)); }
.almanac-copy p { font-size: 15px; line-height: 1.6; color: var(--text); }
.almanac-copy p:last-child { margin-bottom: 0; }
.almanac-copy a, .weir-panel p a { font-weight: 700; text-decoration: underline; color: #fff; }
.almanac-copy a:hover, .weir-panel p a:hover { color: var(--accent); }
.tithe-scroll { overflow-x: auto; margin: 6px 0 4px; box-shadow: inset 0 0 0 1px rgb(var(--n750)); }
table { width: 100%; min-width: 380px; border-collapse: collapse; font-size: 14px; }
th, td { padding: 10px 12px; text-align: left; vertical-align: top; border: 1px solid rgb(var(--n750)); }
thead th { font-size: 13px; font-weight: 700; text-transform: uppercase; color: var(--accent); background: rgb(var(--n800)); }
tbody tr:nth-child(odd) td { background: rgb(var(--n850)); }
tbody tr:nth-child(even) td { background: rgb(var(--n900)); }
tbody td:first-child { font-weight: 700; color: #fff; }
tbody td { color: var(--text); }
.tithe-note { margin: 8px 0 0; font-size: 12px; color: var(--text-2); }
.tally-items { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 14px 0 6px; }
.tally-item { display: flex; flex-direction: column; gap: 4px; padding: 14px; background: rgb(var(--n850)); box-shadow: inset 0 0 0 1px rgb(var(--n750)); }
.tally-item__value { font-size: 24px; font-weight: 700; color: var(--accent); }
.tally-item__label { font-size: 12px; color: var(--text); }
.stepping-stones { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 10px 0 6px; }
.stepping-stone { display: flex; gap: 12px; padding: 14px; background: rgb(var(--n850)); box-shadow: inset 0 0 0 1px rgb(var(--n750)); }
.stepping-stone__num { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; background: var(--grad-gold-2); color: rgb(var(--n900)); font-weight: 700; font-size: 16px; }
.stepping-stone strong { display: block; margin-bottom: 2px; font-size: 15px; font-weight: 700; color: #fff; }
.stepping-stone p { margin: 0; font-size: 13px; color: var(--text); }
.reed-ticks { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 12px; padding: 14px 16px; background: rgb(var(--n850)); box-shadow: inset 0 0 0 1px rgb(var(--n750)); }
.reed-ticks li { position: relative; padding-left: 26px; font-size: 15px; color: var(--text); }
.reed-ticks li::before { content: ""; position: absolute; left: 0; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 10px no-repeat, linear-gradient(rgb(var(--g400)), rgb(var(--g600))); }
.paddle-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 18px; }
.riverbank-phone__grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; align-items: start; }
.riverbank-phone__badges { display: flex; gap: 10px; margin-top: 6px; }
.riverbank-phone__badges img { height: 40px; width: auto; border-radius: 4px; }
.ferryman-desk__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 14px 0 6px; }
.ferryman-desk__card { display: flex; flex-direction: column; gap: 6px; padding: 16px; background: rgb(var(--n850)); box-shadow: inset 0 0 0 1px rgb(var(--n750)); }
.ferryman-desk__icon { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin-bottom: 4px; border-radius: 50%; border: 1px solid rgb(var(--n700)); background: var(--grad-o2); color: var(--accent); }
.ferryman-desk__icon svg { width: 20px; height: 20px; }
.ferryman-desk__card strong { font-size: 15px; font-weight: 700; color: #fff; }
.ferryman-desk__meta { font-size: 11px; color: var(--text-2); }
.ferryman-desk__card p { margin: 0 0 auto; font-size: 13px; color: var(--text); }
.ferryman-desk__card .paddle-btn { align-self: flex-start; margin-top: 10px; }
.ferry-box__strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px; }
.ferry-method { position: relative; display: flex; justify-content: center; align-items: center; width: 104px; height: 44px; padding: 6px 4px; border: 1px solid transparent; border-radius: 4px; background: var(--grad-o15) padding-box, var(--grad-o16) border-box; box-shadow: 0 4px 4px rgb(var(--black) / .25); transition: background .2s; }
.ferry-method:hover { background: var(--grad-o15) padding-box, linear-gradient(rgb(var(--n600)), rgb(var(--n600))) border-box; }
.ferry-method__icon img { height: 22px; width: auto; max-width: 80px; object-fit: contain; }
.ferry-method__initial { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--text); }

/* Reviews */
.neighbour-notes__summary { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 16px; }
.neighbour-notes__word { font-size: 22px; font-weight: 700; text-transform: uppercase; color: var(--accent); }
.neighbour-notes__text { font-size: 13px; color: var(--text); }
.kingfisher-stars { display: inline-flex; gap: 2px; }
.kingfisher-star { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 3px; background: #00b67a; }
.kingfisher-star svg { width: 14px; height: 14px; fill: #fff; }
.kingfisher-star.is-half-tide { background: linear-gradient(90deg, #00b67a 50%, rgb(var(--n700)) 50%); }
.neighbour-note__rating .kingfisher-star { width: 16px; height: 16px; }
.neighbour-note__rating .kingfisher-star svg { width: 10px; height: 10px; }
.neighbour-notes__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.neighbour-note { display: flex; flex-direction: column; gap: 8px; padding: 16px; background: rgb(var(--n850)); box-shadow: inset 0 0 0 1px rgb(var(--n750)); }
.neighbour-note__head { display: flex; align-items: center; gap: 10px; }
.neighbour-note__avatar { flex: 0 0 auto; width: 40px; height: 40px; overflow: hidden; border-radius: 50%; background: var(--bg-3); box-shadow: 0 0 0 2px rgb(var(--br500)); }
.neighbour-note__avatar img { width: 100%; height: 100%; object-fit: cover; }
.neighbour-note__name { font-size: 14px; font-weight: 700; color: #fff; }
.neighbour-note__sub { font-size: 11px; color: var(--text-2); }
.neighbour-note__meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.neighbour-note__date { font-size: 11px; color: var(--text-2); }
.neighbour-note__title { font-size: 14px; font-weight: 700; color: var(--accent); }
.neighbour-note__text { margin: 0; font-size: 13px; color: var(--text); }
.neighbour-note__verified { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; font-size: 11px; font-weight: 700; color: rgb(var(--g500)); }
.neighbour-note__verified svg { width: 14px; height: 14px; }

/* FAQ */
.village-qa__list { display: flex; flex-direction: column; gap: 8px; }
.village-qa__item { overflow: hidden; border: 1px solid rgb(var(--n750)); background: var(--grad-o2); }
.village-qa__question { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 16px; border: 0; background: transparent; color: #fff; font-family: var(--font); font-size: 16px; font-weight: 700; text-align: left; cursor: pointer; transition: color .2s; }
.village-qa__question:hover { color: var(--accent); }
.village-qa__icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 20px; height: 20px; color: var(--text-2); transition: transform .2s; }
.village-qa__icon svg { width: 14px; height: 14px; }
.village-qa__item.is-sluice-open .village-qa__icon { transform: rotate(180deg); color: var(--accent); }
.village-qa__answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .25s ease; }
.village-qa__item.is-sluice-open .village-qa__answer { grid-template-rows: 1fr; }
.village-qa__answer-inner { overflow: hidden; min-height: 0; }
.village-qa__answer p { margin: 0; padding: 0 16px 16px; font-size: 14px; line-height: 1.5; color: var(--text); }

/* TOC */
.river-map { margin: 16px 0 0; }
.river-map__box { position: relative; padding: 6px 20px; background: rgb(var(--n900) / .92); box-shadow: 0 0 0 1px rgb(var(--n750)) inset; }
.river-map__box::before { content: ""; position: absolute; inset: 0; z-index: 2; border-style: solid; border-width: 14px; border-image: url("/images/ui/frame-straight.webp") 12 / 14px round; pointer-events: none; }
.river-map__box > * { position: relative; z-index: 3; }
.river-map__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 12px 0; border: 0; background: transparent; color: #fff; cursor: pointer; font-family: var(--font); font-size: 20px; font-weight: 700; text-transform: uppercase; }
.river-map__title { display: inline-flex; align-items: center; gap: 8px; }
.river-map__title svg { width: 18px; height: 18px; color: var(--accent); }
.river-map__toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 400; text-transform: none; color: var(--text-2); }
.river-map__toggle svg { width: 12px; height: 12px; transition: transform .2s; }
.river-map.is-dammed .river-map__toggle svg { transform: rotate(180deg); }
.river-map__body { display: grid; grid-template-rows: 1fr; transition: grid-template-rows .25s ease; }
.river-map.is-dammed .river-map__body { grid-template-rows: 0fr; }
.river-map__body-inner { overflow: hidden; }
.river-map__list { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 0 14px; counter-reset: toc; }
.river-map__list li a { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 4px 12px 4px 6px; border: 1px solid rgb(var(--n750)); border-radius: 4px; background: var(--grad-o2); color: var(--text-2); font-size: 14px; font-weight: 700; text-transform: uppercase; transition: color .2s, border-color .2s; }
.river-map__list li a::before { counter-increment: toc; content: counter(toc); display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--grad-gold-2); color: rgb(var(--n900)); font-size: 12px; font-weight: 700; }
.river-map__list li a:hover { color: #fff; border-color: rgb(var(--n600)); }
.almanac-date { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin-top: 16px; padding: 12px 14px; background: rgb(var(--n850)); box-shadow: inset 0 0 0 1px rgb(var(--n750)); font-size: 12px; color: var(--text); }
.almanac-date__label { font-weight: 700; color: #fff; }
.almanac-date__icon { display: none; }
.almanac-date__body { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
.almanac-date__badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 4px; background: rgb(var(--g500) / .18); color: rgb(var(--g400)); font-size: 11px; font-weight: 700; }
.almanac-date__badge svg { width: 14px; height: 14px; }

/* ---------- Footer (neutral-850 + diamond texture, 1px gold line on top; help/lang plates, logo + legal, 5 link columns, payments 136x58, bottom links) ---------- */
.mill-foot { position: relative; z-index: 1; margin-top: 16px; background: rgb(var(--n850)) url("/images/ui/footer-texture.png") top left / 29px 42px repeat; }
.mill-foot::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--grad-gold-5); }
.mill-foot__inner { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 32px; max-width: 1920px; margin: 0 auto; padding: 16px 96px 32px; }
.mill-foot__top { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(136px, auto); justify-content: center; align-items: center; column-gap: 12px; }
.mill-foot__lang, .mill-foot__chat, .mill-foot__help, .mill-foot__app { display: inline-grid; grid-template-columns: max-content auto; align-items: center; justify-content: center; column-gap: 8px; min-width: 136px; min-height: 58px; padding: 8px 12px; font-size: 14px; font-weight: 700; text-transform: none; color: var(--text-2); }
.mill-foot__lang img, .mill-foot__help img, .mill-foot__chat img { width: 24px; height: 24px; border-radius: 2px; object-fit: cover; }
.mill-foot__help svg, .mill-foot__chat svg, .mill-foot__app svg { width: 24px; height: 24px; }
.mill-foot__ico { display: inline-flex; width: 24px; height: 24px; align-items: center; justify-content: center; }
.mill-foot__app, .mill-foot__chat { display: none; }
.mill-foot__body { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 32px 40px; padding-top: 32px; border-top: 1px solid rgb(var(--n750)); }
.mill-foot__brand { display: grid; align-content: start; justify-items: start; gap: 16px; }
.mill-foot__brand .mill-foot__logo img { width: 101px; height: 42px; }
.mill-foot__legal { font-size: 12px; font-weight: 400; line-height: 1.5; color: var(--text); }
.mill-foot__legal p { margin: 0 0 4px; }
.mill-foot__18 { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 2px solid rgb(var(--n200)); border-radius: 50%; font-size: 14px; font-weight: 700; color: rgb(var(--n200)); }
.mill-foot__cols { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0 40px; }
.mill-foot__col .mill-foot__col-title { margin: 0 0 20px; font-size: 14px; font-weight: 700; line-height: 1.4; text-transform: uppercase; color: rgb(var(--br200)); }
.mill-foot__col ul { display: flex; flex-direction: column; gap: 20px; }
.mill-foot__col a, .mill-foot__col span { display: inline-block; font-size: 14px; font-weight: 400; line-height: 1.4; color: var(--text); cursor: pointer; transition: color .2s; }
.mill-foot__col a:hover, .mill-foot__col span:hover { color: var(--accent); }
.mill-foot__pay { position: relative; display: flex; flex-direction: column; align-items: center; gap: 20px; padding-top: 32px; border-top: 1px solid rgb(var(--n750)); }
.mill-foot__pay-row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px; }
.mill-foot__pay-row .ferry-method { width: 136px; height: 58px; padding: 6px 4px; }
.mill-foot__pay-row .ferry-method .ferry-method__icon img { height: 36px; max-width: 108px; }
.mill-foot__pay-row .ferry-method--more .ferry-method__initial { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; text-transform: none; color: var(--text); }
.mill-foot__pay-row .ferry-method--more svg { width: 16px; height: 16px; }
.mill-foot__pay-row .ferry-method--more:hover .ferry-method__initial { color: var(--accent); }
.mill-foot__badges { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 26px; padding: 6px 0 18px; }
.mill-foot__badges img { display: block; height: 36px; width: auto; }
.mill-foot__badges a img[src*="gambleaware"] { height: 20px; }
.mill-foot__badges a img[src*="gordon-moody"] { height: 32px; }
.mill-foot__badges [role="button"] { cursor: pointer; }
.mill-foot__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 32px; padding-top: 32px; border-top: 1px solid rgb(var(--n750)); }
.mill-foot__links a, .mill-foot__links span { font-size: 12px; font-weight: 700; text-transform: uppercase; color: rgb(var(--n400)); cursor: pointer; transition: color .2s; }
.mill-foot__links a:hover, .mill-foot__links span:hover { color: var(--accent); }
.village-rights { display: none; }
.village-links { display: none; }

/* Bottom mobile navigation */
.towpath-dock { display: none; }

/* Promo bar (desktop, appears after scrolling) */
.bunting-strip { position: fixed; left: 50%; bottom: 14px; z-index: 70; width: min(1180px, calc(100% - 24px)); transform: translate(-50%, 140%); transition: transform .35s ease; }
.bunting-strip.is-on-the-bank { transform: translate(-50%, 0); }
.bunting-strip__inner { display: flex; align-items: center; gap: 14px; padding: 10px 14px; border: 1px solid rgb(var(--n700)); background: var(--grad-o5); box-shadow: var(--shadow); }
.bunting-strip__logo { height: 30px; width: auto; }
.bunting-strip__info { display: flex; flex-direction: column; min-width: 0; }
.bunting-strip__label { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--accent); }
.bunting-strip__title { overflow: hidden; font-size: 14px; font-weight: 700; color: #fff; white-space: nowrap; text-overflow: ellipsis; }
.bunting-strip__btn { margin-left: auto; }
.bunting-strip__close { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 34px; height: 34px; border: 1px solid rgb(var(--n700)); border-radius: 50%; background: var(--grad-o2); color: var(--text); cursor: pointer; }
.bunting-strip__close svg { width: 14px; height: 14px; }
.back-upstream { position: fixed; right: 18px; bottom: 90px; z-index: 65; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid rgb(var(--n700)); border-radius: 50%; background: var(--grad-o2); color: var(--text); cursor: pointer; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; }
.back-upstream.is-on-the-bank { opacity: 1; visibility: visible; }
.back-upstream svg { width: 18px; height: 18px; }

/* ---------- Mobile drawer ---------- */
.boathouse-menu, .boathouse-menu__backdrop { display: none; }

/* ---------- Responsive ---------- */

@media (max-width: 1919px) {
  :root { --cols: 7; --cols-rank: 6; --cols-wide: 4; --cols-grid: 9; --cols-promo: 4; --cols-sport: 7; --cols-prov: 10; }
  .pebble-grid .game-pebble:nth-child(n+28) { display: none; }
  .meadow-carousel { --col: 432px; --hpad: 66px; }
  .meadow-slide__title { --fs: 36px; white-space: normal; text-wrap: balance; }
  .meadow-slide__label { padding: 4px 40px 12px; font-size: 10px; }
  .meadow-slide__inner { padding: 18px var(--hpad) 18px; gap: 16px; }
  .meadow-carousel__dots { width: 300px; bottom: 32px; }
  .paddle-btn--regatta { --fx: 18px; --fy: 3px; --cta: url("/images/ui/cta-m.webp"); --ctas: 56; min-width: 224px; }
  .paddle-btn__sweep::before { left: 2px; width: 98%; }
  .fair-banner { aspect-ratio: 1720 / 390; }
  .fair-banner__title { font-size: 32px; }
  .mill-foot__inner { padding: 16px 64px 32px; }
  .lock-number { font-size: 70px; }
}
@media (max-width: 1535px) {
  :root { --cols: 6; --cols-rank: 5; --cols-wide: 4; --cols-grid: 8; --cols-promo: 4; --cols-sport: 7; --cols-prov: 8; }
  .ford-nav__drop .milestone-tile { width: 100px; }
  .pebble-grid .game-pebble:nth-child(n+25) { display: none; }
  .guild-crests__grid { grid-template-columns: none; grid-auto-columns: minmax(140px, 1fr); }
  .fair-banner { aspect-ratio: 1056 / 262; }
  .fair-banner__content { grid-template-columns: 520px; width: 562px; padding: 10px 32px; }
  .fair-banner__title { font-size: 30px; margin-bottom: 8px; }
  .harvest-prizes { gap: 8px 12px; }
}
@media (max-width: 1400px) {
  .mill-foot__cols { gap: 0 24px; }
  .mill-foot__body { grid-template-columns: 240px minmax(0, 1fr); gap: 24px; }
  .guild-crests__grid { grid-auto-columns: 150px; }
  .green-fixtures__grid { grid-template-columns: none; grid-template-rows: repeat(2, 1fr); grid-auto-flow: column; grid-auto-columns: 190px; }
}
@media (max-width: 1279px) {
  :root { --hdr-h: 60px; --nav-h: 0px; --cols: 6; --cols-rank: 5; --cols-wide: 3; --cols-grid: 6; --cols-promo: 3; --cols-sport: 6; --gap: 8px; --gap-rank: 8px; --rank-shift: 33px; --row-gap: 16px; --grid-row-gap: 8px; --tile-in: 2.5px; --frame-w: 30px; --frame-slice: 90; }
  html { scroll-padding-top: 150px; }
  body { background-size: 325px 140px; }
  .stream-main { padding-top: var(--hdr-h); }
  .ford-nav { display: none; }
  .bridge-bar { background-size: auto 60px; }
  .bridge-bar__inner { gap: 6px 4px; padding: 11px 12px 11px 18px; }
  .sluice-toggle { position: relative; display: flex; flex-direction: column; flex: 0 0 auto; justify-content: center; align-items: center; width: 28px; height: 36px; padding: 0; border: 0; background: transparent; color: #fff; cursor: pointer; }
  .sluice-toggle span { display: block; width: 24px; height: 3px; border-radius: 2px; background: var(--grad-gold-2); filter: drop-shadow(0 1px rgb(var(--black))); }
  .sluice-toggle span + span { margin-top: 5px; }
  .heron-logo { margin: 0 0 0 12px; }
  .heron-logo img { width: 92px; height: 38px; }
  .fieldglass-search, .bridge-bar__actions { display: none; }
  .bridge-bar__login-m, .bridge-bar__reg-m { display: inline-grid; --fs: 14px; --mh: 36px; --px: 12px; --biw: 18px; --bis: 36; column-gap: 6px; min-width: 36px; white-space: nowrap; }
  .bridge-bar__login-m { margin-left: auto; }
  .bridge-bar__reg-m { margin-left: 4px; }
  .meadow-banner { margin-top: 0; }
  .meadow-banner .bank-frame { padding: 0; }
  .meadow-carousel { --col: 100%; --hpad: 16px; }
  .meadow-carousel::before { display: none; }
  .meadow-slide { grid-template-columns: 1fr; height: 340px; }
  .meadow-slide__media::before { aspect-ratio: auto; }
  .meadow-slide__media { height: 340px; }
  .meadow-slide__inner { align-self: end; align-content: end; gap: 4px; min-height: 132px; padding: 8px 16px 8px; }
  .meadow-slide__inner::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 192px; background: linear-gradient(180deg, rgb(var(--n900) / 0) 0%, rgb(var(--n900) / .57) 20.24%, rgb(var(--n900) / .75) 38.3%, rgb(var(--n900) / .94) 71.51%, rgb(var(--n900)) 94.43%); pointer-events: none; }
  .meadow-slide__card { gap: 0; }
  .meadow-slide__label { padding: 4px 40px 12px; font-size: 10px; }
  .meadow-slide__title { --fs: 32px; }
  .meadow-slide__action { gap: 4px; min-height: 68px; align-content: start; }
  .paddle-btn--regatta { --fs: 20px; --mh: 48px; --fx: 18px; --fy: 3px; --cta: url("/images/ui/cta-s.webp"); --ctas: 48; min-width: 184px; }  /* ref: frame 215x50 (plate 48), dots 8px lower */
  .meadow-carousel__nav { display: none; }
  .meadow-carousel__dots { left: 16px; right: 16px; bottom: 8px; width: auto; }
  .meadow-carousel__dot { padding: 3px; }
  .meadow-carousel__dot::before { width: 8px; height: 8px; }
  /* sticky category strip (stb .navigation-menu: 82px, icons 32, 12px 700 uppercase, gold underline on the active item, search with separator) */
  .eddy-tabs { position: sticky; top: var(--hdr-h); z-index: 30; display: flex; align-items: end; gap: 0; overflow-x: auto; scrollbar-width: none; margin: 0; padding: 0 16px 0 16px; min-height: 77px; background: var(--bg); box-shadow: inset 0 -1px 0 0 rgb(var(--n800)); }
  .eddy-tabs::-webkit-scrollbar { display: none; }
  .eddy-tab { position: relative; display: grid; grid-auto-flow: row; justify-items: center; align-content: end; gap: 4px; flex: 0 0 auto; min-width: 72px; padding: 11px 8px 6px; border: 0; background: transparent; font-family: var(--font); font-size: 12px; font-weight: 700; line-height: 1.4; text-transform: uppercase; text-align: center; white-space: nowrap; color: var(--text-2); cursor: pointer; transition: color .2s; }
  .eddy-tab img, .eddy-tab svg { width: 32px; height: 32px; object-fit: contain; }
  .eddy-tab__ico { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; }
  .eddy-tab span { position: relative; display: flex; align-items: center; height: 24px; }
  .eddy-tab span::after { content: ""; position: absolute; left: 0; bottom: -6px; width: 100%; height: 2px; border-radius: 4px 4px 0 0; background: var(--grad-o13); opacity: 0; transition: opacity .2s; }
  .eddy-tab:hover { color: #fff; }
  .eddy-tab:hover span::after { opacity: 1; }
  .eddy-tab.is-in-flow { color: #fff; }
  .eddy-tab.is-in-flow span::after { opacity: 1; background: var(--grad-gold-7); }
  .eddy-tab--search { margin-right: 4px; padding-right: 16px; }
  .eddy-tab--search::after { content: ""; position: absolute; right: 0; top: 4px; bottom: 4px; width: 1px; background: linear-gradient(0deg, rgb(var(--n700) / 0) 0%, rgb(var(--n700)) 50%, rgb(var(--n700) / 0) 100%); }
  .stream-page { padding-top: 16px; }
  .pebble-grid .game-pebble:nth-child(n+25) { display: none; }
  .beck-shelf__head { margin-bottom: 8px; }
  .beck-shelf__title { min-height: 20px; font-size: 16px; line-height: 1.25; }
  .beck-shelf__arrows { display: none; }
  .beck-shelf__link svg { display: block; width: 14px; height: 14px; }
  .beck-scroll { margin: -6px -2px -8px; padding: 6px 2px 8px; scroll-padding: 2px; }
  .beck-scroll--ranked { margin-bottom: -16px; padding-bottom: 16px; }
  .game-pebble::after { inset: 0; }
  .game-pebble__pic { background-size: 40px 28px; }
  .game-pebble__badge { top: -4px; min-width: 44px; height: 16px; padding: 0 8px 1px; font-size: 10px; }
  .game-pebble__jackpot { min-height: 20px; font-size: 10px; line-height: 1.4; }
  .game-pebble__live::before { height: 30px; }
  .game-pebble__results { grid-template-columns: repeat(auto-fit, 16px); grid-template-rows: 16px; height: 22px; padding: 3px 4px; }
  .game-pebble__results span { width: 16px; font-size: 12px; }
  .game-pebble__results span:nth-child(n+5) { display: none; }
  .game-pebble--wide .game-pebble__results span:nth-child(n+5) { display: flex; }
  .game-pebble--wide .game-pebble__results span:nth-child(n+10) { display: none; }
  .game-pebble__seats { min-height: 16px; margin-bottom: 3px; padding: 0 6px; font-size: 12px; }
  .game-pebble__seats::before { width: 12px; height: 12px; }
  .game-pebble__limits { min-width: 58px; height: 16px; margin-bottom: -7px; padding: 0 6px 2px; font-size: 10px; line-height: 1.4; background-size: 17px 100%, 17px 100%, calc(100% - 33px) 100%; }
  .game-pebble__hover { row-gap: 4px; }
  .game-pebble__play { width: 62px; height: 62px; }
  .game-pebble__demo { font-size: 10px; }
  .numbered-lock::before, .numbered-lock::after { top: 6px; bottom: 7px; width: calc(100% - 12px); }
  .lock-number { left: 10px; font-size: 56px; transform: rotate(-5deg) translate(0, 7px); }
  .lock-number i + i { transform: translateX(-16px); }
  .lock-number--small { left: 4px; }
  .guild-crests__grid { grid-template-rows: repeat(2, 82px); grid-auto-columns: 82px; gap: 8px; }
  .guild-crest { padding: 6px 2px 4px; }
  .guild-crest::after { border-width: 14px; border-image-width: 14px; border-image-slice: 28; }
  .green-fixtures__grid { --sgap: 6px; grid-template-columns: none; grid-template-rows: repeat(2, 1fr); grid-auto-flow: column; grid-auto-columns: 118px; }
  .green-fixture { padding: 3px; }
  .green-fixture::after { border-width: 16px; border-image-width: 16px; border-image-slice: 30; }
  .green-fixture__name { min-height: 40px; font-size: 12px; }
  .green-fixture__action { padding: 24px 7px 10px; }
  .green-fixture__action .paddle-btn { --mh: 48px; --fs: 16px; }
  .harvest-prizes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .harvest-prize, .harvest-prize:nth-child(1), .harvest-prize:nth-child(2) { grid-column: span 1; }
  .harvest-prize:nth-child(3) { grid-column: span 2; }
  .harvest-prize { min-height: 84px; padding: 12px; }
  .harvest-prize::before { background-image: url("/images/ui/rewards-bg-m.webp"), var(--grad-o10); }
  .harvest-prize__img { width: 94px; }
  .harvest-prize__content { max-width: calc(100% - 50px); }
  .harvest-prize__title { font-size: 13px; }
  .harvest-prize__desc { font-size: 12px; }
  .harvest-prize__desc::after { margin-inline-start: 2px; padding-inline: 6px; background-size: 12px 12px; }
  .beck-scroll--bonuses { grid-auto-columns: 235px; }
  .fair-banner { aspect-ratio: 736 / 182; }
  .fair-banner__content { grid-template-columns: 360px; width: 390px; row-gap: 8px; padding: 14px 16px; }
  .fair-banner__title { font-size: 18px; margin-bottom: 4px; -webkit-text-stroke-width: 1px; }
  .weir-panel { padding: 16px 20px 20px; }
  .ferryman-desk__grid, .tally-items { grid-template-columns: repeat(2, 1fr); }
  .neighbour-notes__grid { grid-template-columns: repeat(2, 1fr); }
  .mill-foot__inner { row-gap: 20px; padding: 16px 16px 32px; }
  .mill-foot__top { grid-auto-columns: 1fr; }
  .mill-foot__body { grid-template-columns: 1fr; gap: 20px; padding-top: 20px; }
  .mill-foot__cols { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .mill-foot__pay { padding-top: 20px; }
  .mill-foot__links { padding-top: 20px; }
  .bunting-strip { display: none; }
}
@media (max-width: 1279px) {
  .mill-perk__title { font-size: 16px; }  /* stb: 22px only from 1280 */
  /* drawer (stb burger menu: header 60, search pill, welcome card, plate tiles 3 / 3+3 / 2+3 / 3) */
  .boathouse-menu__backdrop { display: block; position: fixed; inset: 0; z-index: 80; background: rgb(var(--black) / .6); opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
  .boathouse-menu__backdrop.is-sluice-open { opacity: 1; visibility: visible; }
  .boathouse-menu { --panel: min(406px, calc(100% - 40px)); display: flex; flex-direction: column; position: fixed; inset: 0; z-index: 90; width: 100%; background: none; transform: translateX(-104%); transition: transform .26s ease; pointer-events: none; }  /* stb: the header stays full-width (X instead of the burger, the same buttons), the 406px panel sits under it, the dimmed page shows on the right */
  .boathouse-menu.is-sluice-open { transform: translateX(0); }
  .boathouse-menu__body { display: flex; flex-direction: column; gap: 12px; flex: 1 1 auto; min-height: 0; width: var(--panel); overflow-y: auto; overscroll-behavior: contain; padding: 12px 12px 24px; background: var(--bg) url("/images/ui/bricks.webp") top left / 325px 140px repeat; box-shadow: 6px 0 24px rgb(var(--black) / .6); scrollbar-width: none; pointer-events: auto; }
  .boathouse-menu__body::-webkit-scrollbar { display: none; }
  .boathouse-menu__head { display: flex; align-items: center; gap: 4px; flex: 0 0 auto; height: 60px; padding: 0 12px 0 18px; background: rgb(var(--n850)) url("/images/ui/header-bg.webp") top center / auto 60px repeat-x; pointer-events: auto; }
  .boathouse-menu__head > img { width: 92px; height: 38px; margin-left: 12px; }
  .boathouse-menu__close { display: flex; flex: 0 0 auto; justify-content: center; align-items: center; width: 28px; height: 36px; padding: 0; border: 0; background: transparent; color: rgb(var(--y500)); cursor: pointer; filter: drop-shadow(0 1px rgb(var(--black))); }
  .boathouse-menu__close svg { width: 24px; height: 24px; }
  .boathouse-menu__cta { display: flex; gap: 4px; margin-left: auto; }
  .boathouse-menu__cta .paddle-btn { --fs: 14px; --mh: 36px; --px: 12px; --biw: 18px; --bis: 36; min-width: 36px; }
  .boathouse-menu__search { position: relative; display: flex; align-items: center; gap: 8px; flex: 0 0 auto; height: 48px; margin-top: 8px; padding: 0 16px; border: 1px solid transparent; border-radius: 100px; color: var(--text-2); font-weight: 500; font-size: 16px; white-space: nowrap; overflow: hidden; background: var(--grad-o2) padding-box, var(--grad-gold-4) border-box; box-shadow: 0 4px 4px rgb(var(--n950)); }
  .boathouse-menu__search svg, .boathouse-menu__search .fieldglass-search__ico { width: 20px; height: 20px; color: var(--text-2); }
  .boathouse-menu__banner { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; flex: 0 0 auto; min-height: 76px; padding: 10px 12px; border: 1px solid rgb(var(--n700)); overflow: hidden; color: #fff; background: var(--grad-o5); }
  .boathouse-menu__banner img { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
  .boathouse-menu__banner::before { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(90deg, rgb(var(--n900) / .85) 0%, rgb(var(--n900) / .55) 60%, rgb(var(--n900) / .25) 100%); }
  .boathouse-menu__banner > span { position: relative; z-index: 1; display: grid; gap: 2px; }
  .boathouse-menu__banner small { font-size: 14px; font-weight: 400; line-height: 1.4; color: #fff; }
  .boathouse-menu__banner b { font-size: 18px; font-weight: 700; line-height: 1.2; text-transform: uppercase; color: #fff; }
  .boathouse-menu__banner .paddle-btn { position: relative; z-index: 1; }
  .boathouse-menu__label { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; flex: 0 0 auto; margin: 4px 0 -4px; font-size: 12px; font-weight: 400; text-align: center; color: var(--text-2); }
  .boathouse-menu__label::before, .boathouse-menu__label::after { content: ""; height: 1px; background: rgb(var(--n700)); }
  .boathouse-menu__tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; flex: 0 0 auto; }
  .boathouse-menu__tiles--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .boathouse-menu__tiles--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .boathouse-menu__tile { min-height: 72px; width: 100%; padding: 10px 8px; font-size: 12px; }
  .boathouse-menu__tile--s { min-height: 60px; font-size: 10px; text-transform: none; }
  .boathouse-menu__tile--s img, .boathouse-menu__tile--s svg { width: 20px; height: 20px; }
  .boathouse-menu__tile span { max-width: 100%; }
}
@media (max-width: 900px) {
  .riverbank-phone__grid { grid-template-columns: 1fr; }
  .mill-foot__cols { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  :root { --cols-grid: 4; }
  body { padding-bottom: 0; background-size: 235px 110px; }
  .boathouse-menu__body { background-size: 235px 110px; }
  .bank-frame { padding: 0 var(--pad); }
  .meadow-banner .bank-frame { padding: 0; }
  .stream-page { padding: 16px 0 28px; row-gap: 16px; }
  .beck-scroll { grid-auto-columns: 92px; }
  .beck-scroll--wide { grid-auto-columns: calc(92px * 2 + var(--gap)); }
  .beck-scroll--ranked { grid-auto-columns: calc(92px + var(--rank-shift)); }
  .beck-scroll--bonuses { grid-auto-columns: 235px; }
  .pebble-grid .game-pebble:nth-child(n+21) { display: none; }  /* ref: 5 rows x 4, the 5th row fades out under the button */
  .fair-banner { display: block; aspect-ratio: auto; min-height: 0; }
  .fair-banner__pic { position: relative; inset: auto; display: block; width: 100%; max-height: 314px; aspect-ratio: 328 / 314; }
  .fair-banner__content { position: absolute; left: 0; right: 0; bottom: 3px; grid-template-columns: minmax(0, 1fr); width: 100%; row-gap: 8px; padding: 10px 16px 12px; background: var(--grad-o19); text-align: center; }
  .fair-banner__title { margin: 2px 0 3px; font-size: 18px; text-align: center; }
  .fair-banner .fair-banner__btn { --fs: 12px; --mh: 32px; --px: 16px; --biw: 16px; --bi: url("/images/ui/btn-prim-xs.webp"); min-width: 116px; justify-self: center; }  /* ref: 116x32 plate, 12px caps */
  .weir-panel { margin: 16px 0 0; padding: 16px; }
  .weir-panel--foreword { padding: 16px; }
  .weir-panel--foreword h1 { font-size: 20px; }
  .weir-panel--foreword p { font-size: 14px; }
  .almanac-title { font-size: 20px; }
  .paddle-btn--lg { --px: 16px; --mh: 48px; --fs: 16px; white-space: normal; text-align: center; line-height: 1.1; max-width: 100%; }
  .paddle-row .paddle-btn { max-width: 100%; }
  .tithe-scroll { max-width: 100%; }
  .stepping-stones, .ferryman-desk__grid, .neighbour-notes__grid { grid-template-columns: 1fr; }
  .tally-items { grid-template-columns: repeat(2, 1fr); }
  .river-map { margin: 16px 0 0; }
  .mill-foot { margin-top: 16px; }
  .mill-foot__top { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; column-gap: 12px; }
  .mill-foot__lang, .mill-foot__chat, .mill-foot__help, .mill-foot__app { grid-template-columns: 1fr; justify-items: center; row-gap: 4px; min-width: 0; padding: 6px 4px; font-size: 10px; white-space: normal; line-height: 1.2; }
  .mill-foot__app { display: none; }
  .mill-foot__chat { display: inline-grid; }
  .mill-foot__body { padding-top: 20px; }
  .mill-foot__cols { grid-template-columns: 1fr; gap: 12px; }  /* ref: 44px plates, pitch 56 */
  .mill-foot__col { position: relative; z-index: 0; padding: 0 16px; color: var(--text); background: linear-gradient(rgb(var(--n750)), rgb(var(--n850)) 55%, rgb(var(--n800))); box-shadow: 0 6px 6px rgb(var(--black) / .25), inset 0 1px 0 rgb(var(--n500)), inset 0 -1px 0 rgb(var(--n500)); }
  .mill-foot__col::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(var(--n600)), transparent 12px, transparent calc(100% - 12px), rgb(var(--n600))); opacity: .5; pointer-events: none; }
  .mill-foot__col .mill-foot__col-title { position: relative; margin: 0; padding: 12px 40px 12px 0; font-size: 16px; line-height: 20px; color: rgb(var(--n300)); text-shadow: .5px .5px 0 rgb(var(--n600)); cursor: pointer; }
  .mill-foot__col .mill-foot__col-title::after { content: ""; position: absolute; right: 4px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c6c6dc' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform .2s; }
  .mill-foot__col ul { display: none; padding: 0 0 16px; gap: 14px; }
  .mill-foot__col.is-sluice-open ul { display: flex; }
  .mill-foot__col.is-sluice-open .mill-foot__col-title::after { transform: translateY(-50%) rotate(180deg); }
  .mill-foot__pay-row { gap: 12px; }
  .mill-foot__pay-row .ferry-method { width: 104px; height: 44px; }
  .mill-foot__pay-row .ferry-method .ferry-method__icon img { height: 26px; max-width: 80px; }
  .mill-foot__links { gap: 20px 24px; }
  .back-upstream { right: 12px; bottom: 16px; width: 40px; height: 40px; }
}
@media (max-width: 420px) {
  .bridge-bar__login-m, .bridge-bar__reg-m { --px: 10px; }
  .meadow-slide__title { --fs: 28px; }
  .beck-shelf__title { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 20px; }
  .boathouse-menu__tiles { gap: 6px; }
}
@media (max-width: 411px) {
  :root { --cols-grid: 4; }
  .harvest-prizes { gap: 6px; }
}