/* CHRISTMAS 2026 - the shared festive blocks (12 Sep 2026): the menus, the standing-party tabs, the packages, the
   extras ledger, the dark band on the light pages, the venue pages' festive line and the seasonal ribbon.
   Every rule here is prefixed fx- so it can land on any prototype page without meeting that page's own classes.
   The blocks are always DARK (Nuo, 12 Sep 2026: the Christmas page is candlelit; the other pages' festive bands go
   dark too) - near-black warm ground, Sandstone type, Neon Orange as the season's one accent. Orange on this black
   measures about 7:1 and Sandstone about 17:1, so both pass as text. */
:root{--fx-bg:#0B0908;--fx-bg2:#151110;--fx-bg3:#1E1917;--fx-ink:#F2ECE9;--fx-acc:#F36F23;--fx-acc2:#FFB36B;--fx-mute:rgba(242,236,233,.62);--fx-line:rgba(242,236,233,.14);--fx-line2:rgba(242,236,233,.28);
  --fx-head:var(--head,"Graphik","Inter",Arial,sans-serif);--fx-body:var(--body,"Solina","Figtree",Arial,sans-serif);--fx-ease:cubic-bezier(.2,.8,.2,1)}
.fx{background:var(--fx-bg);color:var(--fx-ink);font-family:var(--fx-body)}
.fx a{color:inherit}
.fx-k{font-family:var(--fx-head);text-transform:uppercase;font-size:11px;letter-spacing:.1em;color:var(--fx-acc)}
.fx-k.mute{color:var(--fx-mute)}
.fx h2,.fx h3,.fx h4,.fx .fx-caps{font-family:var(--fx-head);font-weight:400;letter-spacing:-0.02em;line-height:1.02;margin:0}
.fx-sub{font-size:clamp(16px,1.25vw,19px);line-height:1.5;color:var(--fx-mute);max-width:58ch;hyphens:auto;-webkit-hyphens:auto}
/* pills on the dark ground: outline Sandstone; .fill is an orange outline */
.fx .pill,.fx-pill{font-family:var(--fx-head);font-size:14px;letter-spacing:-0.01em;padding:12px 20px;border:2px solid var(--fx-ink);border-radius:999px;background:transparent;color:var(--fx-ink);display:inline-flex;align-items:center;gap:8px;text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s;white-space:nowrap}
@media (hover:hover){.fx .pill:hover,.fx-pill:hover{background:transparent;color:var(--fx-ink);border-color:var(--fx-acc)}}   /* outline only - V2 slide 79 (13 Sep 2026) */
/* WHITE type in the orange outline (Nuo, 13 Sep 2026: "white font everywhere where the background is dark"). The
   morning's version set black, reading V2 slide 79 for a light ground - but .fx IS the dark ground (.fx above paints
   --fx-bg), so every instance was black on black: the Private Hire band, the Menus row, the Menus dialog's "Plan a
   Christmas party →", the sharing picker's "Send it with your enquiry →". Two pages had patched their own instance
   white; this is the rule they were patching. White on #0B0908 is about 19:1. */
.fx .pill.fill,.fx-pill.fill{background:transparent;border-color:var(--fx-acc);color:#fff}
@media (hover:hover){.fx .pill.fill:hover,.fx-pill.fill:hover{background:transparent;border-color:var(--fx-ink);color:var(--fx-ink)}}
.fx .pill.ghost,.fx-pill.ghost{border-color:var(--fx-line2);color:var(--fx-ink)}
@media (hover:hover){.fx .pill.ghost:hover,.fx-pill.ghost:hover{border-color:var(--fx-ink);background:transparent;color:var(--fx-ink)}}
.fx .pill.big,.fx-pill.big{font-size:17px;padding:17px 30px}
.fx .pill.sm,.fx-pill.sm{font-size:12px;padding:8px 14px}
/* the dietary marks: v, vg, gf as small caps in a hairline box */
.fx-tags{display:inline-flex;gap:4px;margin-left:8px;vertical-align:middle}
.fx-tag{font-family:var(--fx-head);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--fx-mute);border:1px solid var(--fx-line2);border-radius:4px;padding:2px 5px;line-height:1}   /* 10px: the annotation floor; was 9 (13 Sep 2026 audit) - a dietary mark is read, not decorative */
/* a supplement: the season's colour, never a pound sign */
.fx-sup{font-family:var(--fx-head);font-size:12px;letter-spacing:.02em;color:var(--fx-acc);white-space:nowrap;margin-left:10px}

/* ============================ the menus ============================ */
.fx-menu{background:var(--fx-bg2);border:1px solid var(--fx-line);border-radius:22px;padding:34px 36px 30px;position:relative;overflow:hidden}
.fx-menu::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 100% 0%,rgba(243,111,35,.14),rgba(243,111,35,0) 55%);pointer-events:none}
.fx-menu>*{position:relative}
.fx-mhd{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding-bottom:22px;border-bottom:1px solid var(--fx-line2)}
.fx-mhd h3{font-size:clamp(26px,2.4vw,36px);margin-top:8px}
.fx-mhd .fx-line{margin:12px 0 0;color:var(--fx-mute);font-size:15px;line-height:1.5;max-width:46ch;hyphens:auto;-webkit-hyphens:auto}
.fx-price{text-align:right;flex:0 0 auto}
.fx-price b{display:block;font-family:var(--fx-head);font-weight:400;font-size:clamp(44px,4.4vw,64px);letter-spacing:-0.03em;line-height:.95;font-variant-numeric:tabular-nums}
.fx-price span{display:block;font-family:var(--fx-head);text-transform:uppercase;font-size:11px;letter-spacing:.08em;color:var(--fx-mute);margin-top:6px}
.fx-opener{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:16px 0;border-bottom:1px dashed var(--fx-line);font-size:15px;color:var(--fx-ink)}
.fx-opener .fx-k{color:var(--fx-mute);margin-right:10px}
.fx-courses{display:grid;grid-template-columns:1fr;gap:0}
.fx-course{padding:22px 0 8px;border-bottom:1px solid var(--fx-line)}
.fx-course:last-child{border-bottom:0}
.fx-chd{display:flex;align-items:baseline;gap:14px;margin-bottom:10px}
.fx-num{font-family:var(--fx-head);font-size:11px;letter-spacing:.1em;color:var(--fx-acc);font-variant-numeric:tabular-nums}
.fx-chd h4{font-size:clamp(18px,1.5vw,22px);text-transform:none}
.fx-pick{margin-left:auto;font-family:var(--fx-head);text-transform:uppercase;font-size:11px;letter-spacing:.08em;color:var(--fx-mute);display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.fx-pick i{display:inline-flex;gap:4px}
.fx-pick i b{width:7px;height:7px;border-radius:50%;border:1px solid var(--fx-line2);display:block;transition:background .25s,border-color .25s,transform .25s}
.fx-pick i b.on{background:var(--fx-acc);border-color:var(--fx-acc);transform:scale(1.15)}
.fx-pick.done{color:var(--fx-acc)}
.fx-note{font-size:13px;color:var(--fx-mute);margin:0 0 10px;line-height:1.45}
.fx-dishes{list-style:none;margin:0;padding:0}
.fx-dishes li{margin:0;padding:0}
.fx-dish{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 0;font-size:15.5px;line-height:1.4;color:var(--fx-ink);border-top:1px solid rgba(242,236,233,.06)}
.fx-dishes li:first-child .fx-dish{border-top:0}
.fx-dish .n{flex:1 1 auto;hyphens:auto;-webkit-hyphens:auto}
/* build-your-table: the dish is a button; chosen fills a small square with the accent and the row lifts */
button.fx-dish{width:100%;text-align:left;background:none;border:0;border-top:1px solid rgba(242,236,233,.06);font:inherit;color:inherit;cursor:pointer;border-radius:8px;padding:9px 10px 9px 34px;position:relative;transition:background .2s,color .2s}
button.fx-dish::before{content:"";position:absolute;left:8px;top:14px;width:14px;height:14px;border-radius:4px;border:1.5px solid var(--fx-line2);transition:background .2s,border-color .2s,transform .2s}
@media (hover:hover){button.fx-dish:hover{background:rgba(242,236,233,.05)}}
button.fx-dish[aria-pressed="true"]{background:rgba(243,111,35,.12)}
button.fx-dish[aria-pressed="true"]::before{background:var(--fx-acc);border-color:var(--fx-acc);transform:scale(1.05);box-shadow:0 0 0 3px rgba(243,111,35,.18)}
button.fx-dish[aria-disabled="true"]{color:var(--fx-mute);cursor:not-allowed}
.fx-course.full button.fx-dish[aria-pressed="false"]{opacity:.55}
.fx-course.shake .fx-pick{animation:fxshake .4s}
@keyframes fxshake{0%,100%{transform:none}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.fx-trim{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--fx-line);font-size:13.5px;line-height:1.5;color:var(--fx-mute)}
.fx-trim b{color:var(--fx-ink);font-weight:500}
.fx-mft{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:18px;font-size:12.5px;color:var(--fx-mute)}
.fx-mft a{text-decoration:underline;text-underline-offset:3px;color:var(--fx-ink);padding:3px 0} /* a flex item is blockified: 19px tall bare, 25 with the padding (tap floor 24, 25 Sep 2026) */
/* the table's summary, drawn by the build control: what has been chosen, and the two actions */
.fx-table{margin-top:18px;padding:18px 20px;border:1px solid var(--fx-line2);border-radius:14px;background:rgba(0,0,0,.25);display:none}
.fx-table.on{display:block}
.fx-table .fx-k{margin-bottom:8px}
.fx-table dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:14px;line-height:1.45}
.fx-table dt{font-family:var(--fx-head);text-transform:uppercase;font-size:10.5px;letter-spacing:.08em;color:var(--fx-mute);padding-top:3px}
.fx-table dd{margin:0}
.fx-table .acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.fx-table .done{color:var(--fx-acc)}

/* two menus side by side on a wide screen */
.fx-menus{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
@media (max-width:1020px){.fx-menus{grid-template-columns:1fr}}
@media (max-width:560px){.fx-menu{padding:26px 20px 22px;border-radius:16px}.fx-mhd{flex-direction:column}.fx-price{text-align:left}.fx-dish{font-size:15px}.fx-pick span{display:none}}

/* ============================ for a standing party: tabs ============================ */
.fx-party{background:var(--fx-bg2);border:1px solid var(--fx-line);border-radius:22px;overflow:hidden}
.fx-tabs{display:flex;gap:0;border-bottom:1px solid var(--fx-line2);overflow-x:auto;scrollbar-width:none}
.fx-tabs::-webkit-scrollbar{display:none}
.fx-tab{flex:1 0 auto;background:none;border:0;color:var(--fx-mute);font-family:var(--fx-head);font-size:14px;letter-spacing:-0.01em;padding:20px 22px;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;transition:color .2s;min-height:24px}
.fx-tab small{font-family:var(--fx-head);text-transform:uppercase;font-size:10.5px;letter-spacing:.08em;color:var(--fx-mute)}
.fx-tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--fx-acc);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--fx-ease)}
@media (hover:hover){.fx-tab:hover{color:var(--fx-ink)}}
.fx-tab[aria-selected="true"]{color:var(--fx-ink)}
.fx-tab[aria-selected="true"]::after{transform:scaleX(1)}
.fx-tab[aria-selected="true"] small{color:var(--fx-acc)}
.fx-pane{display:none;padding:28px 32px 30px}
.fx-pane[data-on]{display:block;animation:fxin .45s var(--fx-ease)}
@keyframes fxin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.fx-phd{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:18px;flex-wrap:wrap}
.fx-phd p{margin:0;color:var(--fx-mute);font-size:14.5px;line-height:1.5;flex:1 1 0;min-width:min(100%,280px)}   /* full width of the pane beside the price; was max-width:60ch (Nuo, 30 Sep 2026) */
.fx-each{font-family:var(--fx-head);font-size:clamp(22px,2vw,30px);letter-spacing:-0.02em;white-space:nowrap}
.fx-each span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fx-mute);margin-left:8px}
.fx-grps{display:grid;grid-template-columns:1fr 1fr;gap:6px 40px}
.fx-grp{padding:6px 0 14px}
.fx-grp .fx-k{margin-bottom:6px;display:flex;justify-content:space-between}
.fx-grp .fx-k em{font-style:normal;color:var(--fx-mute);font-variant-numeric:tabular-nums}
.fx-grp .fx-dish{font-size:14.5px;padding:7px 0}
.fx-boards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:6px}
.fx-board{border:1px solid var(--fx-line2);border-radius:14px;padding:18px 18px 16px;background:rgba(0,0,0,.2);display:flex;flex-direction:column;gap:10px}
.fx-board h5{font-family:var(--fx-head);font-weight:400;font-size:17px;letter-spacing:-0.02em;margin:0;display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.fx-board h5 b{font-weight:500;color:var(--fx-acc);white-space:nowrap;font-size:15px}
.fx-board p{margin:0;font-size:13.5px;line-height:1.45;color:var(--fx-mute)}
.fx-board .est{margin-top:auto;padding-top:10px;border-top:1px dashed var(--fx-line);font-family:var(--fx-head);font-size:13px;color:var(--fx-ink)}
.fx-board .est b{color:var(--fx-acc);font-weight:500}
/* the grazing guide: a number of guests -> square metres -> a guide price per board */
.fx-calc{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:16px 18px;border:1px solid var(--fx-line2);border-radius:14px;background:rgba(243,111,35,.06);margin-bottom:18px}
.fx-calc label{font-family:var(--fx-head);font-size:13px;display:flex;align-items:center;gap:10px}
.fx-calc .num{display:inline-flex;align-items:center;border:1px solid var(--fx-line2);border-radius:999px;overflow:hidden}
.fx-calc .num button{background:none;border:0;color:var(--fx-ink);width:36px;height:34px;font-size:18px;cursor:pointer}
@media (hover:hover){.fx-calc .num button:hover{background:rgba(242,236,233,.08)}}
.fx-calc .num input{width:56px;text-align:center;background:none;border:0;color:var(--fx-ink);font:inherit;font-family:var(--fx-head);font-size:16px;-moz-appearance:textfield}
.fx-calc .num input::-webkit-inner-spin-button,.fx-calc .num input::-webkit-outer-spin-button{-webkit-appearance:none}
.fx-calc .out{font-size:14px;color:var(--fx-mute)}
.fx-calc .out b{color:var(--fx-ink);font-weight:500;font-family:var(--fx-head)}
@media (max-width:860px){.fx-grps{grid-template-columns:1fr}.fx-boards{grid-template-columns:1fr}.fx-pane{padding:22px 20px 24px}.fx-tab{padding:16px 16px}}

/* ============================ packages ============================ */
.fx-packs{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.fx-pack{position:relative;border:1px solid var(--fx-line2);border-radius:18px;padding:24px 22px 22px;background:var(--fx-bg2);display:flex;flex-direction:column;gap:14px;overflow:hidden;transition:transform .35s var(--fx-ease),border-color .35s}
@media (hover:hover){.fx-pack:hover{transform:translateY(-4px);border-color:rgba(242,236,233,.45)}}
.fx-pack .tier{font-family:var(--fx-head);text-transform:uppercase;font-size:11px;letter-spacing:.14em;color:var(--fx-mute)}
.fx-pack h4{font-size:clamp(22px,1.9vw,28px)}
.fx-pack ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.fx-pack li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45;color:var(--fx-ink)}
.fx-pack li img{width:12px;height:12px;flex:0 0 auto;margin-top:5px;opacity:.9}
.fx-pack .seat{margin-top:auto;padding-top:14px;border-top:1px dashed var(--fx-line);font-size:12.5px;color:var(--fx-mute)}
/* the tiers read as metals without gilding: a hairline sheen on the top edge, warmest on Platinum */
.fx-pack::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,rgba(242,236,233,0),rgba(242,236,233,.5),rgba(242,236,233,0))}
.fx-pack.gold::before{background:linear-gradient(90deg,rgba(243,111,35,0),rgba(255,179,107,.9),rgba(243,111,35,0))}
.fx-pack.platinum{border-color:rgba(243,111,35,.6);background:linear-gradient(180deg,rgba(243,111,35,.12),var(--fx-bg2) 60%)}
.fx-pack.platinum::before{background:linear-gradient(90deg,rgba(243,111,35,0),var(--fx-acc),rgba(243,111,35,0))}
.fx-pack.cocktail{background:linear-gradient(180deg,rgba(242,236,233,.06),var(--fx-bg2) 60%)}
@media (max-width:1100px){.fx-packs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.fx-packs{grid-template-columns:1fr}}

/* ============================ the extra details: a ledger ============================ */
.fx-extras{columns:2;column-gap:48px}
.fx-extra{break-inside:avoid;display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--fx-line);font-size:15.5px}
.fx-extra .n{flex:1 1 auto}
.fx-extra .n small{display:block;font-size:12.5px;color:var(--fx-mute);margin-top:2px;line-height:1.4}
.fx-extra .p{font-family:var(--fx-head);white-space:nowrap;font-variant-numeric:tabular-nums}
.fx-extra .p small{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fx-mute);margin-right:6px}
.fx-extra .p.poa{color:var(--fx-mute);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.fx-vat{margin:16px 0 0;font-size:12.5px;color:var(--fx-mute)}
@media (max-width:760px){.fx-extras{columns:1}}

/* ============================ the band on a light page (Menus, Private Hire) ============================ */
.fx-band{background:var(--fx-bg);color:var(--fx-ink);border-radius:24px;padding:0;display:grid;grid-template-columns:1.1fr 1fr;overflow:hidden;position:relative;min-height:380px}
.fx-band .pic{position:relative;min-height:280px}
.fx-band .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fx-band .pic::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,9,8,0) 55%,var(--fx-bg) 100%),linear-gradient(0deg,rgba(11,9,8,.5),rgba(11,9,8,0) 50%)}
.fx-band .txt{padding:44px 48px 40px;display:flex;flex-direction:column;justify-content:center;gap:18px;position:relative}
.fx-band .txt::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 100% 100%,rgba(243,111,35,.16),rgba(243,111,35,0) 60%);pointer-events:none}
.fx-band .txt>*{position:relative}
.fx-band h2{font-size:clamp(30px,3.2vw,48px);margin:0}
.fx-band p{margin:0;color:var(--fx-mute);font-size:16px;line-height:1.5;max-width:52ch;hyphens:auto;-webkit-hyphens:auto}
.fx-band .prices{display:flex;gap:28px;flex-wrap:wrap}
.fx-band .prices div{border-left:2px solid var(--fx-acc);padding-left:12px}
.fx-band .prices b{display:block;font-family:var(--fx-head);font-weight:400;font-size:clamp(28px,2.6vw,40px);letter-spacing:-0.03em;line-height:1}
.fx-band .prices span{display:block;font-family:var(--fx-head);text-transform:uppercase;font-size:10.5px;letter-spacing:.08em;color:var(--fx-mute);margin-top:6px}
.fx-band .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
/* no .fx-band .acts .pill.fill override: it patched the shared .fill rule's black type white for this band alone
   (13 Sep 2026, morning); the shared rule is white now, for every dark ground - see the pills at the top */
.fx-band .kk{display:inline-flex;align-items:center;gap:10px}
.fx-band .kk i{width:8px;height:8px;border-radius:50%;background:var(--fx-acc);animation:fxpulse 1.8s ease-in-out infinite}
@keyframes fxpulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.6);opacity:.55}}
@media (max-width:860px){.fx-band{grid-template-columns:1fr}.fx-band .pic{min-height:220px}.fx-band .pic::after{background:linear-gradient(180deg,rgba(11,9,8,0) 50%,var(--fx-bg) 100%)}.fx-band .txt{padding:8px 24px 30px}}
@media (prefers-reduced-motion:reduce){.fx-band .kk i,.fx-course.shake .fx-pick{animation:none}.fx-pane[data-on]{animation:none}}

/* ============================ the venue pages' festive line ============================ */
.fx-siteline{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.28);font-size:14px;line-height:1.5}
.fx-siteline .fx-k{display:block;margin-bottom:4px;color:var(--fx-acc2)}
.fx-siteline a{text-decoration:underline;text-underline-offset:3px}

/* ============================ the seasonal ribbon, every page but the Christmas page ============================
   A 36px bar over the nav. The nav is position:fixed at top:0 on every page, so body.dgrib moves it (and the About
   page's chapter pills, and every anchor's scroll margin) down by the bar's height. Dismiss remembers per viewer
   (localStorage, in a try) and removes the class again. */
:root{--fx-rib:36px}
.fx-rib{position:fixed;top:0;left:0;right:0;height:var(--fx-rib);z-index:60;background:var(--fx-acc);color:#000;display:flex;align-items:center;justify-content:center;gap:14px;padding:0 48px 0 16px;font-family:var(--fx-head);font-size:13px;letter-spacing:.01em;transform:translateY(-100%);transition:transform .5s var(--fx-ease)}
.fx-rib.in{transform:none}
.fx-rib img{width:14px;height:14px;flex:0 0 auto}
.fx-rib span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-rib a.go{color:#000;text-decoration:underline;text-underline-offset:3px;white-space:nowrap;font-weight:500;padding:9px 0}   /* padding: the link's box fills the 36px bar (a 96x18 tap target on every page before 13 Sep 2026; 24px is the floor) */
.fx-rib button{position:absolute;right:8px;top:0;height:var(--fx-rib);width:36px;background:none;border:0;color:#000;font-size:20px;line-height:1;cursor:pointer;border-radius:8px}
@media (hover:hover){.fx-rib button:hover{background:rgba(0,0,0,.12)}}
body.dgrib .nav{top:var(--fx-rib)}
body.dgrib .chapters{top:calc(var(--nav,72px) + var(--fx-rib))}
body.dgrib section[id]{scroll-margin-top:calc(var(--nav,72px) + var(--fx-rib) + 16px)}
body.dgrib .mmenu{padding-top:calc(80px + var(--fx-rib))}
body.dgrib .dgskip:focus{top:calc(12px + var(--fx-rib))}
@media (max-width:560px){.fx-rib{font-size:12px;padding-left:12px}.fx-rib img{display:none}}
@media (prefers-reduced-motion:reduce){.fx-rib{transition:none}}
/* == E9 ONE BUTTON (Nuo, 24 Sep 2026, elegance pass) == every button in copy on the prototype is the same object: outline,
   8px corners, 13px caps in the head face, a 1.5px rule, no fill. Colour is the context's through currentColor (ink on
   Sandstone, white on a photograph); the tinted and filled variants (.fill .blue .sand .light) lose their tint. Floating
   chrome - the Map fab, dialog close buttons, the tour's Close - is not a button in copy and keeps its shape. The same
   text sits in every first-parse stylesheet, cards.css and collection.css; audit_prototype_caps.js checks each carries it. */
.pill,.fx .pill,.fx-pill,.nav .book,button.book,.card .bk:not(.walk),.mapcard .mcbk,.place .go,.place .bk,.ev .go,.enq .chips button,.chips button,.guide button,.railnav button{border-radius:8px;font-family:var(--head);font-size:13px;letter-spacing:.06em;text-transform:uppercase;font-weight:400;border-width:1.5px;border-style:solid;background:transparent;box-shadow:none}
.pill.fill,.fx .pill.fill,.fx-pill.fill,.fx .pill.ghost,.fx-pill.ghost,.pill.blue,.pill.sand,.pill.light,.pill.dark,.nav .book,.card .bk:not(.walk),.place .go,.place .bk{color:inherit;border-color:currentColor;background:transparent}
.nav .book{color:#fff;border-color:currentColor}.nav.solid .book{color:var(--ink,#000);border-color:currentColor}   /* the bar's Book: white over a photograph, ink on the Sandstone bar - the one place inherit is wrong (the bar's own colour is ink while its links are white) */
@media (hover:hover){.pill:hover,.nav .book:hover,.card .bk:not(.walk):hover{background:transparent;color:inherit;border-color:currentColor;opacity:.7}}
/* == BUTTONS: BLACK, BLUE ON HOVER 3 OCT 2026 == Nuo: "on all the pages, make all the buttons show as black font with black border, turn
   them blue when the mouse hovers over them; except the art page on black: white, neon green on hover; and the christmas page on
   black: white, neon orange on hover". REVERSES the 2 Oct orange-accent block (kept above as the record). Shape, size, caps and no
   fill stand (E9). Light ground: ink rule and label; on hover Neon Orange #F36F23 (Nuo, 3 Oct 2026, 11:45 - was Neon Blue from that morning). A button over a photograph, on a card or on a dark
   bar stays white. art.css and christmas.css set --btn / --btn-hover on body for their black grounds. */
body .pill:not(.light),body .pill.fill,body .pill.blue,body .pill.dark,body .panel.dg .pill,body button.book,body .nav.solid .book,body .mapcard .mcbk,body .ev .go,body .enq .chips button,body .chips button,body .guide button,body .railnav button,body .cats .mchip,body .cats .cpill:not(.here){color:var(--btn,#000);border-color:var(--btn,#000)}   /* `body` prefix: out-ranks a page's own two-class pill rules (About's .pledge .bc a.pill, .lam a.pill) so one rule holds everywhere */
.nav:not(.solid) .book,.place .go,.place .bk,.hero .pill,.card .bk:not(.walk),.pill.light{color:#fff;border-color:currentColor}
@media (hover:hover){body .pill:hover,body .nav.solid .book:hover,body button.book:hover,body .cats .mchip:hover,body .cats .cpill:not(.here):hover,body .gbtn:hover{color:var(--btn-hover,#F36F23);border-color:var(--btn-hover,#F36F23);opacity:1;background:transparent}
.nav:not(.solid) .book:hover,.place .go:hover,.place .bk:hover,.hero .pill:hover,.card .bk:not(.walk):hover,.pill.light:hover{color:var(--btn-hover,#F36F23);border-color:var(--btn-hover,#F36F23)}}

/* the party menu as its PDF only (Nuo, 3 Nov 2026): the link centred, the service line under it */
.fx-partypdf{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:8px 0 4px}
.fx-partypdf p{margin:0;font-size:12.5px;color:var(--fx-mute)}
