/* figtree-latin-ext-600-normal */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/_astro/figtree-latin-ext-600-normal.DJlfifZj.woff2) format('woff2'), url(/_astro/figtree-latin-ext-600-normal.CQqsimlV.woff) format('woff');
  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;
}

/* figtree-latin-600-normal */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/_astro/figtree-latin-600-normal.Cv_xCTDl.woff2) format('woff2'), url(/_astro/figtree-latin-600-normal.BM_oTo4n.woff) format('woff');
  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;
}/* wix-madefor-text-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'Wix Madefor Text Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 800;
  src: url(data:font/woff2;base64,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) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* wix-madefor-text-cyrillic-wght-normal */
@font-face {
  font-family: 'Wix Madefor Text Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 800;
  src: url(/_astro/wix-madefor-text-cyrillic-wght-normal.BLx_7Pqn.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* wix-madefor-text-vietnamese-wght-normal */
@font-face {
  font-family: 'Wix Madefor Text Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 800;
  src: url(/_astro/wix-madefor-text-vietnamese-wght-normal.DnTfAuVi.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* wix-madefor-text-latin-ext-wght-normal */
@font-face {
  font-family: 'Wix Madefor Text Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 800;
  src: url(/_astro/wix-madefor-text-latin-ext-wght-normal.BH75is57.woff2) format('woff2-variations');
  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;
}

/* wix-madefor-text-latin-wght-normal */
@font-face {
  font-family: 'Wix Madefor Text Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 800;
  src: url(/_astro/wix-madefor-text-latin-wght-normal.M4ts_BV7.woff2) format('woff2-variations');
  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;
}/* ---- OKO site: tokens, base type and the shared components (menu, sticky bar, notifications, footer) ----
   Design rules: DESIGN.md (local). Ported from the approved mobile prototype H (2026-09-25).
   teal    #044b53  the logo's own colour: brand, hero, evening service, footer
   sunny   #ffc43a  11:30, late-morning light; the primary button
   berry   #ce2147  12:30, the lunch rush
   ground  #fcfbf8  the websites, the team, the price
   Type: 400 body · 600 headings and emphasis. Sizes 13 / 15 / 17 / 28 / 34. Radii 12 / 18 / 22 / pill. */
:root {
  --ground: #fcfbf8;
  --white: #ffffff;
  --ink: #0f2a30;
  --ink-2: #44585c;
  --ink-3: #5b6e72;
  --line: #e3e6e4;
  --line-strong: #cfd5d3;
  --teal: #044b53;
  --teal-deep: #03353b;
  --teal-pale: #bfdde0;
  --teal-soft: #dff0f1;
  --cream: #f6eee0;
  --sunny: #ffc43a;
  --sunny-deep: #6b4a00;
  --sunny-soft: #fff0c2;
  --berry: #ce2147;
  --berry-deep: #7a0f28;
  --berry-pale: #ffebef;
  --berry-soft: #ffdde4;
  --basil: #1f7a3e;
  --basil-soft: #e3f3e8;
  --font-display: "Figtree", "PingFang SC", "Noto Sans SC", -apple-system, "Segoe UI", sans-serif;
  --font-text: "Wix Madefor Text Variable", "Wix Madefor Text", -apple-system, "Segoe UI", "Helvetica Neue", "PingFang SC", "Noto Sans SC", sans-serif;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --bar-h: 52px;
}

/* ---- Chinese: Noto Sans SC (SIL OFL), cut to the characters the Chinese pages use (npm run fonts:zh). Latin letters and
   digits keep Figtree and Wix Madefor Text, which come first in the stacks. Only Chinese pages ever download it. ---- */
:root:lang(zh) {
  --font-display: "Figtree", "OKO Noto SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-text: "Wix Madefor Text Variable", "OKO Noto SC", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* Browser surfaces, themed from the palette */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { scrollbar-color: var(--teal-pale) var(--ground); }
::selection { background: var(--sunny); color: var(--ink); }
:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--teal-pale); border-radius: 99px; border: 3px solid var(--ground); }
::-webkit-scrollbar-track { background: var(--ground); }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }
img { display: block; max-width: 100%; }
p, li { text-wrap: pretty; } /* no lone word on a last line */
button { font: inherit; color: inherit; }
.num, time { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nowrap { white-space: nowrap; }
[id] { scroll-margin-top: calc(var(--bar-h) + 12px); }

body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--font-text);
  font-size: 17px;
  line-height: 1.47;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
/* Layout: one phone column up to 430px, a slightly wider centred column on small tablets, the wide layout from 900px
   (the rules for it sit at the end of each stylesheet, under @media (min-width: 900px)). */
/* --col is the column width, shared by the page and the sticky bar so they always line up */
:root { --col: 430px; }
@media (min-width: 431px) and (max-width: 899px) { :root { --col: 560px; } }
.page { position: relative; max-width: var(--col); margin: 0 auto; background: var(--ground); }

.skip {
  position: absolute; left: 16px; top: -100px; z-index: 30;
  background: var(--white); color: var(--ink); padding: 12px 16px; border-radius: 12px;
  font-weight: 600; text-decoration: none; box-shadow: 0 8px 24px -8px rgba(15,42,48,.4);
}
.skip:focus { top: 12px; }

/* Type: Figtree speaks, Wix Madefor Text reads. Hierarchy from size and space, not weight (apple.com headlines are 600). */
h1, h2, h3, p, ul, ol, figure { margin: 0; }
h1, h2 { font-family: var(--font-display); font-weight: 600; letter-spacing: -.015em; text-wrap: balance; }
h1 { font-size: 34px; line-height: 1.08; }
@media (max-width: 374px) { h1 { font-size: 30px; } }
h2 { font-size: 28px; line-height: 1.1; }
h3 { font-size: 17px; line-height: 1.35; font-weight: 600; }
.lead { font-size: 17px; line-height: 1.47; color: var(--ink-2); text-wrap: pretty; }
/* Chinese reads better with more leading and no negative tracking; a line break written in a heading ("\n") is kept,
   so headings break between phrases rather than inside a word. */
:lang(zh) body { line-height: 1.75; text-wrap: pretty; } /* no lone character on a last line */
:lang(zh) .lead { line-height: 1.75; }
:lang(zh) h1, :lang(zh) h2 { letter-spacing: 0; line-height: 1.3; white-space: pre-line; }

/* Links that lead to a page are ghost pills: the same outline grammar as the menu ring, so they read as tappable on every field */
.link, .module-link a, .modules h3 a {
  display: inline-flex; align-items: center; gap: 6px; min-height: 42px; padding: 0 14px 0 16px;
  border-radius: 99px; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, currentColor 55%, transparent);
  color: var(--teal); font-family: var(--font-display); font-weight: 600; font-size: 15px; letter-spacing: -.005em;
  text-decoration: none; transition: background-color .15s ease-out, box-shadow .15s ease-out, transform .12s ease-out;
}
.link::after, .module-link a::after, .modules h3 a::after { content: "\203A"; font-weight: 500; opacity: .85; margin-top: -1px; }
.link:hover, .module-link a:hover, .modules h3 a:hover { box-shadow: inset 0 0 0 1.5px currentColor; }
.link:active, .module-link a:active, .modules h3 a:active { transform: scale(.97); }

/* The mark: one symbol, recoloured by currentColor wherever it appears */
.mark { display: block; height: auto; fill: currentColor; }

/* Buttons: pooled ends, like the swash's head. One filled button per screen; the second action is a link. */
.btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; min-height: 52px; padding: 12px 18px;
  border-radius: 99px; border: 0; cursor: pointer;
  font-family: var(--font-display); font-size: 17px; font-weight: 600; letter-spacing: -.005em; line-height: 1.2;
  text-decoration: none;
  transition: transform .12s ease-out, background-color .15s ease-out, box-shadow .15s ease-out;
}
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--sunny); color: var(--ink); }
.btn-primary:hover { background: #ffd062; }
.btn-secondary { background: var(--white); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.btn-secondary:hover { box-shadow: inset 0 0 0 1.5px var(--ink); }
.btn svg { width: 18px; height: 18px; flex: none; }
/* The second action is a link, not a second box; › is apple.com's "continues" affordance. It takes the colour of its block. */
.actions .btn-secondary {
  background: transparent; box-shadow: none; min-height: 44px; margin-top: 2px; color: inherit;
  font-size: 16px; font-weight: 600; text-decoration: none;
}
.actions .btn-secondary::after { content: "\203A"; font-weight: 500; margin-left: -2px; opacity: .8; }
.actions .btn-secondary:hover { box-shadow: none; text-decoration: underline; text-underline-offset: .2em; }
/* One line of reassurance under the buttons */
.assure { font-size: 15px; line-height: 1.45; color: var(--ink-2); margin-top: 12px; text-align: center; text-wrap: pretty; }
.icon { fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.actions { display: grid; gap: 10px; }

.ph-tag {
  display: inline-block; vertical-align: middle;
  font-size: 13px; line-height: 1; padding: 4px 7px; border-radius: 99px;
  border: 1px dashed #b0b8b6; color: var(--ink-3); font-weight: 500;
}

/* ---- Navigation: a row on wide screens, the menu button below 900px ---- */
.nav-inline { display: none; }

/* ---- Page header, inside each page's first colour block (home: the hero; inner pages: the page hero) ---- */
.header {
  position: relative; z-index: 5;
  display: flex; align-items: center; justify-content: space-between;
  height: calc(64px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 16px 0;
}
.header .logo { display: flex; align-items: center; min-height: 44px; color: var(--cream); }
.header .logo .mark { width: 72px; }
.field-sunny .header .logo { color: var(--teal); }   /* cream does not hold on yellow */
.header-actions { display: flex; align-items: center; gap: 8px; }
.header .pill { display: none; }   /* one yellow action per screen: the big button below; the sticky bar brings the pill back */
.header :focus-visible { outline-color: var(--sunny); }
.field-sunny .header :focus-visible { outline-color: var(--ink); }

/* ---- Pill, menu and language disclosure (header and sticky bar) ---- */
.pill {
  position: relative;
  display: inline-flex; align-items: center; height: 40px; padding: 0 16px;
  background: var(--sunny); color: var(--ink); border-radius: 99px;
  font-family: var(--font-display); font-size: 15px; font-weight: 600; letter-spacing: -.005em; text-decoration: none;
  transition: transform .12s ease-out, background-color .15s ease-out;
}
.pill:hover { background: #ffd062; }
.pill:active { transform: scale(.97); }
details.menu { position: relative; }
details.menu > summary {
  position: relative;
  list-style: none; cursor: pointer;
  width: 40px; height: 40px; border-radius: 99px; background: transparent; color: inherit;
  box-shadow: inset 0 0 0 1.5px color-mix(in srgb, currentColor 55%, transparent);
  display: grid; place-items: center;
}
/* 44px hit areas while the visual stays 40px */
.pill::after, details.menu > summary::after { content: ""; position: absolute; inset: -2px; border-radius: inherit; }
details.menu > summary::-webkit-details-marker { display: none; }
details.menu > summary svg { width: 18px; height: 18px; }
details.menu[open] > summary .i-menu { display: none; }
details.menu:not([open]) > summary .i-close { display: none; }
.menu-panel {
  position: absolute; top: 48px; right: 0; width: 256px;
  max-height: calc(100vh - 92px); max-height: calc(100dvh - 92px); overflow-y: auto;
  background: var(--white); color: var(--ink); border-radius: 18px; padding: 8px;
  box-shadow: 0 24px 60px -20px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.12);
}
details.menu[open] > .menu-panel { animation: menu-in .16s ease-out; }
@keyframes menu-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.menu-panel a { display: flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 12px; text-decoration: none; font-weight: 600; font-size: 15px; }
.menu-panel a:hover { background: var(--ground); }
.menu-panel hr { border: 0; border-top: 1px solid var(--line); margin: 6px 4px; }
.menu-label { padding: 8px 12px 2px; font-size: 13px; font-weight: 600; color: var(--ink-3); }
.menu-panel a[aria-current] { color: var(--teal); }
.menu-icon { flex: none; width: 28px; height: 28px; margin-right: 10px; border-radius: 8px; background: var(--teal-soft); color: var(--teal); display: grid; place-items: center; }
.menu-icon .icon { width: 16px; height: 16px; }
/* Language: a native disclosure showing the current language; the links stay in the HTML */
details.lang > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  min-height: 44px; padding: 0 12px; border-radius: 12px; font-weight: 600; font-size: 15px;
}
details.lang > summary::-webkit-details-marker { display: none; }
details.lang > summary .chev { width: 16px; height: 16px; stroke-width: 2; opacity: .7; transition: transform .16s ease-out; }
details.lang[open] > summary .chev { transform: rotate(180deg); }
details.lang > summary:hover { background: var(--ground); }
.lang-list { list-style: none; padding: 0 0 4px; margin: 0; display: grid; }
.lang-list a { display: flex; align-items: center; min-height: 44px; padding: 0 12px 0 24px; border-radius: 12px; text-decoration: none; font-size: 15px; font-weight: 500; color: var(--ink-2); }
.lang-list a:hover { background: var(--ground); }
.lang-list a[aria-current] { color: var(--ink); font-weight: 600; }
.lang-list a[aria-current]::before { content: ""; width: 6px; height: 6px; border-radius: 99px; background: var(--teal); margin: 0 8px 0 -14px; }
.menu-panel :focus-visible { outline-color: var(--teal); }

/* ---- Sticky compact bar: shown once the hero has scrolled past ---- */
.topbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 6;
  width: 100%; max-width: var(--col); margin: 0 auto;
  height: calc(var(--bar-h) + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 16px 0;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(252,251,248,.92);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 var(--line);
  transform: translateY(-100%); opacity: 0; visibility: hidden;
  transition: transform .22s var(--ease-out), opacity .22s ease-out, visibility 0s linear .22s;
}
.topbar.on { transform: none; opacity: 1; visibility: visible; transition-delay: 0s; }
.topbar .logo { display: flex; align-items: center; min-height: 44px; color: var(--teal); }
.topbar .logo .mark { width: 54px; }
.topbar .pill { height: 36px; font-size: 15px; }
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.topbar details.menu > summary { color: var(--teal); box-shadow: inset 0 0 0 1.5px var(--line-strong); width: 36px; height: 36px; }
.topbar details.menu > summary svg { width: 16px; height: 16px; }

/* ---- The colour fields: one colour per time of day, each with its own inks (The Field Inks Rule).
   11:30 sunny · 12:30 berry · 20:00 night (teal). Home uses them for the day; inner pages for their page hero. ---- */
.field-sunny { background: var(--sunny); color: var(--ink); --field-2: var(--sunny-deep); --card-glow: rgba(107,74,0,.6); --sky-line: rgba(15,42,48,.55); --sun: #fff; --sun-ring: rgba(107,74,0,.22); }
.field-berry { background: var(--berry); color: #fff;      --field-2: var(--berry-pale); --card-glow: rgba(90,8,28,.75); --sky-line: rgba(255,255,255,.6); --sun: var(--sunny); --sun-ring: rgba(122,15,40,.3); }
.field-night { background: var(--teal);  color: #fff;      --field-2: var(--teal-pale);  --card-glow: rgba(0,20,24,.8);  --sky-line: rgba(255,255,255,.45); --sun: var(--cream); --sun-ring: rgba(3,53,59,.35); }
.field-sunny :focus-visible { outline-color: var(--ink); }
.field-berry :focus-visible, .field-night :focus-visible { outline-color: #fff; }
.field-berry ::selection, .field-night ::selection { background: var(--sunny); color: var(--ink); }

/* ---- Notifications: what OKO sends to the owner's phone, drawn like an iOS lock-screen notification. The glass is used here
   on purpose (the one exception to "no glass"): without it the banner reads as a web card, not a notification. ---- */
.notif {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 12px 14px 13px 12px; border-radius: 22px; color: var(--ink);
  background: rgba(255,255,255,.82);
  -webkit-backdrop-filter: blur(24px) saturate(160%); backdrop-filter: blur(24px) saturate(160%);
  box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 8px 24px -12px rgba(0,0,0,.35);
}
@supports not (backdrop-filter: blur(1px)) { .notif { background: rgba(255,255,255,.95); } }
@media (prefers-reduced-transparency: reduce) { .notif { background: var(--white); -webkit-backdrop-filter: none; backdrop-filter: none; } }
.app-icon { flex: none; width: 38px; height: 38px; border-radius: 9px; background: var(--teal); color: var(--cream); display: grid; place-items: center; }
.app-icon .mark { width: 27px; }
.tile { flex: none; width: 38px; height: 38px; border-radius: 9px; display: grid; place-items: center; }
.tile svg { width: 20px; height: 20px; }
.tile-booking { background: var(--teal-soft); color: var(--teal); }
.tile-order { background: var(--berry-soft); color: var(--berry); }
.tile-loyalty { background: var(--sunny-soft); color: var(--sunny-deep); }
.tile-google { background: #fff; border: 1px solid var(--line); }
.tile-google img { width: 20px; height: 20px; }
.notif-text { flex: 1; min-width: 0; }
.notif-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.notif-title { min-width: 0; font-size: 15px; font-weight: 600; line-height: 1.3; letter-spacing: -.005em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notif-when { flex: none; font-size: 13px; color: var(--ink-3); }
.notif-body { font-size: 15px; line-height: 1.35; color: var(--ink-2); margin-top: 1px; text-wrap: pretty; }
.stars { display: flex; gap: 2px; margin: 4px 0 2px; }
.stars svg { width: 15px; height: 15px; fill: var(--sunny); stroke: var(--sunny-deep); stroke-width: 1; stroke-linejoin: round; }
.marks { display: flex; gap: 5px; margin: 6px 0 4px; }
.marks span { width: 13px; height: 13px; border-radius: 99px; border: 1.5px solid var(--teal-pale); background: var(--white); }
.marks .on { background: var(--teal); border-color: var(--teal); }

/* The picture is the wallpaper; the notification floats on it. The only object with a shadow. */
.shot {
  margin: 0 16px; border-radius: 18px; overflow: hidden; background: var(--white);
  box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 18px 40px -24px var(--card-glow, rgba(0,0,0,.5));
}
.shot .photo { position: relative; height: 312px; overflow: hidden; }
.shot .photo img { width: 100%; height: 100%; object-fit: cover; }
.shot .notif { position: absolute; left: 10px; right: 10px; bottom: 10px; }

/* ---- Footer: teal ---- */
.footer { background: var(--teal); color: #fff; padding: 48px 16px 48px; font-size: 15px; }
.footer::after { content: ""; display: block; height: env(safe-area-inset-bottom); }
.footer ::selection { background: var(--sunny); color: var(--ink); }
.footer :focus-visible { outline-color: var(--sunny); }
.footer .logo { display: inline-flex; align-items: center; min-height: 44px; color: var(--cream); }
.footer .logo .mark { width: 88px; }
.footer-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 16px; margin: 16px 0 20px; }
.footer h3 { font-size: 13px; color: var(--teal-pale); margin-bottom: 2px; font-weight: 600; }
.footer h3 + ul + h3 { margin-top: 20px; }
.footer ul { list-style: none; padding: 0; display: grid; gap: 0; }
.footer ul a { display: flex; align-items: center; min-height: 44px; text-decoration: none; }
.footer a:hover { text-decoration: underline; }
.footer-legal { display: flex; gap: 20px; margin: 0 0 8px; }
.footer-legal a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; color: var(--teal-pale); }
.footer .lang-row { display: flex; flex-wrap: wrap; gap: 0 4px; margin: 0 0 16px -10px; }
.footer .lang-row a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px; border-radius: 99px; font-size: 15px; font-weight: 500; color: var(--teal-pale); text-decoration: none; }
.footer .lang-row a:hover { color: #fff; background: rgba(255,255,255,.08); }
.footer .lang-row a[aria-current] { color: #fff; font-weight: 600; }
.footer .lang-row a[aria-current]::before { content: ""; width: 6px; height: 6px; border-radius: 99px; background: var(--sunny); margin-right: 8px; }
.footer-line { color: var(--teal-pale); line-height: 1.6; }
.footer-line a { color: #fff; display: inline-flex; align-items: center; min-height: 44px; }
.footer-line .tel { white-space: nowrap; }
.footer-note { margin-top: 14px; }
/* The app line under the phone number: label, then the two store links */
.footer-apps { white-space: nowrap; }

/* ---- Reveal: headline-and-copy blocks and pictures rise in once as they enter (85vh), like apple.com's content elements ---- */
.motion .rv { opacity: 0; transform: translateY(30px); transition: opacity .95s cubic-bezier(.42,0,.58,1), transform .78s cubic-bezier(.42,0,.58,1); }
.motion .rv.in { opacity: 1; transform: none; }

/* ---- Wide screens (900px and up) ----
   Content sits in one centred column, --wrap wide. The colour blocks (hero, the day, footer) stand 12px in from the window
   edges with 22px corners, the ground showing between them (the phone's "blocks never touch", widened). Type steps up:
   H1 56, H2 40, lead 19 (hero lead 21); body stays 17. One yellow action per screen still holds; buttons stop being
   full-width. */
@media (min-width: 900px) {
  :root { --wrap: 1120px; --bar-h: 60px; }
  .page { max-width: none; }
  h1 { font-size: clamp(44px, 3.4vw + 8px, 56px); line-height: 1.04; }
  h2 { font-size: clamp(34px, 2vw + 12px, 40px); line-height: 1.08; }
  .lead { font-size: 19px; }

  .nav-inline { display: flex; align-items: center; gap: 2px; }
  .nav-inline > a, .nav-drop > summary {
    display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 99px;
    font-family: var(--font-display); font-size: 15px; font-weight: 600; letter-spacing: -.005em; text-decoration: none;
    opacity: .82; transition: opacity .15s ease-out;
  }
  .nav-inline > a:hover, .nav-drop > summary:hover, .nav-drop[open] > summary { opacity: 1; }
  /* Modules: a disclosure with the six modules, grouped like the day */
  .nav-drop { position: relative; }
  .nav-drop > summary { list-style: none; cursor: pointer; gap: 4px; }
  .nav-drop > summary::-webkit-details-marker { display: none; }
  .nav-drop > summary .chev { width: 14px; height: 14px; stroke-width: 2; transition: transform .16s ease-out; }
  .nav-drop[open] > summary .chev { transform: rotate(180deg); }
  .nav-panel {
    position: absolute; top: calc(100% + 8px); left: -8px; z-index: 20;
    width: 360px; margin: 0; padding: 8px; list-style: none; border-radius: 18px; background: var(--white); color: var(--ink);
    display: grid; gap: 2px;
    box-shadow: 0 18px 44px -18px rgba(0,0,0,.4), 0 1px 3px rgba(0,0,0,.1);
  }
  .nav-drop[open] > .nav-panel { animation: menu-in .16s ease-out; }
  .nav-panel a { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 12px; text-decoration: none; }
  .nav-panel a:hover { background: var(--ground); }
  .nav-tile { flex: none; width: 36px; height: 36px; border-radius: 9px; background: var(--teal-soft); color: var(--teal); display: grid; place-items: center; }
  .nav-tile .icon { width: 20px; height: 20px; }
  .nav-text { display: grid; min-width: 0; }
  .nav-text b { font-family: var(--font-display); font-size: 15px; font-weight: 600; letter-spacing: -.005em; }
  .nav-text span { font-size: 13px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .nav-panel a[aria-current] { background: var(--ground); }
  .nav-panel a[aria-current] b { color: var(--teal); }
  .nav-panel :focus-visible { outline-color: var(--teal); }
  .nav-lang > summary { gap: 6px; }
  .nav-lang > summary .globe { width: 18px; height: 18px; stroke-width: 1.6; }
  .nav-lang-panel { left: auto; right: -8px; width: 200px; }
  /* every name on the same left edge; the current language gets a tick on the right (Bo: the dot pushed it out of line) */
  .nav-lang-panel a { justify-content: space-between; gap: 12px; padding: 10px 12px; font-size: 15px; font-weight: 500; color: var(--ink-2); }
  .nav-lang-panel a[aria-current] { color: var(--ink); font-weight: 600; }
  .nav-lang-panel .check { flex: none; width: 18px; height: 18px; stroke: var(--teal); stroke-width: 2.2; }
  details.menu { display: none; }

  .topbar { max-width: none; padding-inline: max(40px, calc((100% - var(--wrap)) / 2)); }
  .topbar .logo .mark { width: 62px; }
  .topbar .nav-inline { margin-left: auto; margin-right: 12px; color: var(--ink); }

  .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
  .actions .btn { width: auto; padding: 12px 30px; }
  .actions .btn-secondary { padding-inline: 4px; }   /* a link: no box to pad */
  .assure { text-align: left; }

  /* the notification floats on the lower middle of a wider picture, at a phone notification's width */
  .shot .notif { left: 50%; right: auto; bottom: 18px; width: min(400px, calc(100% - 36px)); transform: translateX(-50%); }

  .footer {
    margin: 12px; border-radius: 22px; padding: 64px max(28px, calc((100% - var(--wrap)) / 2 - 12px)) 48px;
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 72px;
    grid-template-areas: "logo cols" "info cols" "note cols" "legal lang"; grid-template-rows: auto auto 1fr auto;
  }
  .footer .logo { grid-area: logo; justify-self: start; }
  .footer .logo .mark { width: 96px; }
  .footer-cols { grid-area: cols; margin: 0; column-gap: 40px; }
  .footer-line { grid-area: info; margin-top: 16px; }
  .footer-note { grid-area: note; align-self: end; }
  .footer-legal { grid-area: legal; margin: 32px 0 0; }
  .footer .lang-row { grid-area: lang; margin: 32px 0 0 -10px; }
}

@media (prefers-reduced-motion: reduce) {
  .btn, .pill, .topbar { transition: none; }
  .rv { opacity: 1 !important; transform: none !important; transition: none !important; }
  details.menu[open] > .menu-panel, .nav-drop[open] > .nav-panel { animation: none; }
}
/* Generated by scripts/build-zh-font.mjs (npm run fonts:zh). Do not edit by hand.
   Noto Sans SC for Chinese pages, in three files: a browser downloads a file only when the page shows one of its characters.
   Only :lang(zh) pages use this family (base.css), so other languages never download it. */
@font-face {
  font-family: "OKO Noto SC"; src: url(/_astro/noto-sans-sc-core.Dj4M05Vz.woff2) format("woff2"); font-weight: 400 600; font-display: swap;
  unicode-range: U+B7, U+3001-3002, U+4E00, U+4E09-4E0B, U+4E0D, U+4E13, U+4E1A, U+4E24, U+4E2A, U+4E2D, U+4E3A-4E3B, U+4E4B, U+4E5F, U+4E70, U+4E86, U+4E8B-4E8C, U+4E8E, U+4E9B, U+4EA4, U+4EA7, U+4EAE, U+4EBA, U+4ECA, U+4ECD-4ECE, U+4ED6, U+4ED8, U+4EE5, U+4EEC, U+4EF6-4EF7, U+4F1A, U+4F4D, U+4F4F, U+4F53, U+4F5C, U+4F63, U+4F8B, U+4F9B, U+4FE1, U+505A, U+505C, U+508D, U+5148, U+514D, U+5165, U+5168, U+516C-516D, U+5173, U+5176, U+5185, U+518D, U+5199, U+51E0, U+51FA, U+5206, U+5219-521A, U+522B, U+5230, U+5236, U+523A, U+524D, U+529E-529F, U+52A1, U+52A8-52A9, U+52B1, U+5305, U+5348, U+534E, U+5353, U+5355-5356, U+5361, U+5370, U+5382, U+5385, U+53A8, U+53D1, U+53D6, U+53D8, U+53E3, U+53E6, U+53EA, U+53EF-53F0, U+53F3, U+53F8, U+5404, U+5408, U+540C-540E, U+542B, U+543B, U+544A, U+5458, U+5468, U+548C, U+54A8, U+54C1, U+54EA, U+552E, U+5546, U+5668, U+56DB, U+56DE, U+56F4, U+56FD-56FE, U+5728, U+5730, U+5747, U+5802, U+58F0, U+5907, U+590D, U+5916, U+591A, U+591C, U+5927, U+5929, U+5934, U+5956-5957, U+597D, U+5982, U+59CB, U+5A92, U+5B50, U+5B58, U+5B83, U+5B89, U+5B8C, U+5B98, U+5B9A, U+5B9E, U+5BA2, U+5BA4, U+5BB6, U+5BB9, U+5BF9, U+5BFC, U+5C06, U+5C0F, U+5C31, U+5C5E, U+5DE5-5DE6, U+5DF1-5DF2, U+5DF4, U+5E03, U+5E2E, U+5E38, U+5E73-5E74, U+5E78, U+5E7F, U+5E94, U+5E97, U+5EA7, U+5EFA, U+5F00, U+5F0F, U+5F20, U+5F55, U+5F81, U+5F85, U+5F8B, U+5F97, U+5FD9, U+6062, U+606F, U+60A8, U+60C5, U+60F3, U+610F, U+6210-6211, U+6216, U+6234, U+6237, U+623F, U+624B, U+624D, U+6253, U+626B, U+627E, U+628A, U+62A5, U+62BD, U+6301-6302, U+6309, U+6362, U+6392, U+63A5, U+63A8, U+63D0, U+641C, U+641E, U+642C-642D, U+6446, U+6512, U+652F, U+6536, U+6539, U+653E-653F, U+6587, U+6599, U+65AD, U+65B0, U+65B9, U+65E0, U+65E5, U+65F6, U+660E-660F, U+661F, U+6628, U+662F, U+665A, U+6682, U+66F4, U+66FF-6700, U+6708-6709, U+670D, U+671F, U+6728, U+672C, U+673A, U+6761, U+6765, U+676F, U+677F, U+67B6, U+67E5, U+6807, U+683C, U+6848, U+684C, U+695A, U+6B21, U+6B27, U+6B63, U+6B65, U+6BCF, U+6BD4, U+6C42, U+6C9F, U+6CD5, U+6D32, U+6D4F, U+6D88, U+6DF1, U+6E05, U+6ED1, U+70B9, U+70DB, U+7167, U+7247-7248, U+724C, U+72EC, U+73A9, U+73B0, U+7406, U+751C, U+7528, U+7531, U+7535, U+754C, U+7559, U+767B, U+767D, U+7684, U+76D8, U+76F4, U+770B, U+771F, U+7740, U+77E5, U+7801, U+793A, U+793E, U+7968, U+79C1, U+79D2, U+7A0E, U+7A7A, U+7A97, U+7ACB, U+7AD9, U+7AE0, U+7B14, U+7B2C, U+7B56, U+7B7E, U+7BA1, U+7C73, U+7CFB, U+7EA2, U+7EA7, U+7EBF, U+7EC4, U+7ECF, U+7ED9, U+7EDC, U+7EDF, U+7EED, U+7EF4, U+7F16, U+7F44, U+7F51, U+7F6E, U+7FFB, U+8001, U+8033, U+804A, U+8054, U+80FD, U+8111, U+81EA, U+81F4, U+822A, U+822C, U+82F1, U+8361, U+83B7, U+83DC, U+8425, U+8721, U+884C, U+8857, U+8868, U+88C5, U+8981, U+89C1, U+89C4, U+89C6, U+89C8, U+89E3, U+8A00, U+8BA1-8BA2, U+8BA9, U+8BBA, U+8BBE, U+8BC4, U+8BC9, U+8BCD, U+8BD1, U+8BDD, U+8BE2, U+8BE6, U+8BED, U+8BF4, U+8D26, U+8D39, U+8D44, U+8D77, U+8DD1, U+8DF3, U+8EAB, U+8F6C, U+8F6E, U+8F7B, U+8F7D, U+8FB9, U+8FC7, U+8FD0, U+8FD8-8FD9, U+8FDB, U+9001-9002, U+9009, U+9010, U+901A, U+9020, U+9053, U+9080, U+90A3, U+90AE, U+90E8, U+90FD, U+914D, U+9152, U+91CC, U+91D1, U+949F, U+94A2, U+94B1, U+94F6, U+952E, U+957F, U+95E8, U+95EE, U+95F4, U+9690, U+96C6, U+9700, U+9762, U+9875, U+9891, U+9898, U+98CE, U+98DF, U+9910, U+996D-996E, U+9996, U+9A6C, U+9AD8, U+9C7C, U+9EC4, U+9ECE, U+FF08-FF09, U+FF0C, U+FF1A-FF1B, U+FF1F, U+FF5C;
}
@font-face {
  font-family: "OKO Noto SC"; src: url(/_astro/noto-sans-sc-more.C5KPLEcB.woff2) format("woff2"); font-weight: 400 600; font-display: swap;
  unicode-range: U+2019, U+201C-201D, U+300C-300D, U+4E0E, U+4E14, U+4E1C, U+4E34, U+4E45, U+4E48-4E49, U+4E5D, U+4E66, U+4E71, U+4E94, U+4E9A, U+4EB2, U+4EC0, U+4EC5, U+4ECB, U+4ED3, U+4EE3-4EE4, U+4EFB, U+4EFD, U+4F01, U+4F11, U+4F18, U+4F20, U+4F38, U+4F46, U+4F4E, U+4F55, U+4F59, U+4F60, U+4F7F, U+4FBF, U+4FDD, U+4FEE, U+500D, U+5012, U+5019, U+501F, U+503C, U+5047, U+50AC, U+50CF, U+513F, U+5141, U+5143, U+5149, U+514B, U+5151, U+5170-5171, U+5174, U+5177, U+517C, U+518C, U+5192, U+51B0, U+51B3, U+51B5, U+51C6, U+51CF, U+51ED, U+51FB, U+5207, U+5212, U+5217, U+5220, U+5229, U+5237-5238, U+529B, U+52A0, U+52FE, U+5316, U+533A, U+5341, U+534F, U+5357, U+5373, U+5377, U+5386, U+539F, U+53BB, U+53C2, U+53C8, U+53CA-53CB, U+53CD, U+53D7, U+53E0, U+53EB, U+53F2, U+53F7, U+5403, U+5411, U+5417, U+5426-5427, U+542F, U+5473, U+5496, U+54CD, U+5561, U+5584, U+559C, U+55B1, U+56E0, U+56E2, U+56FA, U+573A, U+5740, U+5750, U+5757, U+578B, U+57CE, U+57DF, U+586B, U+5883, U+5899, U+589E, U+58EB, U+5904, U+590F, U+592B, U+5931, U+5939, U+594F, U+59D3, U+5B57, U+5B63, U+5B66, U+5B88, U+5BA3, U+5BC6, U+5BFF, U+5C01, U+5C11, U+5C1D, U+5C3D, U+5C40, U+5C42, U+5C45, U+5C4F, U+5C55, U+5CA9, U+5CF0, U+5DE7, U+5DEE, U+5E02, U+5E08, U+5E0C, U+5E10, U+5E26, U+5E55, U+5E76, U+5E7D, U+5E8F, U+5E93, U+5E95, U+5E9F, U+5EA6, U+5F04, U+5F15, U+5F52-5F53, U+5F71, U+5F80, U+5F84, U+5F88, U+5FAA, U+5FB7, U+5FC3, U+5FC5, U+5FEB, U+6001, U+600E, U+6025, U+6027, U+603B, U+606D, U+6076, U+6089, U+60E0, U+611F, U+613F, U+61C2, U+622A, U+6240, U+6258, U+6263, U+6279, U+627F, U+6284, U+6295, U+6298, U+62A4, U+62AB, U+62B1, U+62B5, U+62B9, U+62C5, U+62C9, U+62CC-62CD, U+62D2, U+62DB, U+62E6, U+62E8-62E9, U+62FC, U+62FF, U+6307, U+6311, U+631E, U+6328, U+636E, U+6377, U+6388-6389, U+638C, U+63CF, U+63E1, U+6444, U+64A4, U+64CD-64CE, U+6545, U+6548, U+654F, U+6563, U+6570, U+6574, U+65C1, U+65E7, U+65E9, U+6613, U+6625, U+663E, U+666E-666F, U+6674, U+6696, U+66DD, U+66FE, U+670B, U+6717, U+671B, U+672B, U+6743, U+6750, U+675F, U+6790, U+679C, U+67AA, U+67D0, U+67DC, U+67F4, U+680F, U+6837-6839, U+6863, U+68B3, U+68C0, U+697C, U+6982, U+69DB, U+6A21, U+6B22, U+6B3E, U+6B49, U+6B62, U+6B8A, U+6BB5, U+6BCD, U+6C14, U+6C1B, U+6C34, U+6C38, U+6C41, U+6C47, U+6C99, U+6CA1, U+6CB3, U+6CB9, U+6CE8, U+6CF0, U+6D3B, U+6D41, U+6D4B, U+6D53, U+6D77, U+6DC7, U+6DCB, U+6DFB, U+6E20, U+6E29, U+6E38, U+6E90, U+6EE1, U+6F0F, U+706B, U+706F, U+7092, U+70B8, U+70CA, U+70E9, U+70ED, U+7136, U+714E, U+7194, U+719F, U+723D, U+7259, U+725B, U+7269, U+7279, U+72B6, U+731C, U+7387, U+73AF, U+73ED, U+7410, U+751F, U+7545, U+75D5, U+76CF, U+76D2, U+76D6, U+76F8, U+7701, U+773C, U+77ED, U+7814, U+786E, U+788D, U+7891, U+7897, U+793C, U+7981, U+79BB, U+79CB, U+79CD, U+79EF, U+7A0B, U+7A33, U+7A3F, U+7A76, U+7A7F, U+7AEF, U+7B26, U+7B49, U+7B54, U+7B5B, U+7B77, U+7B79, U+7B80, U+7B97, U+7BB1, U+7BF7, U+7C7B, U+7C89, U+7CBE, U+7CD5, U+7CEC, U+7D20, U+7D22, U+7D2F, U+7E41, U+7EA6, U+7EAF, U+7EB3, U+7EB8, U+7EC6, U+7EC8, U+7ECD, U+7ED1, U+7ED3, U+7ED5, U+7EDD, U+7EE7, U+7EFF, U+7F29, U+7F3A, U+7FA4, U+8005, U+800C, U+805A, U+8089, U+80A1, U+80A9, U+80CC, U+817F-8180, U+81F3, U+8212, U+8272, U+8282, U+829D, U+82F9, U+8303, U+8336, U+8349, U+8350, U+8377, U+83C7, U+8404, U+8428, U+843D, U+8461, U+8471, U+852C, U+85AF, U+85CF, U+8611, U+86CB, U+8865, U+888B, U+88AB, U+897F, U+8986, U+89C2, U+89C9, U+89D2, U+89E6, U+8A9E, U+8BA4, U+8BAE, U+8BB0, U+8BB2, U+8BB8, U+8BBF, U+8BC1, U+8BC6, U+8BD5, U+8BE5, U+8BEF, U+8BF7, U+8BFA-8BFB, U+8C01, U+8C03, U+8C08, U+8C22, U+8C5A, U+8D1F, U+8D23, U+8D25, U+8D28, U+8D2D, U+8D34, U+8D60, U+8D62, U+8D70, U+8D85, U+8D8A, U+8DA3, U+8DB3, U+8DC3, U+8DDD, U+8DDF, U+8DEF, U+8F66, U+8F68, U+8F6F, U+8F85-8F86, U+8F91, U+8F93, U+8FBE, U+8FC1, U+8FCE, U+8FD1, U+8FD4, U+8FDC, U+8FDE, U+8FF0, U+9000, U+900F, U+9012, U+9014, U+901F, U+9047, U+904D, U+906E, U+9075, U+9171, U+9192, U+91CD, U+91CF, U+94AE, U+94C3, U+94FA, U+94FE, U+9500-9501, U+9505, U+9508, U+9519, U+95ED, U+95F9, U+9605, U+961F, U+9632-9633, U+9644, U+9650, U+9664, U+968F, U+9694, U+969C, U+96F6, U+9732, U+9759, U+9760, U+97E9, U+97F3, U+9876, U+9879-987A, U+987E, U+9884, U+9886, U+989C-989D, U+997A, U+9986, U+9988, U+9A8C, U+9AA8, U+9E21, U+9E2D, U+9EBB, U+9ED8, U+9F50, U+FF01, U+FF0F;
}
@font-face {
  font-family: "OKO Noto SC"; src: url(/_astro/noto-sans-sc-legal.YDOGAfzV.woff2) format("woff2"); font-weight: 400 600; font-display: swap;
  unicode-range: U+4E89, U+4F9D, U+5761, U+59D4, U+5C0A, U+5F62, U+5FD7, U+6280, U+63AA, U+643A, U+64AD, U+653B, U+65BD, U+672A, U+672F, U+6784, U+6F5C, U+753B, U+76CA, U+76DF, U+76EE, U+79F0, U+8003, U+88C1, U+8E2A, U+8F96, U+8FFD, U+91C7, U+9488, U+9645, U+9662, U+9AA4;
}