/* Shared presentation palette. One static route works in either color mode. */
:root {
 color-scheme:light;
 --theme-canvas:#F7F8FA; --theme-surface:#FFFFFF; --theme-ink:#20242B;
 --theme-muted:#58616D; --theme-line:#DDE1E6; --theme-control-line:#7F8894;
 --theme-primary:#FFD400; --theme-primary-hover:#E6BD00;
 --theme-accent:#685400; --theme-accent-soft:#FFF6CD; --theme-accent-hover:#F5E9B1;
 --theme-accent-muted:#BFA42E; --theme-subtle:#F0F2F5;
 --theme-on-primary:#17140A; --theme-art-ink:#17140A; --theme-stage:#EEF0F3;
 --theme-rank-color:#FFD400; --theme-rank-background:#FFFFFF; --theme-offer-row-bg:#F3F5F7;
 --theme-label-category-bg:#F8E5D5; --theme-label-category-ink:#734223;
 --theme-label-cashback-bg:#E6EED9; --theme-label-cashback-ink:#3D5725;
 --theme-label-min-spend-bg:#F8E4D4; --theme-label-min-spend-ink:#794121;
 --theme-label-welcome-bg:#F3E0E8; --theme-label-welcome-ink:#783A52;
 --theme-label-period-bg:#F3E9C9; --theme-label-period-ink:#695117;
 --theme-label-upcoming-bg:#E8ECD9; --theme-label-upcoming-ink:#4C5729;
 --theme-label-neutral-bg:#EDEFF2; --theme-label-neutral-ink:#4C5561;
 --theme-label-review-bg:#F9E1DB; --theme-label-review-ink:#813C2D;
 --theme-label-condition-bg:#F5EACA; --theme-label-condition-ink:#68501E;
 --theme-overlay:rgb(20 22 28 / .45); --theme-disabled-bg:#EDEFF2; --theme-disabled-ink:#58616D;
}
:root[data-theme="dark"] {
 color-scheme:dark;
 --theme-canvas:#0A0A0A; --theme-surface:#14151B; --theme-ink:#F5F7FF;
 --theme-muted:#A7AAB8; --theme-line:#3D3F49; --theme-control-line:#777984;
 --theme-primary:#FFD400; --theme-primary-hover:#E6BD00;
 --theme-accent:#FFD400; --theme-accent-soft:#30280B; --theme-accent-hover:#42360A;
 --theme-accent-muted:#A88100; --theme-subtle:#18170F;
 --theme-on-primary:#17140A; --theme-art-ink:#17140A; --theme-stage:#080805;
 --theme-rank-color:#FFD400; --theme-rank-background:#211D10; --theme-offer-row-bg:#27271B;
 --theme-label-category-bg:#392A1F; --theme-label-category-ink:#F0C09A;
 --theme-label-cashback-bg:#28351F; --theme-label-cashback-ink:#C5DDA0;
 --theme-label-min-spend-bg:#3D291D; --theme-label-min-spend-ink:#F2B58D;
 --theme-label-welcome-bg:#392833; --theme-label-welcome-ink:#E7B9C8;
 --theme-label-period-bg:#3A3018; --theme-label-period-ink:#EAD98D;
 --theme-label-upcoming-bg:#2E3422; --theme-label-upcoming-ink:#D4DAB1;
 --theme-label-neutral-bg:#292A24; --theme-label-neutral-ink:#D1CFBE;
 --theme-label-review-bg:#3A2423; --theme-label-review-ink:#F0B1A1;
 --theme-label-condition-bg:#3B301A; --theme-label-condition-ink:#EAD58A;
 --theme-overlay:rgb(0 0 0 / .7); --theme-disabled-bg:#24252B; --theme-disabled-ink:#A7AAB8;
}
/* Retain yellow in the brand illustration, without washing the whole stage gold. */
:root:not([data-theme="dark"]) #vue-app .editorial-art { background:var(--theme-stage); }
:root:not([data-theme="dark"]) #vue-app .static-language-options { box-shadow:0 8px 24px rgb(32 36 43 / .1); }
#vue-app .category-option-parent,#vue-app .result-count { color:var(--theme-muted); }
#vue-app .art-card-front { background:var(--theme-primary); }
#vue-app .editorial-art::before,#vue-app .art-orbit { border-color:var(--theme-line); }
#vue-app :is(input:not([type=checkbox]):not([type=radio]),select,.static-category-picker > summary,.static-language-menu > summary) { border-color:var(--theme-control-line); }
#vue-app input:disabled:not([role="switch"]),#vue-app select:disabled,#vue-app button:disabled { opacity:1; background:var(--theme-disabled-bg); color:var(--theme-disabled-ink); -webkit-text-fill-color:var(--theme-disabled-ink); }
#vue-app.page-best-of-the-day .best-card-detail-panel::backdrop,#vue-app .static-navigation-dialog::backdrop { background:var(--theme-overlay); }
#vue-app :focus-visible { outline:2px solid var(--theme-ink); outline-offset:3px; }
@media (forced-colors:active) {
 #vue-app :focus-visible { outline-color:Highlight; }
}

/* One switch component, including checked/unchecked disabled states and theme.
   The label remains a 44px target; the native input owns keyboard/state semantics. */
#vue-app .static-switch { position:relative; display:inline-flex; align-items:center; gap:10px; min-width:44px; min-height:44px; margin:0; padding:0; color:var(--theme-ink); font:inherit; font-size:14px; line-height:1.4; cursor:pointer; vertical-align:middle; }
#vue-app .static-switch > .static-switch-input { position:absolute; inset:0; width:100%; height:100%; min-height:0; margin:0; padding:0; border:0; opacity:0; cursor:inherit; }
#vue-app .static-switch-track { display:block; box-sizing:border-box; position:relative; flex:0 0 44px; width:44px; height:26px; border:1px solid var(--theme-control-line); border-radius:999px; background:var(--theme-muted); }
#vue-app .static-switch-thumb { display:flex; align-items:center; justify-content:center; position:absolute; top:2px; left:2px; width:20px; height:20px; border-radius:50%; color:var(--theme-ink); background:var(--theme-surface); transition:transform .15s ease; }
#vue-app .static-switch-input:checked + .static-switch-track { background:var(--theme-primary); }
#vue-app .static-switch-input:checked + .static-switch-track .static-switch-thumb { transform:translateX(18px); background:var(--theme-on-primary); color:var(--theme-primary); }
#vue-app .static-switch:has(> input:disabled) { color:var(--theme-disabled-ink); cursor:not-allowed; }
#vue-app .static-switch-input:disabled + .static-switch-track { background:var(--theme-disabled-bg); border-color:var(--theme-control-line); border-style:dashed; }
#vue-app .static-switch-input:disabled + .static-switch-track .static-switch-thumb { color:var(--theme-disabled-bg); background:var(--theme-disabled-ink); }
#vue-app .static-switch-input:focus-visible + .static-switch-track { outline:2px solid var(--theme-ink); outline-offset:3px; }
#vue-app .static-switch:has(> input:not(:disabled)):hover .static-switch-track { box-shadow:0 0 0 3px var(--theme-subtle); }
#vue-app .static-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
#vue-app .static-theme-toggle { flex:0 0 44px; }
#vue-app [data-theme-icon] { box-sizing:border-box; width:12px; height:12px; border:1.5px solid currentColor; border-radius:50%; box-shadow:inset -3px -2px 0 0 currentColor; }
:root[data-theme="dark"] #vue-app [data-theme-icon] { width:10px; height:10px; border:2px dotted currentColor; box-shadow:none; }
/* SVG strokes are centered geometrically, independent of font baselines. */
#vue-app .static-icon { display:inline-flex; align-items:center; justify-content:center; flex:none; width:20px; height:20px; line-height:1; vertical-align:middle; }
#vue-app .static-icon > svg { display:block; width:20px; height:20px; }
#vue-app .static-icon-button { box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; width:44px; height:44px; min-width:44px; min-height:44px; margin:0; padding:0; border:0; border-radius:50%; background:var(--theme-surface); color:var(--theme-ink); font:inherit; line-height:1; cursor:pointer; vertical-align:middle; }
#vue-app .static-icon-button-with-label { flex-basis:auto; width:auto; gap:8px; padding:0 10px; border-radius:8px; font-size:13px; font-weight:650; }
#vue-app .static-icon-button:hover:not(:disabled) { background:var(--theme-subtle); }
#vue-app .static-icon-button:focus-visible { outline:2px solid var(--theme-ink); outline-offset:3px; }
#vue-app .app-header .static-icon-button,#vue-app .app-header .static-main-menu > summary,#vue-app .app-header .static-language-menu > summary { border:0; background:transparent; min-width:44px; min-height:44px; }
#vue-app .app-header .static-icon-button:hover,#vue-app .app-header .static-main-menu > summary:hover,#vue-app .app-header .static-language-menu > summary:hover { background:var(--theme-subtle); }
#vue-app .static-main-menu > summary { align-items:center; justify-content:center; gap:8px; }
#vue-app .best-view-options .static-switch { grid-column:auto; justify-self:start; }
@media(max-width:720px) { #vue-app .best-view-options .static-switch { font-size:12px; gap:8px; justify-self:stretch; } }
@media(forced-colors:active) {
 #vue-app .static-switch-input:focus-visible + .static-switch-track { outline-color:Highlight; }
 #vue-app .static-switch-track { forced-color-adjust:none; background:Canvas; border-color:ButtonText; }
 #vue-app .static-switch-thumb { forced-color-adjust:none; background:ButtonText; }
 #vue-app .static-switch-input:checked + .static-switch-track { background:Highlight; }
 #vue-app .static-switch-input:checked + .static-switch-track .static-switch-thumb { background:HighlightText; }
 #vue-app .static-switch-input:disabled + .static-switch-track { background:Canvas; border-color:GrayText; }
 #vue-app .static-switch-input:disabled + .static-switch-track .static-switch-thumb { background:GrayText; }
}
@media(prefers-reduced-motion:reduce) { #vue-app .static-switch-thumb { transition:none; } }

/* Spending amounts are exclusive static destinations, styled as one button group. */
#vue-app .static-amount-field { min-width:0; }
#vue-app .static-amount-options { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
#vue-app .static-amount-options > a { box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; flex:1 1 90px; min-width:44px; min-height:44px; padding:10px 14px; border:1px solid var(--theme-control-line); border-radius:999px; color:var(--theme-ink); background:var(--theme-surface); font-size:14px; font-weight:650; line-height:1.2; font-variant-numeric:tabular-nums; text-decoration:none; white-space:nowrap; }
#vue-app .static-amount-options > a:hover { background:var(--theme-subtle); }
#vue-app .static-amount-options > a[aria-current="page"] { border-color:var(--theme-on-primary); color:var(--theme-on-primary); background:var(--theme-primary); }
#vue-app .static-amount-options > a[aria-current="page"]:hover { background:var(--theme-primary-hover); }
#vue-app .static-amount-options > a:focus-visible { outline:2px solid var(--theme-ink); outline-offset:3px; }
@media(forced-colors:active) { #vue-app .static-amount-options > a[aria-current="page"] { border-width:2px; } }

/* Requested navigation foreground, identical on desktop and the mobile sheet. */
#vue-app .app-header { --navigation-ink:#000000; }
:root[data-theme="dark"] #vue-app .app-header { --navigation-ink:#FFFFFF; }
#vue-app .app-header #main-navigation > a,
#vue-app .app-header #main-navigation > a[aria-current],
#vue-app .app-header #main-navigation > a:hover,
#vue-app .app-header .static-language-menu > summary,
#vue-app .app-header .static-language-options a,
#vue-app .app-header .static-language-options a[aria-current],
#vue-app .app-header .static-settings-languages a,
#vue-app .app-header .static-settings-languages a[aria-current],
#vue-app .app-header .static-icon-button,
#vue-app .app-header .static-main-menu > summary { color:var(--navigation-ink); }
#vue-app .app-header #main-navigation > a[aria-current]::after { background:var(--navigation-ink); }

/* One header disclosure for language and appearance. It remains an ordinary
   keyboard-operable disclosure, rather than an application-style menu. */
#vue-app .static-settings-menu { position:relative; flex:0 0 44px; width:44px; margin:0; padding:0; border:0; }
#vue-app .static-settings-button { list-style:none; }
#vue-app .static-settings-button::-webkit-details-marker { display:none; }
#vue-app .static-settings-menu[open] > .static-settings-button { background:var(--theme-subtle); }
#vue-app .static-settings-panel { --dropdown-preferred-width:248px; padding:8px; text-align:left; }
#vue-app .static-settings-section { margin:0; padding:8px; }
#vue-app .static-settings-label { margin:0 0 4px; color:var(--theme-muted); font-size:12px; font-weight:650; line-height:1.4; }
#vue-app .static-settings-languages { display:grid; gap:2px; }
#vue-app .static-settings-languages > a { box-sizing:border-box; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; padding:10px 8px; border-radius:6px; color:var(--navigation-ink); font-size:14px; line-height:1.4; text-decoration:none; }
#vue-app .static-settings-languages > a:hover { background:var(--theme-subtle); }
#vue-app .static-settings-languages > a[aria-current] { font-weight:650; background:var(--theme-accent-soft); }
#vue-app .static-settings-languages > a[aria-current]::after { content:'✓'; flex:none; }
#vue-app .static-settings-panel .static-theme-toggle { display:flex; flex-direction:row-reverse; justify-content:space-between; width:100%; gap:12px; }
#vue-app .static-settings-panel .static-switch-label { flex:1; }
@media(max-width:720px) {
 #vue-app.static-page .static-settings-menu { margin-left:auto; }
 #vue-app.static-page:not(.static-menu-enhanced) .static-main-menu > summary { right:68px; }
 #vue-app.static-page:not(.static-menu-enhanced) .static-main-menu { order:3; }
 #vue-app.static-menu-enhanced .static-settings-menu { margin-left:0; }
}
@media(forced-colors:active) { #vue-app .static-settings-languages > a[aria-current] { outline:1px solid Highlight; outline-offset:-1px; } }

/* Compact Best-day filters; the floating panel reuses this exact DOM subtree. */
#vue-app.page-best-of-the-day .best-controls.search-panel { display:block; margin:12px 0; padding:16px; }
#vue-app .static-primary-filters { display:grid; grid-template-columns:minmax(260px,1.2fr) minmax(260px,1fr) auto; align-items:end; gap:12px 20px; }
#vue-app .static-primary-filters .static-amount-field { margin:0; }
#vue-app .static-primary-filters .field-label,#vue-app .static-primary-filters .best-date-filter > span { display:block; margin:0 0 6px; font-size:12px; font-weight:600; line-height:1.4; }
#vue-app .static-primary-filters .static-amount-options { margin:0; }
#vue-app .static-primary-filters .best-date-options { display:grid; grid-template-columns:repeat(4,minmax(44px,1fr)); gap:6px; }
#vue-app .static-primary-filters .best-date-options > :is(a,button) { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 10px; margin:0; }
#vue-app .static-secondary-filters { display:grid; grid-template-columns:minmax(180px,1fr) auto minmax(210px,1fr); align-items:end; gap:8px 16px; margin-top:12px; padding:12px 0 0; border-top:1px solid var(--theme-line); }
#vue-app .static-secondary-filters .form-field { margin:0; }
#vue-app .static-secondary-filters .form-field label { font-size:12px; }
#vue-app .static-secondary-filters .form-field input { min-height:44px; }
#vue-app .static-secondary-filters .best-saving-types legend { position:static; width:auto; height:auto; margin:0 0 6px; padding:0; clip-path:none; font-size:12px; }
#vue-app .static-secondary-filters .best-saving-options { display:flex; gap:6px; }
#vue-app .static-secondary-filters .best-saving-options label { padding:8px; font-size:12px; }
@media(max-width:1000px) {
 #vue-app .static-primary-filters { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px 16px; }
 #vue-app .static-primary-filters > .static-view-toggle { grid-column:1 / -1; }
 #vue-app .static-secondary-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #vue-app .static-secondary-filters > .static-switch { grid-column:1 / -1; }
}
@media(max-width:600px) {
 #vue-app.page-best-of-the-day .best-controls.search-panel { padding:12px; }
 #vue-app .static-primary-filters { grid-template-columns:minmax(0,1fr); gap:10px; }
 #vue-app .static-primary-filters .static-amount-options > a { flex-basis:0; }
 #vue-app .static-primary-filters .best-date-filter > span { font-size:12px; }
 #vue-app .static-secondary-filters { grid-template-columns:minmax(0,1fr); gap:10px; }
 #vue-app .static-secondary-filters .best-saving-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media(max-width:600px) {
 #vue-app .static-secondary-filters .form-field { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:8px; }
 #vue-app .static-secondary-filters .form-field label { margin:0; max-width:80px; font-size:12px; }
 #vue-app .static-secondary-filters .form-field input { min-width:0; height:44px; padding-inline:12px; font-size:12px; }
 #vue-app .static-secondary-filters .best-saving-types legend { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); }
 #vue-app .static-secondary-filters .static-switch { font-size:12px; }
}

/* Keep mobile view switches together instead of spending a full row on each. */
@media(max-width:600px) {
 #vue-app.page-best-of-the-day .best-controls.search-panel { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 #vue-app.page-best-of-the-day .static-primary-filters,#vue-app.page-best-of-the-day .static-secondary-filters { display:contents; }
 #vue-app.page-best-of-the-day .static-primary-filters > .static-amount-field { display:block; grid-column:1 / -1; grid-row:1; }
 #vue-app.page-best-of-the-day .static-primary-filters > .best-date-filter { grid-column:1 / -1; grid-row:2; }
 #vue-app.page-best-of-the-day .static-secondary-filters > .static-switch { grid-column:1; grid-row:3; }
 #vue-app.page-best-of-the-day .static-primary-filters > .static-view-toggle { grid-column:2; grid-row:3; }
 #vue-app.page-best-of-the-day .best-controls .static-switch { justify-self:stretch; align-self:center; gap:8px; font-size:12px; }
}

/* Shared floating dropdown surface. Absolute positioning is the no-script
   baseline; native popovers escape clipping while retaining this DOM order. */
#vue-app [data-static-dropdown] { position:relative; }
#vue-app [data-static-dropdown][open] { z-index:60; }
#vue-app [data-static-dropdown-panel] { --dropdown-gap:6px; --dropdown-edge:12px; --dropdown-height:340px; box-sizing:border-box; position:absolute; z-index:60; inset:auto; top:var(--dropdown-top,calc(100% + var(--dropdown-gap))); left:var(--dropdown-left,0px); width:var(--dropdown-width,var(--dropdown-preferred-width,100%)); min-width:0; max-width:calc(100vw - 24px); max-height:min(var(--dropdown-available-height,var(--dropdown-height)),calc(100dvh - 24px)); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; margin:0; border:1px solid var(--theme-line); border-radius:10px; color:var(--theme-ink); background:var(--theme-surface); box-shadow:0 12px 32px rgb(0 0 0 / .18); text-align:left; }
#vue-app [data-dropdown-align="end"] > [data-static-dropdown-panel] { left:var(--dropdown-left,auto); right:0; }
#vue-app [data-static-dropdown-panel]:popover-open { right:auto; }
#vue-app [data-static-dropdown]:not([open]) > [data-static-dropdown-panel] { display:none; }
/* Older/no-script browsers keep an absolute overlay too. Removing only the
   clipping (not the height constraint) prevents an open menu resizing a panel. */
#vue-app .search-panel:has([data-static-dropdown][open] > [data-static-dropdown-panel]:not([popover])),
#vue-app .best-floating-panel:has([data-static-dropdown][open] > [data-static-dropdown-panel]:not([popover])),
#vue-app .best-floating-body:has([data-static-dropdown][open] > [data-static-dropdown-panel]:not([popover])) { overflow:visible; }
#vue-app .search-panel:has([data-static-dropdown][open] > [data-static-dropdown-panel]:not([popover])) { z-index:60; }
#vue-app [data-static-dropdown] > summary:focus-visible { outline:2px solid var(--theme-ink); outline-offset:3px; }
@media(forced-colors:active) { #vue-app [data-static-dropdown-panel] { border-color:CanvasText; } }