/* ═══════════════════════════════════════════════════════════════
   Restaurant v3 — Semeny identity + horizontal item cards
   ═══════════════════════════════════════════════════════════════ */

:root {
    --bg:         #f7f7f5;
    --surface:    #ffffff;
    --border:     rgba(0,0,0,.08);
    --border-2:   rgba(0,0,0,.14);

    --ink-0:      #1a1a1a;
    --ink-1:      #2a2a2a;
    --ink-2:      #8898aa;
    --ink-3:      #b0b4be;

    --brand:      #C0392B;
    --brand-dark: #8e2a20;
    --brand-soft: #fdecec;

    --r:  16px;
    --rs: 10px;
    --ease: cubic-bezier(.22,.61,.36,1);
    --shadow-sm: 0 1px 2px rgba(15,17,19,.05), 0 1px 1px rgba(15,17,19,.03);
    --shadow-md: 0 6px 16px rgba(15,17,19,.08), 0 2px 4px rgba(15,17,19,.04);
    --shadow-lg: 0 18px 40px rgba(15,17,19,.14), 0 6px 12px rgba(15,17,19,.06);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
html, body { min-height: 100%; overflow-x: hidden; background: var(--bg); }

/* ═══════════════════════════════════════════════════════════════
   LIVING LIGHT — hypnotic coherent-breathing layer
   ---------------------------------------------------------------
   Rhythm: 10 s full cycle = 5 s inhale / 5 s exhale = 6 bpm
   (≈5.5 bpm coherent breathing — Russo et al. 2014, Lin 2022.
   Maximises vagal tone / HRV / subjective calm.)
   Easing: near-sinusoidal cubic-bezier(.45,0,.55,1) — matches
   natural diaphragm motion.
   Color: warm amber (UC Davis Color Lab — fastest stress drop).
   Every moving layer on the page inherits this 10 s period so
   they all breathe together, reinforcing the pacing.
   ═══════════════════════════════════════════════════════════════ */
.rv2-life {
    position: fixed; inset: 0;
    z-index: 0; pointer-events: none;
    overflow: hidden;
}

/* ══════════════════ SWITCHABLE FX (body[data-fx]) ══════════════════ */
#rv2-fx-layer {
    position: fixed; inset: 0; z-index: 0;
    pointer-events: none; overflow: hidden;
    opacity: 0; /* off by default — aurora (rv2-life) shows instead */
}
body[data-fx]:not([data-fx=""]):not([data-fx="aurora"]) .rv2-life { display: none; }
body[data-fx]:not([data-fx=""]):not([data-fx="aurora"]) #rv2-fx-layer { opacity: 1; }
body[data-fx]:not([data-fx=""]):not([data-fx="aurora"]) body::before,
body[data-fx]:not([data-fx=""]):not([data-fx="aurora"])::before,
body[data-fx]:not([data-fx=""]):not([data-fx="aurora"])::after { display: none; }
/* Common helpers inside the fx layer */
.fx-blob { position: absolute; border-radius: 50%; filter: blur(48px); mix-blend-mode: multiply; }
.fx-ink  { position: absolute; border-radius: 50%; filter: blur(2px); mix-blend-mode: multiply; opacity: .75;
           background: radial-gradient(circle at 40% 35%, #C0392B 0%, rgba(192,57,43,.6) 40%, transparent 75%); }
.fx-streak { position: absolute; width: 2px; height: 140%;
             background: linear-gradient(180deg, transparent 0%, rgba(255,122,104,.9) 30%, rgba(255,122,104,.9) 70%, transparent 100%);
             transform: rotate(25deg); filter: drop-shadow(0 0 4px rgba(255,122,104,.7)); }
.fx-star { position: absolute; width: 2px; height: 2px; background: #fff; border-radius: 50%; box-shadow: 0 0 4px #fff; animation: fx-twinkle 3s ease-in-out infinite; }

/* 02 Ocean waves */
body[data-fx="waves"] #rv2-fx-layer { background: linear-gradient(180deg, #fff 0%, #fff3f0 100%); }
body[data-fx="waves"] .fx-wave { position: absolute; left: 0; width: 200%; height: 120px; bottom: 0; }
body[data-fx="waves"] .fx-wave svg { width: 100%; height: 100%; display: block; }
body[data-fx="waves"] .fx-wave.w1 { animation: fx-scroll 18s linear infinite; opacity: .35; }
body[data-fx="waves"] .fx-wave.w2 { animation: fx-scroll 24s linear infinite reverse; bottom: 18px; opacity: .55; }
body[data-fx="waves"] .fx-wave.w3 { bottom: 36px; animation: fx-scroll 30s linear infinite; opacity: .85; }
@keyframes fx-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* 03 Fire */
body[data-fx="fire"] #rv2-fx-layer { background: radial-gradient(ellipse at 50% 110%, #3a0a04 0%, #1a0402 70%); }
body[data-fx="fire"] .fx-flame { position: absolute; border-radius: 50%; filter: blur(50px); mix-blend-mode: screen; }
body[data-fx="fire"] .fx-flame.f1 { width: 420px; height: 420px; bottom: -120px; left: 8%;  background: radial-gradient(circle, #ff4a1a 0%, transparent 70%); animation: fx-flame 2.8s ease-in-out infinite; }
body[data-fx="fire"] .fx-flame.f2 { width: 340px; height: 340px; bottom: -100px; left: 42%; background: radial-gradient(circle, #ff8a2a 0%, transparent 70%); animation: fx-flame 2.2s ease-in-out infinite .4s; }
body[data-fx="fire"] .fx-flame.f3 { width: 400px; height: 400px; bottom: -120px; right: 6%;  background: radial-gradient(circle, #ffb450 0%, transparent 70%); animation: fx-flame 3.4s ease-in-out infinite .8s; }
@keyframes fx-flame {
    0%,100% { transform: translateY(0) scale(1); opacity: .7; }
    25%     { transform: translateY(-22px) scale(1.08); opacity: 1; }
    50%     { transform: translateY(-8px) scale(.95); opacity: .85; }
    75%     { transform: translateY(-28px) scale(1.12); opacity: 1; }
}

/* 04 Grid pulse */
body[data-fx="grid"] #rv2-fx-layer { background: #fafaf7; }
body[data-fx="grid"] .fx-grid {
    position: absolute; inset: 0;
    background-image: linear-gradient(#C0392B 1px, transparent 1px), linear-gradient(90deg, #C0392B 1px, transparent 1px);
    background-size: 48px 48px;
    opacity: .1;
    animation: fx-grid-pulse 5s ease-in-out infinite;
}
@keyframes fx-grid-pulse { 0%,100% { opacity: .08; } 50% { opacity: .22; } }

/* 05 Starfield (dark backdrop) */
body[data-fx="stars"] #rv2-fx-layer { background: radial-gradient(ellipse at 50% 40%, #1b1a2e 0%, #0a0a14 100%); }
body[data-fx="stars"] .fx-star.big { width: 3px; height: 3px; box-shadow: 0 0 8px #fff, 0 0 16px rgba(255,220,180,.6); }
body[data-fx="stars"] .fx-star.red { background: #ff7a68; box-shadow: 0 0 8px #ff7a68, 0 0 16px rgba(192,57,43,.7); }
@keyframes fx-twinkle { 0%,100% { opacity: .3; } 50% { opacity: 1; } }

/* 06 Ribbons */
body[data-fx="ribbons"] #rv2-fx-layer { background: #fffaf8; }
body[data-fx="ribbons"] .fx-ribbon {
    position: absolute; left: -20%; right: -20%;
    height: 220px; border-radius: 50%; filter: blur(36px); opacity: .5;
}
body[data-fx="ribbons"] .fx-ribbon.r1 { top: 12%; background: linear-gradient(90deg, transparent, #ff7a68, transparent); transform: rotate(-8deg); animation: fx-flow 11s ease-in-out infinite; }
body[data-fx="ribbons"] .fx-ribbon.r2 { top: 45%; background: linear-gradient(90deg, transparent, #C0392B, transparent); transform: rotate(6deg);  animation: fx-flow 15s ease-in-out infinite .5s; }
body[data-fx="ribbons"] .fx-ribbon.r3 { top: 72%; background: linear-gradient(90deg, transparent, #ffb87a, transparent); transform: rotate(-5deg); animation: fx-flow 13s ease-in-out infinite 1s; }
@keyframes fx-flow {
    0%,100% { transform: translateX(-4%) rotate(-8deg); }
    50%     { transform: translateX( 4%) rotate(-6deg); }
}

/* 07 Mesh gradient */
body[data-fx="mesh"] #rv2-fx-layer {
    background:
        radial-gradient(at 20% 20%, #ff7a68 0%, transparent 45%),
        radial-gradient(at 80% 10%, #ffb87a 0%, transparent 50%),
        radial-gradient(at 70% 85%, #C0392B 0%, transparent 45%),
        radial-gradient(at 25% 80%, #fde9e6 0%, transparent 60%),
        #fff;
    background-size: 240% 240%;
    animation: fx-mesh 16s ease-in-out infinite;
}
@keyframes fx-mesh {
    0%,100% { background-position: 0% 0%,   100% 0%, 100% 100%, 0% 100%; }
    50%     { background-position: 30% 20%, 70% 30%, 70% 70%,   30% 80%; }
}

/* 08 ECG heartbeat (dark) */
body[data-fx="ecg"] #rv2-fx-layer { background: #0b0b10; }
body[data-fx="ecg"] .fx-ecg { position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); height: 140px; }
body[data-fx="ecg"] .fx-ecg svg { width: 100%; height: 100%; display: block; }
body[data-fx="ecg"] .fx-ecg path {
    stroke: #ff4a5a; stroke-width: 2.4; fill: none;
    filter: drop-shadow(0 0 6px #ff4a5a) drop-shadow(0 0 18px rgba(255,74,90,.5));
    stroke-dasharray: 900; stroke-dashoffset: 900;
    animation: fx-ecg-run 3s linear infinite;
}
body[data-fx="ecg"] .fx-scan {
    position: absolute; inset: 0;
    background: repeating-linear-gradient(180deg, rgba(255,255,255,.015) 0, rgba(255,255,255,.015) 2px, transparent 2px, transparent 4px);
}
@keyframes fx-ecg-run { to { stroke-dashoffset: -900; } }

/* 09 Ink bloom */
body[data-fx="ink"] #rv2-fx-layer { background: #fffdfb; }
body[data-fx="ink"] .fx-ink.i1 { width: 340px; height: 340px; top: -40px; left: 20%; animation: fx-bloom 8s ease-in-out infinite; }
body[data-fx="ink"] .fx-ink.i2 { width: 420px; height: 420px; bottom: -80px; right: 10%; animation: fx-bloom 11s ease-in-out infinite 1.5s; }
body[data-fx="ink"] .fx-ink.i3 { width: 260px; height: 260px; top: 40%; left: -80px; animation: fx-bloom 9s ease-in-out infinite 3s; }
@keyframes fx-bloom {
    0%,100% { transform: scale(.85); border-radius: 58% 42% 46% 54% / 50% 60% 40% 50%; }
    50%     { transform: scale(1.2); border-radius: 42% 58% 56% 44% / 60% 40% 60% 40%; }
}

/* 10 Diagonal drift (gnister) */
body[data-fx="drift"] #rv2-fx-layer { background: linear-gradient(135deg, #1a1a1a 0%, #2a1a1a 100%); }
body[data-fx="drift"] .fx-streak { animation: fx-fall linear infinite; }
@keyframes fx-fall {
    from { transform: rotate(25deg) translateY(-120%); }
    to   { transform: rotate(25deg) translateY( 120%); }
}

/* Dark FX: flip text colors so content stays readable */
body[data-fx="fire"], body[data-fx="stars"], body[data-fx="ecg"], body[data-fx="drift"] {
    color: #f5eee8;
}
body[data-fx="fire"] #rv2-topbar, body[data-fx="stars"] #rv2-topbar,
body[data-fx="ecg"]  #rv2-topbar, body[data-fx="drift"] #rv2-topbar {
    background: rgba(10,10,14,.75);
    border-bottom-color: rgba(255,255,255,.08);
}

/* Effect picker button + popover */
.rv2-fx-btn {
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--surface); color: var(--ink-1);
    border: 1px solid var(--border);
    display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer; transition: all .15s var(--ease);
    flex-shrink: 0;
}
.rv2-fx-btn:hover { background: var(--ink-0); color: #fff; border-color: var(--ink-0); }
.rv2-fx-pop {
    position: fixed; z-index: 60;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 14px; padding: 6px;
    box-shadow: var(--shadow-lg);
    min-width: 200px;
}
.rv2-fx-pop[hidden] { display: none; }
.rv2-fx-pop button {
    display: flex; align-items: center; gap: 10px;
    width: 100%; padding: 9px 12px;
    background: transparent; border: none; border-radius: 9px;
    font-size: .88rem; font-weight: 600; color: var(--ink-1);
    text-align: left; cursor: pointer;
    transition: background .12s var(--ease);
}
.rv2-fx-pop button:hover { background: var(--bg); color: var(--ink-0); }
.rv2-fx-pop button.on { background: var(--brand-soft); color: var(--brand); font-weight: 800; }
.rv2-fx-pop .ic { width: 22px; height: 22px; border-radius: 50%; background: var(--ink-0); display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; color: #fff; flex-shrink: 0; }
.rv2-fx-pop button.on .ic { background: var(--brand); }

/* ── Flow pages (checkout / success / track) — keep breathing
   ambient but tone it WAY down so it doesn't overwhelm forms.         */
body.rv2-flow::before,
body.rv2-flow::after { opacity: .35; filter: blur(30px); }
body.rv2-flow .rv2-breath {
    opacity: .18 !important;
    width: clamp(240px, 40vw, 560px) !important;
    top: 18% !important;
    filter: blur(60px) !important;
}
body.rv2-flow .rv2-aurora { opacity: .3 !important; }
body.rv2-flow .rv2-orb { opacity: .55 !important; }

/* The dominant breath — deep, passionate rose-crimson swell.
   12 s cycle (5 bpm) for a fuller, slower sigh of love.                */
.rv2-breath {
    position: absolute;
    left: 50%; top: 28%;
    width: clamp(380px, 65vw, 920px);
    aspect-ratio: 1 / 1;
    transform: translate(-50%, -50%) scale(1);
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 50%,
            hsla(350, 100%, 72%, .95) 0%,
            hsla(355, 95%, 60%, .7)  20%,
            hsla(0,   90%, 54%, .45) 38%,
            hsla(8,   85%, 48%, .22) 58%,
            transparent 78%);
    filter: blur(48px);
    mix-blend-mode: multiply;
    opacity: .7;
    animation:
        breathe 12s cubic-bezier(.42, 0, .58, 1) infinite,
        breathHue 24s ease-in-out infinite alternate;
    will-change: transform, opacity;
}
@keyframes breathe {
    0%, 100% { transform: translate(-50%, -50%) scale(1);    opacity: .55; }
    50%      { transform: translate(-50%, -50%) scale(1.7);  opacity: 1;   }
}
@keyframes breathHue {
    0%   { filter: blur(48px) hue-rotate(-14deg) saturate(1); }
    100% { filter: blur(48px) hue-rotate(16deg)  saturate(1.2); }
}
@media (prefers-reduced-motion: reduce) { .rv2-breath { animation: none; } }
/* Aurora ribbons — ALL breathe on the same 10 s coherent cycle.
   Different start phases and positions create depth without breaking rhythm. */
.rv2-aurora {
    position: absolute;
    top: -10vh; left: -15%;
    width: 130%; height: 55vh;
    border-radius: 50%;
    filter: blur(60px);
    opacity: .7;
    mix-blend-mode: multiply;
    will-change: transform, opacity;
    animation: auroraBreathe 12s cubic-bezier(.42, 0, .58, 1) infinite;
}
.rv2-aurora-1 {
    background: radial-gradient(ellipse 70% 60% at 50% 50%,
        rgba(255, 70, 100, .45) 0%, rgba(220, 40, 80, .25) 45%, transparent 70%);
    animation-delay: 0s;
}
.rv2-aurora-2 {
    top: -5vh; left: 10%; width: 100%;
    background: radial-gradient(ellipse 55% 70% at 50% 50%,
        rgba(255, 80, 140, .4) 0%, rgba(230, 50, 100, .2) 50%, transparent 72%);
    animation-delay: -2s;
}
.rv2-aurora-3 {
    top: 5vh; left: -25%; width: 120%;
    background: radial-gradient(ellipse 80% 50% at 50% 50%,
        rgba(255, 130, 90, .32) 0%, rgba(255, 90, 70, .16) 45%, transparent 70%);
    animation-delay: -4s;
}
@keyframes auroraBreathe {
    0%, 100% { transform: scale(.92) translateX(-4%); opacity: .4; }
    50%      { transform: scale(1.18) translateX(4%);  opacity: 1;   }
}
@media (prefers-reduced-motion: reduce) { .rv2-aurora { animation: none; } }

/* Smaller floating orbs — supporting background motion, 20 s cycle = 2 breaths */
.rv2-orb {
    position: absolute;
    left: var(--x, 50%);
    bottom: -180px;
    width: var(--size, 120px); height: var(--size, 120px);
    border-radius: 50%;
    background: radial-gradient(circle at 50% 50%,
        hsla(var(--hue, 30), 100%, 82%, .75) 0%,
        hsla(var(--hue, 30), 95%, 65%, .4) 28%,
        hsla(var(--hue, 30), 90%, 55%, .15) 55%,
        transparent 75%);
    filter: blur(10px);
    opacity: 0;
    animation: orbFloat var(--dur, 20s) cubic-bezier(.45, 0, .55, 1) infinite;
    animation-delay: var(--delay, 0s);
    will-change: transform, opacity;
    mix-blend-mode: multiply;
}
@keyframes orbFloat {
    0%   { transform: translate(0, 0) scale(.6); opacity: 0; }
    12%  { opacity: .75; }
    50%  { transform: translate(-18px, -55vh) scale(1.15); opacity: 1; }
    88%  { opacity: .5; }
    100% { transform: translate(-8px, -115vh) scale(.7); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .rv2-orb { animation: none; opacity: 0; } }

/* ── Breathing halo around nav brand logo ── */
.rv2-brand-mark {
    position: relative;
}
.rv2-brand-mark::after {
    content: ''; position: absolute; inset: -20px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(192,57,43,.5) 0%, rgba(255,130,90,.22) 40%, transparent 75%);
    z-index: -1; pointer-events: none;
    filter: blur(6px);
    animation: auraPulse 12s cubic-bezier(.42, 0, .58, 1) infinite;
}
@keyframes auraPulse {
    0%, 100% { transform: scale(.55); opacity: .3; }
    50%      { transform: scale(1.25); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .rv2-brand-mark::after { animation: none; } }

/* ── Cozy fire ambience at top of page — flickering warm light ── */
body::before {
    content: '';
    position: fixed; top: 0; left: 0; right: 0; height: 55vh;
    z-index: 0; pointer-events: none;
    background:
        radial-gradient(ellipse 55% 70% at 18% 10%, rgba(255, 140, 60, .22) 0%, transparent 55%),
        radial-gradient(ellipse 60% 70% at 82% 5%,  rgba(255, 100, 40, .18) 0%, transparent 60%),
        radial-gradient(ellipse 40% 50% at 50% 0%,  rgba(255, 190, 90, .14) 0%, transparent 70%);
    filter: blur(26px) hue-rotate(0deg);
    mix-blend-mode: multiply;
    animation: fireFlicker 12s cubic-bezier(.42, 0, .58, 1) infinite, fireHue 30s ease-in-out infinite alternate;
    will-change: opacity, transform, filter;
}
@keyframes fireHue {
    0%   { filter: blur(26px) hue-rotate(-12deg) saturate(1); }
    50%  { filter: blur(26px) hue-rotate(10deg)  saturate(1.2); }
    100% { filter: blur(26px) hue-rotate(-8deg)  saturate(.95); }
}
body::after {
    content: '';
    position: fixed; top: 0; left: 0; right: 0; height: 30vh;
    z-index: 0; pointer-events: none;
    background:
        radial-gradient(ellipse 30% 40% at 25% 0%, rgba(255, 170, 70, .35) 0%, transparent 60%),
        radial-gradient(ellipse 25% 35% at 70% 2%, rgba(255, 130, 50, .3)  0%, transparent 65%);
    filter: blur(14px);
    mix-blend-mode: screen;
    animation: fireFlicker2 12s cubic-bezier(.42, 0, .58, 1) infinite;
    will-change: opacity, transform;
}
@keyframes fireFlicker {
    0%, 100% { opacity: .45; transform: translateY(4px)  scale(.96); }
    50%      { opacity: .95; transform: translateY(-10px) scale(1.08); }
}
@keyframes fireFlicker2 {
    0%, 100% { opacity: .4;  transform: translate(-4px, 4px)  scale(.94); }
    50%      { opacity: .9;  transform: translate(4px, -8px)  scale(1.1); }
}
@media (prefers-reduced-motion: reduce) {
    body::before, body::after { animation: none; }
}

/* ── Page-alive / breathing layer ──────────────────────── */
/* Cover breath — synced to 10 s coherent cycle */
@keyframes coverBreath {
    0%, 100% { transform: scale(1) translateZ(0); filter: saturate(.88) brightness(.9); }
    50%      { transform: scale(1.06) translateZ(0); filter: saturate(1.1) brightness(1.06); }
}
/* Tile fade-in on first load */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--ink-0);
    font-size: 15px; line-height: 1.5;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
}
button { cursor: pointer; font-family: inherit; color: inherit; background: none; border: none; }
input, textarea { font-family: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }

/* ══════════════════ MENU-ONLY MODE (rv2-noorder) ══════════════════ */
.rv2-noorder-banner {
    position: sticky; top: 0; z-index: 31;
    background: var(--ink-0); color: #fff;
    padding: 10px 20px; text-align: center;
    font-size: .88rem; font-weight: 600; letter-spacing: .01em;
    box-shadow: 0 2px 12px rgba(0,0,0,.15);
}
body.rv2-noorder .rv2-nav-cart,
body.rv2-noorder #rv2-cart,
body.rv2-noorder #rv2-cart-toggle,
body.rv2-noorder #rv2-cart-show,
body.rv2-noorder .p-ctl,
body.rv2-noorder .cart-expedition,
body.rv2-noorder #btn-checkout,
body.rv2-noorder #btn-checkout-guest { display: none !important; }
body.rv2-noorder .p-tile { pointer-events: none; }
body.rv2-noorder .p-tile .p-info,
body.rv2-noorder .p-tile .p-photo { pointer-events: auto; cursor: default; }

/* ══════════════════ TOP BAR ══════════════════ */
#rv2-topbar {
    position: sticky; top: 0; z-index: 30;
    background: rgba(247,247,245,.92);
    backdrop-filter: saturate(1.6) blur(14px);
    -webkit-backdrop-filter: saturate(1.6) blur(14px);
    border-bottom: 1px solid var(--border);
}
.rv2-top-inner {
    width: 100%;
    max-width: none; margin: 0;
    padding: 12px 28px;
    display: flex; align-items: center; gap: 12px;
    flex-wrap: nowrap;
}
.rv2-nav-spacer { flex: 1; min-width: 0; }
.rv2-brand-mark {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 4px 12px 4px 4px;
    border-radius: 999px;
    color: var(--ink-0);
    font-weight: 700; font-size: .95rem;
    letter-spacing: -.015em;
    transition: background .12s var(--ease);
}
.rv2-brand-mark:hover { background: var(--border); }
.rv2-brand-mark img {
    height: 44px; width: auto; max-width: 180px;
    border-radius: 8px; object-fit: contain;
    flex-shrink: 0; background: transparent;
    animation: navLogoBreath 12s cubic-bezier(.42, 0, .58, 1) infinite;
    will-change: transform, filter;
}
@keyframes navLogoBreath {
    0%, 100% { transform: scale(1); filter: brightness(.95) drop-shadow(0 0 0 rgba(230,50,90,0)); }
    50%      { transform: scale(1.1); filter: brightness(1.1) drop-shadow(0 0 22px rgba(230,50,90,.7)); }
}
@media (prefers-reduced-motion: reduce) { .rv2-brand-mark img { animation: none; } }
.rv2-brand-name { letter-spacing: -.01em; }
.rv2-brand-dot { display: none; }

.rv2-mode-switch {
    margin: 0 auto;
    display: inline-flex;
    padding: 3px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 999px;
    gap: 2px;
}
.rv2-mode-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 18px;
    color: var(--ink-2);
    font-size: .86rem; font-weight: 600;
    border-radius: 999px;
    transition: all .12s var(--ease);
    white-space: nowrap;
}
.rv2-mode-btn:hover { color: var(--ink-0); }
.rv2-mode-btn.active {
    background: var(--ink-0);
    color: #fff;
    box-shadow: var(--shadow-sm);
}

/* Top-nav Handlekurv button */
.rv2-nav-cart {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 16px 9px 14px;
    background: var(--ink-0);
    color: #fff;
    border-radius: 999px;
    font-weight: 600; font-size: .88rem;
    letter-spacing: -.005em;
    transition: background .18s var(--ease), transform .1s var(--ease);
}
.rv2-nav-cart:hover { background: #000; }
.rv2-nav-cart:active { transform: scale(.97); }
.rv2-nav-cart.is-open { background: var(--brand); }
.rv2-nav-cart.is-open:hover { background: var(--brand-dark); }
.rv2-nav-cart svg { opacity: .9; flex-shrink: 0; }
.rv2-nav-cart-label { letter-spacing: -.005em; }
.rv2-nav-cart-count {
    background: var(--brand);
    color: #fff;
    min-width: 22px; height: 22px; border-radius: 999px;
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: .74rem;
    padding: 0 7px;
}
.rv2-nav-cart.is-open .rv2-nav-cart-count { background: #fff; color: var(--brand); }
.rv2-nav-cart-total {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    padding-left: 2px;
    border-left: 1px solid rgba(255,255,255,.25);
    margin-left: 2px;
}
@media (max-width: 860px) {
    .rv2-nav-cart-label, .rv2-nav-cart-total { display: none; }
}
body.mode-viewing .rv2-nav-cart { display: none; }

.rv2-top-pill {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 8px 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    color: var(--ink-1);
    font-size: .86rem; font-weight: 600;
    border-radius: 999px;
    transition: all .12s var(--ease);
}
.rv2-top-pill:hover { background: var(--bg); border-color: var(--border-2); color: var(--ink-0); }
.rv2-pill-owner {
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
}
.rv2-pill-owner:hover { background: var(--brand-dark); color: #fff; border-color: var(--brand-dark); }

/* ══════════════════ APP LAYOUT (full-viewport) ══════════════════ */
#rv2-app {
    position: relative;
    z-index: 1;
    max-width: none; margin: 0;
    width: 100%;
    padding: 20px 28px 0;
    display: flex; flex-direction: column; gap: 18px;
}
.rv2-site-foot { position: relative; z-index: 1; }

/* ══════════════════ IDENTITY HERO (impact) ══════════════════ */
#rv2-identity {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    min-height: 400px;
    background: var(--ink-0);
    box-shadow: var(--shadow-lg);
}
.rv2-cover {
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    opacity: .95;
    animation: coverBreath 12s cubic-bezier(.42, 0, .58, 1) infinite;
    will-change: transform, filter;
}
@media (prefers-reduced-motion: reduce) { .rv2-cover { animation: none; } }
#rv2-identity::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.8) 100%);
}
.rv2-identity-inner {
    position: relative; z-index: 2;
    padding: 28px 34px;
    min-height: 400px;
    display: flex; flex-direction: column; justify-content: flex-end;
    color: #fff;
    gap: 16px;
}
.rv2-logo-ring {
    display: inline-block;
    width: 64px; height: 64px; border-radius: 16px;
    background: #fff;
    padding: 6px;
    box-shadow: 0 10px 22px rgba(0,0,0,.3);
    flex-shrink: 0;
    animation: softFloat 12s cubic-bezier(.42, 0, .58, 1) infinite;
}
@keyframes softFloat {
    0%, 100% { transform: translateY(0) scale(1); box-shadow: 0 10px 22px rgba(0,0,0,.3); }
    50%      { transform: translateY(-12px) scale(1.05); box-shadow: 0 24px 42px rgba(0,0,0,.45), 0 0 50px rgba(255,90,120,.55); }
}
@media (prefers-reduced-motion: reduce) { .rv2-logo-ring { animation: none; } }
.rv2-logo {
    width: 100%; height: 100%; border-radius: 10px;
    background-size: contain; background-position: center; background-repeat: no-repeat;
    background-color: #fff;
}
.rv2-identity-text { flex: 0 0 auto; }
.rv2-rest-name {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 3.2rem;
    color: #fff;
    letter-spacing: -.025em;
    line-height: .95;
    margin-bottom: 10px;
    position: relative;
    animation: titleBreath 12s cubic-bezier(.42, 0, .58, 1) infinite;
    will-change: text-shadow;
}
@keyframes titleBreath {
    0%, 100% {
        text-shadow:
            0 2px 12px rgba(0,0,0,.35),
            0 0 8px rgba(255,120,140,.2);
    }
    50% {
        text-shadow:
            0 2px 16px rgba(0,0,0,.5),
            0 0 50px rgba(255,80,110,.8),
            0 0 100px rgba(230,50,90,.55);
    }
}
@media (prefers-reduced-motion: reduce) { .rv2-rest-name { animation: none; } }
.rv2-rest-desc {
    font-size: 1.02rem;
    color: rgba(255,255,255,.85);
    line-height: 1.5;
    max-width: 620px;
    margin-bottom: 14px;
    font-weight: 500;
    text-shadow: 0 1px 4px rgba(0,0,0,.4);
}

.rv2-status-row {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin-bottom: 4px;
}
.rv2-status-pill {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 7px 14px;
    background: rgba(255,255,255,.16);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    font-size: .78rem; font-weight: 600; letter-spacing: .01em;
    color: #fff;
}
.rv2-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 8px rgba(74,222,128,.8); }
.rv2-status-pill.closed .rv2-status-dot { background: #ff6f6f; box-shadow: 0 0 8px rgba(255,111,111,.8); }
.rv2-status-pill.open .rv2-status-dot { animation: openPulse 2s ease-in-out infinite; }
@keyframes openPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(74,222,128,.6); transform: scale(1); }
    50%      { box-shadow: 0 0 0 12px rgba(74,222,128,0); transform: scale(1.25); }
}
.rv2-status-today { font-size: .82rem; color: rgba(255,255,255,.75); font-weight: 500; }

/* Rating pill — star row + average */
.rv2-rating-pill {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 12px;
    background: rgba(255,255,255,.16);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    font-size: .8rem; font-weight: 600;
    color: #fff;
}
.rv2-rating-pill b { font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }
.rv2-stars { display: inline-flex; align-items: center; gap: 1px; color: #ffd64a; }
.rv2-rating-count { color: rgba(255,255,255,.8); font-weight: 500; font-size: .78rem; }

.rv2-contact-row {
    display: flex; gap: 8px; flex-wrap: wrap;
}
.rv2-contact-link {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 16px;
    background: rgba(255,255,255,.16);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    color: #fff;
    font-size: .86rem; font-weight: 500;
    transition: all .12s var(--ease);
}
.rv2-contact-link:hover { background: rgba(255,255,255,.26); }
.rv2-contact-link svg { color: #fff; opacity: .85; flex-shrink: 0; }

.rv2-hours-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 16px;
    background: var(--brand);
    color: #fff;
    border-radius: 999px;
    font-size: .86rem; font-weight: 700;
    border: 1px solid transparent;
}
.rv2-hours-btn:hover { background: var(--brand-dark); }
.rv2-hours-btn svg { color: #fff; flex-shrink: 0; }

/* ══════════════════ VIEWING BANNER ══════════════════ */
.rv2-viewing-banner {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 20px;
    background: var(--brand-soft);
    border: 1px solid rgba(192,57,43,.2);
    border-radius: var(--r);
    color: var(--brand-dark);
    font-size: .9rem; font-weight: 600;
}
.rv2-viewing-banner svg { color: var(--brand); flex-shrink: 0; }
.rv2-viewing-banner span { flex: 1; }
.rv2-viewing-cta {
    padding: 8px 16px;
    background: var(--brand);
    color: #fff;
    border-radius: 999px;
    font-size: .78rem; font-weight: 700;
    letter-spacing: .02em;
    transition: background .12s var(--ease);
}
.rv2-viewing-cta:hover { background: var(--brand-dark); }
body.mode-ordering .rv2-viewing-banner { display: none; }

/* ══════════════════ CATEGORY STRIP (bigger) ══════════════════ */
.rv2-search-row { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; }
/* Desktop: the search + cats row stays pinned under the top nav as you scroll the menu. */
@media (min-width: 861px) {
    .rv2-search-row {
        position: sticky;
        top: 64px; /* clears #rv2-topbar (padding 12 + logo ~40) */
        z-index: 25;
        background: rgba(247,247,245,.94);
        backdrop-filter: saturate(1.6) blur(14px);
        -webkit-backdrop-filter: saturate(1.6) blur(14px);
        padding: 10px 0 6px;
        margin: 0 -4px 8px;
        border-bottom: 1px solid var(--border);
    }
    .rv2-search-row > .rv2-search,
    .rv2-search-row > .rv2-cats-strip { padding-left: 4px; padding-right: 4px; }
}
.rv2-search {
    flex: 1;
    display: flex; align-items: center; gap: 10px;
    padding: 11px 18px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--ink-1);
    box-shadow: var(--shadow-sm);
    transition: all .12s var(--ease);
}
.rv2-search:focus-within {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
}
.rv2-search svg { color: var(--ink-2); flex-shrink: 0; }
#rv2-search {
    flex: 1; background: transparent; border: none;
    color: var(--ink-0);
    padding: 0;
    font-size: .94rem; font-weight: 500;
    outline: none;
}
#rv2-search::placeholder { color: var(--ink-3); }

.rv2-cats-strip, .cats-list {
    display: flex; gap: 8px; align-items: center;
    overflow-x: auto; scrollbar-width: none;
    padding: 4px 0 14px;
}
.rv2-cats-strip::-webkit-scrollbar, .cats-list::-webkit-scrollbar { display: none; }
.cat-chip, .cat-row {
    flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: 10px;
    padding: 11px 20px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--ink-1);
    font-size: .96rem; font-weight: 600;
    white-space: nowrap;
    transition: all .22s var(--ease);
}
.cat-chip .cat-ic, .cat-row .cat-ic { font-size: 1.2rem; line-height: 1; }
.cat-chip.active .cat-ic, .cat-row.active .cat-ic {
    filter: saturate(1.15);
    animation: chipWink 6s ease-in-out infinite;
}
@keyframes chipWink {
    0%, 90%, 100% { transform: translateY(0) rotate(0); }
    95% { transform: translateY(-2px) rotate(-4deg); }
}
.cat-chip:hover, .cat-row:hover { border-color: var(--border-2); }
.cat-name { white-space: nowrap; }
.cat-badge {
    background: var(--bg);
    padding: 2px 8px; border-radius: 6px;
    font-size: .74rem; font-weight: 700;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}
.cat-chip.active, .cat-row.active {
    background: var(--ink-0);
    color: #fff;
    border-color: var(--ink-0);
}
.cat-chip.active .cat-badge, .cat-row.active .cat-badge {
    background: var(--brand);
    color: #fff;
}

/* Sidebar in original 3-col layout — repurpose it as just the top strip row */
#rv2-cats-sidebar { display: none; }

/* ══════════════════ MAIN LAYOUT ══════════════════ */
#rv2-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 22px;
    align-items: start;
    width: 100%;
}
body.mode-viewing #rv2-cart { display: none; }
body.mode-viewing #rv2-layout { grid-template-columns: minmax(0, 1fr); }
body.mode-viewing .rv2-cart-toggle { display: none !important; }

#rv2-main {
    min-width: 0;
    display: flex; flex-direction: column;
    gap: 14px;
}

/* ══════════════════ MENU CONTAINER ══════════════════ */
#rv2-menu {
    background: transparent;
    border: none;
    padding: 0;
    min-height: 200px;
}
.rv2-binder-spine, .rv2-binder-crest { display: none; }
.rv2-binder-inner { }

/* Section heading */
.p-section-title {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 1.3rem;
    color: var(--ink-0);
    letter-spacing: -.02em;
    margin: 24px 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
    grid-column: 1 / -1;
}
.p-section-title:first-child { margin-top: 4px; }
.p-section-title[data-cat-id] { scroll-margin-top: 120px; }
@media (max-width: 860px) { .p-section-title[data-cat-id] { scroll-margin-top: 160px; } }

/* Cats strip: hide on mobile (FAB handles it there) */
@media (max-width: 860px) { .rv2-cats-strip { display: none !important; } }

/* ══════════════════ ITEM CARD (horizontal, per screenshot) ══════════════════ */
#rv2-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 14px;
}

.p-tile {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 140px;
    gap: 16px;
    padding: 16px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r);
    cursor: pointer; text-align: left;
    transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .2s;
    align-items: center;
    color: var(--ink-0);
    position: relative;
    min-height: 140px;
    animation: fadeInUp .55s ease-out both;
    /* iOS: avoid 300ms tap delay + provide visible tap feedback */
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(192,57,43,.15);
    user-select: none;
    -webkit-user-select: none;
}
.p-tile:active { transform: scale(.985); }
.p-tile:hover { transform: translateY(-3px); border-color: var(--border-2); box-shadow: var(--shadow-md); }

/* Stagger entry — first 18 tiles cascade in gently */
.p-tile:nth-child(2)  { animation-delay: .04s; }
.p-tile:nth-child(3)  { animation-delay: .07s; }
.p-tile:nth-child(4)  { animation-delay: .10s; }
.p-tile:nth-child(5)  { animation-delay: .13s; }
.p-tile:nth-child(6)  { animation-delay: .16s; }
.p-tile:nth-child(7)  { animation-delay: .19s; }
.p-tile:nth-child(8)  { animation-delay: .22s; }
.p-tile:nth-child(9)  { animation-delay: .25s; }
.p-tile:nth-child(10) { animation-delay: .28s; }
.p-tile:nth-child(11) { animation-delay: .30s; }
.p-tile:nth-child(12) { animation-delay: .32s; }
.p-tile:nth-child(n+13) { animation-delay: .34s; }
@media (prefers-reduced-motion: reduce) { .p-tile { animation: none; } }

.p-info {
    min-width: 0;
    display: flex; flex-direction: column;
    gap: 6px;
    align-self: center;
}
.p-name {
    font-family: 'Inter', sans-serif;
    font-weight: 700; font-size: 1.02rem;
    color: var(--ink-0);
    letter-spacing: -.005em;
    line-height: 1.25;
}
.p-desc {
    font-size: .84rem;
    color: var(--ink-2);
    line-height: 1.4;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.p-foot {
    display: flex; align-items: center; gap: 8px;
    margin-top: 2px;
}
.p-price {
    font-family: 'Inter', sans-serif;
    font-weight: 800; font-size: 1.05rem;
    color: var(--ink-0);
    font-variant-numeric: tabular-nums;
}
.p-has-opts {
    color: var(--brand);
    background: var(--brand-soft);
    padding: 3px 10px;
    border-radius: 6px;
    font-size: .68rem; font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.p-photo {
    width: 140px; height: 140px;
    border-radius: 16px;
    background-size: cover; background-position: center;
    background-color: var(--bg);
    justify-self: end;
    flex-shrink: 0;
    transition: transform .5s var(--ease);
    will-change: transform;
}
.p-tile:hover .p-photo { transform: scale(1.04); }
@media (prefers-reduced-motion: reduce) { .p-photo { transition: none; } }
.p-photo--empty {
    background-image: none;
    background: linear-gradient(135deg, #f0f0ed, #e5e5e0);
    position: relative;
}
.p-photo--empty::after {
    content: '🍽';
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 2rem; opacity: .25;
}

/* Qty control positioned in top-right corner of the photo */
.p-ctl {
    position: absolute;
    top: 24px; right: 24px;
    z-index: 3;
    display: flex; align-items: center;
    background: var(--ink-0);
    color: #fff;
    border-radius: 999px;
    box-shadow: 0 3px 10px rgba(0,0,0,.35);
    transition: background .12s var(--ease), transform .12s var(--ease);
}
.p-ctl button {
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    background: transparent;
    color: #fff;
    font-size: 1.3rem; font-weight: 500; line-height: 1;
    padding: 0;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(255,255,255,.2);
}
.p-ctl button:hover { color: #fff; }
.p-ctl .qty {
    min-width: 22px; text-align: center;
    font-weight: 700; font-size: .92rem;
    font-variant-numeric: tabular-nums;
    padding: 0 2px;
    user-select: none;
}
.p-ctl.has-qty { background: var(--brand); box-shadow: 0 3px 12px rgba(192,57,43,.4); }
.p-tile:hover .p-ctl:not(.has-qty) { background: var(--brand); transform: scale(1.04); }
body.mode-viewing .p-ctl { display: none; }

/* ══════════════════ CART ══════════════════ */
#rv2-cart {
    position: sticky; top: 88px;
    max-height: calc(100vh - 108px);
    align-self: start;
    display: flex; flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}
.cart-head {
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
    display: flex; align-items: center; justify-content: space-between;
}
.cart-title {
    font-weight: 800; font-size: .98rem;
    color: var(--ink-0);
    letter-spacing: -.01em;
    flex: 1;
    text-align: left;
}
.cart-hide {
    width: 30px; height: 30px; border-radius: 50%;
    background: var(--bg);
    border: 1px solid var(--border);
    color: var(--ink-2);
    display: flex; align-items: center; justify-content: center;
    transition: all .12s var(--ease);
}
.cart-hide:hover { background: var(--ink-0); color: #fff; border-color: var(--ink-0); }

/* Expedition (Levering / Take-away / Dine-in) segmented toggle */
.cart-expedition {
    display: grid;
    grid-auto-flow: column; grid-auto-columns: 1fr;
    gap: 4px;
    margin: 12px 14px 0;
    padding: 4px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 12px;
}
.ce-opt {
    display: flex; align-items: center; justify-content: center; gap: 7px;
    padding: 9px 8px;
    background: transparent;
    color: var(--ink-2);
    font-size: .84rem; font-weight: 600;
    letter-spacing: -.005em;
    border-radius: 9px;
    white-space: nowrap;
    transition: all .14s var(--ease);
}
.ce-opt:hover { color: var(--ink-0); }
.ce-opt.on {
    background: var(--surface);
    color: var(--ink-0);
    box-shadow: var(--shadow-sm);
    font-weight: 700;
}
.ce-ic { font-size: 1rem; line-height: 1; }
.ce-lb { }

.cart-paper { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
#cart-lines {
    flex: 1; overflow-y: auto;
    padding: 8px 16px;
}
.cart-line {
    display: grid; grid-template-columns: 1fr auto auto;
    gap: 10px; align-items: center;
    padding: 12px 4px;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
}
.cart-line:last-child { border-bottom: none; }
.cart-line:hover { background: var(--bg); }
.cart-line .cl-name { font-weight: 600; font-size: .9rem; color: var(--ink-0); line-height: 1.3; }
.cart-line .cl-meta { font-size: .72rem; color: var(--ink-2); margin-top: 2px; }
.cart-line .cl-qty {
    display: flex; align-items: center; gap: 2px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 2px;
}
.cart-line .cl-qty button {
    width: 26px; height: 26px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--ink-0);
    font-size: .9rem; font-weight: 800;
    transition: all .1s var(--ease);
}
.cart-line .cl-qty button:hover { background: var(--ink-0); color: #fff; border-color: var(--ink-0); }
.cart-line .cl-qty span { min-width: 22px; text-align: center; font-weight: 800; font-size: .86rem; padding: 0 4px; color: var(--ink-0); font-variant-numeric: tabular-nums; }
.cart-line .cl-total { font-weight: 800; font-size: .94rem; color: var(--ink-0); min-width: 58px; text-align: right; font-variant-numeric: tabular-nums; }

.cart-empty {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 50px 20px; text-align: center;
    color: var(--ink-2); flex: 1;
}
.cart-empty svg { opacity: .35; margin-bottom: 12px; color: var(--ink-2); }
.cart-empty .ce-title { font-size: 1rem; font-weight: 700; color: var(--ink-0); margin-bottom: 4px; }
.cart-empty .ce-sub { font-size: .8rem; color: var(--ink-2); line-height: 1.5; }

#cart-note-wrap { padding: 10px 16px; border-top: 1px solid var(--border); }
#cart-note {
    width: 100%;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--ink-0);
    padding: 10px 12px;
    font-size: .84rem; font-weight: 500;
    outline: none;
    transition: all .12s var(--ease);
}
#cart-note:focus { border-color: var(--brand); background: var(--surface); box-shadow: 0 0 0 3px var(--brand-soft); }
#cart-note::placeholder { color: var(--ink-3); }

#cart-totals { padding: 14px 16px; border-top: 1px solid var(--border); }
.cart-row { display: flex; justify-content: space-between; padding: 4px 0; font-size: .88rem; color: var(--ink-1); font-variant-numeric: tabular-nums; }
.cart-row--mva { font-size: .74rem; color: var(--ink-2); }

.cart-lcd {
    margin: 0 16px 12px;
    padding: 14px 18px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    display: flex; justify-content: space-between; align-items: center;
}
.cart-lcd-label { font-size: .68rem; font-weight: 700; letter-spacing: .14em; color: var(--ink-2); text-transform: uppercase; }
.cart-lcd-total {
    font-family: 'Inter', sans-serif;
    font-size: 1.3rem; font-weight: 800;
    color: var(--ink-0);
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}

#cart-actions { padding: 0 16px 16px; }
.cart-checkout {
    width: 100%;
    padding: 14px;
    background: var(--brand);
    color: #fff;
    border-radius: 12px;
    font-size: .94rem; font-weight: 700;
    letter-spacing: .01em;
    transition: background .12s var(--ease), transform .1s var(--ease);
}
.cart-checkout:disabled { background: var(--bg); color: var(--ink-3); cursor: not-allowed; }
.cart-checkout:not(:disabled):hover { background: var(--brand-dark); }
.cart-checkout:not(:disabled):active { transform: translateY(1px); }

/* Secondary "Sjekk ut som gjest" link under the main checkout button */
.cart-checkout-guest {
    display: block;
    text-align: center;
    padding: 10px 8px 4px;
    font-size: .82rem; font-weight: 600;
    color: var(--ink-2);
    text-decoration: none;
    transition: color .12s var(--ease);
}
.cart-checkout-guest:hover { color: var(--brand); }
.cart-checkout-guest[hidden] { display: none; }

/* Cart hide/show state */
body.cart-hidden #rv2-cart { display: none; }
body.mode-ordering.cart-hidden #rv2-layout { grid-template-columns: minmax(0, 1fr); }
.rv2-cart-show {
    position: fixed; bottom: 20px; right: 20px;
    display: none; align-items: center; gap: 8px;
    padding: 11px 18px 11px 14px;
    background: var(--brand); color: #fff;
    border-radius: 999px;
    font-size: .88rem; font-weight: 700;
    box-shadow: 0 10px 24px rgba(192,57,43,.35), 0 4px 8px rgba(0,0,0,.15);
    z-index: 45;
    transition: all .12s var(--ease);
}
.rv2-cart-show:hover { background: var(--brand-dark); }
body.mode-ordering.cart-hidden .rv2-cart-show { display: inline-flex; }
.rv2-cart-show .rcs-count {
    min-width: 22px; height: 22px; border-radius: 999px;
    background: #fff; color: var(--brand);
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: .72rem;
    padding: 0 7px;
}

/* ══════════════════ MOBILE CART TOGGLE ══════════════════ */
/* ═══════════════ Category Speed-Dial FAB ═══════════════ */
.rv2-cat-fab {
    position: fixed; right: 20px; top: 50%;
    transform: translateY(-50%);
    z-index: 45;
    display: flex; flex-direction: column; align-items: flex-end; gap: 0;
}
.rv2-cat-fab-btn {
    position: relative;
    width: 56px; height: 56px; border-radius: 50%;
    background: var(--brand); color: #fff; border: none;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 10px 28px rgba(192,57,43,.45);
    cursor: pointer;
    animation: rv2CatFabBreath 3.6s cubic-bezier(.42,0,.58,1) infinite;
    transition: transform .3s var(--ease), background .2s var(--ease), box-shadow .3s var(--ease);
    overflow: hidden;
}
.rv2-cat-fab-btn:hover { transform: scale(1.06); }
.rv2-cat-fab-btn .ic-grid, .rv2-cat-fab-btn .ic-close {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%) scale(1) rotate(0);
    transition: opacity .22s var(--ease), transform .32s var(--ease-spring);
}
.rv2-cat-fab-btn .ic-close { opacity: 0; transform: translate(-50%,-50%) scale(.6) rotate(-90deg); }
.rv2-cat-fab.on .rv2-cat-fab-btn {
    background: var(--ink-0);
    animation: none;
    box-shadow: 0 12px 34px rgba(0,0,0,.35);
}
.rv2-cat-fab.on .rv2-cat-fab-btn .ic-grid  { opacity: 0; transform: translate(-50%,-50%) scale(.5) rotate(90deg); }
.rv2-cat-fab.on .rv2-cat-fab-btn .ic-close { opacity: 1; transform: translate(-50%,-50%) scale(1)  rotate(0);    }
.rv2-cat-fab-lab {
    position: absolute; right: calc(100% + 10px); top: 50%;
    transform: translateY(-50%);
    background: var(--ink-0); color: #fff;
    padding: 6px 12px; border-radius: 999px;
    font-size: .76rem; font-weight: 700; white-space: nowrap;
    opacity: 0; pointer-events: none;
    transition: opacity .2s var(--ease);
}
.rv2-cat-fab-btn:hover .rv2-cat-fab-lab { opacity: 1; }
.rv2-cat-fab.on .rv2-cat-fab-lab { display: none; }
@keyframes rv2CatFabBreath {
    0%,100% { box-shadow: 0 10px 28px rgba(192,57,43,.45), 0 0 0 0 rgba(192,57,43,.5); }
    50%     { box-shadow: 0 14px 34px rgba(192,57,43,.55), 0 0 0 14px rgba(192,57,43,0); }
}

/* Speed-dial pills */
.rv2-cat-pills {
    position: absolute; right: 0; bottom: 66px;
    display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 8px;
    pointer-events: none;
}
.rv2-cat-pill {
    display: inline-flex; align-items: center; flex-direction: row-reverse;
    gap: 10px;
    height: 46px; padding: 0 10px 0 16px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 24px;
    color: var(--ink-0);
    font-size: .88rem; font-weight: 700;
    letter-spacing: -.005em;
    cursor: pointer;
    box-shadow: var(--shadow-md);
    opacity: 0; transform: translateY(12px) scale(.8);
    transition: transform .3s var(--ease-spring), opacity .25s var(--ease), background .15s var(--ease), color .15s var(--ease);
    white-space: nowrap;
    pointer-events: none; /* invisible by default — only clickable when the FAB is open */
}
.rv2-cat-fab.on .rv2-cat-pill { pointer-events: auto; }
.rv2-cat-pill:hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.rv2-cat-pill.active { background: var(--ink-0); color: #fff; border-color: var(--ink-0); }
.rv2-cat-pill .ic {
    width: 34px; height: 34px; border-radius: 50%;
    background: var(--bg);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
    transition: background .15s var(--ease);
}
.rv2-cat-pill:hover .ic, .rv2-cat-pill.active .ic { background: rgba(255,255,255,.18); }
.rv2-cat-pill .lab { padding: 0 2px; }

/* Staggered bloom on open */
.rv2-cat-fab:not(.on) .rv2-cat-pills { pointer-events: none; }
.rv2-cat-fab.on .rv2-cat-pill { opacity: 1; transform: translateY(0) scale(1); }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(1)  { transition-delay: .02s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(2)  { transition-delay: .05s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(3)  { transition-delay: .08s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(4)  { transition-delay: .11s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(5)  { transition-delay: .14s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(6)  { transition-delay: .17s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(7)  { transition-delay: .20s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(8)  { transition-delay: .23s; }
.rv2-cat-fab.on .rv2-cat-pill:nth-last-child(n+9){ transition-delay: .26s; }

/* Backdrop scrim when open */
.rv2-cat-fab::before {
    content: ''; position: fixed; inset: 0;
    background: rgba(0,0,0,.18);
    opacity: 0; pointer-events: none;
    transition: opacity .25s var(--ease);
    z-index: -1;
}
.rv2-cat-fab.on::before { opacity: 1; pointer-events: auto; }

@media (max-width: 560px) {
    .rv2-cat-fab { right: 14px; top: auto; bottom: 88px; transform: none; }
    .rv2-cat-fab-btn { width: 52px; height: 52px; }
    .rv2-cat-pills { gap: 7px; bottom: 62px; max-height: calc(100vh - 200px); overflow-y: auto; scrollbar-width: none; }
    .rv2-cat-pills::-webkit-scrollbar { display: none; }
    .rv2-cat-pill { height: 42px; font-size: .84rem; }
    .rv2-cat-pill .ic { width: 30px; height: 30px; font-size: .96rem; }
}
@media (prefers-reduced-motion: reduce) {
    .rv2-cat-fab-btn { animation: none; }
    .rv2-cat-pill { transition: opacity .1s linear; }
}

.rv2-cart-toggle {
    position: fixed; bottom: 16px; left: 16px; right: 16px;
    padding: 14px 20px;
    background: var(--ink-0);
    color: #fff;
    border-radius: 14px;
    display: flex; align-items: center; gap: 12px;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(0,0,0,.25);
    z-index: 40;
}
.rv2-cart-toggle .ct-count {
    min-width: 28px; height: 28px; border-radius: 14px;
    background: var(--brand);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: .78rem;
    padding: 0 8px;
}
.rv2-cart-toggle .ct-label { flex: 1; text-align: left; font-size: .92rem; }
.rv2-cart-toggle .ct-total { font-weight: 800; font-size: 1rem; font-variant-numeric: tabular-nums; }

/* ══════════════════ ITEM MODAL (SE MENY style) ══════════════════ */
.modal-bg {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 100;
    animation: fadeIn .12s var(--ease);
}
.modal-sheet {
    position: fixed; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 32px); max-width: 480px;
    max-height: 92vh;
    background: var(--surface);
    border: none;
    border-radius: 22px;
    z-index: 101;
    padding: 0;
    color: var(--ink-1);
    box-shadow: 0 30px 80px rgba(0,0,0,.28), 0 10px 24px rgba(0,0,0,.12);
    display: flex; flex-direction: column;
    overflow: hidden;
    animation: modalIn .18s ease-out;
    contain: layout paint;
    will-change: transform, opacity;
}
@keyframes modalIn {
    from { opacity: 0; transform: translate(-50%, -48%); }
    to   { opacity: 1; transform: translate(-50%, -50%); }
}
/* Pause the heavy cover breath while modal is open — avoids compositing conflicts */
body:has(.modal-sheet[style*="display: flex"]) .rv2-cover,
body:has(.modal-sheet[style*="display:flex"]) .rv2-cover { animation-play-state: paused; }

.m-header {
    padding: 18px 20px;
    display: flex; align-items: center; justify-content: center;
    position: relative;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}
.m-header h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700; font-size: .98rem;
    color: var(--ink-0);
    letter-spacing: -.005em;
    line-height: 1.2;
    margin: 0;
}
.m-close {
    position: absolute; top: 12px; right: 14px;
    width: 34px; height: 34px; border-radius: 50%;
    background: var(--bg);
    color: var(--ink-2);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem; font-weight: 500;
    transition: all .12s var(--ease);
    border: none;
}
.m-close:hover { background: var(--border); color: var(--ink-0); }

.m-hero {
    width: 100%; height: 260px;
    background-size: cover; background-position: center;
    flex-shrink: 0;
    background-color: var(--bg);
}

.m-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 22px 22px 18px;
    touch-action: pan-y;
}
.m-body h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 800; font-size: 1.2rem;
    color: var(--ink-0);
    letter-spacing: -.015em; line-height: 1.2;
    margin: 0 0 10px;
}
.m-desc {
    font-size: .92rem;
    color: var(--ink-2);
    line-height: 1.55;
    margin: 0 0 18px;
}
.m-alt-label {
    font-size: .82rem; font-weight: 700;
    color: var(--ink-2);
    margin-bottom: 10px;
    letter-spacing: -.005em;
}

.m-group {
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 18px 20px 16px;
    margin-bottom: 12px;
}
.m-group-title {
    font-weight: 800; font-size: 1rem;
    color: var(--ink-0);
    letter-spacing: -.005em;
    margin-bottom: 14px;
}

/* Variants — inline text labels, not bordered buttons */
.m-variant-row { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.m-variant {
    background: none;
    border: none;
    padding: 4px 0;
    display: inline-flex; align-items: baseline; gap: 6px;
    color: var(--ink-2);
    font-size: .94rem; font-weight: 500;
    cursor: pointer;
    transition: color .12s var(--ease);
}
.m-variant:hover { color: var(--ink-0); }
.m-variant .m-v-price {
    font-size: .78rem; font-weight: 500;
    color: var(--ink-3);
    font-variant-numeric: tabular-nums;
}
.m-variant.selected { color: var(--brand); font-weight: 700; }
.m-variant.selected .m-v-name { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1.5px; }
.m-variant.selected .m-v-price { color: var(--brand); font-weight: 600; }

/* Extras — checkbox rows, no individual borders */
.m-extras-list { display: flex; flex-direction: column; gap: 2px; }
.m-extra {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    gap: 12px; align-items: center;
    padding: 10px 2px;
    cursor: pointer;
    user-select: none;
}
.m-check {
    width: 22px; height: 22px;
    border: 1.5px solid var(--border-2);
    border-radius: 6px;
    background: var(--surface);
    position: relative;
    flex-shrink: 0;
    transition: all .12s var(--ease);
}
.m-extra.sel .m-check {
    background: var(--brand);
    border-color: var(--brand);
}
.m-extra.sel .m-check::after {
    content: ''; position: absolute;
    top: 3px; left: 7px;
    width: 6px; height: 11px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.m-extra .m-name { font-size: .92rem; font-weight: 600; color: var(--ink-0); letter-spacing: -.005em; }
.m-extra .m-price { font-weight: 600; font-size: .9rem; color: var(--ink-1); font-variant-numeric: tabular-nums; }

/* Sticky footer with Price | Antall | Add button */
.m-foot {
    padding: 16px 22px 18px;
    background: var(--surface);
    border-top: 1px solid var(--border);
    flex-shrink: 0;
}
.m-foot-grid {
    display: grid; grid-template-columns: 1fr auto;
    gap: 18px; align-items: center;
    margin-bottom: 14px;
}
.m-foot-grid .m-col .l {
    font-size: .74rem; font-weight: 700;
    color: var(--ink-2);
    letter-spacing: .02em;
    margin-bottom: 4px;
}
.m-foot-grid .m-col .v {
    font-size: 1.4rem; font-weight: 800;
    color: var(--ink-0);
    letter-spacing: -.025em;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}
.m-qty-input {
    display: inline-flex; align-items: center; gap: 3px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 4px;
}
.m-qty-input button {
    width: 36px; height: 36px; border-radius: 9px;
    background: var(--surface);
    color: var(--ink-1);
    font-size: 1.1rem; font-weight: 600;
    border: 1px solid var(--border);
    transition: all .1s var(--ease);
}
.m-qty-input button:hover { background: var(--ink-0); color: #fff; border-color: var(--ink-0); }
.m-qty-input span {
    min-width: 40px; text-align: center;
    font-weight: 800; font-size: 1.05rem;
    color: var(--ink-0);
    font-variant-numeric: tabular-nums;
    padding: 0 4px;
}

.m-add {
    width: 100%;
    padding: 15px 20px;
    background: var(--brand);
    color: #fff;
    border-radius: 999px;
    font-size: 1rem; font-weight: 700;
    letter-spacing: -.005em;
    min-height: 52px;
    transition: background .12s var(--ease), transform .1s var(--ease);
}
.m-add:hover { background: var(--brand-dark); }
.m-add:active { transform: translateY(1px); }

@media (max-width: 560px) {
    .modal-sheet {
        top: auto; left: 0; right: 0; bottom: 0;
        transform: none;
        width: 100%; max-width: 100%;
        height: 92vh;
        height: 92dvh;
        max-height: 92dvh;
        border-radius: 20px 20px 0 0;
        animation: slideUpMobile .26s var(--ease);
        display: flex; flex-direction: column;
        overflow: hidden;
    }
    @keyframes slideUpMobile {
        from { opacity: 0; transform: translateY(100%); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes modalIn { /* neutralize desktop centering animation on mobile */
        from { opacity: 0; transform: translateY(30px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    .m-header { padding: 14px 18px; }
    .m-hero { height: 160px; }
    .m-body { padding: 18px 18px 14px; }
    .m-body h3 { font-size: 1.1rem; }
    .m-group { padding: 14px 16px; margin-bottom: 10px; }
    .m-foot {
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
        flex: 0 0 auto;
        box-shadow: 0 -8px 20px rgba(0,0,0,.06);
    }
    .m-foot-grid { margin-bottom: 10px; gap: 12px; }
    .m-foot-grid .m-col .v { font-size: 1.2rem; }
    .m-qty-input button { width: 34px; height: 34px; }
    .m-add { padding: 13px 18px; min-height: 48px; font-size: .96rem; }
}
@media (max-width: 420px) {
    .m-hero { height: 130px; }
    .m-body h3 { font-size: 1.05rem; }
    .m-desc { font-size: .86rem; margin-bottom: 14px; }
}
@media (max-height: 640px) and (max-width: 560px) {
    .m-hero { height: 100px; }
}

/* ══════════════════ HOURS MODAL (legacy btn) + HOURS SECTION ══════════════════ */
.rv2-hours-modal[hidden] { display: none; }
.rv2-hours-modal {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 120;
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
    animation: fadeIn .14s var(--ease);
}
.rv2-hours-card {
    width: 100%; max-width: 420px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r);
    padding: 22px 24px;
    box-shadow: var(--shadow-lg);
}
.rv2-hours-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--border); }
.rv2-hours-head h3 { font-size: 1.1rem; font-weight: 800; color: var(--ink-0); letter-spacing: -.01em; }
.rv2-hours-close {
    background: var(--bg); color: var(--ink-1);
    width: 32px; height: 32px; border-radius: 50%;
    font-size: 1.1rem; font-weight: 600;
    transition: all .12s var(--ease);
}
.rv2-hours-close:hover { background: var(--ink-0); color: #fff; }
.rv2-hours-list { list-style: none; display: flex; flex-direction: column; gap: 2px; }
.rv2-hours-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 4px; border-bottom: 1px solid var(--border); font-size: .92rem; color: var(--ink-2); }
.rv2-hours-row:last-child { border-bottom: none; }
.rv2-hours-row.today { font-weight: 800; color: var(--ink-0); }
.rv2-hours-row.closed .rv2-hours-ranges { color: var(--ink-3); font-style: italic; }
.rv2-hours-day { font-weight: inherit; }
.rv2-hours-ranges { font-variant-numeric: tabular-nums; font-weight: 500; }
.rv2-hours-row.today .rv2-hours-ranges { font-weight: 800; }

/* Inline hours section (on the page) */
.rv2-hours-section {
    max-width: 560px; margin: 0 auto;
    padding: 40px 30px;
    text-align: center;
}
.rv2-hours-section h3 {
    font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em;
    margin-bottom: 20px; color: var(--ink-0);
}
.rv2-hours-section ul { list-style: none; text-align: left; }
.rv2-hours-section li {
    display: flex; justify-content: space-between; align-items: center;
    padding: 12px 2px;
    border-bottom: 1px solid rgba(0,0,0,.06);
    font-size: .96rem;
    color: var(--ink-2);
}
.rv2-hours-section li:last-child { border-bottom: none; }
.rv2-hours-section li span:last-child { font-variant-numeric: tabular-nums; font-weight: 500; }
.rv2-hours-section li.today { font-weight: 800; color: var(--ink-0); }
.rv2-hours-section li.today span:last-child { font-weight: 800; }
.rv2-hours-section li.closed span:last-child { font-style: italic; color: var(--ink-3); }

/* ══════════════════ OWNER PITCH + FOOTER ══════════════════ */
.rv2-owner-pitch {
    position: relative; z-index: 1;
    max-width: 640px; margin: 40px auto 0;
    padding: 28px 28px 30px;
    text-align: center;
    background: linear-gradient(135deg, #fff, var(--brand-soft));
    border: 1px solid rgba(192,57,43,.18);
    border-radius: 20px;
    box-shadow: var(--shadow-sm);
}
.rv2-owner-pitch h3 {
    font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em;
    color: var(--ink-0); margin-bottom: 8px;
}
.rv2-owner-pitch p { color: var(--ink-2); font-size: .96rem; line-height: 1.55; margin-bottom: 16px; }
.rv2-owner-cta {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 11px 22px; border-radius: 999px;
    background: var(--brand); color: #fff;
    font-size: .9rem; font-weight: 700; letter-spacing: -.005em;
    text-decoration: none;
    transition: all .15s var(--ease);
    box-shadow: 0 6px 18px rgba(192,57,43,.28);
}
.rv2-owner-cta:hover { background: var(--brand-dark); transform: translateY(-1px); box-shadow: 0 10px 24px rgba(192,57,43,.4); }

.rv2-site-foot {
    display: flex; flex-direction: column; align-items: center; gap: 14px;
    color: var(--ink-2); font-size: .88rem;
    padding: 30px 20px 40px;
    text-align: center;
    border-top: 1px solid rgba(0,0,0,.06);
    margin-top: 32px;
}
.rv2-site-foot b { color: var(--ink-0); font-weight: 800; letter-spacing: .08em; }
.rv2-foot-brand-row { display: inline-flex; align-items: center; gap: 10px; }
.rv2-foot-brand { display: inline-flex; align-items: center; transition: opacity .15s var(--ease); }
.rv2-foot-brand:hover { opacity: .7; }
.rv2-foot-brand img { height: 36px; width: auto; max-width: 180px; object-fit: contain; }
.rv2-foot-links {
    display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: 8px 12px;
    font-size: .82rem;
}
.rv2-foot-links a { color: var(--ink-2); text-decoration: none; transition: color .12s var(--ease); font-weight: 500; }
.rv2-foot-links a:hover { color: var(--ink-0); text-decoration: underline; }
.rv2-foot-links span { color: var(--ink-3); }
@media (max-width: 560px) {
    .rv2-owner-pitch { margin: 28px 14px 0; padding: 22px 20px 24px; }
    .rv2-owner-pitch h3 { font-size: 1.15rem; }
    .rv2-owner-pitch p { font-size: .88rem; }
    .rv2-foot-links { font-size: .76rem; gap: 6px 10px; }
}

/* ══════════════════ RESPONSIVE ══════════════════ */
@media (max-width: 1280px) {
    .rv2-rest-name { font-size: 2.8rem; }
}
@media (max-width: 1024px) {
    #rv2-layout { grid-template-columns: minmax(0, 1fr); }

    /* Mobile/tablet: cart is ALWAYS a fixed bottom sheet */
    #rv2-cart {
        position: fixed !important;
        left: 0; right: 0; bottom: 0;
        top: auto;
        max-height: 82vh; height: auto;
        width: auto;
        border-radius: 20px 20px 0 0;
        box-shadow: 0 -12px 40px rgba(0,0,0,.25);
        z-index: 60;
        transform: translateY(0);
        transition: transform .3s var(--ease);
    }
    /* Hidden state — slide the sheet off-screen (NOT display:none, so transition works) */
    body.cart-hidden #rv2-cart {
        display: flex !important;          /* override desktop display:none */
        transform: translateY(100%);
        pointer-events: none;
    }
    /* In viewing mode the cart is removed entirely */
    body.mode-viewing #rv2-cart { display: none !important; }

    /* Drag handle at top of the sheet */
    #rv2-cart::before {
        content: '';
        position: absolute; top: 8px; left: 50%;
        transform: translateX(-50%);
        width: 40px; height: 4px; border-radius: 2px;
        background: var(--border-2);
        z-index: 5;
    }

    /* Hide the small reopen pill — the fat bottom bar handles it on mobile */
    .rv2-cart-show { display: none !important; }
    /* Fat "Din bestilling" bar always visible when cart is collapsed AND has items */
    .rv2-cart-toggle {
        bottom: calc(14px + env(safe-area-inset-bottom));
        left: 12px; right: 12px;
        padding: 16px 20px;
        border-radius: 16px;
        background: var(--ink-0);
        animation: cartBarRise .28s cubic-bezier(.2,.8,.2,1);
    }
    body.cart-hidden .rv2-cart-toggle { display: flex !important; }
    body:not(.cart-hidden) .rv2-cart-toggle { display: none !important; }
    .rv2-cart-toggle[data-empty] { display: none !important; }
    @keyframes cartBarRise { from { transform: translateY(120%); } to { transform: translateY(0); } }
    .rv2-cart-toggle .ct-label::after { content: ' →'; }

    .rv2-rest-name { font-size: 2.4rem; }
    #rv2-grid { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
    #rv2-app { padding: 14px 14px 0; gap: 14px; }
    .rv2-top-inner { padding: 10px 14px; gap: 8px; }
    .rv2-top-pill span, .rv2-brand-name { display: none; }
    .rv2-brand-mark img { max-width: 140px; }
    .rv2-mode-btn { padding: 7px 14px; font-size: .8rem; }
    .rv2-identity-inner { padding: 22px 22px; }
    #rv2-identity { min-height: 340px; }
    .rv2-rest-name { font-size: 2rem; }
    .rv2-rest-desc { font-size: .94rem; }
    .cat-chip { padding: 10px 16px; font-size: .9rem; }
    .p-tile { grid-template-columns: minmax(0,1fr) 110px; padding: 14px; }
    .p-photo { width: 110px; height: 110px; }
    .p-ctl { top: 20px; right: 20px; }
    .p-ctl button { width: 32px; height: 32px; font-size: 1.2rem; }
}
@media (max-width: 560px) {
    .rv2-rest-name { font-size: 1.6rem; animation: none; }
    #rv2-identity { min-height: 260px; }
    .rv2-identity-inner { padding: 16px; }
    .p-tile { grid-template-columns: minmax(0,1fr) 96px; gap: 12px; padding: 12px; }
    .p-photo { width: 96px; height: 96px; border-radius: 12px; }
    .p-ctl { top: 8px; right: 8px; }
    .p-ctl button { width: 40px; height: 40px; font-size: 1.2rem; }
    .cart-hide { width: 40px; height: 40px; }
    .rv2-contact-link { max-width: 100%; flex-wrap: wrap; }
    /* Perf: kill extra living-light layers at small sizes */
    .rv2-aurora-2, .rv2-aurora-3, body::after { display: none; }
    /* Tracking stepper: tight layout for 5 steps on 375px */
    .v2-stepper { padding: 12px 0 8px; }
    .v2-stepper .step { gap: 4px; }
    .v2-stepper .step-dot { width: 34px; height: 34px; font-size: .9rem; }
    .v2-stepper .step-label { font-size: .6rem; letter-spacing: 0; line-height: 1.15; }
    .v2-stepper .step-line { top: 17px; left: 50%; right: auto; width: calc(100% - 34px); }
    .v2-stepper .step:last-child .step-line { display: none; }
    /* Info rows already stack above; let chips wrap */
    .rv2-succ-row { flex-direction: column; max-width: 100%; }
    .rv2-succ-chip { width: 100%; justify-content: center; padding: 12px 18px; }
}
@media (max-width: 480px) {
    .v2-form-grid-2 { grid-template-columns: 1fr; }
    .v2-card { padding: 18px 16px; }
    .v2-page { padding: 20px 12px; }
    .v2-page-plaque h1 { font-size: 1.4rem; }
}

/* Scrollbars */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-2); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--ink-3); }

/* Animations */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp {
    from { transform: translateX(-50%) translateY(100%); }
    to { transform: translateX(-50%) translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.96); }
    to { opacity: 1; transform: scale(1); }
}

/* ══════════════════ SANDBOX PAGES (checkout / success / track) ══════════════════ */
.v2-page {
    min-height: 100vh; padding: 30px 16px;
    max-width: 820px; margin: 0 auto;
}
.v2-page-head { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 24px; text-align: center; }
.v2-page-plaque h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 800; font-size: 1.8rem;
    color: var(--ink-0); letter-spacing: -.025em; line-height: 1.1;
}
.v2-page-sub { font-size: .78rem; color: var(--ink-2); letter-spacing: .08em; text-transform: uppercase; font-weight: 600; }
.v2-back {
    font-size: .84rem; color: var(--ink-1); font-weight: 600;
    background: var(--surface); padding: 8px 16px; border-radius: 999px;
    border: 1px solid var(--border);
    transition: all .12s var(--ease);
}
.v2-back:hover { background: var(--bg); color: var(--ink-0); }

.v2-page-main { display: flex; flex-direction: column; gap: 14px; }
.v2-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--r); padding: 22px 24px;
    box-shadow: var(--shadow-sm);
}
.v2-card h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700; font-size: 1rem;
    color: var(--ink-0); letter-spacing: .02em;
    text-transform: uppercase;
    margin-bottom: 14px; padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
}

.v2-form-row { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.v2-form-row label { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
.v2-input {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--ink-0);
    font-size: .94rem; font-weight: 500;
    outline: none;
    transition: all .12s var(--ease);
    font-family: inherit;
    min-width: 0;
}
.v2-input:focus { border-color: var(--brand); background: var(--surface); box-shadow: 0 0 0 3px var(--brand-soft); }

.v2-pay-row {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--r);
    padding: 22px 24px;
    display: flex; flex-direction: column; gap: 10px;
    box-shadow: var(--shadow-sm);
}
.v2-pay-row .cart-lcd { margin: 0; }

/* ── Checkout page layout ───────────────────────────────── */
.rv2-checkout-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 20px; max-width: 1100px; margin: 0 auto; align-items: start; }
.rv2-checkout-left { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.rv2-checkout-right { position: sticky; top: 90px; }
.rv2-step-n {
    display: inline-flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; border-radius: 50%;
    background: var(--brand); color: #fff;
    font-size: .78rem; font-weight: 800;
    margin-right: 10px;
}
.v2-card h2 { display: flex; align-items: center; font-size: 1rem; }
.v2-form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.v2-form-grid-2 > .v2-form-row { min-width: 0; margin-bottom: 0; }
.v2-form-row { min-width: 0; }
/* Scheduled pickup/delivery time block */
.rv2-sched {
    display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
    margin-top: 4px;
}
.rv2-sched-toggle {
    display: flex; gap: 8px; margin-bottom: 14px;
    background: var(--bg); padding: 4px; border-radius: 10px;
}
.rv2-sched-btn {
    flex: 1; padding: 10px 12px;
    background: transparent; border: none; border-radius: 8px;
    font-size: .86rem; font-weight: 600; color: var(--ink-2);
    cursor: pointer; transition: all .12s var(--ease);
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.rv2-sched-btn:hover { color: var(--ink-0); }
.rv2-sched-btn.on { background: var(--surface); color: var(--ink-0); box-shadow: var(--shadow-sm); font-weight: 700; }
.rv2-sched-btn .ic { font-size: 1rem; }
.rv2-sched-fields[hidden] { display: none; }
.rv2-sched-hint {
    font-size: .78rem; color: var(--ink-2);
    margin-top: 8px; padding: 10px 12px;
    background: var(--brand-soft);
    border-radius: 8px;
    display: flex; align-items: center; gap: 8px;
}
.rv2-sched-hint::before { content: '⏱'; font-size: 1rem; }
@media (max-width: 480px) { .rv2-sched { grid-template-columns: 1fr; } }

/* Expedition toggle on checkout */
.rv2-exp-toggle {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px;
    background: var(--bg); padding: 4px; border-radius: 12px;
}
.rv2-exp-btn {
    padding: 12px 14px;
    background: transparent; border: none; border-radius: 10px;
    font-size: .9rem; font-weight: 600; color: var(--ink-2);
    cursor: pointer; transition: all .12s var(--ease);
    display: flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 48px;
}
.rv2-exp-btn:hover { color: var(--ink-0); }
.rv2-exp-btn.on { background: var(--surface); color: var(--ink-0); box-shadow: var(--shadow-sm); font-weight: 700; }
.rv2-exp-btn .ic { font-size: 1.1rem; }

/* "Legg til mer" link beside section heading */
.rv2-addmore {
    margin-left: auto;
    font-size: .78rem; font-weight: 700; letter-spacing: 0;
    color: var(--brand); text-decoration: none;
    text-transform: none;
    padding: 4px 10px; border-radius: 999px;
    transition: all .12s var(--ease);
}
.rv2-addmore:hover { background: var(--brand-soft); }

/* Editable order lines */
.rv2-edit-lines { display: flex; flex-direction: column; gap: 4px; padding: 4px 0 10px; }
.rv2-edit-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    gap: 14px; align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}
.rv2-edit-line:last-child { border-bottom: none; }
.rv2-edit-line .rel-info { min-width: 0; }
.rv2-edit-line .rel-name { font-weight: 700; font-size: .96rem; color: var(--ink-0); letter-spacing: -.005em; }
.rv2-edit-line .rel-meta { font-size: .76rem; color: var(--ink-2); margin-top: 2px; }
.rv2-edit-line .rel-qty {
    display: inline-flex; align-items: center; gap: 2px;
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 10px; padding: 3px;
}
.rv2-edit-line .rel-qty button {
    width: 30px; height: 30px; border-radius: 7px;
    background: var(--surface); color: var(--ink-1);
    font-size: 1rem; font-weight: 700;
    border: 1px solid var(--border); cursor: pointer;
    transition: all .1s var(--ease);
}
.rv2-edit-line .rel-qty button:hover { background: var(--ink-0); color: #fff; border-color: var(--ink-0); }
.rv2-edit-line .rel-q { min-width: 24px; text-align: center; font-weight: 800; font-size: .94rem; font-variant-numeric: tabular-nums; }
.rv2-edit-line .rel-total { font-weight: 700; color: var(--ink-0); font-variant-numeric: tabular-nums; font-size: .96rem; min-width: 70px; text-align: right; }
.rv2-edit-line .rel-rm {
    width: 28px; height: 28px; border-radius: 50%;
    background: transparent; color: var(--ink-3);
    border: none; font-size: .82rem;
    cursor: pointer; transition: all .12s var(--ease);
}
.rv2-edit-line .rel-rm:hover { background: var(--brand-soft); color: var(--brand); }
@media (max-width: 560px) {
    .rv2-edit-line { grid-template-columns: minmax(0,1fr) auto; grid-auto-rows: auto; row-gap: 6px; padding: 10px 0; }
    .rv2-edit-line .rel-info { grid-column: 1 / -1; padding-right: 30px; position: relative; }
    .rv2-edit-line .rel-rm { position: absolute; top: -2px; right: 0; }
    .rv2-edit-line .rel-qty { justify-self: start; }
    .rv2-edit-line .rel-total { justify-self: end; }
}

/* Required-field marker */
.v2-form-row label .req { color: var(--brand); margin-left: 2px; font-weight: 800; }

/* Coupon / kupong — own card with gentle brand accent so users notice it */
.rv2-coupon-card {
    border: 1px solid rgba(192,57,43,.22);
    background: linear-gradient(135deg, #fff, var(--brand-soft) 280%);
}
.rv2-coupon-card h2 { border-bottom-color: rgba(192,57,43,.15); }
.rv2-opt { color: var(--ink-3); font-weight: 500; font-size: .72rem; margin-left: 8px; text-transform: none; letter-spacing: 0; }
.rv2-coupon-help { color: var(--ink-2); font-size: .9rem; margin-bottom: 10px; line-height: 1.5; }
.rv2-coupon-inline { display: flex; gap: 8px; }
.rv2-coupon-inline .v2-input { flex: 1; text-transform: uppercase; letter-spacing: .04em; }
.rv2-coupon-btn {
    padding: 0 18px; height: 48px;
    background: var(--ink-0); color: #fff;
    border: none; border-radius: 10px;
    font-weight: 700; font-size: .9rem; letter-spacing: -.005em;
    cursor: pointer; transition: all .12s var(--ease);
}
.rv2-coupon-btn:hover { background: var(--brand); }
.rv2-coupon-status { font-size: .82rem; margin-top: 6px; font-weight: 600; }
.rv2-coupon-status.ok  { color: #16a34a; }
.rv2-coupon-status.err { color: var(--brand); }

/* Disclaimer links */
.rv2-pay-disclaimer a { color: var(--ink-1); text-decoration: underline; font-weight: 600; }
.rv2-pay-disclaimer a:hover { color: var(--brand); }

/* Native <select> — slot picker */
select.v2-input {
    appearance: none; -webkit-appearance: none; -moz-appearance: none;
    padding-right: 42px;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--ink-2) 50%),
        linear-gradient(135deg, var(--ink-2) 50%, transparent 50%);
    background-position:
        calc(100% - 20px) 50%,
        calc(100% - 14px) 50%;
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
    cursor: pointer;
}
select.v2-input:focus {
    background-image:
        linear-gradient(45deg, transparent 50%, var(--brand) 50%),
        linear-gradient(135deg, var(--brand) 50%, transparent 50%);
}
.rv2-slot-select { font-weight: 600; font-variant-numeric: tabular-nums; }
.rv2-slot-select optgroup { font-weight: 800; color: var(--ink-2); letter-spacing: .02em; }
.rv2-slot-select option { font-weight: 500; color: var(--ink-0); padding: 4px 0; }
.rv2-slot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.rv2-slot-grid > .v2-form-row { margin-bottom: 0; min-width: 0; }
.rv2-slot-grid > .v2-form-row[hidden] { display: none; }
@media (max-width: 480px) { .rv2-slot-grid { grid-template-columns: 1fr; } }
.v2-form-row label small { color: var(--ink-3); font-weight: 500; font-size: .62rem; margin-left: 4px; text-transform: none; letter-spacing: 0; }
.v2-pay-methods { display: flex; gap: 6px; background: var(--bg); padding: 4px; border-radius: 10px; margin-bottom: 14px; }
.v2-pm-btn {
    flex: 1; padding: 10px 8px;
    background: transparent; border: none; border-radius: 8px;
    font-size: .86rem; font-weight: 600; color: var(--ink-2);
    cursor: pointer; transition: all .12s var(--ease);
}
.v2-pm-btn:hover { color: var(--ink-0); }
.v2-pm-btn.on { background: var(--surface); color: var(--ink-0); box-shadow: var(--shadow-sm); font-weight: 700; }
.rv2-summary-title {
    font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
    color: var(--ink-2);
    padding-bottom: 12px; margin-bottom: 8px;
    border-bottom: 1px solid var(--border);
}
.rv2-summary-total {
    display: flex; justify-content: space-between;
    padding: 14px 0 14px; margin-top: 8px;
    border-top: 2px solid var(--ink-0);
    font-size: 1.4rem; font-weight: 800; letter-spacing: -.02em;
}
.rv2-pay-disclaimer {
    font-size: .72rem; color: var(--ink-3);
    line-height: 1.4; text-align: center; margin-top: 10px;
}
@media (max-width: 860px) {
    .rv2-checkout-grid { grid-template-columns: 1fr; }
    .rv2-checkout-right { position: static; }
}

/* Horizontal secondary actions row under the success card */
.rv2-succ-row {
    max-width: 500px;
    margin: 20px auto 0;
    display: flex; flex-wrap: wrap; justify-content: center;
    gap: 8px;
}
.rv2-succ-chip {
    display: inline-flex; align-items: center;
    padding: 9px 18px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--ink-1);
    font-size: .82rem; font-weight: 600;
    text-decoration: none;
    transition: all .12s var(--ease);
    letter-spacing: -.005em;
}
.rv2-succ-chip:hover {
    background: var(--ink-0);
    color: #fff;
    border-color: var(--ink-0);
    transform: translateY(-1px);
}

/* Tracking page — info details grid */
.rv2-info-grid { display: flex; flex-direction: column; gap: 14px; }
.rv2-info-row {
    display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 14px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    align-items: start;
}
.rv2-info-row:last-child { border-bottom: none; padding-bottom: 0; }
.rv2-info-label {
    font-size: .7rem; font-weight: 800;
    letter-spacing: .12em; text-transform: uppercase;
    color: var(--ink-2);
}
.rv2-info-val { font-size: .94rem; color: var(--ink-0); line-height: 1.5; }
.rv2-info-val strong { font-weight: 700; }
.rv2-info-val a { color: var(--brand); text-decoration: none; font-weight: 600; }
.rv2-info-val a:hover { text-decoration: underline; }
@media (max-width: 560px) {
    .rv2-info-row { grid-template-columns: 1fr; gap: 4px; }
}

/* Secondary single-link style kept for legacy refs */
.v2-succ-link {
    display: inline-block; margin-top: 10px;
    font-size: .82rem; font-weight: 600; color: var(--ink-2);
    text-decoration: none; letter-spacing: -.005em;
}
.v2-succ-link:hover { color: var(--brand); }

.checkout-lines, .track-lines { display: flex; flex-direction: column; gap: 0; }
.checkout-empty { text-align: center; padding: 30px 10px; color: var(--ink-2); font-size: .92rem; }
.checkout-empty a { color: var(--brand); font-weight: 700; text-decoration: underline; }
.checkout-totals { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }

/* Success */
.v2-success { align-items: center; }
.v2-success-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--r);
    padding: 40px 32px 34px;
    text-align: center;
    max-width: 500px; margin: 40px auto;
    box-shadow: var(--shadow-md);
}
.v2-success-seal {
    width: 72px; height: 72px; border-radius: 50%;
    margin: 0 auto 20px;
    background: var(--brand); color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 10px 24px rgba(192,57,43,.35);
}
.v2-success-card h1 { font-weight: 800; font-size: 1.7rem; color: var(--ink-0); letter-spacing: -.025em; margin-bottom: 10px; }
.v2-success-sub { font-size: .94rem; color: var(--ink-2); line-height: 1.5; margin-bottom: 22px; }
.v2-success-sub b { color: var(--ink-0); font-weight: 700; }
.v2-success-number {
    padding: 14px 18px; margin: 0 auto 22px; max-width: 260px;
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 10px;
}
.v2-success-label { display: block; font-size: .62rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 4px; }
.v2-success-value { font-size: 1.6rem; font-weight: 800; color: var(--ink-0); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.v2-success-cta {
    display: inline-block; margin-bottom: 22px;
    padding: 12px 24px;
    background: var(--brand); color: #fff;
    border-radius: 12px;
    font-weight: 700; font-size: .92rem;
    letter-spacing: .01em;
    transition: all .12s var(--ease);
}
.v2-success-cta:hover { background: var(--brand-dark); transform: translateY(-1px); }
.v2-success-meta { display: flex; justify-content: space-around; padding-top: 18px; border-top: 1px solid var(--border); }
.v2-success-meta > div { display: flex; flex-direction: column; gap: 4px; }
.v2-success-meta .label { font-size: .64rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.v2-success-meta .value { font-weight: 700; color: var(--ink-0); font-size: 1.05rem; letter-spacing: -.01em; }

/* Stepper */
.v2-stepper { display: flex; align-items: center; justify-content: space-between; padding: 16px 0 14px; margin-bottom: 8px; position: relative; }
.v2-stepper .step { display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; flex: 1; z-index: 2; }
.v2-stepper .step-dot {
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--bg); border: 1px solid var(--border);
    color: var(--ink-3);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
    transition: all .2s var(--ease);
}
.v2-stepper .step.done .step-dot { background: var(--brand); border-color: var(--brand); color: #fff; }
.v2-stepper .step.current .step-dot { background: var(--ink-0); border-color: var(--ink-0); color: #fff; animation: stepPulse 1.8s ease-in-out infinite; }
@keyframes stepPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(192,57,43,.3); }
    50%      { box-shadow: 0 0 0 8px rgba(192,57,43,0); }
}
.v2-stepper .step-label { font-size: .72rem; font-weight: 600; letter-spacing: .03em; color: var(--ink-2); text-align: center; }
.v2-stepper .step.done .step-label, .v2-stepper .step.current .step-label { color: var(--ink-0); }
.v2-stepper .step-line { position: absolute; top: 20px; left: 50%; right: -50%; height: 2px; background: var(--border); z-index: -1; }
.v2-stepper .step-line.done { background: var(--brand); }
.v2-stepper-text { text-align: center; font-size: .92rem; font-weight: 500; color: var(--ink-1); padding: 12px 0 4px; }

.track-line { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--border); }
.track-line .tl-name { font-weight: 600; font-size: .96rem; color: var(--ink-0); }
.track-line .tl-meta { font-size: .74rem; color: var(--ink-2); margin-top: 2px; }
.track-line .tl-qty { font-weight: 700; color: var(--ink-1); min-width: 30px; text-align: center; font-variant-numeric: tabular-nums; }
.track-line .tl-total { font-weight: 700; color: var(--ink-0); min-width: 70px; text-align: right; font-variant-numeric: tabular-nums; font-size: .96rem; }
.track-total {
    display: flex; justify-content: space-between;
    padding-top: 14px; margin-top: 8px;
    border-top: 1px solid var(--border);
    font-size: 1.1rem; font-weight: 800; color: var(--ink-0); letter-spacing: -.015em;
}

/* ══════════════════ TRACKING: LIVE PILL + ETA + QUICK-ACTIONS + CHAT ══════════════════ */

/* Track page: slightly stronger living light than other flow pages */
/* Track page: stronger, livelier ambient light than other flow pages */
body.rv2-track .rv2-breath { opacity: .5; }
body.rv2-track .rv2-aurora-1, body.rv2-track .rv2-aurora-2 { opacity: .7; }
body.rv2-track .rv2-orb { opacity: .55; }

/* Gentle heartbeat of the whole page background — 12s breath cycle */
body.rv2-track::before,
body.rv2-track::after { animation-duration: 12s !important; opacity: .35 !important; }

/* Current step: a breathing halo + orbiting ring */
body.rv2-track .v2-stepper .step.current .step-dot {
    animation: stepPulseTrack 3.6s cubic-bezier(.42,0,.58,1) infinite;
    box-shadow: 0 0 0 0 rgba(192,57,43,.6);
}
body.rv2-track .v2-stepper .step.current { position: relative; }
body.rv2-track .v2-stepper .step.current::before {
    content: ''; position: absolute;
    top: 0; left: 50%;
    width: 60px; height: 60px;
    transform: translate(-50%, -10px);
    border-radius: 50%;
    border: 2px solid rgba(192,57,43,.28);
    animation: stepRing 3.6s cubic-bezier(.42,0,.58,1) infinite;
    pointer-events: none;
    z-index: 0;
}
body.rv2-track .v2-stepper .step.current::after {
    content: ''; position: absolute;
    top: 0; left: 50%;
    width: 60px; height: 60px;
    transform: translate(-50%, -10px);
    border-radius: 50%;
    border: 2px solid rgba(192,57,43,.18);
    animation: stepRing 3.6s cubic-bezier(.42,0,.58,1) 1.8s infinite;
    pointer-events: none;
    z-index: 0;
}
@keyframes stepPulseTrack {
    0%, 100% { box-shadow: 0 0 0 0 rgba(192,57,43,.6), 0 0 18px 4px rgba(192,57,43,.15); transform: scale(1); }
    50%      { box-shadow: 0 0 0 14px rgba(192,57,43,0), 0 0 28px 8px rgba(192,57,43,.3); transform: scale(1.06); }
}
@keyframes stepRing {
    0%   { transform: translate(-50%, -10px) scale(.6); opacity: .7; }
    100% { transform: translate(-50%, -10px) scale(1.9); opacity: 0; }
}

/* Icon in the current step: subtle float */
body.rv2-track .v2-stepper .step.current .step-dot span {
    display: inline-block;
    animation: stepIconFloat 3.6s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes stepIconFloat {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-2px); }
}

/* Done step-lines: static brand color, no flow animation */
body.rv2-track .v2-stepper .step-line.done { background: var(--brand); }

/* The first card (stepper) gets a faint breathing glow */
body.rv2-track .v2-page-main > .v2-card:first-of-type {
    position: relative;
    animation: cardBreath 12s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes cardBreath {
    0%, 100% { box-shadow: var(--shadow-sm); }
    50%      { box-shadow: 0 4px 28px rgba(192,57,43,.14), 0 0 0 1px rgba(192,57,43,.08); }
}

/* ETA: stronger heartbeat — 3 ripples + background shimmer + number shimmer */
body.rv2-track .rv2-eta-card {
    background:
        radial-gradient(circle at 18% 50%, rgba(192,57,43,.12) 0%, transparent 55%),
        linear-gradient(135deg, #fff 0%, var(--brand-soft) 160%);
    animation: etaCardBreath 6s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes etaCardBreath {
    0%, 100% { box-shadow: var(--shadow-sm); }
    50%      { box-shadow: 0 10px 40px rgba(192,57,43,.22), 0 0 0 1px rgba(192,57,43,.15); }
}
body.rv2-track .rv2-eta-pulse span { animation-duration: 6s !important; }
body.rv2-track .rv2-eta-pulse span:nth-child(2) { animation-delay: 2s !important; }
body.rv2-track .rv2-eta-pulse span:nth-child(3) { animation-delay: 4s !important; }
body.rv2-track .rv2-eta-clock-wrap {
    animation: etaClockBreath 3.6s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes etaClockBreath {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-2px) scale(1.04); }
}
body.rv2-track .rv2-eta-clock { filter: drop-shadow(0 8px 22px rgba(192,57,43,.35)); }
@keyframes etaIconFloat {
    0%, 100% { transform: translateY(0) scale(1);   filter: drop-shadow(0 0 10px rgba(192,57,43,.4)); }
    50%      { transform: translateY(-3px) scale(1.08); filter: drop-shadow(0 0 18px rgba(192,57,43,.6)); }
}

/* ETA time number — subtle shimmer sweep */
body.rv2-track .rv2-eta-time {
    background: linear-gradient(90deg, var(--ink-0) 0%, var(--ink-0) 40%, var(--brand) 50%, var(--ink-0) 60%, var(--ink-0) 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: etaShimmer 6s linear infinite;
}
@keyframes etaShimmer {
    0%   { background-position:  100% 0; }
    100% { background-position: -100% 0; }
}

/* Live pill: stronger pulse on the green dot + halo */
body.rv2-track .rv2-live-pill { position: relative; overflow: visible; }
body.rv2-track .rv2-live-dot {
    animation: liveDotStrong 2.2s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes liveDotStrong {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,.7), 0 0 8px 2px rgba(34,197,94,.4); transform: scale(1); }
    50%      { box-shadow: 0 0 0 10px rgba(34,197,94,0), 0 0 16px 6px rgba(34,197,94,.6); transform: scale(1.18); }
}

/* Quick-action buttons: idle breathing + stagger */
body.rv2-track .rv2-qa {
    animation: qaBreath 12s cubic-bezier(.42,0,.58,1) infinite;
}
body.rv2-track .rv2-qa:nth-child(2) { animation-delay: -4s; }
body.rv2-track .rv2-qa:nth-child(3) { animation-delay: -8s; }
@keyframes qaBreath {
    0%, 100% { transform: translateY(0);    box-shadow: var(--shadow-sm); }
    50%      { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,.08); }
}

/* Chat FAB: stronger breath + subtle rotation */
body.rv2-track .rv2-chat-fab {
    animation: fabBreathStrong 4.4s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes fabBreathStrong {
    0%, 100% { box-shadow: 0 8px 24px rgba(192,57,43,.45), 0 0 0 0 rgba(192,57,43,.55); transform: scale(1); }
    50%      { box-shadow: 0 12px 36px rgba(192,57,43,.65), 0 0 0 16px rgba(192,57,43,0); transform: scale(1.06); }
}
body.rv2-track .rv2-chat-fab .rv2-chat-fab-ic {
    display: inline-block;
    animation: fabIconWag 4.4s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes fabIconWag {
    0%, 100% { transform: rotate(-6deg); }
    50%      { transform: rotate(6deg); }
}

/* Done-step dots: static (no traveling glow pulse) */

/* Done step-line: solid brand color, no traveling animation */

/* Track page cards: subtle stagger on load */
body.rv2-track .v2-page-main > .v2-card { animation: cardRise .5s cubic-bezier(.2,.8,.2,1) backwards; }
body.rv2-track .v2-page-main > .v2-card:nth-of-type(1) { animation-delay:  .04s; }
body.rv2-track .v2-page-main > .v2-card:nth-of-type(2) { animation-delay:  .10s; }
body.rv2-track .v2-page-main > .v2-card:nth-of-type(3) { animation-delay:  .18s; }
body.rv2-track .v2-page-main > .v2-card:nth-of-type(4) { animation-delay:  .26s; }
@keyframes cardRise {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Respect user setting */
@media (prefers-reduced-motion: reduce) {
    body.rv2-track *,
    body.rv2-track *::before,
    body.rv2-track *::after { animation: none !important; }
}

/* ══════════════════ DESKTOP SPACING — breathe on wide screens ══════════════════ */
@media (min-width: 900px) {
    .v2-page { max-width: 1180px; padding: 48px 40px; }
    .v2-page-head { gap: 14px; margin-bottom: 36px; }
    .v2-page-plaque h1 { font-size: 2.4rem; }
    .v2-page-main { gap: 22px; }
    .v2-card { padding: 30px 32px; }
    .v2-card h2 { margin-bottom: 20px; padding-bottom: 14px; font-size: 1.05rem; }

    /* Tracking — 2-col grid: stepper spans full, ETA + actions side-by-side, items + details side-by-side */
    body.rv2-track .v2-page-main {
        display: grid;
        grid-template-columns: 1.3fr 1fr;
        gap: 22px;
        align-items: start;
    }
    body.rv2-track .v2-page-main > .v2-card:first-of-type,   /* stepper */
    body.rv2-track .v2-page-main > .rv2-eta-card,            /* ETA */
    body.rv2-track .v2-page-main > .rv2-quick-actions,       /* quick actions */
    body.rv2-track .v2-page-main > .rv2-succ-row { grid-column: 1 / -1; }
    body.rv2-track .rv2-quick-actions { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
    body.rv2-track .rv2-qa { padding: 18px 16px; font-size: .94rem; min-height: 60px; }

    /* Stepper: wider, bigger dots, more label air */
    body.rv2-track .v2-stepper { padding: 28px 20px 22px; }
    body.rv2-track .v2-stepper .step-dot { width: 48px; height: 48px; font-size: 1.2rem; }
    body.rv2-track .v2-stepper .step-line { top: 24px; }
    body.rv2-track .v2-stepper .step-label { font-size: .78rem; margin-top: 4px; }
    body.rv2-track .v2-stepper-text { font-size: 1.02rem; padding: 18px 0 6px; }

    /* ETA card — bigger, room to breathe */
    body.rv2-track .rv2-eta-card { padding: 32px 36px; }
    body.rv2-track .rv2-eta-inner { gap: 26px; }
    body.rv2-track .rv2-eta-clock-wrap { width: 128px; height: 128px; flex-basis: 128px; }
    body.rv2-track .rv2-clock-num { font-size: 12px; }
    body.rv2-track .rv2-eta-time { font-size: 2.3rem; }
    body.rv2-track .rv2-eta-label { font-size: .74rem; margin-bottom: 6px; }
    body.rv2-track .rv2-eta-sub { font-size: .9rem; margin-top: 8px; }

    /* Info grid gets wider label column */
    .rv2-info-grid { gap: 18px; }
    .rv2-info-row { grid-template-columns: 180px minmax(0, 1fr); gap: 18px; padding: 14px 0; }
    .rv2-info-label { font-size: .74rem; }
    .rv2-info-val { font-size: 1rem; line-height: 1.6; }

    .track-line { padding: 16px 0; gap: 18px; }
    .track-line .tl-name { font-size: 1.02rem; }
    .track-total { padding-top: 20px; font-size: 1.2rem; }

    /* Succ-row action chips: bigger + more spacing */
    .rv2-succ-row { gap: 12px; max-width: 800px; margin-top: 10px; }
    .rv2-succ-chip { padding: 12px 22px; font-size: .88rem; }

    /* Checkout — give the left column real breathing room */
    .rv2-checkout-grid { max-width: 1180px; grid-template-columns: minmax(0, 1fr) 420px; gap: 30px; }
    .rv2-checkout-left { gap: 22px; }
    .rv2-checkout-right { top: 100px; }
    .v2-pay-row { padding: 30px 32px; gap: 14px; }
    .rv2-summary-total { font-size: 1.6rem; padding: 18px 0; }
    .v2-form-row { margin-bottom: 18px; }
    .v2-form-grid-2 { gap: 16px; }
    .v2-input { padding: 14px 16px; font-size: .98rem; }
    .v2-pay-methods { gap: 8px; padding: 5px; margin-bottom: 18px; }
    .v2-pm-btn { padding: 12px 10px; font-size: .92rem; }
    .rv2-exp-toggle { gap: 10px; padding: 5px; }
    .rv2-exp-btn { padding: 14px 16px; font-size: .95rem; min-height: 54px; }

    /* Editable lines — more air */
    .rv2-edit-line { padding: 16px 0; gap: 20px; }
    .rv2-edit-line .rel-name { font-size: 1rem; }

    /* Success page — wider card, more breathing */
    .v2-success-card { padding: 48px 56px 36px; }
    .v2-success-card h1 { font-size: 2.2rem; }
}

@media (min-width: 1200px) {
    .v2-page { padding: 60px 48px; }
    body.rv2-track .v2-page-main { gap: 26px; }
    body.rv2-track .rv2-eta-time { font-size: 2.6rem; }
}

/* Live pill with pulsing green dot */
.rv2-live-pill { display: inline-flex; align-items: center; gap: 8px; }
.rv2-live-dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 0 rgba(34,197,94,.6);
    animation: liveDot 2.6s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes liveDot {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,.6); transform: scale(1); }
    50%      { box-shadow: 0 0 0 7px rgba(34,197,94,0); transform: scale(1.12); }
}
@media (prefers-reduced-motion: reduce) { .rv2-live-dot { animation: none; } }

/* ETA card — the "heartbeat" of the page */
.rv2-eta-card {
    background: linear-gradient(135deg, #fff 0%, var(--brand-soft) 160%);
    border: 1px solid rgba(192,57,43,.18);
    padding: 22px 24px;
}
.rv2-eta-inner { display: flex; align-items: center; gap: 18px; }
.rv2-eta-pulse {
    width: 60px; height: 60px; flex: 0 0 60px;
    position: relative;
    display: flex; align-items: center; justify-content: center;
}
.rv2-eta-pulse span {
    position: absolute; inset: 0; border-radius: 50%;
    background: radial-gradient(circle, rgba(192,57,43,.7) 0%, rgba(192,57,43,0) 70%);
    animation: etaRipple 12s cubic-bezier(.42,0,.58,1) infinite;
}
.rv2-eta-pulse span:nth-child(2) { animation-delay: 4s; }
.rv2-eta-pulse span:nth-child(3) { animation-delay: 8s; }
@keyframes etaRipple {
    0%   { transform: scale(.4); opacity: .7; }
    70%  { transform: scale(1.4); opacity: 0; }
    100% { transform: scale(1.4); opacity: 0; }
}
/* Analog clock — real clock face with hour/minute hands pointing to estimated ready time */
.rv2-eta-clock-wrap {
    position: relative;
    width: 92px; height: 92px;
    flex: 0 0 92px;
    display: flex; align-items: center; justify-content: center;
}
.rv2-eta-clock {
    width: 100%; height: 100%;
    filter: drop-shadow(0 6px 16px rgba(192,57,43,.25));
}
.rv2-clock-num {
    font-family: 'Inter', sans-serif;
    font-size: 11px; font-weight: 800;
    fill: #1a1a1a;
    letter-spacing: -.02em;
}
.rv2-clock-mark {
    animation: rv2ClockMarkPulse 2s cubic-bezier(.42,0,.58,1) infinite;
    transform-origin: center; transform-box: fill-box;
}
@keyframes rv2ClockMarkPulse {
    0%, 100% { opacity: 1;  r: 3.2; }
    50%      { opacity: .5; r: 4.5; }
}
.rv2-eta-body { flex: 1; min-width: 0; }
.rv2-eta-label { font-size: .68rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--brand); margin-bottom: 2px; }
.rv2-eta-time { font-size: 1.8rem; font-weight: 800; color: var(--ink-0); letter-spacing: -.025em; line-height: 1.1; }
.rv2-eta-countdown { font-size: .9rem; font-weight: 600; color: var(--ink-2); letter-spacing: 0; }
.rv2-eta-sub { font-size: .82rem; color: var(--ink-2); margin-top: 4px; }
@media (prefers-reduced-motion: reduce) { .rv2-eta-pulse span { animation: none; opacity: .3; } }

/* Quick actions row */
.rv2-quick-actions {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
}
.rv2-quick-actions:has(> .rv2-qa:only-child)  { grid-template-columns: 1fr; }
.rv2-quick-actions:has(> .rv2-qa:nth-child(2):last-child) { grid-template-columns: 1fr 1fr; }
.rv2-qa {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    padding: 14px 10px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    color: var(--ink-0);
    font-size: .88rem; font-weight: 600;
    text-decoration: none;
    position: relative;
    box-shadow: var(--shadow-sm);
    transition: all .15s var(--ease);
    cursor: pointer;
    min-height: 48px;
}
.rv2-qa:hover { background: var(--bg); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.rv2-qa-ic { font-size: 1.15rem; }
.rv2-qa-lab { letter-spacing: -.005em; }
.rv2-qa-badge {
    position: absolute; top: -6px; right: -6px;
    min-width: 20px; height: 20px; padding: 0 5px;
    background: var(--brand); color: #fff;
    border-radius: 10px;
    font-size: .7rem; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
}
@media (max-width: 560px) {
    .rv2-quick-actions { grid-template-columns: 1fr 1fr 1fr; }
    .rv2-qa { flex-direction: column; gap: 4px; padding: 10px 6px; font-size: .74rem; }
    .rv2-qa-ic { font-size: 1.3rem; }
}

/* Chat FAB (floating) */
.rv2-chat-fab {
    position: fixed; right: 20px; bottom: 20px;
    width: 56px; height: 56px; border-radius: 50%;
    background: var(--brand); color: #fff; border: none;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 24px rgba(192,57,43,.4);
    cursor: pointer;
    z-index: 49;
    transition: all .2s var(--ease);
    animation: fabBreath 12s cubic-bezier(.42,0,.58,1) infinite;
}
.rv2-chat-fab:hover { transform: scale(1.06); }
.rv2-chat-fab.hidden { opacity: 0; pointer-events: none; transform: scale(.5); }
.rv2-chat-fab-ic { font-size: 1.4rem; }
.rv2-chat-fab-badge {
    position: absolute; top: -4px; right: -4px;
    min-width: 22px; height: 22px; padding: 0 6px;
    background: #fff; color: var(--brand);
    border-radius: 11px;
    font-size: .74rem; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    box-shadow: var(--shadow-sm);
}
@keyframes fabBreath {
    0%, 100% { box-shadow: 0 8px 24px rgba(192,57,43,.4), 0 0 0 0 rgba(192,57,43,.4); }
    50%      { box-shadow: 0 10px 30px rgba(192,57,43,.55), 0 0 0 12px rgba(192,57,43,0); }
}
@media (prefers-reduced-motion: reduce) { .rv2-chat-fab { animation: none; } }

/* Chat panel */
.rv2-chat {
    position: fixed; right: 20px; bottom: 86px;
    width: 360px; max-width: calc(100vw - 40px);
    height: 560px; max-height: calc(100vh - 120px);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: 0 20px 60px rgba(0,0,0,.2);
    display: flex; flex-direction: column;
    overflow: hidden;
    z-index: 50;
    opacity: 0; pointer-events: none;
    transform: translateY(20px) scale(.96);
    transition: opacity .2s var(--ease), transform .2s var(--ease);
}
.rv2-chat.on { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
.rv2-chat-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, #fff, var(--bg));
}
.rv2-chat-title { display: flex; align-items: center; gap: 10px; }
.rv2-chat-title strong { font-size: .96rem; color: var(--ink-0); font-weight: 700; display: block; }
.rv2-chat-sub { font-size: .74rem; color: var(--ink-2); }
.rv2-chat-dot {
    width: 10px; height: 10px; border-radius: 50%;
    background: #22c55e;
    animation: liveDot 2.6s cubic-bezier(.42,0,.58,1) infinite;
    flex: 0 0 10px;
}
.rv2-chat-close {
    width: 34px; height: 34px; border-radius: 50%;
    background: var(--bg); color: var(--ink-1);
    border: none; font-size: 1rem; cursor: pointer;
    transition: all .12s var(--ease);
}
.rv2-chat-close:hover { background: var(--ink-0); color: #fff; }
.rv2-chat-stream {
    flex: 1; overflow-y: auto;
    padding: 16px;
    display: flex; flex-direction: column; gap: 8px;
    background: var(--bg);
    scroll-behavior: smooth;
}
.rv2-chat-empty { text-align: center; color: var(--ink-3); font-size: .88rem; padding: 40px 20px; }
.rv2-chat-msg { display: flex; flex-direction: column; gap: 2px; max-width: 80%; }
.rv2-chat-msg.me { align-self: flex-end; align-items: flex-end; }
.rv2-chat-msg.them { align-self: flex-start; align-items: flex-start; }
.rv2-chat-bubble {
    padding: 9px 13px;
    border-radius: 16px;
    font-size: .92rem; line-height: 1.4;
    word-wrap: break-word; overflow-wrap: anywhere;
}
.rv2-chat-msg.me .rv2-chat-bubble {
    background: var(--brand); color: #fff;
    border-bottom-right-radius: 4px;
}
.rv2-chat-msg.them .rv2-chat-bubble {
    background: var(--surface); color: var(--ink-0);
    border: 1px solid var(--border);
    border-bottom-left-radius: 4px;
}
.rv2-chat-meta { font-size: .68rem; color: var(--ink-3); padding: 0 6px; }
.rv2-chat-form {
    display: flex; gap: 8px; padding: 12px;
    border-top: 1px solid var(--border);
    background: var(--surface);
}
.rv2-chat-input {
    flex: 1;
    padding: 11px 14px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 22px;
    font-size: .92rem;
    outline: none;
    transition: all .12s var(--ease);
    min-width: 0;
}
.rv2-chat-input:focus { border-color: var(--brand); background: var(--surface); box-shadow: 0 0 0 3px var(--brand-soft); }
.rv2-chat-send {
    width: 42px; height: 42px; border-radius: 50%;
    background: var(--brand); color: #fff; border: none;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: all .12s var(--ease);
    flex: 0 0 42px;
}
.rv2-chat-send:hover { background: var(--brand-dark); transform: scale(1.05); }
.rv2-chat-send svg { transform: translateX(-1px); }

@media (max-width: 560px) {
    .rv2-chat-fab { right: 16px; bottom: 16px; width: 52px; height: 52px; }
    .rv2-chat {
        right: 0; left: 0; bottom: 0;
        width: 100%; max-width: 100%;
        height: 85vh; max-height: 85vh;
        border-radius: 18px 18px 0 0;
    }
    .rv2-eta-time { font-size: 1.5rem; }
    .rv2-eta-countdown { display: block; margin-top: 2px; }
    .rv2-eta-card { padding: 18px; }
    .rv2-eta-inner { gap: 14px; }
    .rv2-eta-clock-wrap { width: 78px; height: 78px; flex-basis: 78px; }
}