/* Rada UI · components v1.0
   Needs rada-tokens.css. RTL-first; logical properties wherever direction matters.
   Motion: transform + opacity only, exits faster than entries, hover gated to fine pointers,
   keyboard-driven changes are instant (html[data-input=keyboard]). */

/* ───────── Base ───────── */
:root{
  /* Linen texture: fine grain + warp/weft threads in cypress at 1.2–2% – averages #f2f3f3 over #f5f5f5. */
  --r-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n' x='0' y='0'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .14 0 0 0 0 .34 0 0 0 0 .29 0 0 0 .14 -.068'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --r-weft:repeating-linear-gradient(0deg,#1164b404 0 1px,transparent 1px 3px);
  --r-warp:repeating-linear-gradient(90deg,#1164b403 0 1px,transparent 1px 4px);
  --r-texture:var(--r-grain),var(--r-weft),var(--r-warp);
}
.r-canvas{background-color:var(--canvas);background-image:var(--r-texture);background-size:220px 220px,auto,auto}
.r-root{font:400 14px/1.85 var(--font-sans);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.r-root *,.r-root *::before,.r-root *::after{box-sizing:border-box}
:where(.r-root) :where(button,input,select,textarea){font:inherit;color:inherit}
.r-root img{max-width:100%;height:auto}
.r-root svg.lucide{width:var(--icon-md);height:var(--icon-md);stroke-width:1.6;flex-shrink:0}
.r-root ::selection{background:var(--lime-200);color:var(--ink)}
.r-root :focus-visible{outline:3px solid var(--focus);outline-offset:4px}
.r-root [hidden]{display:none!important}
:where(body){margin:0}
:where(.r-root) :where(h1,h2,h3,h4,p,figure){margin:0}
:where(.r-root) :where(a){color:inherit}
.r-sr{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.r-ltr{direction:ltr;unicode-bidi:isolate}
.r-muted{color:var(--ink-muted)}
/* Skip link: the first focusable element of the page; above the viewport until it has focus (no motion: focus is a keyboard change). */
.r-skip{position:fixed;top:var(--space-2);inset-inline-start:var(--space-2);z-index:var(--z-overlay);display:inline-flex;align-items:center;min-height:var(--control-height);padding:0 var(--space-4);border-radius:var(--radius-md);background:var(--cypress);color:var(--on-cypress);font:500 14px/1.7 var(--font-sans);text-decoration:none;transform:translateY(calc(-100% - var(--space-4)))}
.r-skip:focus{transform:none;box-shadow:var(--shadow-float)}
.r-skip:focus-visible{outline-offset:2px}
@media print{.r-skip{display:none}}

/* ───────── Button ───────── */
.r-btn{--_bg:var(--surface);--_fg:var(--cypress);--_bd:var(--control);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  min-height:var(--control-height);padding:0 18px;border:1px solid var(--_bd);border-radius:var(--radius-md);
  background:var(--_bg);color:var(--_fg);font:500 14px/1.7 var(--font-sans);white-space:nowrap;text-decoration:none;cursor:pointer;
  user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color),border-color var(--duration-fast) var(--ease-color),color var(--duration-fast) var(--ease-color)}
.r-btn svg.lucide{width:18px;height:18px}
.r-btn--primary{--_bg:var(--cypress);--_fg:var(--on-cypress);--_bd:var(--cypress);box-shadow:var(--shadow-button)}
.r-btn--ghost{--_bg:transparent;--_bd:transparent}
.r-btn--lime{--_bg:var(--lime-200);--_fg:var(--ink);--_bd:transparent}
.r-btn--sm{min-height:var(--control-height-sm);padding:0 12px}
.r-btn--block{width:100%}
.r-btn:active:not(:disabled,[aria-disabled=true],[aria-busy=true]){transform:scale(.97)}
.r-btn:is(:disabled,[aria-disabled=true]){--_bg:var(--surface-sunken);--_fg:var(--ink-muted);--_bd:var(--line);box-shadow:none;cursor:not-allowed}
.r-btn__label{display:inline-flex;align-items:center;gap:var(--space-2);transition:opacity var(--duration-fast) var(--ease-out),filter var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}
.r-btn__spinner{position:absolute;inset:0;margin:auto;width:18px;height:18px;opacity:0;transform:scale(.8);filter:blur(2px);transition:inherit;transition-property:opacity,transform,filter}
.r-btn[aria-busy=true]{cursor:progress}
.r-btn[aria-busy=true] .r-btn__label,.r-btn .r-btn__label[data-swap=out]{opacity:0;filter:blur(2px);transform:scale(.96)}
.r-btn[aria-busy=true] .r-btn__spinner{opacity:1;transform:none;filter:none}
.r-spinner{animation:r-spin 720ms linear infinite}
.r-spinner circle{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-dasharray:38 100}
@keyframes r-spin{to{transform:rotate(360deg)}}

/* ───────── Icon button ───────── */
.r-icon-btn{position:relative;display:inline-grid;place-items:center;width:var(--control-height);height:var(--control-height);padding:0;flex-shrink:0;
  border:1px solid transparent;border-radius:var(--radius-md);background:transparent;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color),color var(--duration-fast) var(--ease-color),border-color var(--duration-fast) var(--ease-color)}
.r-icon-btn--outline{border-color:var(--line);background:var(--surface)}
.r-icon-btn--tint{border-color:var(--cypress);background:var(--tint);color:var(--cypress)}
.r-icon-btn--sm{width:var(--control-height-sm);height:var(--control-height-sm)}
.r-icon-btn--sm::before{content:'';position:absolute;inset:-4px}
.r-icon-btn--sm svg.lucide{width:var(--icon-sm);height:var(--icon-sm)}
.r-icon-btn:active:not(:disabled){transform:scale(.95)}
.r-icon-btn:disabled{color:var(--ink-muted);opacity:.55;cursor:not-allowed}
.r-fav svg.lucide{fill:currentColor;fill-opacity:0;transition:fill-opacity var(--duration-fast) var(--ease-color)}
.r-fav[aria-pressed=true]{color:var(--error);background:var(--error-soft);border-color:transparent}
.r-fav[aria-pressed=true] svg.lucide{fill-opacity:.18}

/* ───────── Link ───────── */
.r-link{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0;border:0;background:none;color:var(--cypress);font:500 14px/1.7 var(--font-sans);cursor:pointer;
  text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;text-decoration-thickness:1px;transition:text-decoration-color var(--duration-fast) var(--ease-color)}
.r-link svg.lucide{width:var(--icon-sm);height:var(--icon-sm);transition:transform var(--duration-base) var(--ease-out)}

/* ───────── Badge ───────── */
.r-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:1px 8px;border-radius:var(--radius-sm);background:var(--surface-sunken);color:var(--ink-muted);font:500 12px/1.9 var(--font-sans);white-space:nowrap}
.r-badge svg.lucide{width:13px;height:13px}
.r-badge--brand{background:var(--tint);color:var(--cypress)}
.r-badge--lime{background:var(--lime-400);color:var(--ink)}
.r-badge--sale{background:var(--sale-soft);color:var(--sale)}
.r-badge--success{background:var(--success-soft);color:var(--success)}
.r-badge--warning{background:var(--warning-soft);color:var(--warning)}
.r-badge--error{background:var(--error-soft);color:var(--error)}
.r-badge--info{background:var(--info-soft);color:var(--info)}
.r-count{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:5px;background:var(--lime-200);color:var(--ink);font:600 11px/1 var(--font-sans)}

/* ───────── Filter chip ───────── */
.r-chips{display:flex;flex-wrap:wrap;gap:6px}
.r-chip{display:inline-flex;align-items:center;gap:var(--space-2);min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font:500 13px/1.7 var(--font-sans);cursor:pointer;
  transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color),border-color var(--duration-fast) var(--ease-color),color var(--duration-fast) var(--ease-color)}
.r-chip::before{content:'';width:8px;height:8px;border-radius:var(--radius-full);box-shadow:inset 0 0 0 1.5px var(--control);transition:box-shadow var(--duration-fast) var(--ease-out)}
.r-chip[aria-pressed=true]{background:var(--tint);border-color:var(--cypress);color:var(--cypress)}
.r-chip[aria-pressed=true]::before{box-shadow:inset 0 0 0 4px var(--cypress)}
.r-chip:active{transform:scale(.97)}
/* Chip as a link (category shortcuts): no underline, no selection dot. */
a.r-chip{text-decoration:none}
a.r-chip::before{content:none}
a.r-chip[aria-current=page]{background:var(--tint);border-color:var(--cypress);color:var(--cypress)}

/* ───────── Field ───────── */
.r-field{display:grid;gap:var(--space-2);min-width:0}
.r-label{font:500 14px/1.7 var(--font-sans);color:var(--ink)}
.r-label small{font-weight:400;color:var(--ink-muted);font-size:12px;margin-inline-start:6px}
.r-input-wrap{position:relative;display:block}
.r-input-wrap>svg.lucide{position:absolute;top:50%;right:13px;transform:translateY(-50%);width:18px;height:18px;color:var(--ink-muted);pointer-events:none}
.r-input,.r-select{width:100%;height:var(--control-height);padding:0 14px;border:1px solid var(--control);border-radius:var(--radius-md);background:var(--surface);color:var(--ink);font:400 16px/1.6 var(--font-sans);
  transition:border-color var(--duration-fast) var(--ease-color),box-shadow var(--duration-fast) var(--ease-color)}
.r-input-wrap>svg.lucide+.r-input{padding-right:42px}
textarea.r-input{height:auto;min-height:104px;padding:10px 14px;resize:vertical;line-height:1.85}
.r-input::placeholder{color:var(--ink-muted);opacity:1}
.r-input:focus,.r-select:focus{outline:none;border-color:var(--cypress);box-shadow:0 0 0 1px var(--cypress),0 0 0 5px var(--tint)}
.r-input[aria-invalid=true]{border-color:var(--error);box-shadow:0 0 0 1px var(--error)}
.r-input[aria-invalid=true]:focus{box-shadow:0 0 0 1px var(--error),0 0 0 5px var(--error-soft)}
.r-input:disabled{background:var(--surface-sunken);border-color:var(--line);color:var(--ink-muted)}
.r-help{display:flex;align-items:flex-start;gap:6px;min-height:22px;margin:0;font:400 12px/1.8 var(--font-sans);color:var(--ink-muted);transition:color var(--duration-fast) var(--ease-color)}
.r-help svg.lucide{width:15px;height:15px;margin-top:2px}
.r-help[data-tone=error]{color:var(--error)}
.r-help[data-tone=success]{color:var(--success)}
.r-help:has(>.r-swap:empty){min-height:0} /* an empty live help line takes no room; the message grows it */
.r-swap{display:inline-flex;align-items:flex-start;gap:6px;transition:opacity var(--duration-fast) var(--ease-out),filter var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}
.r-swap[data-swap=out]{opacity:0;filter:blur(2px);transform:translateY(-3px)}

/* Search */
.r-search .r-input{padding-right:42px;padding-left:44px}
.r-search .r-input::-webkit-search-cancel-button{display:none}
.r-search__clear{position:absolute;top:50%;left:4px;margin-top:-18px;opacity:0;transform:scale(.9);pointer-events:none;
  transition:opacity var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}
.r-search[data-filled] .r-search__clear{opacity:1;transform:none;pointer-events:auto}

/* Select */
.r-select-wrap{position:relative;display:block}
.r-select{appearance:none;-webkit-appearance:none;padding-left:40px;font-size:14px;cursor:pointer}
.r-select-wrap>svg.lucide{position:absolute;top:50%;left:13px;transform:translateY(-50%);width:16px;height:16px;color:var(--ink-muted);pointer-events:none}

/* ───────── Checkbox & radio ───────── */
.r-check,.r-radio{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:var(--control-height);cursor:pointer;font:400 14px/1.7 var(--font-sans)}
.r-check>input,.r-radio>input{position:absolute;opacity:0;width:20px;height:20px;margin:0;cursor:pointer}
.r-check__box,.r-radio__dot{position:relative;display:grid;place-items:center;width:20px;height:20px;flex-shrink:0;border:1.5px solid var(--control);background:var(--surface);
  transition:background-color var(--duration-fast) var(--ease-color),border-color var(--duration-fast) var(--ease-color),transform var(--duration-press) var(--ease-out)}
.r-check__box{border-radius:5px}
.r-check__box svg{width:14px;height:14px;fill:none;stroke:var(--on-cypress);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:16;transition:stroke-dashoffset var(--duration-base) var(--ease-out)}
.r-check>input:checked+.r-check__box{background:var(--cypress);border-color:var(--cypress)}
.r-check>input:checked+.r-check__box svg{stroke-dashoffset:0;transition-delay:40ms}
.r-radio__dot{border-radius:var(--radius-full)}
.r-radio__dot::after{content:'';width:10px;height:10px;border-radius:var(--radius-full);background:var(--cypress);transform:scale(0.4);opacity:0;transition:transform var(--duration-spring) var(--ease-spring),opacity var(--duration-fast) var(--ease-out)}
.r-radio>input:checked+.r-radio__dot{border-color:var(--cypress)}
.r-radio>input:checked+.r-radio__dot::after{transform:none;opacity:1}
.r-check:active .r-check__box,.r-radio:active .r-radio__dot{transform:scale(.92)}
.r-check>input:focus-visible+.r-check__box,.r-radio>input:focus-visible+.r-radio__dot{outline:3px solid var(--focus);outline-offset:3px}
.r-check>input:disabled~*,.r-radio>input:disabled~*{opacity:.5;cursor:not-allowed}

/* ───────── Switch ───────── */
.r-switch{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:var(--control-height);cursor:pointer;font:400 14px/1.7 var(--font-sans)}
.r-switch>input{position:absolute;opacity:0;inset-inline-start:0;width:40px;height:24px;margin:0;cursor:pointer}
.r-switch__track{position:relative;width:40px;height:24px;flex-shrink:0;border-radius:var(--radius-sm);background:var(--surface-sunken);box-shadow:inset 0 0 0 1px var(--control);transition:background-color var(--duration-fast) var(--ease-color),box-shadow var(--duration-fast) var(--ease-color)}
.r-switch__track::after{content:'';position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:4px;background:var(--surface);box-shadow:0 1px 2px #1932282e;transition:transform var(--duration-spring) var(--ease-spring)}
.r-switch>input:checked+.r-switch__track{background:var(--cypress);box-shadow:inset 0 0 0 1px var(--cypress)}
.r-switch>input:checked+.r-switch__track::after{transform:translateX(-16px)}
.r-switch:active .r-switch__track::after{transform:scale(.9)}
.r-switch:active>input:checked+.r-switch__track::after{transform:translateX(-16px) scale(.9)}
.r-switch>input:focus-visible+.r-switch__track{outline:3px solid var(--focus);outline-offset:4px}

/* ───────── Quantity ───────── */
.r-qty{display:inline-flex;align-items:center;direction:ltr;border:1px solid var(--control);border-radius:var(--radius-md);background:var(--surface);overflow:hidden}
.r-qty>button{display:grid;place-items:center;width:42px;height:42px;padding:0;border:0;background:none;color:var(--cypress);cursor:pointer;transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color)}
.r-qty>button svg.lucide{width:16px;height:16px}
.r-qty>button:active:not(:disabled){transform:scale(.9)}
.r-qty>button:disabled{color:var(--ink-muted);opacity:.5;cursor:not-allowed}
.r-qty>output{position:relative;display:grid;place-items:center;width:34px;height:42px;overflow:hidden;font:600 14px/1 var(--font-sans);direction:rtl}
.r-qty>output>span{grid-area:1/1}
.r-qty--sm>button{width:32px;height:34px}.r-qty--sm>output{width:28px;height:34px}
.r-qty--sm{gap:0;padding:0;border-color:transparent;border-radius:var(--radius-full);background:var(--canvas)}
.r-qty--sm>button{width:28px;height:28px;border-radius:var(--radius-full)}
.r-qty--sm>button svg.lucide{width:14px;height:14px}
.r-qty--sm>output{width:20px;height:28px;font-size:13px;font-weight:500}
.r-qty--sm>button:disabled{opacity:.35}

/* ───────── Option picker (size) ───────── */
.r-options{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.r-option{position:relative;display:grid;place-items:center;min-width:var(--control-height);height:var(--control-height);padding:0 10px;border:1px solid var(--control);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font:500 13px/1 var(--font-sans);cursor:pointer;
  transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color),color var(--duration-fast) var(--ease-color),border-color var(--duration-fast) var(--ease-color)}
.r-option[aria-pressed=true]{background:var(--cypress);border-color:var(--cypress);color:var(--on-cypress)}
.r-option:active:not(:disabled){transform:scale(.95)}
.r-option:disabled{border-color:var(--line);background:var(--canvas);color:var(--ink-muted);cursor:not-allowed;
  background-image:linear-gradient(to top left,transparent calc(50% - .5px),var(--line) calc(50% - .5px),var(--line) calc(50% + .5px),transparent calc(50% + .5px))}

/* ───────── Color swatch ───────── */
.r-swatches{display:flex;flex-wrap:wrap;gap:2px}
.r-swatch{position:relative;display:grid;place-items:center;width:var(--control-height);height:var(--control-height);padding:0;border:0;background:none;cursor:pointer;border-radius:var(--radius-full)}
.r-swatch>span{width:30px;height:30px;border-radius:var(--radius-full);background:var(--c);box-shadow:inset 0 0 0 1px #25332e1f,0 0 0 2px var(--surface),0 0 0 2px transparent;
  transition:box-shadow var(--duration-base) var(--ease-out),transform var(--duration-press) var(--ease-out)}
.r-swatch[aria-pressed=true]>span{box-shadow:inset 0 0 0 1px #25332e1f,0 0 0 3px var(--surface),0 0 0 5px var(--cypress)}
.r-swatch:active>span{transform:scale(.92)}
.r-swatch:disabled{cursor:not-allowed}
.r-swatch:disabled>span{opacity:.45;background-image:linear-gradient(to top left,transparent calc(50% - 1px),var(--ink) calc(50% - 1px),var(--ink) calc(50% + 1px),transparent calc(50% + 1px))}

/* ───────── Tabs (segmented, clip-path indicator) ───────── */
.r-tabs{position:relative;display:inline-block;max-width:100%;overflow-x:auto;scrollbar-width:none;padding:4px;border-radius:var(--radius-md);background:var(--surface-sunken)}
.r-tabs__list{display:flex;gap:0}
.r-tabs__list>*{display:inline-grid;place-items:center;min-height:40px;padding:0 16px;border:0;border-radius:var(--radius-sm);background:none;color:var(--ink-muted);font:600 14px/1.7 var(--font-sans);white-space:nowrap;cursor:pointer}
.r-tabs__active{position:absolute;inset:4px;pointer-events:none;border-radius:var(--radius-sm);clip-path:inset(0 0 0 100% round var(--radius-sm));transition:clip-path var(--duration-base) var(--ease-in-out)}
.r-tabs__active .r-tabs__list{height:100%}
.r-tabs__active .r-tabs__list>*{background:var(--surface);color:var(--cypress);border-radius:0}
.r-tabs__active{filter:drop-shadow(0 1px 2px #1932281a)}
.r-tabs[data-instant] .r-tabs__active{transition:none}

/* ───────── Breadcrumb ───────── */
.r-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:0 0 calc(var(--space-8) - var(--space-3));padding:0;list-style:none;font:400 12px/1.8 var(--font-sans);color:var(--ink-muted)}
.r-crumbs a{color:inherit;text-decoration:none;padding:6px 2px}
.r-crumbs svg.lucide{width:14px;height:14px}
.r-crumbs [aria-current]{color:var(--ink);font-weight:500}

/* ───────── Store header ───────── */
.r-header{display:flex;align-items:center;gap:var(--space-6);min-height:72px;padding:var(--space-2) var(--space-6);background:var(--surface);border-bottom:1px solid var(--line)}
.r-wordmark{font:600 38px/1.2 var(--font-display);color:var(--cypress);text-decoration:none;padding:0;border:0;background:none}
.r-wordmark:has(>img){display:inline-flex;align-items:center;justify-self:start;min-height:var(--control-height)}
.r-wordmark>img{display:block;width:128px;height:auto}
@media(max-width:640px){.r-wordmark>img{width:104px}}
.r-nav{display:flex;gap:var(--space-6);flex:1;min-width:0}
.r-nav a{position:relative;display:inline-flex;align-items:center;min-height:var(--control-height);color:var(--ink);text-decoration:none;font:500 13px/1.7 var(--font-sans);white-space:nowrap}
.r-nav a::after{content:'';position:absolute;inset-inline:0;bottom:8px;height:2px;border-radius:2px;background:var(--lime-400);transform:scaleX(0);transform-origin:right;transition:transform var(--duration-base) var(--ease-out)}
.r-nav a[aria-current=page]::after{transform:none;background:var(--cypress)}
.r-header__tools{display:flex;gap:2px;margin-inline-start:auto}
.r-header__tools .r-count{position:absolute;top:2px;left:2px}

/* ───────── Price ───────── */
.r-price{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:2px 6px;font:600 16px/1.6 var(--font-sans);color:var(--ink)}
.r-price small{font:400 12px/1 var(--font-sans);color:var(--ink-muted)}
.r-price s{font:400 12px/1 var(--font-sans);color:var(--ink-muted)}
.r-price--lg{font-size:24px}

/* ───────── Product card ───────── */
/* A white card; the photo sits inset by --pad. The price is on a white tab carved out of the photo's bottom
   corner (concave corners from two radial-gradient pseudos), badges sit on the photo, the title and colour dots
   share one line under it. The title link is the one card link (its ::before stretches over the card). */
.r-products{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,200px));justify-content:start;gap:var(--space-4)}
.r-product{--pad:4px;--r-in:calc(var(--radius-lg) - var(--pad));position:relative;display:flex;flex-direction:column;min-width:0;padding:var(--pad);background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);isolation:isolate;-webkit-tap-highlight-color:transparent;transition:transform var(--duration-press) var(--ease-out)}
.r-product::after{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;box-shadow:var(--shadow-float);opacity:0;transition:opacity var(--duration-slow) var(--ease-out)}
.r-product:active:not(:has(.r-product__dots:active)){transform:scale(.98)}
.r-product:has(.r-product__title a:focus-visible){box-shadow:var(--shadow-soft),var(--focus-ring)}
.r-product__top{position:relative;overflow:hidden;border-radius:var(--r-in);background:var(--surface-sunken)}
.r-product__media{position:relative;display:block;aspect-ratio:4/5}
.r-product__media::after{content:'';position:absolute;inset:0;z-index:1;border-radius:var(--r-in);box-shadow:inset 0 0 16px rgb(0 0 0 / .17);pointer-events:none}
.r-product__img{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;transition:transform 700ms var(--ease-out)}
.r-product__img>img{display:block;width:100%;height:100%;object-fit:cover} /* an <img> in the slot fills it as .r-gallery__slide img does; set object-position inline for the focus point */
.r-product[data-stock=out] .r-product__media{opacity:.6;filter:grayscale(.6)}
.r-product__badge{position:absolute;top:8px;z-index:2;padding:3px 8px;border-radius:var(--radius-full);font:600 11px/1.5 var(--font-sans)}
.r-product__badge--pay{inset-inline-start:8px;background:var(--success-soft);color:var(--success)}
.r-product__badge--sale{inset-inline-end:8px;background:var(--sale-soft);color:var(--sale)}
.r-product__price{position:absolute;bottom:0;inset-inline-start:0;z-index:2;display:grid;justify-items:start;gap:1px;padding:8px 10px 0 14px;background:var(--surface);border-start-end-radius:var(--r-in)}
.r-product__price::before,.r-product__price::after{content:'';position:absolute;width:var(--r-in);height:var(--r-in);background:radial-gradient(circle at 0 0,transparent calc(var(--r-in) - .5px),var(--surface) var(--r-in))}
.r-product__price::before{bottom:100%;inset-inline-start:0}
.r-product__price::after{bottom:0;right:100%}
.r-product__now{display:inline-flex;align-items:center;gap:4px;font:600 16px/1.4 var(--font-display);color:var(--ink);white-space:nowrap}
.r-product__was{font:400 11px/1.4 var(--font-sans);color:var(--ink-muted);opacity:.55;text-decoration:line-through}
.r-product__out{font:500 12px/2 var(--font-sans);color:var(--ink-muted)}
.r-product__body{display:flex;flex-direction:column;gap:var(--space-2);padding:12px 10px 9px;flex:1}
.r-product__line{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}
.r-product__title{display:-webkit-box;min-width:0;min-height:3.6em;margin:0;overflow:hidden;font:500 13px/1.8 var(--font-sans);color:var(--ink);-webkit-box-orient:vertical;-webkit-line-clamp:2}
.r-product__title a{color:inherit;text-decoration:none;outline:none}
.r-product__title a::before{content:'';position:absolute;inset:0;z-index:1}
/* Colour dots: overlapped on touch screens, spread out with a tooltip (data-tooltip) where there is a mouse. */
.r-product__dots{position:relative;z-index:2;display:flex;align-items:center;flex-shrink:0;margin-inline-end:-2px}
.r-product__dot{display:grid;place-items:center;width:9px;height:23px}
.r-product__dot:last-of-type{width:14px}
.r-product__dot>span{flex-shrink:0;width:12px;height:12px;border-radius:var(--radius-full);background:var(--c);box-shadow:0 0 0 1.5px var(--surface),inset 0 0 0 1px color-mix(in srgb,var(--ink) 14%,transparent);transition:transform var(--duration-fast) var(--ease-out)}
.r-product__more{margin-inline-start:2px;font:400 11px/1 var(--font-sans);color:var(--ink-muted)}
/* Horizontal card (.r-product--row): the same card turned on its side. A clean 96px photo at the start; title and colour dots, then the price with its discount pill and the instalment tag beside it. No badges on the photo, no carved price tab. Group: .r-products--rows. */
.r-products.r-products--rows{grid-template-columns:minmax(0,1fr);justify-content:stretch;gap:var(--space-3)}
.r-product--row{flex-direction:row;align-items:stretch;gap:var(--space-3)}
.r-product--row .r-product__top{flex:0 0 96px;align-self:flex-start}
.r-product--row .r-product__media{aspect-ratio:4/5}
.r-product--row .r-product__body{min-width:0;justify-content:space-between;gap:var(--space-2);padding:var(--space-2) var(--space-2) var(--space-2) 0;padding-inline:0 var(--space-2)}
.r-product--row .r-product__line{flex-direction:column;gap:var(--space-1)}
.r-product--row .r-product__title{font-size:14px;line-height:1.7}
.r-product--row .r-product__dots{margin-inline-end:0}
.r-product__foot{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-2)}
.r-product--row .r-product__price{position:static;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 var(--space-2);padding:0;background:none;border-radius:0}
.r-product--row .r-product__price::before,.r-product--row .r-product__price::after{content:none}
.r-product--row .r-product__now{order:1;font-size:17px}
.r-product--row .r-product__was{order:2}
.r-product--row .r-product__badge{position:static;padding:1px 7px}
@media (min-width:641px){
  .r-products.r-products--rows{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.r-product.is-entering{opacity:0;transform:translateY(10px)}
.r-product.is-entered{opacity:1;transform:none;transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out);transition-delay:calc(var(--i,0) * var(--duration-stagger))}
/* The toman mark: «توما» with «ن» set above it, drawn from Ravagh's own glyphs (one copy, as a mask, painted in
   currentColor). Sized by the text around it. Markup: <span class="r-toman" role="img" aria-label="تومان"></span> */
.r-toman{--r-toman:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='36 -1310 1524 1562'%3E%3Cpath d='M1244 -71Q1244 -98 1253 -120Q1262 -142 1272 -142Q1321 -142 1352 -148Q1384 -155 1415 -164Q1411 -204 1392 -299Q1381 -355 1367 -416L1476 -452Q1524 -291 1524 -197Q1524 -152 1510 -119Q1497 -86 1469 -61Q1436 -32 1383 -16Q1331 0 1272 0Q1262 0 1253 -21Q1244 -43 1244 -71ZM1402 -614 1453 -694Q1476 -692 1504 -675Q1532 -657 1560 -630L1505 -548ZM1267 -613 1318 -694Q1342 -691 1370 -674Q1398 -657 1425 -629L1370 -548ZM1116 11 1112 -22Q1050 -12 994 -12Q917 -12 878 -49Q839 -86 839 -155Q838 -206 851 -253Q864 -300 889 -341Q911 -380 953 -399Q983 -413 1024 -413Q1063 -413 1094 -398Q1133 -382 1158 -340Q1201 -260 1214 -142H1272Q1282 -142 1290 -120Q1299 -99 1299 -71Q1299 -42 1290 -21Q1282 0 1272 0H1214Q1212 18 1210 22Q1204 62 1190 89Q1177 116 1152 139Q1103 185 1023 212Q943 238 834 252L795 138Q915 101 978 74Q1042 46 1116 11ZM1079 -274Q1049 -288 1015 -288Q981 -288 947 -274Q938 -237 936 -220Q935 -208 934 -197Q933 -169 947 -155Q961 -141 992 -141H1100Q1096 -179 1091 -210Q1086 -240 1079 -274ZM418 -96Q383 -47 338 -24Q292 0 242 0Q232 0 223 -21Q214 -43 214 -71Q214 -98 223 -120Q232 -142 242 -142Q288 -142 319 -158Q350 -174 376 -213L390 -230Q420 -272 448 -312Q467 -341 488 -361Q509 -380 536 -392Q580 -410 631 -402Q683 -394 716 -360Q739 -338 749 -311Q759 -283 759 -240L756 -122Q756 -60 723 -26Q689 8 624 8Q574 8 530 -6Q486 -20 456 -44Q427 -68 418 -96ZM539 -286Q520 -261 509 -236Q497 -211 497 -193Q497 -173 516 -159Q535 -145 570 -138Q606 -130 659 -128L662 -255Q611 -290 539 -286ZM42 -208 36 -677 146 -703V-241Q146 -191 170 -166Q195 -142 242 -142Q252 -142 260 -120Q269 -98 269 -71Q269 -42 260 -21Q252 0 242 0Q143 0 93 -53Q44 -106 42 -208ZM236 -813Q236 -864 253 -924Q270 -984 313 -1093L412 -1054Q383 -972 372 -927Q362 -883 362 -855Q362 -794 405 -764Q448 -734 538 -734Q586 -734 628 -743Q670 -751 706 -766Q703 -911 688 -1139L804 -1157Q813 -1046 817 -966Q821 -885 821 -820Q821 -760 804 -719Q788 -677 752 -650Q710 -616 649 -600Q588 -583 514 -583Q436 -583 373 -609Q310 -636 273 -688Q236 -740 236 -813ZM442 -1230 494 -1310Q517 -1307 545 -1290Q574 -1273 600 -1245L546 -1164Z'/%3E%3C/svg%3E");display:inline-block;flex-shrink:0;width:0.976em;height:1em;background:currentColor;color:var(--ink-muted);-webkit-mask:var(--r-toman) center/contain no-repeat;mask:var(--r-toman) center/contain no-repeat}

/* ───────── Photo frame (brand signature) ───────── */
.r-frame{position:relative;margin:10px 8px 18px;padding:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-photo);transform:rotate(-1.3deg);isolation:isolate}
.r-frame::before{content:'';position:absolute;inset:12px -10px -10px 12px;z-index:-1;border-radius:var(--radius-lg);background:var(--lime-200);box-shadow:inset 0 0 0 1px #39461d14;transform:rotate(3deg)}
.r-frame img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius-md)}
.r-frame__note{position:absolute;left:16px;bottom:-14px;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--radius-sm);background:var(--lime-400);color:var(--ink);font:500 12px/1.6 var(--font-sans);box-shadow:0 4px 9px #27334a12;transform:rotate(2deg)}
.r-frame__note svg.lucide{width:16px;height:16px}

/* ───────── Overlays: drawer & dialog ───────── */
.r-drawer,.r-dialog{border:0;padding:0;color:var(--ink);background:var(--surface);box-shadow:var(--shadow-dialog);overflow:hidden}
.r-drawer::backdrop,.r-dialog::backdrop{background:var(--backdrop);opacity:0;transition:opacity var(--duration-slow) var(--ease-out)}
.r-drawer[data-state=open]::backdrop,.r-dialog[data-state=open]::backdrop{opacity:1}
.r-drawer[data-state=closing]::backdrop,.r-dialog[data-state=closing]::backdrop{opacity:0;transition-duration:var(--duration-base)}

.r-drawer{position:fixed;inset:0 0 0 auto;margin:0;width:min(440px,100%);max-width:100%;height:100dvh;max-height:100dvh;border-radius:var(--radius-lg) 0 0 var(--radius-lg);
  display:flex;flex-direction:column;transform:translateX(100%);transition:transform var(--duration-drawer) var(--ease-drawer);touch-action:pan-y}
.r-drawer:not([open]){display:none}
.r-drawer[data-state=open]{transform:none}
.r-drawer[data-state=closing]{transform:translateX(100%);transition-duration:var(--duration-base)}
.r-drawer[data-dragging]{transition:none;user-select:none}
.r-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-6) var(--space-6) var(--space-3)}
.r-drawer__head h2{margin:0;font:600 24px/1.5 var(--font-display)}
.r-drawer__body{flex:1;overflow:auto;padding:0 var(--space-6);overscroll-behavior:contain}
.r-drawer__foot{padding:var(--space-4) var(--space-6) var(--space-6);border-top:1px solid var(--line);background:var(--surface)}

.r-dialog{width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);border-radius:var(--radius-lg);padding:var(--space-6);
  opacity:0;transform:translateY(8px) scale(.96);transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}
.r-dialog[data-state=open]{opacity:1;transform:none}
.r-dialog[data-state=closing]{opacity:0;transform:scale(.98);transition-duration:var(--duration-exit)}
.r-dialog h2{margin:0 0 var(--space-2);font:600 24px/1.5 var(--font-display)}
.r-dialog__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:flex-start;margin-top:var(--space-6)}
/* Sheet: .r-dialog at 961px and wider, a bottom sheet at 960px and below. Parts: .r-dialog__handle (decorative),
   .r-dialog__head (title and close; the sheet is dragged down from it), .r-dialog__body (scrolls). --r-keyboard is set
   by rada.js from visualViewport while the on-screen keyboard is up. */
.r-dialog--sheet{flex-direction:column}
.r-dialog--sheet[open]{display:flex}
.r-dialog__handle{display:none}
.r-dialog__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-4)}
.r-dialog__head h2{margin:0}
.r-dialog__body{min-height:0;overflow:auto;overscroll-behavior:contain}
@media (max-width:960px){
  .r-dialog--sheet{inset:auto 0 var(--r-keyboard,0px);margin:0 auto;width:min(640px,100%);max-width:100%;max-height:calc(90dvh - var(--r-keyboard,0px));
    border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:var(--space-3) var(--space-6) calc(var(--space-6) + env(safe-area-inset-bottom,0px));
    opacity:0;transform:translateY(100%);transition:opacity var(--duration-base) var(--ease-out),transform var(--duration-drawer) var(--ease-drawer)}
  .r-dialog--sheet[data-state=open]{opacity:1;transform:none}
  .r-dialog--sheet[data-state=closing]{opacity:0;transform:translateY(100%);transition-duration:var(--duration-base)}
  .r-dialog--sheet[data-dragging]{transition:none;user-select:none}
  .r-dialog--sheet .r-dialog__handle{display:block;flex:none;width:40px;height:4px;margin:0 auto var(--space-4);border-radius:var(--radius-full);background:var(--line)}
  .r-dialog--sheet :is(.r-dialog__handle,.r-dialog__head){touch-action:none;cursor:grab}
}

/* Cart line */
.r-cart-line{display:grid;grid-template-columns:56px 1fr auto;gap:var(--space-3);align-items:start;padding:var(--space-4) 0;border-bottom:1px solid var(--line)}
.r-cart-line__thumb{width:56px;height:72px;border-radius:var(--radius-sm);background-size:cover;background-position:center;background-color:var(--surface-sunken)}
.r-cart-line h3{margin:0;font:500 14px/1.7 var(--font-sans)}
.r-cart-line h3 a{text-decoration:none}
.r-cart-line h3 a:hover{color:var(--cypress)}
.r-cart-line .r-qty{margin-top:var(--space-2)}
.r-cart-line>div:not(.r-cart-line__end):not(:has(.s-line-actions)){display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;align-self:stretch;gap:var(--space-2);min-height:72px}
.r-cart-line>div:not(.r-cart-line__end):not(:has(.s-line-actions)) .r-qty{margin-top:0}
.r-cart-line__end{display:flex;flex-direction:column-reverse;justify-content:space-between;align-items:flex-end;align-self:stretch;gap:var(--space-2)}
.r-cart-line__end .r-icon-btn{color:var(--error)}
.r-cart-line__end .r-icon-btn:hover:not(:disabled){background:var(--error-soft)}
.r-cart-line.is-leaving{opacity:0;transform:translateX(24px);transition:opacity var(--duration-exit) var(--ease-out),transform var(--duration-exit) var(--ease-out)}
.r-summary{display:grid;gap:6px;margin-bottom:var(--space-4);font-size:14px}
.r-summary>div{display:flex;justify-content:space-between;gap:var(--space-3)}
.r-summary>div:last-child{padding-top:var(--space-3);border-top:1px dashed var(--line);font-size:18px;font-weight:600}
.r-summary__label{display:inline-flex;align-items:center;gap:var(--space-2)}
.r-summary__label svg.lucide{width:var(--icon-sm);height:var(--icon-sm);color:var(--ink-muted)}
.r-summary__off{padding:0 var(--space-2);border-radius:var(--radius-sm);background:var(--lime-100);color:var(--cypress);font-weight:500}
.r-summary__off small{color:inherit}
.r-drawer__foot .r-summary>div:only-child{padding-top:0;border-top:0}

/* ───────── Menu ───────── */
.r-menu-anchor{position:relative;display:inline-block}
.r-menu{position:absolute;top:calc(100% + 6px);right:0;z-index:var(--z-popover);min-width:220px;margin:0;padding:6px;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-float);
  transform-origin:top right;opacity:0;transform:translateY(-4px) scale(.96);visibility:hidden;
  transition:opacity var(--duration-exit) var(--ease-out),transform var(--duration-exit) var(--ease-out),visibility 0s linear var(--duration-exit)}
.r-menu[data-state=open]{opacity:1;transform:none;visibility:visible;transition:opacity var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out),visibility 0s}
.r-menu[data-instant]{transition:none}
.r-menu [role^=menuitem]{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);width:100%;min-height:40px;padding:0 10px;border:0;border-radius:var(--radius-sm);background:none;color:var(--ink);font:400 14px/1.7 var(--font-sans);text-align:right;cursor:pointer}
.r-menu [role^=menuitem] svg.lucide{width:16px;height:16px;color:var(--cypress);opacity:0}
.r-menu [aria-checked=true]{color:var(--cypress);font-weight:500}
.r-menu [aria-checked=true] svg.lucide{opacity:1}
.r-menu [role^=menuitem]:focus-visible{outline:none;background:var(--tint)}

/* ───────── Tooltip ───────── */
.r-tooltip{position:fixed;z-index:var(--z-popover);padding:5px 10px;border-radius:var(--radius-sm);background:var(--cypress-deep);color:var(--on-cypress);font:500 12px/1.7 var(--font-sans);pointer-events:none;white-space:nowrap;
  transform-origin:bottom center;opacity:0;transform:translateY(2px) scale(.97);transition:opacity var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}
.r-tooltip[data-state=open]{opacity:1;transform:none}
.r-tooltip[data-instant]{transition-duration:0ms}

/* ───────── Toast ───────── */
.r-toaster{position:fixed;left:24px;bottom:24px;z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--space-2);width:min(380px,calc(100% - 32px));pointer-events:none}
.r-toast{display:flex;align-items:center;gap:var(--space-3);padding:10px 10px 10px 14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-float);font:400 14px/1.7 var(--font-sans);pointer-events:auto;touch-action:none;
  opacity:0;transform:translateY(100%) scale(.98);transition:opacity var(--duration-base) var(--ease-out),transform var(--duration-spring) var(--ease-spring)}
.r-toast[data-state=open]{opacity:1;transform:none}
.r-toast[data-state=closing]{opacity:0;transform:translateY(8px) scale(.98);transition:opacity var(--duration-exit) var(--ease-out),transform var(--duration-exit) var(--ease-out)}
.r-toast[data-dragging]{transition:none}
.r-toast__icon{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border-radius:var(--radius-sm);background:var(--tint);color:var(--cypress)}
.r-toast__icon svg.lucide{width:18px;height:18px}
.r-toast[data-tone=error] .r-toast__icon{background:var(--error-soft);color:var(--error)}
.r-toast[data-tone=info] .r-toast__icon{background:var(--info-soft);color:var(--info)}
.r-toast__text{flex:1;min-width:0}
.r-toast__text strong{display:block;font-weight:500}
.r-toast__text span{display:block;font-size:12px;color:var(--ink-muted)}
.r-toast .r-icon-btn{width:36px;height:36px}

/* ───────── Alert ───────── */
.r-alert{display:flex;gap:var(--space-3);align-items:flex-start;padding:14px 16px;border-radius:var(--radius-md);background:var(--info-soft);color:var(--ink);font:400 14px/1.8 var(--font-sans)}
.r-alert>svg.lucide{margin-top:3px;color:var(--info)}
.r-alert strong{display:block;font-weight:600}
.r-alert p{margin:0;color:var(--ink)}
.r-alert--success{background:var(--success-soft)}.r-alert--success>svg.lucide{color:var(--success)}
.r-alert--warning{background:var(--warning-soft)}.r-alert--warning>svg.lucide{color:var(--warning)}
.r-alert--error{background:var(--error-soft)}.r-alert--error>svg.lucide{color:var(--error)}
.r-alert--lime{background:var(--lime-100)}.r-alert--lime>svg.lucide{color:var(--cypress)}

/* ───────── Skeleton ───────── */
.r-skeleton{display:block;border-radius:var(--radius-sm);background:var(--surface-sunken);animation:r-breathe 1.8s var(--ease-in-out) infinite alternate}
@keyframes r-breathe{from{opacity:1}to{opacity:.55}}

/* ───────── Empty / error state ───────── */
.r-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:var(--space-8) var(--space-4)}
.r-empty__icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:6px;border-radius:var(--radius-lg);background:var(--lime-100);color:var(--cypress)}
.r-empty__icon svg.lucide{width:24px;height:24px}
.r-empty h3{margin:0;font:600 16px/1.7 var(--font-sans)}
.r-empty p{margin:0;max-width:320px;color:var(--ink-muted);font-size:14px}
.r-empty--error .r-empty__icon{background:var(--error-soft);color:var(--error)}

/* ───────── Order tracker ───────── */
.r-track{display:flex;margin:0;padding:0;list-style:none}
.r-track li{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font:400 12px/1.6 var(--font-sans);color:var(--ink-muted)}
.r-track li::before{content:'';position:absolute;top:9px;right:50%;width:100%;height:2px;background:var(--line)}
.r-track li:last-child::before{display:none}
.r-track b{position:relative;z-index:1;display:grid;place-items:center;width:20px;height:20px;border:2px solid var(--line);border-radius:var(--radius-full);background:var(--surface)}
.r-track b svg{width:12px;height:12px;fill:none;stroke:var(--on-cypress);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.r-track .is-done{color:var(--ink)}
.r-track .is-done b{background:var(--cypress);border-color:var(--cypress)}
.r-track .is-done b svg{opacity:1}
.r-track .is-done::before{background:var(--cypress)}
.r-track .is-current{color:var(--cypress);font-weight:600}
.r-track .is-current b{border-color:var(--cypress);background:var(--lime-400);box-shadow:0 0 0 4px var(--tint)}

/* ───────── Accordion ───────── */
.r-acc{border-top:1px solid var(--line)}
.r-acc:last-of-type{border-bottom:1px solid var(--line)}
.r-acc summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:52px;padding:0 2px;list-style:none;cursor:pointer;font:500 14px/1.7 var(--font-sans)}
.r-acc summary::-webkit-details-marker{display:none}
.r-acc summary svg.lucide{width:18px;height:18px;color:var(--ink-muted);transition:transform var(--duration-base) var(--ease-out)}
.r-acc[open] summary svg.lucide{transform:rotate(180deg)}
.r-acc.is-closing summary svg.lucide{transform:none}
.r-acc__content{overflow:hidden}
.r-acc__content>div{padding:0 2px var(--space-4);color:var(--ink-muted);font-size:14px}

/* ───────── Hover: fine pointers only ───────── */
@media (hover:hover) and (pointer:fine){
  .r-btn--primary:hover:not(:disabled,[aria-disabled=true]){--_bg:var(--cypress-hover);--_bd:var(--cypress-hover)}
  .r-btn:not(.r-btn--primary,.r-btn--lime):hover:not(:disabled,[aria-disabled=true]){--_bg:var(--tint)}
  .r-btn--lime:hover{--_bg:var(--lime-400)}
  .r-icon-btn:hover:not(:disabled,.r-fav[aria-pressed=true]){background:var(--tint)}
  .r-link:hover{text-decoration-color:currentColor}
  .r-link:hover svg.lucide{transform:translateX(-3px)}
  .r-chip:hover:not([aria-pressed=true]){border-color:var(--control)}
  .r-option:hover:not(:disabled,[aria-pressed=true]){border-color:var(--cypress);background:var(--tint)}
  .r-qty>button:hover:not(:disabled){background:var(--tint)}
  .r-nav a:hover::after{transform:none}
  .r-product:hover::after{opacity:1}
  .r-product:hover .r-product__img{transform:scale(1.04)}
  .r-product__dot,.r-product__dot:last-of-type{width:16px}
  .r-product__dot>span{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 14%,transparent)}
  .r-product__dot:hover>span{transform:scale(1.25)}
  .r-menu [role^=menuitem]:hover{background:var(--tint)}
  .r-tabs__list>button:hover{color:var(--ink)}
}

/* ───────── Keyboard-driven changes are instant ───────── */
html[data-input=keyboard] :is(.r-chip,.r-option,.r-swatch>span,.r-check__box,.r-check__box svg,.r-tabs__active,.r-menu,.r-acc summary svg.lucide),
html[data-input=keyboard] .r-radio__dot::after,html[data-input=keyboard] .r-switch__track::after{transition:none!important}

/* ───────── Reduced motion: keep fades, drop movement ─────────
   Follows the OS setting unless the page sets html[data-motion=full] (user override) or [data-motion=reduced]. */
html[data-motion=reduced] *,html[data-motion=reduced] *::before,html[data-motion=reduced] *::after{transition-property:opacity,background-color,border-color,color,fill-opacity!important;animation:none!important}
html[data-motion=reduced] :is(.r-drawer,.r-dialog,.r-dialog--sheet,.r-toast,.r-menu,.r-tooltip,.r-product){transform:none!important}
@media (prefers-reduced-motion:reduce){
  html:not([data-motion=full]) *,html:not([data-motion=full]) *::before,html:not([data-motion=full]) *::after{transition-property:opacity,background-color,border-color,color,fill-opacity!important;animation:none!important}
  html:not([data-motion=full]) :is(.r-drawer,.r-dialog,.r-dialog--sheet,.r-toast,.r-menu,.r-tooltip,.r-product){transform:none!important}
}
html[data-motion=reduced] .r-spinner{animation:r-spin 1.2s linear infinite!important}
@media (prefers-reduced-motion:reduce){html:not([data-motion=full]) .r-spinner{animation:r-spin 1.2s linear infinite!important}}

@media (max-width:640px){
  .r-header{gap:var(--space-3);padding:var(--space-2) var(--space-3);flex-wrap:wrap}
  .r-nav{order:3;flex-basis:100%;justify-content:space-between;gap:var(--space-3);border-top:1px solid var(--line)}
  .r-wordmark{font-size:32px}
  .r-toaster{left:16px;bottom:16px}
  .r-drawer{width:100%;border-radius:0}
  .r-drawer__head,.r-drawer__foot{padding-inline:var(--space-4)}.r-drawer__body{padding:0 var(--space-4)}
  .r-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
}

/* ═════════ v1.1 · Navigation ═════════ */
/* --r-dock = height of the fixed mobile bar (bottom bar or open buy bar); floating layers sit above it. */
.r-root{--r-dock:0px}

/* ───────── Mega menu ───────── */
.r-mega-host{position:relative}
.r-nav>button{position:relative;display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0;border:0;background:none;color:var(--ink);font:600 11px/1.6 var(--font-sans);white-space:nowrap;cursor:pointer}
.r-nav>button::after{content:'';position:absolute;inset-inline:0;bottom:8px;height:2px;border-radius:2px;background:var(--lime-400);transform:scaleX(0);transform-origin:right;transition:transform var(--duration-base) var(--ease-out)}
.r-nav>button svg.lucide{width:14px;height:14px;color:var(--ink-muted);transition:transform var(--duration-base) var(--ease-out)}
.r-nav>button[aria-expanded=true]::after{transform:none}
.r-nav>button[aria-expanded=true] svg.lucide{transform:rotate(180deg)}
.r-mega{position:absolute;top:100%;inset-inline:0;z-index:var(--z-popover);display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--space-8);padding:var(--space-8);background:var(--surface);border:1px solid var(--line);border-radius:0 0 var(--radius-lg) var(--radius-lg);box-shadow:var(--shadow-float);
  opacity:0;transform:translateY(-6px);visibility:hidden;transition:opacity var(--duration-exit) var(--ease-out),transform var(--duration-exit) var(--ease-out),visibility 0s linear var(--duration-exit)}
.r-mega[data-state=open]{opacity:1;transform:none;visibility:visible;transition:opacity var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out),visibility 0s}
.r-mega[data-instant]{transition:none}
/* Mega menu: the department as a .r-cat-card in the first column, then its subcategories as .r-cat-tile (round picture, name) with their types as plain links under each, text centred under each picture. A subcategory without types is just the tile. Below 1024px the panel stacks: the card on top, the tiles under it. */
.r-mega__aside .r-cat-card{aspect-ratio:4/5}
.r-mega__cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--space-4);align-items:start}
.r-mega__group{display:grid;justify-items:center;gap:var(--space-2);min-width:0;text-align:center}
.r-mega__group .r-cat-tile{width:auto}
.r-mega__group .r-cat-tile__pic{width:64px}
.r-mega__cols ul{margin:0;padding:0;list-style:none}
.r-mega__cols ul a{display:flex;align-items:center;justify-content:center;min-height:32px;color:var(--ink-muted);text-decoration:none;font-size:12px;transition:color var(--duration-fast) var(--ease-color)}
@media (max-width:1023px){
  .r-mega{grid-template-columns:minmax(0,1fr);gap:var(--space-6);padding:var(--space-6)}
  .r-mega__aside .r-cat-card{aspect-ratio:4/1}
}
.r-mega__tile{display:grid;gap:var(--space-2);align-content:start;color:var(--ink);text-decoration:none;font:500 14px/1.7 var(--font-sans)}
.r-mega__tile img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-md)}

/* ───────── Bottom bar & buy bar (mobile only) ───────── */
.r-bottom-bar,.r-buy-bar{display:none}

/* ───────── Stepper ───────── */
.r-stepper{display:flex;align-items:center;gap:var(--space-2);margin:0;padding:0;list-style:none;font:500 13px/1.7 var(--font-sans);color:var(--ink-muted)}
.r-stepper li{display:flex;align-items:center;gap:var(--space-2);min-width:0}
.r-stepper li+li::before{content:'';width:var(--space-6);height:1px;flex-shrink:0;background:var(--control)}
.r-stepper li.is-done+li::before{background:var(--cypress)}
.r-stepper li>*{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--control-height);color:inherit;text-decoration:none;white-space:nowrap}
.r-stepper b{display:grid;place-items:center;width:24px;height:24px;flex-shrink:0;border:1.5px solid var(--control);border-radius:var(--radius-full);background:var(--surface);font:600 12px/1 var(--font-sans)}
.r-stepper .is-done{color:var(--ink)}
.r-stepper .is-done b{background:var(--cypress);border-color:var(--cypress);color:var(--on-cypress)}
.r-stepper [aria-current=step]{color:var(--cypress);font-weight:600}
.r-stepper [aria-current=step] b{border-color:var(--cypress);background:var(--lime-400);color:var(--ink)}

/* ───────── Anchor nav (sticky, scroll-spy) ───────── */
.r-anchor-nav{position:sticky;top:var(--r-sticky-top,0px);z-index:calc(var(--z-header) - 1);display:flex;gap:var(--space-6);overflow-x:auto;scrollbar-width:none;padding:0 var(--space-4);background:var(--surface);border-bottom:1px solid var(--line)}
.r-anchor-nav::-webkit-scrollbar{display:none}
.r-anchor-nav a{position:relative;display:inline-flex;align-items:center;min-height:48px;flex-shrink:0;color:var(--ink-muted);text-decoration:none;font:500 14px/1.7 var(--font-sans);white-space:nowrap;transition:color var(--duration-fast) var(--ease-color)}
.r-anchor-nav a::after{content:'';position:absolute;inset-inline:0;bottom:0;height:2px;background:var(--cypress);transform:scaleX(0);transition:transform var(--duration-base) var(--ease-out)}
.r-anchor-nav a[aria-current]{color:var(--cypress)}
.r-anchor-nav a[aria-current]::after{transform:none}
.r-anchor-nav a:focus-visible{outline-offset:-3px}

/* ───────── Pagination ───────── */
.r-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--space-1)}
.r-pagination>*{display:inline-grid;place-items:center;min-width:var(--control-height);height:var(--control-height);padding:0 6px;border-radius:var(--radius-sm);color:var(--ink);font:500 14px/1 var(--font-sans);text-decoration:none;transition:background-color var(--duration-fast) var(--ease-color)}
.r-pagination svg.lucide{width:18px;height:18px}
.r-pagination [aria-current=page]{background:var(--cypress);color:var(--on-cypress)}
.r-pagination [aria-disabled=true]{color:var(--ink-muted);opacity:.55}
.r-pagination>span[aria-hidden]{min-width:var(--space-6);color:var(--ink-muted)}

@media (hover:hover) and (pointer:fine){
  .r-nav>button:hover::after{transform:none}
  .r-mega__cols ul a:hover{color:var(--cypress)}
  .r-mega__tile:hover{color:var(--cypress)}
  .r-stepper a:hover{color:var(--cypress)}
  .r-anchor-nav a:hover{color:var(--ink)}
  .r-pagination a:not([aria-current]):hover{background:var(--tint)}
}
html[data-input=keyboard] .r-anchor-nav a::after{transition:none!important}
html[data-motion=reduced] :is(.r-mega,.r-buy-bar){transform:none!important}
@media (prefers-reduced-motion:reduce){html:not([data-motion=full]) :is(.r-mega,.r-buy-bar){transform:none!important}}

@media (max-width:640px){
  .r-root:has(.r-bottom-bar){--r-dock:calc(56px + env(safe-area-inset-bottom,0px))}
  .r-root:has(.r-buy-bar[data-state=open]){--r-dock:calc(68px + env(safe-area-inset-bottom,0px))}
  .r-toaster{bottom:calc(var(--r-dock) + var(--space-4))}
  .r-mega{grid-template-columns:minmax(0,1fr);padding:var(--space-4)}
  .r-mega__aside{display:none}
  .r-mega .r-mega__tile{display:none}
  .r-bottom-bar{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-header);display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);padding-bottom:env(safe-area-inset-bottom,0px);background:var(--surface);border-top:1px solid var(--line)}
  .r-bottom-bar>*{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;padding:0;border:0;background:none;color:var(--ink-muted);text-decoration:none;font:500 12px/1.6 var(--font-sans);cursor:pointer;-webkit-tap-highlight-color:transparent}
  .r-bottom-bar>*::before{content:'';position:absolute;top:-1px;width:var(--space-6);height:2px;border-radius:2px;background:var(--cypress);transform:scaleX(0);transition:transform var(--duration-base) var(--ease-out)}
  .r-bottom-bar>[aria-current=page]{color:var(--cypress)}
  .r-bottom-bar>[aria-current=page]::before{transform:none}
  .r-bottom-bar>:focus-visible{outline-offset:-3px}
  .r-bottom-bar .r-count{position:absolute;top:6px;left:calc(50% - 24px)}
  .r-buy-bar{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-header);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4) calc(var(--space-3) + env(safe-area-inset-bottom,0px));background:var(--surface);border-top:1px solid var(--line);box-shadow:var(--shadow-float);
    transform:translateY(100%);visibility:hidden;transition:transform var(--duration-base) var(--ease-out),visibility 0s linear var(--duration-base)}
  .r-buy-bar[data-state=open]{transform:none;visibility:visible;transition:transform var(--duration-slow) var(--ease-out),visibility 0s}
  .r-buy-bar .r-btn{flex:1;max-width:60%}
  .r-buy-bar .r-price{align-content:center;row-gap:0}
  .r-buy-bar .r-price s{flex:0 0 100%}
  .r-stepper li:not([aria-current=step])>*>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .r-stepper li+li::before{width:var(--space-3)}
  .r-anchor-nav{gap:var(--space-4)}
  .r-pagination>*{min-width:40px}
}

/* ═════════ v1.1 · Product ═════════ */
/* Play badge (gallery slide, thumbnail, video poster, video card) */
.r-play{position:absolute;inset:0;margin:auto;display:grid;place-items:center;width:56px;height:56px;border-radius:var(--radius-full);background:var(--surface);color:var(--cypress);box-shadow:var(--shadow-float);pointer-events:none;transition:transform var(--duration-base) var(--ease-out)}
.r-play svg.lucide{width:22px;height:22px;fill:currentColor;transform:translateX(1px)}
.r-play--sm{width:28px;height:28px}
.r-play--sm svg.lucide{width:12px;height:12px}

/* ───────── Gallery ───────── */
.r-gallery{display:grid;grid-template-columns:72px minmax(0,1fr);gap:var(--space-3);min-width:0}
.r-gallery__stage{position:relative;grid-column:2;grid-row:1;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface)}
.r-gallery__track{display:flex;margin:0;padding:0;list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.r-gallery__track::-webkit-scrollbar{display:none}
.r-gallery__track>li{flex:0 0 100%;scroll-snap-align:start;scroll-snap-stop:always}
.r-gallery__slide{position:relative;display:block;width:100%;aspect-ratio:4/5;padding:0;border:0;background:none;cursor:zoom-in}
.r-gallery__slide img{display:block;width:100%;height:100%;object-fit:contain}
.r-gallery__slide:focus-visible{outline-offset:-3px}
.r-gallery__count{position:absolute;bottom:12px;left:12px;padding:1px 10px;border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font:500 12px/1.9 var(--font-sans);box-shadow:var(--shadow-soft);pointer-events:none}
.r-gallery__prev,.r-gallery__next{position:absolute;top:50%;margin-top:-22px;border-color:var(--line);background:var(--surface);box-shadow:var(--shadow-soft)}
.r-gallery__prev{right:12px}
.r-gallery__next{left:12px}
.r-gallery :is(.r-gallery__prev,.r-gallery__next):disabled{visibility:hidden}
.r-gallery__thumbs{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:var(--space-2);height:0;min-height:100%;padding:2px;overflow-y:auto;scrollbar-width:none}
.r-gallery__thumbs::-webkit-scrollbar{display:none}
.r-gallery__thumbs>button{position:relative;flex-shrink:0;width:100%;aspect-ratio:4/5;padding:0;border:0;border-radius:var(--radius-sm);overflow:hidden;background:var(--surface-sunken);cursor:pointer;box-shadow:0 0 0 1px var(--line);transition:box-shadow var(--duration-fast) var(--ease-color)}
.r-gallery__thumbs>button[aria-current=true]{box-shadow:0 0 0 2px var(--cypress)}
.r-gallery__thumbs img{display:block;width:100%;height:100%;object-fit:cover}

/* ───────── Lightbox (dialog is created by rada.js) ───────── */
.r-lightbox{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--surface);color:var(--ink);opacity:0;transition:opacity var(--duration-base) var(--ease-out)}
.r-lightbox:not([open]){display:none}
.r-lightbox[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.r-lightbox[data-state=open]{opacity:1}
.r-lightbox[data-state=closing]{opacity:0;transition-duration:var(--duration-exit)}
.r-lightbox__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) var(--space-4);font:500 14px/1.7 var(--font-sans)}
.r-lightbox__stage{position:relative;min-height:0;overflow:hidden;touch-action:pan-y pinch-zoom}
.r-lightbox__stage>:is(img,video,iframe){display:block;width:100%;height:100%;border:0;object-fit:contain}
.r-lightbox__stage>img{cursor:zoom-in;transition:transform var(--duration-slow) var(--ease-out)}
.r-lightbox__stage>img[data-zoomed]{transform:scale(2.2);cursor:zoom-out}
.r-lightbox__caption{min-height:var(--space-12);padding:var(--space-3) var(--space-4);text-align:center;color:var(--ink-muted);font-size:14px}
.r-lightbox__prev,.r-lightbox__next{position:absolute;top:50%;margin-top:-22px}
.r-lightbox__prev{right:var(--space-4)}
.r-lightbox__next{left:var(--space-4)}
.r-lightbox :is(.r-lightbox__prev,.r-lightbox__next):disabled{visibility:hidden}

/* ───────── Video (poster, click to load) ───────── */
.r-video{display:grid;gap:var(--space-3);min-width:0}
.r-video__frame{position:relative;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:var(--cypress-deep)}
.r-video__poster{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer}
.r-video__poster:focus-visible{outline-offset:-3px}
.r-video__poster img,.r-video__frame>:is(video,iframe){position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.r-video__frame>video{object-fit:contain}
.r-video__time{position:absolute;bottom:12px;left:12px;padding:1px 8px;border-radius:var(--radius-sm);background:var(--cypress-deep);color:var(--on-cypress);font:500 12px/1.9 var(--font-sans)}
.r-video__error{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:var(--space-2);padding:var(--space-4);background:var(--cypress-deep);color:var(--on-cypress);text-align:center;font-size:14px}
.r-video__chapters{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0;padding:0;list-style:none}
.r-video__chapters button{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--control-height-sm);padding:0 12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font:500 13px/1.7 var(--font-sans);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-color),background-color var(--duration-fast) var(--ease-color)}
.r-video__chapters bdi{color:var(--ink-muted);font-weight:400}
.r-video figcaption{color:var(--ink-muted);font-size:12px}

/* Video card */
.r-video-card{display:grid;gap:var(--space-1);align-content:start;min-width:0}
.r-video-card__media{position:relative;display:block;width:100%;aspect-ratio:4/3;margin-bottom:var(--space-1);padding:0;border:0;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-sunken);cursor:pointer}
.r-video-card__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 700ms var(--ease-out)}
.r-video-card h3{font:500 14px/1.8 var(--font-sans)}

/* ───────── Hotspots ───────── */
.r-hotspots{position:relative}
.r-hotspots>img{display:block;width:100%;height:auto;border-radius:var(--radius-lg)}
.r-hotspot{position:absolute;left:var(--x);top:var(--y)}
.r-hotspot[data-state=open]{z-index:1}
.r-hotspot__dot{position:absolute;top:-22px;left:-22px;display:grid;place-items:center;width:var(--control-height);height:var(--control-height);padding:0;border:0;border-radius:var(--radius-full);background:none;cursor:pointer}
.r-hotspot__dot::before{content:'';width:22px;height:22px;border:7px solid var(--surface);border-radius:var(--radius-full);background:var(--cypress);box-shadow:var(--shadow-photo),0 0 0 5px color-mix(in srgb,var(--surface) 45%,transparent);transition:transform var(--duration-base) var(--ease-out),border-width var(--duration-base) var(--ease-out)}
.r-hotspot__dot[aria-expanded=true]::before{border-width:4px;transform:scale(1.1)}
.r-hotspot__card{position:absolute;top:20px;left:-110px;z-index:var(--z-popover);width:220px;padding:var(--space-2);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-float);
  opacity:0;transform:translateY(-4px) scale(.96);visibility:hidden;transition:opacity var(--duration-exit) var(--ease-out),transform var(--duration-exit) var(--ease-out),visibility 0s linear var(--duration-exit)}
.r-hotspot[data-side~=left] .r-hotspot__card{left:-24px}
.r-hotspot[data-side~=right] .r-hotspot__card{left:auto;right:-24px}
.r-hotspot[data-side~=up] .r-hotspot__card{top:auto;bottom:20px}
.r-hotspot[data-state=open] .r-hotspot__card{opacity:1;transform:none;visibility:visible;transition:opacity var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out),visibility 0s}
.r-hotspot__card a{display:grid;grid-template-columns:48px minmax(0,1fr);gap:var(--space-3);align-items:center;color:var(--ink);text-decoration:none;font:500 13px/1.7 var(--font-sans)}
.r-hotspot__card img{display:block;width:48px;height:60px;border-radius:var(--radius-sm);object-fit:cover}
.r-hotspot__card .r-price{font-size:14px}

/* ───────── Spec table ───────── */
.r-spec{display:grid;gap:var(--space-6);min-width:0}
.r-spec h3{margin-bottom:var(--space-1);font:600 16px/1.7 var(--font-sans)}
.r-spec dl{margin:0}
.r-spec dl>div{display:grid;grid-template-columns:minmax(104px,2fr) 5fr;gap:var(--space-4);padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.r-spec dt{color:var(--ink-muted)}
.r-spec dd{margin:0}
.r-spec__diagram{padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);text-align:center}
.r-spec__diagram :is(img,svg){max-width:100%;height:auto}
.r-spec__diagram figcaption{margin-top:var(--space-2);color:var(--ink-muted);font-size:12px}

/* ───────── Delivery estimate ───────── */
.r-delivery{display:grid;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}
.r-delivery__rows{display:grid;gap:var(--space-3);margin:0;padding:0;list-style:none}
.r-delivery__rows li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--space-3);align-items:start;font-size:14px}
.r-delivery__rows li>svg.lucide{margin-top:3px;color:var(--cypress)}
.r-delivery__rows strong{display:block;font-weight:500}
.r-delivery__rows li>div>span{display:block;color:var(--ink-muted);font-size:12px}
.r-delivery__rows .r-price{font-size:14px}

/* ───────── Compare tray ───────── */
.r-root:has(.r-compare-tray[data-state=open]){--r-tray:85px}
.r-compare-tray{position:fixed;inset-inline:0;bottom:var(--r-dock);z-index:var(--z-header);display:flex;align-items:center;justify-content:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--surface);border-top:1px solid var(--line);box-shadow:var(--shadow-float);
  transform:translateY(100%);visibility:hidden;transition:transform var(--duration-base) var(--ease-out),visibility 0s linear var(--duration-base)}
.r-compare-tray[data-state=open]{transform:none;visibility:visible;transition:transform var(--duration-slow) var(--ease-out),visibility 0s}
.r-compare-tray__items{display:flex;gap:var(--space-3);margin:0;padding:0;list-style:none}
.r-compare-tray__items li{position:relative;width:48px;height:60px;border:1px dashed var(--control);border-radius:var(--radius-sm);background:var(--surface-sunken)}
.r-compare-tray__items li:has(img){border:1px solid var(--line)}
.r-compare-tray__items img{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover}
.r-compare-tray__items .r-icon-btn{position:absolute;top:-10px;left:-10px;width:24px;height:24px;border-color:var(--line);border-radius:var(--radius-full);background:var(--surface)}
.r-compare-tray__items .r-icon-btn::before{content:'';position:absolute;inset:-10px}
.r-compare-tray__items .r-icon-btn svg.lucide{width:12px;height:12px}

/* ───────── Compare table ───────── */
.r-compare-wrap{container-type:inline-size;min-width:0}
.r-compare{--label:160px;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:14px}
.r-compare :is(th,td){padding:10px var(--space-3);border-bottom:1px solid var(--line);vertical-align:top;text-align:start;font-weight:400}
.r-compare thead th{position:sticky;top:var(--r-sticky-top,0px);z-index:1;padding-block:var(--space-3);background:var(--surface);border-bottom-color:var(--control)}
.r-compare thead th:first-child{width:var(--label)}
.r-compare tbody th{color:var(--ink-muted)}
.r-compare__group th{padding-top:var(--space-6);border-bottom-color:var(--control);color:var(--ink);font-weight:600}
.r-compare__group th>span{position:sticky;inset-inline-start:var(--space-3)}
.r-compare__product{position:relative;display:grid;gap:var(--space-1);justify-items:start}
.r-compare__product img{display:block;width:min(120px,100%);aspect-ratio:4/5;border-radius:var(--radius-md);object-fit:cover}
.r-compare__product>a{color:var(--ink);text-decoration:none;font:500 14px/1.7 var(--font-sans)}
.r-compare__product .r-btn{margin-top:var(--space-1)}
.r-compare__remove{position:absolute;top:0;left:0;border-color:var(--line);background:var(--surface)}
.r-compare[data-diff] tr.is-same{display:none}

@media (hover:hover) and (pointer:fine){
  .r-gallery__slide:hover .r-play,.r-video__poster:hover .r-play,.r-video-card__media:hover .r-play{transform:scale(1.06)}
  .r-gallery__thumbs>button:hover:not([aria-current=true]){box-shadow:0 0 0 1px var(--control)}
  .r-video__chapters button:hover{border-color:var(--cypress);background:var(--tint)}
  .r-video-card__media:hover img{transform:scale(1.03)}
  .r-hotspot__dot:hover::before{transform:scale(1.1)}
  .r-hotspot__card a:hover strong,.r-compare__product>a:hover{color:var(--cypress)}
}
html[data-input=keyboard] .r-hotspot__card{transition:none!important}
html[data-motion=reduced] :is(.r-compare-tray,.r-hotspot__card,.r-lightbox__stage>img){transform:none!important}
@media (prefers-reduced-motion:reduce){html:not([data-motion=full]) :is(.r-compare-tray,.r-hotspot__card,.r-lightbox__stage>img){transform:none!important}}

@media (max-width:640px){
  .r-gallery{grid-template-columns:minmax(0,1fr)}
  .r-gallery__stage{grid-column:1}
  .r-gallery__thumbs,.r-gallery__prev,.r-gallery__next{display:none}
  .r-lightbox__prev,.r-lightbox__next{top:auto;bottom:var(--space-2);margin:0}
  .r-play{width:48px;height:48px}
  .r-play--sm{width:28px;height:28px}
  .r-compare-tray{gap:var(--space-3)}
  .r-compare-tray__items li{width:40px;height:50px}
  .r-compare-wrap{overflow:auto;max-height:calc(100dvh - var(--r-sticky-top,0px) - var(--r-dock) - var(--space-6));scroll-snap-type:x mandatory;scroll-padding-inline-start:96px;overscroll-behavior-x:contain}
  .r-compare{--label:96px;width:calc(var(--label) + var(--cols,4) * (100cqw - var(--label)) / 2)}
  .r-compare thead th{top:0;scroll-snap-align:start}
  .r-compare :is(thead th:first-child,tbody th[scope=row]){position:sticky;inset-inline-start:0;z-index:1;background:var(--surface)}
  .r-compare thead th:first-child{z-index:2}
  .r-compare :is(th,td){padding-inline:var(--space-2)}
}

/* ═════════ v1.1 · Social proof ═════════ */
/* Stars: five masked stars, filled from the right edge by --rating (0–5). The value itself goes in aria-label. */
:root{--r-star:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01z'/%3E%3C/svg%3E")}
.r-stars{--rating:0;display:inline-block;width:90px;height:16px;flex-shrink:0;vertical-align:middle;
  background:linear-gradient(to left,var(--cypress) calc(var(--rating) / 5 * 100%),color-mix(in srgb,var(--control) 40%,transparent) 0);
  -webkit-mask:var(--r-star) center/20% 100% repeat-x;mask:var(--r-star) center/20% 100% repeat-x}
.r-stars--lg{width:135px;height:24px}

/* ───────── Rating, inline ───────── */
.r-rating{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-3);color:var(--ink-muted);font:400 13px/1.7 var(--font-sans)}
.r-rating strong{color:var(--ink);font-weight:600}
.r-rating a{padding-block:var(--space-2);color:inherit;text-decoration:underline;text-decoration-color:var(--control);text-underline-offset:4px;transition:color var(--duration-fast) var(--ease-color)}
.r-rating--sm{gap:var(--space-1);font-size:12px}
.r-rating--sm svg.lucide{width:13px;height:13px;color:var(--cypress);fill:currentColor}

/* ───────── Rating summary ───────── */
.r-rating-summary{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-4) var(--space-8);align-items:center;min-width:0}
.r-rating-summary__score{display:grid;gap:var(--space-1);justify-items:start}
.r-rating-summary__score>strong{font:600 48px/1.2 var(--font-display)}
.r-rating-summary__score>span:last-child{color:var(--ink-muted);font-size:12px}
.r-rating-summary__note{grid-column:1/-1;display:flex;align-items:center;gap:var(--space-2);font-size:14px}
.r-rating-summary__note svg.lucide{width:18px;height:18px;color:var(--cypress)}
.r-rating-summary__note strong{font-weight:600}
.r-rating-summary__attrs{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-3) var(--space-8);margin:0;padding:var(--space-4) 0 0;border-top:1px solid var(--line);list-style:none}
.r-meter{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--space-3);align-items:center;font-size:13px}
.r-meter>span:first-child{color:var(--ink-muted)}
.r-meter>strong{font-weight:500}
.r-meter__bar{grid-column:1/-1;position:relative;height:6px;border-radius:var(--radius-full);background:var(--lime-100)}
.r-meter__bar::after{content:'';position:absolute;inset-block:0;right:0;width:var(--v);border-radius:inherit;background:var(--cypress)}
.r-meter--scale .r-meter__bar::after{right:calc(var(--v) - 6px);top:-3px;width:12px;height:12px;border:2px solid var(--surface);border-radius:var(--radius-full);box-shadow:0 0 0 1px var(--cypress)}
.r-meter__ends{grid-column:1/-1;display:flex;justify-content:space-between;color:var(--ink-muted);font-size:12px;font-weight:400}

/* ───────── Rating bars (rows are buttons when they filter) ───────── */
.r-rating-bars{display:grid;gap:2px;min-width:0}
.r-rating-bars>*{display:grid;grid-template-columns:52px minmax(0,1fr) 34px;align-items:center;gap:var(--space-3);min-height:var(--control-height-sm);padding:0 var(--space-2);border:0;border-radius:var(--radius-sm);background:none;color:var(--ink-muted);font:400 12px/1.6 var(--font-sans);text-align:start;transition:background-color var(--duration-fast) var(--ease-color),color var(--duration-fast) var(--ease-color)}
.r-rating-bars>button{cursor:pointer}
.r-rating-bars__bar{height:8px;border-radius:var(--radius-full);background:var(--surface-sunken);overflow:hidden}
.r-rating-bars__bar::after{content:'';display:block;width:var(--v);height:100%;border-radius:inherit;background:var(--cypress)}
.r-rating-bars>[aria-pressed=true]{background:var(--tint);color:var(--cypress);font-weight:500}

/* ───────── Star input ───────── */
.r-star-input{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-3)}
.r-star-input>.r-label{flex-basis:100%}
.r-star-input__stars{display:inline-flex;margin-inline-start:-10px}
.r-star-input__stars label{position:relative;display:grid;place-items:center;width:var(--control-height);height:var(--control-height);border-radius:var(--radius-sm);color:var(--control);cursor:pointer}
.r-star-input__stars input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.r-star-input__stars svg.lucide{width:28px;height:28px;fill:currentColor;fill-opacity:0;transition:fill-opacity var(--duration-fast) var(--ease-color),color var(--duration-fast) var(--ease-color),transform var(--duration-press) var(--ease-out)}
.r-star-input__stars label:has(input:checked),.r-star-input__stars label:has(~label input:checked){color:var(--cypress)}
.r-star-input__stars label:has(input:checked) svg.lucide,.r-star-input__stars label:has(~label input:checked) svg.lucide{fill-opacity:1}
.r-star-input__stars label:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:-2px}
.r-star-input__stars label:active svg.lucide{transform:scale(.9)}
.r-star-input__text{color:var(--ink-muted);font-size:14px}

/* ───────── Vote (helpful / not helpful) ───────── */
.r-votes{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.r-vote{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:var(--control-height-sm);padding:0 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink-muted);font:500 12px/1 var(--font-sans);cursor:pointer;
  transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color),border-color var(--duration-fast) var(--ease-color),color var(--duration-fast) var(--ease-color)}
.r-vote::before{content:'';position:absolute;inset:-4px}
.r-vote svg.lucide{width:15px;height:15px}
.r-vote[aria-pressed=true]{border-color:var(--cypress);background:var(--tint);color:var(--cypress)}
.r-vote:active{transform:scale(.96)}

/* ───────── Review card ───────── */
.r-review{display:grid;gap:var(--space-2);min-width:0;padding:var(--space-4) 0;border-bottom:1px solid var(--line)}
.r-review--card{padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-soft)}
.r-review__head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-2)}
.r-review__head strong{font-weight:500}
.r-review__head time{margin-inline-start:auto}
.r-review__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-3)}
.r-review h3{font:600 14px/1.8 var(--font-sans)}
.r-review p{font-size:14px}
.r-review__points{display:grid;gap:2px;margin:0;padding:0;list-style:none;font-size:13px}
.r-review__points li{display:flex;align-items:flex-start;gap:var(--space-2)}
.r-review__points svg.lucide{width:14px;height:14px;margin-top:5px}
.r-review__points .is-pro svg.lucide{color:var(--success)}
.r-review__points .is-con svg.lucide{color:var(--error)}
.r-review__media{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.r-review__media button{position:relative;width:64px;height:64px;padding:0;border:0;border-radius:var(--radius-sm);overflow:hidden;background:var(--surface-sunken);cursor:zoom-in}
.r-review__media img{display:block;width:100%;height:100%;object-fit:cover}
.r-review__reply{display:grid;gap:2px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--tint)}
.r-review__reply strong{color:var(--cypress);font-weight:500;font-size:13px}

/* ───────── Q&A item ───────── */
.r-qa{display:grid;gap:var(--space-2);min-width:0;padding:var(--space-4) 0;border-bottom:1px solid var(--line)}
.r-qa__q{display:flex;align-items:flex-start;gap:var(--space-2);font:500 14px/1.8 var(--font-sans)}
.r-qa__q svg.lucide{width:18px;height:18px;margin-top:4px;color:var(--cypress)}
.r-qa__answers{display:grid;gap:var(--space-4);margin:var(--space-1) 0 0;padding:0;padding-inline-start:var(--space-4);border-inline-start:2px solid var(--line);list-style:none}
.r-qa__answers li{display:grid;gap:var(--space-1);font-size:14px}
.r-qa__by{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.r-qa__by strong{font-weight:500}

@media (hover:hover) and (pointer:fine){
  .r-rating a:hover{color:var(--cypress)}
  .r-rating-bars>button:hover:not([aria-pressed=true]){background:var(--surface-sunken)}
  .r-star-input__stars:hover label{color:var(--cypress)}
  .r-star-input__stars:hover label svg.lucide{fill-opacity:1}
  .r-star-input__stars:hover label:hover~label{color:var(--control)}
  .r-star-input__stars:hover label:hover~label svg.lucide{fill-opacity:0}
  .r-vote:hover:not([aria-pressed=true]){border-color:var(--control);color:var(--ink)}
}
html[data-input=keyboard] :is(.r-star-input__stars svg.lucide,.r-vote,.r-rating-bars>*){transition:none!important}

@media (max-width:640px){
  .r-rating-summary{grid-template-columns:minmax(0,1fr)}
  .r-rating-summary__score{grid-template-columns:auto 1fr;align-items:center;column-gap:var(--space-3)}
  .r-rating-summary__score>strong{grid-row:span 2;font-size:40px}
}

/* ═════════ v1.1 · Trust ═════════ */
/* ───────── Assurance ───────── */
.r-assurances{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4);margin:0;padding:0;list-style:none}
.r-assurance{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 var(--space-3);align-items:center;width:100%;min-height:var(--control-height);padding:0;border:0;background:none;color:inherit;font:400 12px/1.8 var(--font-sans);text-align:start;text-decoration:none}
:is(a,button).r-assurance{cursor:pointer}
.r-assurance__icon{grid-row:span 2;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-md);background:var(--lime-100);color:var(--cypress)}
.r-assurance strong{align-self:end;font:500 14px/1.7 var(--font-sans);transition:color var(--duration-fast) var(--ease-color)}
.r-assurance strong:last-child{grid-row:span 2;align-self:center}
.r-assurance>span:not(.r-assurance__icon){align-self:start;color:var(--ink-muted)}
/* List rows (product page): chevron at the end, one per line */
.r-assurances.r-assurances--compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-4)}
.r-assurances--compact .r-assurance{min-height:40px}
.r-assurances--compact .r-assurance__icon{width:36px;height:36px}
.r-assurances--compact .r-assurance>span:not(.r-assurance__icon){display:none}
.r-assurances--quad{grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
.r-panel--trust{padding:var(--space-4)}
.r-assurances--quad>li:nth-child(even){border-inline-start:1px solid var(--line)}
.r-assurances--quad>li:nth-child(n+3){border-top:1px solid var(--line)}
.r-assurances--quad .r-assurance{grid-template-columns:minmax(0,1fr) auto;column-gap:var(--space-3);min-height:80px;padding:var(--space-4) var(--space-6);padding-inline-start:var(--space-8)}
.r-assurances--quad .r-assurance__icon{grid-column:2;grid-row:span 2;background:none;width:36px;height:36px}
.r-assurances--quad .r-assurance strong{grid-column:1;grid-row:1;align-self:end;font-weight:500}
.r-assurances--quad .r-assurance strong:last-child{grid-row:span 2;align-self:center}
.r-assurances--quad .r-assurance>span:not(.r-assurance__icon){grid-column:1;grid-row:2;align-self:start}
#p-assure .r-assurance__icon{animation:r-assurance-arrive 420ms var(--ease-out) backwards;will-change:transform}
#p-assure>li:nth-child(1) .r-assurance__icon{animation-delay:40ms}
#p-assure>li:nth-child(2) .r-assurance__icon{animation-delay:90ms}
#p-assure>li:nth-child(3) .r-assurance__icon{animation-delay:140ms}
#p-assure>li:nth-child(4) .r-assurance__icon{animation-delay:190ms}
@keyframes r-assurance-arrive{from{opacity:0;transform:translateY(7px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
.r-assurances--list{grid-template-columns:minmax(0,1fr);gap:0}
.r-assurances--list .r-assurance{grid-template-columns:auto minmax(0,1fr) auto;padding:var(--space-3) 0;border-bottom:1px solid var(--line)}
.r-assurances--list .r-assurance>svg.lucide{grid-column:3;grid-row:1/span 2;width:var(--icon-sm);height:var(--icon-sm);color:var(--ink-muted)}
/* Card (guarantee page) */
.r-assurance--card{grid-template-columns:minmax(0,1fr);gap:var(--space-1);align-content:start;padding:var(--space-6);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);font-size:14px}
.r-assurance--card .r-assurance__icon{grid-row:auto;width:48px;height:48px;margin-bottom:var(--space-2)}
.r-assurance--card strong{font:600 16px/1.7 var(--font-sans)}
/* On cypress-deep (footer trust strip) */
.r-assurances--on-dark .r-assurance{color:var(--on-cypress)}
.r-assurances--on-dark .r-assurance__icon{background:color-mix(in srgb,var(--on-cypress) 12%,transparent);color:var(--lime-200)}
.r-assurances--on-dark .r-assurance>span:not(.r-assurance__icon){color:color-mix(in srgb,var(--on-cypress) 72%,transparent)}
.r-assurances--on-dark .r-assurance:focus-visible{outline-color:var(--lime-200)}

/* ───────── Stat ───────── */
.r-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-4);margin:0;padding:0;list-style:none}
.r-stat{display:grid;gap:2px;align-content:start;min-width:0;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}
.r-stat__value{color:var(--cypress);font:600 32px/1.4 var(--font-display)}
.r-stat__value small{margin-inline-start:var(--space-1);color:var(--ink-muted);font:500 14px/1 var(--font-sans)}
.r-stat__label{font:500 14px/1.7 var(--font-sans)}
.r-stat__note{color:var(--ink-muted);font-size:12px}
.r-stats--band{padding:var(--space-6);border-radius:var(--radius-lg);background:var(--cypress-deep);color:var(--on-cypress)}
.r-stats--band .r-stat{padding:0;border:0;background:none}
.r-stats--band .r-stat__value{color:var(--lime-200)}
.r-stats--band :is(.r-stat__value small,.r-stat__note){color:color-mix(in srgb,var(--on-cypress) 72%,transparent)}

@media (hover:hover) and (pointer:fine){
  :is(a,button).r-assurance:hover strong{color:var(--cypress)}
  #p-assure :is(a,button).r-assurance:hover .r-assurance__icon{transform:translateY(-2px) rotate(-4deg) scale(1.06)}
  .r-assurances--on-dark :is(a,button).r-assurance:hover strong{color:var(--lime-200)}
}
@media (prefers-reduced-motion:reduce){#p-assure .r-assurance__icon{animation:none}}
@media (max-width:640px){
  .r-assurances:not(.r-assurances--list){grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-3)}
  .r-assurances.r-assurances--quad{grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
  .r-assurances--quad .r-assurance{min-height:80px;padding:var(--space-3);column-gap:var(--space-2)}
  .r-assurances--quad .r-assurance__icon{width:30px;height:30px}
  .r-assurances--quad .r-assurance strong{font-size:13px;line-height:1.6}
  .r-assurances--quad .r-assurance>span:not(.r-assurance__icon){font-size:11px;line-height:1.6}
  .r-stats{gap:var(--space-3)}
  .r-stats--band{padding:var(--space-4);gap:var(--space-4)}
}

/* ═════════ v1.1 · Forms ═════════ */
.r-link:disabled{color:var(--ink-muted);cursor:not-allowed;text-decoration-color:transparent}

/* ───────── Textarea (auto-grow, counter) ───────── */
textarea.r-textarea{max-height:320px;resize:none;overflow:hidden}
.r-field__meta{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}
.r-field__meta .r-help{flex:1}
.r-counter{flex-shrink:0;color:var(--ink-muted);font:400 12px/1.8 var(--font-sans)}
.r-counter[data-tone=warning]{color:var(--warning)}

/* ───────── OTP input (one real input over drawn cells) ───────── */
.r-otp{position:relative;display:block;width:fit-content;margin-inline:auto;direction:ltr}
.r-otp__input{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;font-size:16px;cursor:text}
.r-otp__cells{display:flex;gap:var(--space-2)}
.r-otp__cells span{display:grid;place-items:center;width:var(--control-height);height:52px;border:1px solid var(--control);border-radius:var(--radius-md);background:var(--surface);font:600 20px/1 var(--font-sans);transition:border-color var(--duration-fast) var(--ease-color),box-shadow var(--duration-fast) var(--ease-color)}
.r-otp:focus-within .r-otp__cells .is-active{border-color:var(--cypress);box-shadow:0 0 0 1px var(--cypress),0 0 0 5px var(--tint)}
.r-otp:has([aria-invalid=true]) .r-otp__cells span{border-color:var(--error);box-shadow:0 0 0 1px var(--error)}
.r-otp:has(input:disabled) .r-otp__cells span{border-color:var(--line);background:var(--surface-sunken);color:var(--ink-muted)}
.r-resend{font-variant-numeric:tabular-nums}
.r-resend__time{font-weight:400}

/* ───────── Range (two thumbs) ───────── */
.r-range{--lo:0;--hi:1;display:grid;gap:var(--space-1);min-width:0}
.r-range__track{position:relative;height:var(--control-height)}
.r-range__track::before,.r-range__track::after{content:'';position:absolute;top:50%;height:4px;margin-top:-2px;border-radius:var(--radius-full)}
.r-range__track::before{inset-inline:0;background:var(--line)}
.r-range__track::after{inset-inline-start:calc(14px + (100% - 28px) * var(--lo));inset-inline-end:calc(14px + (100% - 28px) * (1 - var(--hi)));background:var(--cypress)}
.r-range input{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;background:none;appearance:none;-webkit-appearance:none;pointer-events:none}
.r-range input:focus{outline:none}
.r-range input::-webkit-slider-runnable-track{height:28px;background:none}
.r-range input::-moz-range-track{height:28px;background:none}
.r-range input::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border:2px solid var(--cypress);border-radius:var(--radius-full);background:var(--surface);box-shadow:var(--shadow-soft);cursor:grab;pointer-events:auto}
.r-range input::-moz-range-thumb{box-sizing:border-box;width:28px;height:28px;border:2px solid var(--cypress);border-radius:var(--radius-full);background:var(--surface);box-shadow:var(--shadow-soft);cursor:grab;pointer-events:auto}
.r-range input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--surface),0 0 0 5px var(--focus)}
.r-range input:focus-visible::-moz-range-thumb{box-shadow:0 0 0 2px var(--surface),0 0 0 5px var(--focus)}
.r-range__values{display:flex;justify-content:space-between;gap:var(--space-3);color:var(--ink-muted);font-size:13px}

/* ───────── Upload ───────── */
.r-upload{display:grid;gap:var(--space-3);min-width:0}
.r-upload__drop{position:relative;display:grid;justify-items:center;gap:2px;padding:var(--space-6) var(--space-4);border:1.5px dashed var(--control);border-radius:var(--radius-md);background:var(--surface);color:var(--ink-muted);font-size:12px;text-align:center;cursor:pointer;transition:border-color var(--duration-fast) var(--ease-color),background-color var(--duration-fast) var(--ease-color)}
.r-upload__drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.r-upload__drop svg.lucide{width:24px;height:24px;margin-bottom:var(--space-1);color:var(--cypress)}
.r-upload__drop strong{color:var(--cypress);font:500 14px/1.7 var(--font-sans)}
.r-upload__drop:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:3px}
.r-upload__drop[data-over]{border-color:var(--cypress);background:var(--tint)}
.r-upload__list{display:flex;flex-wrap:wrap;gap:var(--space-3);margin:0;padding:0;list-style:none}
.r-upload__list:empty{display:none}
.r-upload__list li{position:relative;width:72px;height:72px;border-radius:var(--radius-sm);background:var(--surface-sunken)}
.r-upload__list :is(img,video){display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover}
.r-upload__list .r-icon-btn{position:absolute;top:-10px;left:-10px;width:24px;height:24px;border-color:var(--line);border-radius:var(--radius-full);background:var(--surface)}
.r-upload__list .r-icon-btn::before{content:'';position:absolute;inset:-10px}
.r-upload__list .r-icon-btn svg.lucide{width:12px;height:12px}
/* Document tile (PDF and other non-media files): icon, name, size in place of a preview */
.r-upload__list li.r-upload__file{display:grid;grid-template-columns:auto minmax(0,1fr);align-content:center;column-gap:var(--space-2);width:min(240px,100%);padding:var(--space-2) var(--space-3);border:1px solid var(--line);background:var(--surface)}
.r-upload__file>svg.lucide{grid-row:span 2;width:24px;height:24px;color:var(--cypress)}
.r-upload__name{overflow:hidden;font:500 13px/1.6 var(--font-sans);text-overflow:ellipsis;white-space:nowrap}
.r-upload__size{color:var(--ink-muted);font-size:12px;line-height:1.6}

/* ───────── Radio card (add to a .r-radio label) ───────── */
.r-radio-cards{display:grid;gap:var(--space-3);min-width:0}
.r-radio-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);transition:border-color var(--duration-fast) var(--ease-color),box-shadow var(--duration-fast) var(--ease-color),background-color var(--duration-fast) var(--ease-color)}
.r-radio-card .r-radio__dot{margin-top:2px}
.r-radio-card:has(input:checked){border-color:var(--cypress);box-shadow:0 0 0 1px var(--cypress);background:var(--tint)}
.r-radio-card:has(input:disabled){background:var(--surface-sunken);cursor:not-allowed}
.r-radio-card__body{display:grid;gap:2px;min-width:0}
.r-radio-card__body>strong{font-weight:500}
.r-radio-card__body>span{color:var(--ink-muted);font-size:12px}
.r-radio-card__end{font-weight:500;text-align:end;white-space:nowrap}
.r-radio-card__end .r-price{font-size:14px}

/* ───────── Address card ───────── */
.r-address{display:grid;gap:var(--space-2);min-width:0;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);font-size:14px}
.r-address__head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.r-address__head strong{font-weight:500}
.r-address__lines{display:grid;gap:2px;color:var(--ink-muted);font-size:14px;font-style:normal}
.r-address__actions{display:flex;flex-wrap:wrap;gap:0 var(--space-4)}

@media (hover:hover) and (pointer:fine){
  .r-upload__drop:hover{border-color:var(--cypress)}
  .r-radio-card:hover:not(:has(input:checked,input:disabled)){border-color:var(--control)}
}

/* ═════════ v1.1 · Club ═════════ */
/* ───────── Progress ───────── */
.r-progress{display:grid;gap:var(--space-1);min-width:0;font-size:14px}
.r-progress__head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3);font-weight:500}
.r-progress__head>:last-child{color:var(--ink-muted);font-size:12px;font-weight:400;white-space:nowrap}
.r-progress__bar{height:8px;border-radius:var(--radius-full);background:var(--surface-sunken);overflow:hidden}
.r-progress__bar>span{display:block;height:100%;border-radius:inherit;background:var(--cypress);transform:translateX(calc(100% - var(--v)));transition:transform var(--duration-slow) var(--ease-out)}
.r-progress>p{color:var(--ink-muted);font-size:12px}

/* ───────── Level chip (جوانه → نهال → سرو) ───────── */
.r-level{display:inline-flex;align-items:center;gap:var(--space-1);padding:1px 8px 1px 10px;border-radius:var(--radius-full);background:var(--lime-100);color:var(--cypress);font:500 12px/1.9 var(--font-sans);white-space:nowrap}
.r-level svg.lucide{width:14px;height:14px}
.r-level--2{background:var(--lime-400);color:var(--ink)}
.r-level--3{background:var(--cypress);color:var(--on-cypress)}

/* ───────── Badge medal ───────── */
.r-medal{display:inline-grid;justify-items:center;gap:var(--space-1);width:88px;font:500 12px/1.6 var(--font-sans);text-align:center}
.r-medal__disc{display:grid;place-items:center;width:56px;height:56px;border-radius:var(--radius-full);background:var(--lime-200);color:var(--cypress);box-shadow:inset 0 0 0 3px var(--surface),0 0 0 2px var(--lime-400)}
.r-medal__disc svg.lucide{width:24px;height:24px}
.r-medal.is-locked{color:var(--ink-muted)}
.r-medal.is-locked .r-medal__disc{background:var(--surface-sunken);color:var(--ink-muted);box-shadow:inset 0 0 0 1px var(--line)}
.r-medal--sm{width:auto;vertical-align:middle}
.r-medal--sm .r-medal__disc{width:22px;height:22px;box-shadow:none}
.r-medal--sm .r-medal__disc svg.lucide{width:13px;height:13px}

/* ───────── Mission card ───────── */
.r-mission{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-3);align-items:start;min-width:0;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}
.r-mission__icon{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-md);background:var(--lime-100);color:var(--cypress)}
.r-mission__body{display:grid;gap:var(--space-2);min-width:0}
.r-mission__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-1) var(--space-2)}
.r-mission h3{font:500 14px/1.7 var(--font-sans)}
.r-mission__body>p{color:var(--ink-muted);font-size:12px}
.r-mission.is-done{border-color:transparent;background:var(--lime-100)}
.r-mission.is-done .r-mission__icon{background:var(--cypress);color:var(--on-cypress)}

/* ═════════ v1.1 · Chat ═════════ */
/* ───────── Launcher (bottom-left, above the mobile bar, the compare tray and nothing else) ───────── */
.r-root:has(.r-chat-launcher){--r-launcher:64px}
.r-chat-launcher{position:fixed;left:var(--space-6);bottom:calc(var(--r-dock) + var(--r-tray,0px) + var(--space-6));z-index:var(--z-header);display:inline-flex;align-items:center;gap:var(--space-2);min-height:52px;padding:0 var(--space-4);border:0;border-radius:var(--radius-full);background:var(--cypress);color:var(--on-cypress);font:500 14px/1 var(--font-sans);box-shadow:var(--shadow-float);cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color)}
.r-chat-launcher:active{transform:scale(.96)}
.r-chat-launcher:focus-visible{outline-offset:3px}
.r-toaster{bottom:calc(var(--r-dock) + var(--r-tray,0px) + var(--r-launcher,0px) + var(--space-6))}

/* ───────── Panel (a .r-drawer: side panel on desktop, full screen on mobile) ───────── */
.r-chat .r-drawer__head{padding-bottom:var(--space-3);border-bottom:1px solid var(--line)}
.r-chat .r-drawer__body{display:flex;flex-direction:column;gap:var(--space-4);padding-block:var(--space-4)}
.r-chat__status{display:flex;align-items:center;gap:6px;color:var(--ink-muted);font:400 12px/1.8 var(--font-sans)}
.r-chat__status::before{content:'';width:8px;height:8px;border-radius:var(--radius-full);background:var(--success)}
.r-chat__status.is-offline::before{background:var(--control)}
.r-chat__context{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--space-3);align-items:center;padding:var(--space-2);border:1px solid var(--line);border-radius:var(--radius-md);font-size:13px}
.r-chat__context img{display:block;width:40px;height:50px;border-radius:var(--radius-sm);object-fit:cover}
.r-chat__context span{display:block;color:var(--ink-muted);font-size:12px}
.r-chat__form{display:grid;gap:var(--space-3)}
.r-chat__thread{display:flex;flex-direction:column;gap:var(--space-2);margin:0;padding:0;list-style:none}
.r-chat__note{align-self:center;color:var(--ink-muted);font-size:12px;text-align:center}
.r-chat__composer{display:flex;align-items:flex-end;gap:var(--space-2)}
.r-chat__composer textarea.r-input{flex:1;min-height:var(--control-height);max-height:120px;padding:8px 14px;font-size:16px;line-height:1.6}

/* ───────── Message bubble ───────── */
.r-bubble{max-width:82%;padding:8px 12px;border-radius:var(--radius-lg);font-size:14px;overflow-wrap:anywhere}
.r-bubble--me{align-self:flex-start;border-end-start-radius:var(--radius-sm);background:var(--cypress);color:var(--on-cypress)}
.r-bubble--agent{align-self:flex-end;border-end-end-radius:var(--radius-sm);background:var(--surface-sunken)}
.r-bubble__from{display:block;color:var(--cypress);font-size:12px;font-weight:500}
.r-bubble img{display:block;max-width:100%;margin-bottom:var(--space-1);border-radius:var(--radius-md)}
.r-bubble time{display:block;margin-top:2px;font-size:12px;opacity:.72}

/* ───────── Quick replies ───────── */
.r-quick{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.r-quick button{min-height:40px;padding:0 14px;border:1px solid var(--cypress);border-radius:var(--radius-full);background:var(--surface);color:var(--cypress);font:500 13px/1.7 var(--font-sans);cursor:pointer;transition:transform var(--duration-press) var(--ease-out),background-color var(--duration-fast) var(--ease-color)}
.r-quick button:active{transform:scale(.97)}

@media (hover:hover) and (pointer:fine){
  .r-chat-launcher:hover{background:var(--cypress-hover)}
  .r-quick button:hover{background:var(--tint)}
}
@media (max-width:640px){
  .r-chat-launcher{left:var(--space-4);bottom:calc(var(--r-dock) + var(--r-tray,0px) + var(--space-4));width:52px;padding:0;justify-content:center}
  .r-chat-launcher>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .r-toaster{bottom:calc(var(--r-dock) + var(--r-tray,0px) + var(--r-launcher,0px) + var(--space-4))}
}

/* ═════════ v1.2 · Storefront surfaces ═════════ */
/* ───────── Panel: a surface block that groups one page section ───────── */
.r-panel{min-width:0;padding:var(--space-6);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}
.r-panel--lime{border-color:transparent;background:var(--surface);box-shadow:var(--shadow-soft)}
.r-panel--tint{border-color:transparent;background:var(--tint)}
@media (min-width:961px){.r-panel--roomy{padding:var(--space-8)}}
@media (max-width:640px){.r-panel{padding:var(--space-4)}}

/* ───────── Soft search field (header): no outline until focused ───────── */
.r-search--soft .r-input{border-color:transparent;border-radius:var(--radius-full);background:var(--surface-sunken);font-size:14px}
.r-search--soft .r-input:focus{background:var(--surface);border-color:var(--cypress)}
.r-search--soft>svg.lucide{right:16px}
.r-search--soft .r-input{padding-right:46px}
.r-search--soft .r-search__clear{left:6px}

/* ───────── Landing blocks: category card, banner, ranked list, rail with previous/next ───────── */

.r-banner{display:grid;gap:var(--space-4);align-items:center;min-width:0;padding:var(--space-6);overflow:hidden;border-radius:var(--radius-lg);background:var(--cypress-deep);color:var(--on-cypress)}
.r-banner__body{display:grid;gap:var(--space-2);justify-items:start;min-width:0}
.r-banner__body .r-btn{margin-top:var(--space-2)}
.r-banner__title{margin:0;font:700 24px/1.5 var(--font-display);text-wrap:balance}
.r-banner__text{margin:0;color:color-mix(in srgb,var(--on-cypress) 78%,transparent)}
.r-banner__img{display:block;width:100%;aspect-ratio:16/9;border-radius:var(--radius-md);background-size:cover;background-position:center;background-repeat:no-repeat}
.r-banner--lime{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-soft)}
.r-banner--lime .r-banner__text{color:var(--ink)} /* --ink-muted on --lime-200 is 4.39:1; --ink is 10.86:1 */

.r-ranks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-4);margin:0;padding:0;list-style:none;counter-reset:rank}
.r-rank{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr) 64px;gap:var(--space-3);align-items:center;min-height:88px;padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-soft);counter-increment:rank}
.r-rank::before{content:counter(rank,persian);font:700 28px/1 var(--font-display);color:var(--cypress);text-align:center}
.r-rank:first-child{border-color:transparent;background:var(--lime-100)}
.r-rank__body{display:grid;gap:2px;min-width:0;padding-inline-start:var(--space-3);border-inline-start:1px solid var(--line)}
.r-rank__title{margin:0;overflow:hidden;font:500 14px/1.8 var(--font-sans);text-overflow:ellipsis;white-space:nowrap}
.r-rank__title a{color:inherit;text-decoration:none}
.r-rank__title a::before{content:'';position:absolute;inset:0;border-radius:inherit}
.r-rank .r-price{font-size:14px}
.r-ranks--plain{grid-template-columns:repeat(2,minmax(0,1fr))}
.r-ranks--plain .r-rank{grid-template-columns:minmax(0,1fr) 64px}
.r-ranks--plain .r-rank::before{content:none}
.r-ranks--plain .r-rank:first-child{border-color:var(--line);background:var(--surface)}
.r-ranks--plain .r-rank__body{padding-inline-start:0;border-inline-start:0}
.r-rank__img{width:64px;height:64px;border-radius:var(--radius-md);background-size:cover;background-position:center;background-repeat:no-repeat}

.r-rail{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-2);min-width:0}
.r-rail .r-products{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc((100% - var(--space-3)) / 2);gap:var(--space-3);justify-content:start;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:var(--space-2) 2px 40px;margin-block-end:-28px}
.r-rail .r-product{scroll-snap-align:start}
.r-rail.is-dragging :is(.r-products,.r-cat-tiles){scroll-snap-type:none;cursor:grabbing;user-select:none}
.r-rail__nav{display:none}
.r-rail__nav--prev{inset-inline-start:calc(-1 * var(--space-3))}
.r-rail__nav--next{inset-inline-end:calc(-1 * var(--space-3))}
.r-rail__nav[hidden]{display:none}
.r-rail__dots{display:flex;justify-content:center;gap:0;margin-top:var(--space-1)}
.r-rail__dots:empty{display:none}
.r-rail__dot{position:relative;width:24px;height:24px;padding:0;border:0;background:none;cursor:pointer;transition:width var(--duration-fast) var(--ease-out)}
.r-rail__dot::before{content:'';position:absolute;inset:9px;border-radius:var(--radius-full);background:var(--control);transition:background var(--duration-fast) var(--ease-out)}
.r-rail__dot[aria-current]{width:40px}
.r-rail__dot[aria-current]::before{background:var(--ink-muted)}
@media (hover:hover) and (pointer:fine){
  .r-rail :is(.r-products,.r-cat-tiles){cursor:grab}
  .r-rank:hover{border-color:var(--control)}
}
@media (max-width:640px){
  
  .r-rail__nav{display:none}
}
@media (min-width:641px){
  .r-banner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-8);padding:var(--space-8)}
  .r-banner__img{height:100%;min-height:200px;aspect-ratio:auto}
  .r-rail{padding-inline:0}
  .r-rail__nav--prev{inset-inline-start:0}
  .r-rail__nav--next{inset-inline-end:0}
  .r-rail .r-products{grid-auto-columns:220px;gap:var(--space-4)}
}
@media (min-width:1024px){
  .r-rail .r-products{grid-auto-columns:220px}
}
@media (max-width:640px){
  .r-ranks--plain{gap:var(--space-2)}
  .r-ranks--plain .r-rank{grid-template-columns:minmax(0,1fr) 48px;gap:var(--space-2);min-height:72px;padding:var(--space-2) var(--space-3)}
  .r-ranks--plain .r-rank__title{white-space:normal;line-height:1.6}
  .r-ranks--plain .r-rank__img{width:48px;height:48px}
}

/* ───────── Figures: store numbers as icon cards (the lighter sibling of .r-stats--band) ───────── */
.r-figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3);margin:0;padding:0;list-style:none}
.r-figure{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon value" "icon label";column-gap:var(--space-3);align-items:center;min-width:0;padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-soft)}
.r-figure__icon{grid-area:icon;display:grid;place-items:center;color:var(--ink-muted)}
.r-figure__icon svg.lucide{width:28px;height:28px}
.r-figure__value{grid-area:value;color:var(--ink);font:700 20px/1.4 var(--font-display)}
.r-figure__value small{margin-inline-start:var(--space-1);color:var(--ink-muted);font:500 12px/1 var(--font-sans)}
.r-figure__label{grid-area:label;color:var(--ink-muted);font:500 13px/1.5 var(--font-sans)}
.r-figure__note{display:none}
@media (min-width:1024px){
  .r-figures{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4)}
}
@media (max-width:640px){
  .r-ranks{gap:var(--space-2)}
  .r-ranks:not(.r-ranks--plain) .r-rank{grid-template-columns:minmax(0,1fr) 44px;grid-template-areas:"n img" "body body";gap:var(--space-2);padding:var(--space-3)}
  .r-ranks:not(.r-ranks--plain) .r-rank::before{grid-area:n;font-size:24px;text-align:start}
  .r-ranks:not(.r-ranks--plain) .r-rank__img{grid-area:img;width:44px;height:44px}
  .r-ranks:not(.r-ranks--plain) .r-rank__body{grid-area:body;padding-inline-start:0;border-inline-start:0}
  .r-ranks:not(.r-ranks--plain) .r-rank__title{white-space:normal;line-height:1.6}
}
@media (min-width:641px){
}
@media (min-width:961px){
  .r-ranks:not(.r-ranks--plain){grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ───────── Countdown to a real end time (sale blocks only) ───────── */
.r-countdown{display:flex;flex-direction:row-reverse;justify-content:center;gap:var(--space-1)}
.r-countdown[hidden]{display:none}
.r-countdown__cell{display:grid;justify-items:center;gap:2px;min-width:48px;padding:6px var(--space-1);border-radius:var(--radius-md);background:var(--sale-soft);color:var(--sale)}
.r-countdown__cell strong{font:700 20px/1.3 var(--font-display);font-variant-numeric:tabular-nums}
.r-countdown__cell small{color:inherit;font-size:11px;line-height:1.4}

/* ═════════ v1.3 · Footer, access and print ═════════ */
/* ───────── Logo strip: payment and carrier logos (footer), each on a small light tile so any logo reads on cypress-deep ───────── */
.r-logos{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);margin:0;padding:0;list-style:none}
.r-logos>li{display:flex;align-items:center;min-height:var(--control-height);padding-inline:var(--space-3);border-radius:var(--radius-sm);background:var(--surface)}
.r-logos img{display:block;width:auto;max-width:96px;height:24px;object-fit:contain}
.r-logos a{display:flex;align-items:center;align-self:stretch;margin-inline:calc(-1 * var(--space-3));padding-inline:var(--space-3);border-radius:inherit}
.r-logos a:focus-visible{outline-offset:2px}
.r-logos--seal>li{padding:var(--space-2)}
.r-logos--seal img{max-width:72px;height:78px}
.r-logos--seal a{margin:calc(-1 * var(--space-2));padding:var(--space-2)}

/* ───────── Invoice: the order's printable sales invoice (account order page); not an official tax invoice ───────── */
.r-invoice{display:grid;gap:var(--space-6);min-width:0;padding:var(--space-6);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);font-size:14px}
.r-invoice :is(.r-invoice__party,.r-invoice__notes)>:is(h2,h3,h4,h5){margin:0;font:600 14px/1.7 var(--font-sans)} /* any level: the page decides the outline */
.r-invoice address{display:grid;font-style:normal}
.r-invoice dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px var(--space-4);margin:0}
.r-invoice dt{color:var(--ink-muted)}
.r-invoice dd{margin:0}
.r-invoice__head{display:grid;gap:var(--space-4);padding-bottom:var(--space-6);border-bottom:1px solid var(--line)}
.r-invoice__seller{display:grid;gap:var(--space-1);align-content:start;justify-items:start}
.r-invoice__seller .r-wordmark{font-size:32px}
.r-invoice__seller address{color:var(--ink-muted);font-size:12px;line-height:1.8}
.r-invoice__seller address strong{color:var(--ink);font:500 14px/1.7 var(--font-sans)}
.r-invoice__meta{display:grid;gap:var(--space-2);align-content:start}
.r-invoice__title{margin:0;font:600 24px/1.5 var(--font-display)}
.r-invoice__parties{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:var(--space-4)}
.r-invoice__party{display:grid;gap:var(--space-1);align-content:start}
.r-invoice__items{width:100%;border-collapse:collapse}
.r-invoice__items th{padding:var(--space-2);border-bottom:1px solid var(--control);color:var(--ink-muted);font:500 12px/1.8 var(--font-sans);text-align:start;white-space:nowrap}
.r-invoice__items td{padding:var(--space-3) var(--space-2);border-bottom:1px solid var(--line);vertical-align:top}
.r-invoice__items td small{display:block;color:var(--ink-muted);font-size:12px}
.r-invoice__items .r-invoice__num{text-align:end;white-space:nowrap;font-variant-numeric:tabular-nums}
.r-invoice__foot{display:grid;gap:var(--space-4);align-items:start}
.r-invoice__foot .r-summary{margin:0}
.r-invoice__notes{display:grid;gap:var(--space-1);color:var(--ink-muted);font-size:12px}
.r-invoice__notes>:is(h2,h3,h4,h5){color:var(--ink)}
.r-invoice__notes p{margin:0}
.r-invoice__actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}
/* A run of invoices (the staff print view): a bar of actions and notices, then the invoices one after another. */
.r-invoices{display:grid;gap:var(--space-6);width:100%;max-width:calc(var(--container) + 2 * var(--space-4));margin-inline:auto;padding:var(--space-6) var(--space-4)}
.r-invoices__bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}
.r-invoices__bar>:first-child{margin:0;margin-inline-end:auto;font:600 20px/1.5 var(--font-display)}
@media (min-width:641px){
  .r-invoice__head{grid-template-columns:minmax(0,1fr) auto}
  .r-invoice__foot{grid-template-columns:minmax(0,1fr) minmax(240px,320px)}
  .r-invoice__foot .r-summary{grid-column:2;grid-row:1}
}
/* Phone screens: each item row becomes a short list (name, then label and value lines); the row number is dropped. */
@media screen and (max-width:640px){
  .r-invoice{padding:var(--space-4)}
  .r-invoice__items,.r-invoice__items tbody{display:block}
  .r-invoice__items thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .r-invoice__items tr{display:grid;gap:2px;padding-block:var(--space-3);border-bottom:1px solid var(--line)}
  .r-invoice__items td{padding:0;border:0}
  .r-invoice__items td:first-child{display:none}
  .r-invoice__items td+td{font-weight:500}
  .r-invoice__items td.r-invoice__num{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);font-weight:400}
  .r-invoice__items td.r-invoice__num::before{content:attr(data-label);color:var(--ink-muted);font-size:12px}
  .r-invoice__items td.r-invoice__num:last-child{font-weight:600}
}

/* ───────── Print: no shell chrome, no ink-heavy backgrounds; a page holding an invoice prints the invoice alone ───────── */
@media print{
  @page{margin:12mm}
  .r-root{print-color-adjust:economy;-webkit-print-color-adjust:economy}
  .r-canvas,.r-root{background:none}
  .r-header,.r-mega,.r-bottom-bar,.r-buy-bar,.r-chat-launcher,.r-toaster,.r-compare-tray,.r-anchor-nav,.r-invoice__actions{display:none!important}
  body:has(.r-invoice){margin:0;padding:0;background:none}
  body:has(.r-invoice) *:not(.r-invoice,.r-invoice *,:has(.r-invoice)){display:none!important}
  body:has(.r-invoice) :has(.r-invoice){display:block!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
  .r-invoice{display:block;padding:0;border:0;border-radius:0;background:none;font-size:12px}
  .r-invoice *{background:none!important;box-shadow:none!important}
  .r-invoice>*+*{margin-top:var(--space-6)}
  .r-invoice__head{grid-template-columns:minmax(0,1fr) auto}
  .r-invoice__foot{grid-template-columns:minmax(0,1fr) minmax(240px,320px)}
  .r-invoice__foot .r-summary{grid-column:2;grid-row:1}
  .r-invoice__seller .r-wordmark{color:var(--ink)}
  .r-invoice a{color:inherit;text-decoration:none}
  .r-invoice__items thead{display:table-header-group}
  .r-invoice__items tr,.r-invoice__head,.r-invoice__party,.r-invoice__foot{break-inside:avoid}
  .r-invoice__foot{break-before:avoid}
  .r-invoice~.r-invoice{break-before:page;margin-top:0}
}

/* ───────── Product page v2 (v1.2): rail gallery, sold figure, pay note, club mark ───────── */
.r-gallery--rail{grid-template-columns:minmax(0,1fr)}
.r-gallery--rail .r-gallery__stage{grid-column:1;grid-row:1}
.r-gallery--rail .r-gallery__slide{aspect-ratio:4/3}
.r-gallery--rail .r-gallery__thumbs{grid-column:1;grid-row:2;display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:var(--space-2);height:auto;min-height:0;padding:2px;overflow:visible}
.r-gallery--rail .r-gallery__thumbs>button{width:auto;aspect-ratio:4/3;transition:box-shadow var(--duration-fast) var(--ease-color),transform var(--duration-press) var(--ease-out)}
.r-gallery--rail .r-gallery__thumbs>button:active{transform:scale(.97)}
.r-shipping-note{display:flex;align-items:center;gap:var(--space-3);margin-top:var(--space-3);padding:var(--space-3) var(--space-4);border:1px solid var(--success);border-radius:var(--radius-md);background:var(--success-soft);color:var(--success)}
.r-shipping-note__icon{display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;border-radius:var(--radius-sm);background:var(--surface);box-shadow:var(--shadow-soft);animation:r-shipping-truck 4.8s var(--ease-out) infinite}
.r-shipping-note__icon svg{width:22px;height:22px;animation:r-shipping-icon 4.8s var(--ease-out) infinite}
.r-shipping-note__content{display:grid;gap:2px;min-width:0}
.r-shipping-note__content strong{font:600 14px/1.5 var(--font-sans)}
.r-shipping-note__copy{color:var(--ink-muted);font:400 12px/1.6 var(--font-sans);transition:opacity var(--duration-fast) var(--ease-out),filter var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}
.r-shipping-note__copy.is-changing{opacity:0;filter:blur(2px);transform:translateY(4px)}
@keyframes r-shipping-truck{0%,72%,100%{transform:translateX(0)}12%{transform:translateX(-4px)}28%{transform:translateX(3px)}42%{transform:translateX(0)}}
@keyframes r-shipping-icon{0%,68%,100%{transform:scale(1) rotate(0)}16%{transform:scale(1.08) rotate(-5deg)}30%{transform:scale(1.02) rotate(3deg)}44%{transform:scale(1) rotate(0)}}
@media (prefers-reduced-motion:reduce){.r-shipping-note__icon,.r-shipping-note__icon svg{animation:none}.r-shipping-note__copy{transition:none}}

.r-rating--plain a{text-decoration:none}

.r-sold{position:relative;display:inline-grid;justify-items:center;gap:0;color:var(--success);text-align:center}
.r-sold strong{font:600 36px/1.2 var(--font-display);font-variant-numeric:tabular-nums}
.r-sold span{font:500 14px/1.6 var(--font-sans)}
.r-sold::before,.r-sold::after,.r-sold strong::before{content:"♥";position:absolute;z-index:1;color:var(--sale);font:500 16px/1 var(--font-sans);pointer-events:none;opacity:0;animation:r-sold-heart-rise calc(var(--duration-slow) * 12) var(--ease-out) both}
.r-sold::before{inset-inline-start:-4px;top:6px}
.r-sold::after{inset-inline-end:-4px;top:6px;animation-delay:var(--duration-fast)}
.r-sold strong::before{inset-inline-start:50%;top:0;animation-delay:calc(var(--duration-fast) * 2)}
@keyframes r-sold-heart-rise{0%{transform:translateY(4px) scale(.5);opacity:0}22%{opacity:1}100%{transform:translateY(-42px) scale(.9);opacity:0}}
@media (prefers-reduced-motion:reduce){.r-sold::before,.r-sold::after,.r-sold strong::before{animation:none}}

.r-pay-note{display:grid;justify-items:end;gap:2px;margin:0;color:var(--ink-muted);font:400 12px/1.7 var(--font-sans);text-align:end}
.r-pay-note strong{color:var(--ink);font-weight:600}

.r-installments{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3);overflow:hidden;border:0;border-radius:var(--radius-md);background:var(--pay-soft);color:var(--ink);font:500 12px/1.6 var(--font-sans)}
.r-installments::before{position:absolute;z-index:0;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--pay) 13%,transparent),color-mix(in srgb,var(--pay) 27%,transparent));content:'';opacity:0;pointer-events:none}
.r-installments.is-revealed::before{animation:r-installments-fill 680ms var(--ease-out) forwards,r-installments-loop 4.8s var(--ease-in-out) 1.6s infinite}
@keyframes r-installments-loop{0%{clip-path:inset(0 0 0 100%);opacity:1}35%{clip-path:inset(0);opacity:1}70%{clip-path:inset(0);opacity:.6}100%{clip-path:inset(0 0 0 100%);opacity:.6}}
.r-installments__label,.r-installments__brands{position:relative;z-index:1;display:flex;align-items:center;gap:var(--space-2)}
.r-installments__label{font-weight:600}
.r-installments__brands{gap:var(--space-1)}
.r-installments__provider{display:grid;place-items:center;min-width:48px;height:40px;padding:4px 7px;border-radius:var(--radius-sm);background:var(--surface);transition:transform 180ms var(--ease-out),box-shadow 180ms ease}
.r-installments__provider>img{display:block;max-width:42px;max-height:32px;object-fit:contain}
@keyframes r-installments-fill{0%{clip-path:inset(0 0 0 100%);opacity:1}78%{clip-path:inset(0);opacity:1}100%{clip-path:inset(0);opacity:.72}}
@keyframes r-installments-provider-arrive{0%{transform:translateY(5px) scale(.96)}65%{transform:translateY(-2px) scale(1.025)}100%{transform:translateY(0) scale(1)}}
@keyframes r-installments-provider-loop{0%,22%,100%{transform:translateY(0) scale(1)}8%{transform:translateY(-3px) scale(1.04)}}
.r-installments.is-revealed .r-installments__provider{animation:r-installments-provider-arrive 320ms var(--ease-out) backwards,r-installments-provider-loop 4.8s var(--ease-in-out) infinite}
.r-installments.is-revealed .r-installments__provider:nth-child(1){animation-delay:520ms,1.9s}
.r-installments.is-revealed .r-installments__provider:nth-child(2){animation-delay:580ms,2s}
.r-installments.is-revealed .r-installments__provider:nth-child(3){animation-delay:640ms,2.1s}
@media (hover:hover) and (pointer:fine){.r-installments__provider:hover{box-shadow:var(--shadow-soft);transform:translateY(-2px) scale(1.03)}}
@media (prefers-reduced-motion:reduce){.r-installments.is-revealed::before{animation:none;clip-path:inset(0);opacity:.45}.r-installments.is-revealed .r-installments__provider{animation:none}.r-installments__provider{transition:box-shadow 180ms ease}}

.r-club{border:1px solid var(--lime-400)}
.r-club__icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:var(--radius-full);background:var(--lime-400);color:var(--cypress-deep)}
.r-club__icon svg.lucide{width:var(--icon-md);height:var(--icon-md)}
.r-club__icon{position:relative}
.r-club__icon::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 2px var(--lime-400);opacity:0}
.r-club[data-reveal][data-ready]:not(.is-in) .r-club__icon{opacity:0;transform:scale(.9)}
.r-club.is-in .r-club__icon{animation:r-club-pop var(--duration-spring) var(--ease-spring) backwards}
.r-club.is-in .r-club__icon::after{animation:r-club-ring 800ms var(--ease-out) 250ms both}
@keyframes r-club-pop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@keyframes r-club-ring{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.9)}}
@media (prefers-reduced-motion:reduce){html:not([data-motion=full]) .r-club.is-in :is(.r-club__icon,.r-club__icon::after){animation:none}}
html[data-motion=reduced] .r-club.is-in :is(.r-club__icon,.r-club__icon::after){animation:none}

/* Stepper, stacked: the numbered circles in one row joined by a line, each title under its circle. Used inside the page, not the header. */
.r-stepper--stack{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);align-items:start;gap:0}
.r-stepper--stack li{position:relative;flex-direction:column;align-items:center;gap:0;text-align:center}
.r-stepper--stack li>*{flex-direction:column;gap:var(--space-2);min-height:0;white-space:normal}
.r-stepper--stack li+li::before{position:absolute;top:12px;inset-inline-start:calc(-50% + 20px);width:calc(100% - 40px)}
.r-stepper--stack li:not([aria-current=step])>*>span{position:static;width:auto;height:auto;overflow:visible;clip:auto}

/* Category sheet: a tall .r-dialog--sheet that walks a nested category list one level at a time. The markup is the whole
   tree (nested .r-cat-sheet__list); rada.js marks .is-current (the level on show), .is-trail (its ancestors) and .is-open
   (the item on the path). Level one: image cards (__card, .is-wide on a featured one = a full row). Deeper levels: three
   columns of round pictures (__tile with __pic). Parts: __lead (back button and title), __search, __tree, __found
   (__results chips, __hits for the host's product rows, __empty), __status. Motion stops under the reduced-motion rules above. */
.r-cat-sheet .r-dialog__body{display:grid;align-content:start;gap:var(--space-4)}
.r-cat-sheet__lead{display:flex;align-items:center;gap:var(--space-3);min-width:0}
.r-cat-sheet__lead h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.r-cat-sheet__back{flex:none}
.r-cat-sheet__status{margin:0}
.r-cat-sheet__lead [hidden],.r-cat-sheet__search[hidden],.r-cat-sheet__tree[hidden],.r-cat-sheet__found[hidden],.r-cat-sheet__empty[hidden]{display:none}
.r-cat-sheet__list{display:grid;gap:var(--space-4) var(--space-2);margin:0;padding:0;list-style:none;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.r-cat-sheet__list:not(.is-current):not(.is-trail){display:none}
.r-cat-sheet__list.is-trail{display:block}
.r-cat-sheet__list.is-trail>li:not(.is-open),.r-cat-sheet__list>li.is-open>:is(.r-cat-sheet__card,.r-cat-sheet__tile){display:none}
.r-cat-sheet__list.is-current{animation:r-cat-slide var(--duration-base) var(--ease-out) backwards}
.r-cat-sheet__list.is-current[data-dir=back]{animation-name:r-cat-slide-back}
.r-cat-sheet__list.is-current>li{animation:r-cat-in var(--duration-base) var(--ease-out) backwards;animation-delay:calc(var(--i,0) * var(--duration-stagger))}
.r-cat-sheet__list--root.is-current{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
.r-cat-sheet__list--root.is-current>li.is-wide{grid-column:1/-1}
.r-cat-sheet__card,.r-cat-card{position:relative;display:block;width:100%;aspect-ratio:4/5;overflow:hidden;padding:0;border:0;border-radius:var(--radius-lg);background:var(--cypress);color:var(--on-cypress);text-decoration:none;cursor:pointer;transition:transform var(--duration-press) var(--ease-spring)}
.is-wide>.r-cat-sheet__card,.r-cat-card--wide{aspect-ratio:2/1}
/* Landscape cards keep the mobile menu compact, including featured departments. */
.r-cat-sheet__card{aspect-ratio:3/2;min-height:88px}
.is-wide>.r-cat-sheet__card{aspect-ratio:3/1}
.r-cat-sheet__card:active,.r-cat-sheet__tile:active,.r-cat-card:active,.r-cat-tile:active{transform:scale(.975)}
.r-cat-sheet__card img,.r-cat-card img,.r-cat-card__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform var(--duration-slow) var(--ease-out)}
.r-cat-sheet__card::after,.r-cat-card::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,color-mix(in srgb,black 70%,transparent),transparent 55%)}
.r-cat-sheet__card .r-cat-sheet__title,.r-cat-card__title{position:absolute;z-index:1;inset-inline:var(--space-3);bottom:var(--space-3);text-align:start;font:600 17px/1.5 var(--font-display)}
.is-wide>.r-cat-sheet__card .r-cat-sheet__title,.r-cat-card--wide .r-cat-card__title{font-size:22px}
.r-cat-sheet__tile,.r-cat-tile{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);width:100%;padding:0;border:0;background:none;color:var(--ink);text-align:center;text-decoration:none;cursor:pointer;transition:transform var(--duration-press) var(--ease-spring)}
.r-cat-sheet__pic,.r-cat-tile__pic{display:grid;place-items:center;width:min(100%,84px);aspect-ratio:1;overflow:hidden;border-radius:var(--radius-full);background:var(--surface-sunken);color:var(--ink-muted)}
.r-cat-sheet__pic,.r-cat-tile__pic{border:1px solid var(--control)}
.r-cat-sheet__pic img,.r-cat-tile__pic img{width:100%;height:100%;object-fit:cover;transition:transform var(--duration-slow) var(--ease-out)}
.r-cat-sheet__pic svg.lucide,.r-cat-tile__pic svg.lucide{width:26px;height:26px}
.r-cat-sheet__tile .r-cat-sheet__title,.r-cat-tile__title{font:500 13px/1.6 var(--font-sans);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.r-cat-sheet__tile:active .r-cat-sheet__pic img,.r-cat-sheet__card:active img,.r-cat-tile:active .r-cat-tile__pic img,.r-cat-card:active :is(img,.r-cat-card__img){transform:scale(1.05)}
/* Category card (image, title over a scrim) and category tile (round picture, title below): the same looks as the mobile category sheet, usable on any page. */
.r-cat-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2)}
.r-cat-card{aspect-ratio:4/3}
.r-cat-cards>.r-cat-card--wide{grid-column:1/-1}
.r-cat-card__img{background-size:cover;background-position:center;background-repeat:no-repeat}
/* Finished category banners include their own title and keep the original 4:3 composition. */
.r-cat-card[data-category-banner]{aspect-ratio:4/3;background:var(--surface)}
.r-cat-card[data-category-banner]::after,.r-cat-card[data-category-banner] .r-cat-card__title{display:none}
.r-cat-card[data-category-banner]:is(:hover,:active) .r-cat-card__img{transform:none}
.r-cat-sheet__card[data-category-banner]{aspect-ratio:4/3;background:var(--surface)}
.is-wide>.r-cat-sheet__card[data-category-banner]{aspect-ratio:3/1}
.r-cat-sheet__card[data-category-banner]::after,.r-cat-sheet__card[data-category-banner] .r-cat-sheet__title{display:none}
.r-cat-sheet__card[data-category-banner]:is(:hover,:active) img{transform:none}
.r-mega:has(.r-mega__aside [data-category-banner]){grid-template-columns:300px minmax(0,1fr)}
.r-mega__aside .r-cat-card[data-category-banner]{aspect-ratio:16/9}
@media (max-width:1023px){
  .r-mega:has(.r-mega__aside [data-category-banner]){grid-template-columns:minmax(0,1fr)}
  .r-mega__aside .r-cat-card[data-category-banner]{max-width:320px}
}
@media (max-width:640px){
  .r-cat-cards:has([data-category-banner]){grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* Catalogue cutouts keep their white backdrop and full silhouette; editorial cards keep their own treatment. */
.r-cat-card[data-product-image],.r-cat-sheet__card[data-product-image]{background:var(--surface);color:var(--ink);border:1px solid var(--control)}
.r-cat-card[data-product-image]::after,.r-cat-sheet__card[data-product-image]::after{display:none}
.r-cat-card[data-product-image] .r-cat-card__img,.r-cat-sheet__card[data-product-image] img{inset:var(--space-3) var(--space-3) var(--space-12);width:calc(100% - var(--space-6));height:calc(100% - var(--space-12) - var(--space-3));object-fit:contain;background-size:contain}
.r-cat-card[data-product-image] .r-cat-card__title,.r-cat-sheet__card[data-product-image] .r-cat-sheet__title{text-align:center;font-size:14px}
.r-cat-card--art::after,.r-cat-sheet__card--art::after{display:none}
.r-cat-card--art .r-cat-card__title,.r-cat-sheet__card--art .r-cat-sheet__title{inset-inline:auto var(--space-3);bottom:auto;top:50%;max-inline-size:44%;color:var(--ink);font:600 17px/1.3 var(--font-display);text-align:start;transform:translateY(-50%)}
.r-cat-card__title{font-size:14px}
@media (max-width:640px){
  .r-cat-cards .r-cat-card[data-product-image] .r-cat-card__img{inset:var(--space-1) var(--space-2) calc(var(--space-8) + var(--space-2));width:calc(100% - var(--space-4));height:calc(100% - var(--space-8) - var(--space-3))}
  .r-cat-cards .r-cat-card[data-product-image] .r-cat-card__title{inset-inline:var(--space-1);bottom:var(--space-1);font-size:12px;line-height:1.4}
}
.r-cat-card:focus-visible,.r-cat-tile:focus-visible{outline-offset:2px}
.r-cat-tiles{display:grid;grid-auto-flow:column;grid-auto-columns:76px;gap:var(--space-3);margin:0;padding:2px 2px var(--space-2);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;list-style:none}
.r-cat-tile__pic>span{display:block;width:100%;height:100%;background-size:cover;background-repeat:no-repeat;transition:transform var(--duration-slow) var(--ease-out)}
.r-cat-tiles .r-cat-tile__pic{width:64px}
.r-cat-tiles .r-cat-tile__title{font-size:12px}
.r-cat-tile[aria-current]{color:var(--cypress)}
.r-cat-tile[aria-current] .r-cat-tile__pic{box-shadow:0 0 0 2px var(--cypress)}
/* The home page's curated child categories: one compact desktop row, two mobile rows. */
.r-child-categories{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:var(--space-6) var(--space-4);margin:0;padding:0;list-style:none}
.r-child-category{display:grid;justify-items:center;gap:var(--space-3);min-width:0;color:var(--ink);text-align:center;text-decoration:none;transition:transform var(--duration-press) var(--ease-spring)}
.r-child-category__image{display:grid;place-items:center;width:100%;aspect-ratio:1;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-full);background:var(--surface);color:var(--ink-muted);transition:border-color var(--duration-fast) var(--ease-color),box-shadow var(--duration-fast) var(--ease-color)}
.r-child-category__image img{width:100%;height:100%;object-fit:contain;transform:scale(.88);transition:transform var(--duration-slow) var(--ease-out)}
.r-child-category__image svg.lucide{width:28px;height:28px}
.r-child-category__title{display:-webkit-box;overflow:hidden;max-width:100%;font:500 14px/1.55 var(--font-sans);-webkit-box-orient:vertical;-webkit-line-clamp:2}
.r-child-category:active{transform:scale(.975)}
.r-child-category:active .r-child-category__image img{transform:scale(.94)}
.r-child-category:focus-visible .r-child-category__image img{transform:scale(1)}
@media (hover:hover) and (pointer:fine){.r-child-category:hover .r-child-category__image{border-color:var(--cypress);box-shadow:0 0 0 2px color-mix(in srgb,var(--cypress) 12%,transparent)}.r-child-category:hover .r-child-category__image img{transform:scale(1)}}
@media (max-width:800px){.r-child-categories{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-8) var(--space-3)}.r-child-category{gap:var(--space-2)}.r-child-category__title{font-size:12px;line-height:1.5}}
@media (min-width:641px){
  .r-cat-cards{gap:var(--space-4)}
  .r-cat-card__title{font-size:17px}
}
.r-cat-sheet__found{display:grid;gap:var(--space-4)}
.r-cat-sheet__results{margin:0;padding:0;list-style:none}
.r-cat-sheet__results small{margin-inline-start:var(--space-1);color:var(--ink-muted);font:400 12px/1.6 var(--font-sans)}
.r-cat-sheet__hits:empty{display:none}
.r-cat-sheet__hits h3{margin:0 0 var(--space-2)}
.r-cat-sheet__products{display:grid;gap:var(--space-1);margin:0;padding:0;list-style:none}
.r-cat-sheet__product{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:var(--space-3);padding:var(--space-1) 0;color:var(--ink);text-decoration:none;font:500 14px/1.7 var(--font-sans)}
.r-cat-sheet__product img{width:48px;height:60px;border-radius:var(--radius-sm);object-fit:cover;background:var(--surface-sunken)}
.r-cat-sheet__hits:not(:empty)~.r-cat-sheet__empty{display:none}
.r-cat-sheet__empty{margin:0}
@keyframes r-cat-in{from{opacity:0;transform:translateY(8px)}}
@keyframes r-cat-slide{from{opacity:0;transform:translateX(-20px)}}
@keyframes r-cat-slide-back{from{opacity:0;transform:translateX(20px)}}
@media (max-width:960px){
  .r-cat-sheet{height:94dvh;max-height:calc(94dvh - var(--r-keyboard,0px))}
}
@media (hover:hover){
  .r-cat-sheet__card:hover img,.r-cat-sheet__tile:hover .r-cat-sheet__pic img,.r-cat-tile:hover .r-cat-tile__pic img,.r-cat-card:hover :is(img,.r-cat-card__img){transform:scale(1.05)}
  .r-cat-sheet__tile:hover .r-cat-sheet__title,.r-cat-tile:hover .r-cat-tile__title{color:var(--cypress)}
}
.r-cat-sheet__card[data-category-banner]:hover img,.r-mega__aside .r-cat-card[data-category-banner]:hover .r-cat-card__img{transform:none}

/* Wide category card (the home page's featured category): 2:1 on phones, 3:1 from 641px, where the plain card's 4:3 would otherwise win. */
@media (min-width:641px){
  .r-cat-card.r-cat-card--wide{aspect-ratio:3/1}
  .r-cat-card--wide .r-cat-card__title{inset-inline:var(--space-6);bottom:var(--space-6);font-size:28px}
}

/* ───────── Journey (.r-journey): the parcel's trip, order → check and pack → road → door, for the home hero ─────────
   One loop of --duration-journey shared by every moving part: all keyframes are percentages of it, so the scene and the steps
   stay in step (and pause together). Rada.journey injects the scene (decorative, aria-hidden), a pause button and pauses it
   off screen; the steps animate only once the scene is in ([data-ready]). Each part's base style is the last frame (parcel at
   the door, every step done), which is what reduced motion and a page without script show.
   Easing: pans cubic-bezier(.65,0,.35,1) (= --ease-in-out), the drive (.45,0,.4,1), entries (.25,1,.5,1) (= --ease-out),
   pops (.3,1.4,.6,1), falls (.55,0,1,.45). */
.r-journey{position:relative;display:grid;gap:var(--space-3);width:100%;max-width:520px;margin:0}
.r-journey__stage{position:relative;aspect-ratio:20/9;overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(var(--art-sky),var(--surface));box-shadow:var(--shadow-soft)}
.r-journey__scene{display:block;width:100%;height:100%}
.r-journey__toggle{position:absolute;top:var(--space-2);inset-inline-end:var(--space-2);background:color-mix(in srgb,var(--surface) 85%,transparent);color:var(--ink)}
.r-journey__toggle svg{width:var(--icon-sm);height:var(--icon-sm)}
.r-journey__steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-1);margin:0;padding:0;list-style:none}
.r-journey__steps::before,.r-journey__steps::after{content:'';position:absolute;top:15px;inset-inline:12.5%;height:2px;border-radius:var(--radius-full);background:var(--line)}
.r-journey__steps::after{background:var(--cypress);transform-origin:right center}
.r-journey__step{position:relative;z-index:1;display:grid;justify-items:center;align-content:start;gap:var(--space-1);text-align:center;font:500 12px/1.6 var(--font-sans);color:var(--ink)}
.r-journey__icon{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--cypress);border-radius:var(--radius-full);background:var(--tint);color:var(--cypress)}
.r-journey__icon svg.lucide{width:var(--icon-sm);height:var(--icon-sm)}
.r-journey__step:last-child .r-journey__icon{background:var(--cypress);color:var(--on-cypress)}
@media (min-width:641px){.r-journey__step{font-size:13px}}

/* Scene paint */
.r-journey__scene .k-ink{fill:var(--ink)}.r-journey__scene .k-muted{fill:var(--ink-muted)}.r-journey__scene .k-line{fill:var(--line)}
.r-journey__scene .k-surface{fill:var(--surface)}.r-journey__scene .k-cypress{fill:var(--cypress)}.r-journey__scene .k-deep{fill:var(--cypress-deep)}
.r-journey__scene .k-tint{fill:var(--tint)}.r-journey__scene .k-sky{fill:var(--art-sky)}.r-journey__scene .k-ground{fill:var(--art-ground)}
.r-journey__scene .k-road{fill:var(--art-road)}.r-journey__scene .k-cream{fill:var(--art-cream)}.r-journey__scene .k-sun{fill:var(--art-sun)}
.r-journey__scene .k-sun-soft{fill:var(--art-sun-soft)}.r-journey__scene .k-clay{fill:var(--art-clay)}.r-journey__scene .k-clay-deep{fill:var(--art-clay-deep)}
.r-journey__scene .k-clay-soft{fill:var(--art-clay-soft)}.r-journey__scene .k-kraft{fill:var(--art-kraft)}.r-journey__scene .k-kraft-deep{fill:var(--art-kraft-deep)}
.r-journey__scene .k-kraft-light{fill:var(--art-kraft-light)}.r-journey__scene .k-sage{fill:var(--art-sage)}.r-journey__scene .k-sage-deep{fill:var(--art-sage-deep)}
.r-journey__scene .k-sage-soft{fill:var(--art-sage-soft)}.r-journey__scene .k-hill{fill:var(--art-hill)}.r-journey__scene .k-rose{fill:var(--art-rose)}
.r-journey__scene .k-wood{fill:var(--art-wood)}
.r-journey__scene .jy-shadow{fill:var(--ink);opacity:.08}
.r-journey__scene .jy-dash{fill:none;stroke:var(--surface);stroke-width:1.6;stroke-dasharray:8 10}
.r-journey__scene .jy-bars{fill:none;stroke:var(--art-cream);stroke-width:2}
.r-journey__scene .jy-arrow{fill:none;stroke:var(--surface);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.r-journey__scene .jy-stem{fill:none;stroke:var(--art-sage-deep);stroke-width:1.2;stroke-linecap:round}
.r-journey__scene .jy-glaze{fill:none;stroke:var(--art-cream);stroke-width:1.4}
.r-journey__scene .jy-shine{fill:none;stroke:var(--surface);stroke-width:1.2;stroke-linecap:round;opacity:.7}
.r-journey__scene .jy-tick{fill:none;stroke:var(--on-cypress);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.r-journey__scene .jy-ring{fill:none;stroke:var(--cypress);stroke-width:1.6}
.r-journey__scene .jy-finger{fill:color-mix(in srgb,var(--ink) 22%,transparent);stroke:var(--surface);stroke-width:2}
.r-journey__scene .jy-lens{fill:color-mix(in srgb,var(--surface) 55%,transparent);stroke:var(--ink);stroke-width:2.6}
.r-journey__scene .jy-handle{fill:none;stroke:var(--ink);stroke-width:4;stroke-linecap:round}
.r-journey__scene .jy-glint{fill:none;stroke:var(--surface);stroke-width:1.4;stroke-linecap:round}
.r-journey__scene .jy-arm{fill:none;stroke:var(--art-sage);stroke-width:3.4;stroke-linecap:round}
.r-journey__scene .jy-badge{stroke:var(--surface);stroke-width:2}

/* Scene pivots: rotations and scales turn about the part itself, the vase about its foot (its drawing's 0,0). */
.r-journey__scene :is(.jy-halo,.jy-finger,.jy-ripple,.jy-btn,.jy-spark,.jy-box-in,.jy-lid,.jy-tape,.jy-sticker,.jy-lens-g,.jy-ok,.jy-wheel,.jy-puff,.jy-love,.jy-bit,.jy-van-tilt,.jy-box-sq,.jy-door,.jy-arm){transform-box:fill-box;transform-origin:center}
.r-journey__scene .jy-tape{transform-origin:50% 0}
.r-journey__scene .jy-box-sq{transform-origin:50% 100%}
.r-journey__scene .jy-van-tilt{transform-origin:17% 100%}
.r-journey__scene .jy-door{transform-origin:0 50%}
.r-journey__scene .jy-arm{transform-origin:0 100%}

/* The last frame, shown without animation */
.r-journey__scene :is(.jy-tap,.jy-ripple,.jy-spark,.jy-vase-s,.jy-lens-g,.jy-ok,.jy-puffs,.jy-bit){opacity:0}
.r-journey__scene .jy-box{transform:translateX(-210px)}
.r-journey__scene .jy-box-y{transform:translateY(38px)}
.r-journey__scene .jy-door{transform:scaleX(.16)}
.r-journey__scene .jy-arm{transform:rotate(-16deg)}

/* The timeline */
.r-journey__scene :is(.jy-all,.jy-world,.jy-far,.jy-tap,.jy-finger,.jy-ripple,.jy-btn,.jy-btn-ok,.jy-spark,.jy-vase,.jy-vase-y,.jy-vase-s,.jy-box,.jy-box-y,.jy-box-in,.jy-box-sq,.jy-lid,.jy-tape,.jy-sticker,.jy-lens-g,.jy-ok,.jy-van,.jy-van-tilt,.jy-vdoor,.jy-wheel,.jy-puffs,.jy-door,.jy-arm,.jy-love,.jy-bit){animation:var(--duration-journey) infinite both}
.r-journey__scene .jy-all{animation-name:r-jy-fade}
.r-journey__scene .jy-world{animation-name:r-jy-world}
.r-journey__scene .jy-far{animation-name:r-jy-far}
.r-journey__scene .jy-tap{animation-name:r-jy-tap}
.r-journey__scene .jy-finger{animation-name:r-jy-press}
.r-journey__scene .jy-ripple{animation-name:r-jy-ripple}
.r-journey__scene .jy-btn{animation-name:r-jy-btn}
.r-journey__scene .jy-btn-ok{animation-name:r-jy-btn-ok}
.r-journey__scene .jy-spark{animation-name:r-jy-spark}
.r-journey__scene .jy-spark:nth-child(2){animation-delay:60ms}
.r-journey__scene .jy-spark:nth-child(3){animation-delay:120ms}
.r-journey__scene .jy-vase{animation-name:r-jy-vase-x}
.r-journey__scene .jy-vase-y{animation-name:r-jy-vase-y}
.r-journey__scene .jy-vase-s{animation-name:r-jy-vase-s}
.r-journey__scene .jy-box{animation-name:r-jy-box-x}
.r-journey__scene .jy-box-y{animation-name:r-jy-box-y}
.r-journey__scene .jy-box-in{animation-name:r-jy-box-in}
.r-journey__scene .jy-box-sq{animation-name:r-jy-squash}
.r-journey__scene .jy-lid{animation-name:r-jy-lid}
.r-journey__scene .jy-tape{animation-name:r-jy-tape}
.r-journey__scene .jy-sticker{animation-name:r-jy-sticker}
.r-journey__scene .jy-lens-g{animation-name:r-jy-lens}
.r-journey__scene .jy-ok{animation-name:r-jy-ok}
.r-journey__scene .jy-van{animation-name:r-jy-van}
.r-journey__scene .jy-van-tilt{animation-name:r-jy-tilt;animation-timing-function:cubic-bezier(.65,0,.35,1)}
.r-journey__scene .jy-vdoor{animation-name:r-jy-vdoor;animation-timing-function:cubic-bezier(.65,0,.35,1)}
.r-journey__scene .jy-wheel{animation-name:r-jy-wheel}
.r-journey__scene .jy-puffs{animation-name:r-jy-puffs}
.r-journey__scene .jy-door{animation-name:r-jy-door}
.r-journey__scene .jy-arm{animation-name:r-jy-wave;animation-timing-function:cubic-bezier(.65,0,.35,1)}
.r-journey__scene .jy-love{animation-name:r-jy-love}
.r-journey__scene .jy-bit{animation-name:r-jy-bit}
.r-journey__scene .jy-bit:nth-child(1){--dx:-22px;--dy:-26px;--r:-120deg}
.r-journey__scene .jy-bit:nth-child(2){--dx:-10px;--dy:-34px;--r:90deg;animation-delay:30ms}
.r-journey__scene .jy-bit:nth-child(3){--dx:4px;--dy:-38px;--r:-60deg;animation-delay:60ms}
.r-journey__scene .jy-bit:nth-child(4){--dx:16px;--dy:-30px;--r:140deg;animation-delay:30ms}
.r-journey__scene .jy-bit:nth-child(5){--dx:26px;--dy:-20px;--r:-90deg;animation-delay:90ms}
.r-journey__scene .jy-bit:nth-child(6){--dx:-30px;--dy:-14px;--r:60deg;animation-delay:60ms}
/* Ambient: the sun breathes, the parked van idles, exhaust drifts (own short loops, decorative). */
.r-journey__scene .jy-halo{animation:r-jy-glow 4s cubic-bezier(.65,0,.35,1) infinite alternate}
.r-journey__scene .jy-van-bob{animation:r-jy-bob .34s cubic-bezier(.65,0,.35,1) infinite alternate}
.r-journey__scene .jy-puff{animation:r-jy-puff .9s linear infinite}
.r-journey__scene .jy-puff:nth-child(2){animation-delay:.3s}
.r-journey__scene .jy-puff:nth-child(3){animation-delay:.6s}
/* Steps: lit as the parcel reaches each; the cypress line fills between them. */
.r-journey[data-ready] .r-journey__steps::after{animation:r-jy-bar var(--duration-journey) infinite both}
.r-journey[data-ready] .r-journey__step .r-journey__icon{animation:var(--duration-journey) infinite both}
.r-journey[data-ready] .r-journey__step:nth-child(1) .r-journey__icon{animation-name:r-jy-step1}
.r-journey[data-ready] .r-journey__step:nth-child(2) .r-journey__icon{animation-name:r-jy-step2}
.r-journey[data-ready] .r-journey__step:nth-child(3) .r-journey__icon{animation-name:r-jy-step3}
.r-journey[data-ready] .r-journey__step:nth-child(4) .r-journey__icon{animation-name:r-jy-step4}
/* Paused by the button, or off screen */
.r-journey:is([data-paused],[data-off]) :is(*,*::after){animation-play-state:paused!important}

/* 0–3 s order: a tap on the button, the vase lifts out of the screen */
@keyframes r-jy-fade{0%{opacity:0}2.67%,96.67%{opacity:1}100%{opacity:0}}
@keyframes r-jy-tap{0%,2%{transform:translate(52px,30px);opacity:0;animation-timing-function:cubic-bezier(.65,0,.35,1)}4%{opacity:1}7.33%{transform:translate(0,0)}9.33%{opacity:1}11.33%,100%{transform:translate(0,0);opacity:0}}
@keyframes r-jy-press{0%,7.33%{transform:scale(1)}8.33%{transform:scale(.8)}9.67%,100%{transform:scale(1)}}
@keyframes r-jy-ripple{0%,8.33%{transform:scale(.6);opacity:0;animation-timing-function:cubic-bezier(.25,1,.5,1)}8.67%{opacity:.7}12%,100%{transform:scale(1.9);opacity:0}}
@keyframes r-jy-btn{0%,7.33%{transform:scale(1)}8.33%{transform:scale(.94)}10%,100%{transform:scale(1)}}
@keyframes r-jy-btn-ok{0%,8.67%{opacity:0}10.67%,96.67%{opacity:1}100%{opacity:0}}
@keyframes r-jy-spark{0%,12.67%{transform:scale(.5);opacity:0;animation-timing-function:cubic-bezier(.25,1,.5,1)}14.67%{transform:scale(1);opacity:1}18%,100%{transform:scale(.8);opacity:0}}
@keyframes r-jy-vase-x{0%,20%{transform:translateX(300px);animation-timing-function:cubic-bezier(.65,0,.35,1)}26.67%,100%{transform:translateX(320px)}}
@keyframes r-jy-vase-y{
  0%,12%{transform:translateY(92px);animation-timing-function:cubic-bezier(.25,1,.5,1)}
  14.67%{transform:translateY(79px)}
  16%,20%{transform:translateY(82px);animation-timing-function:cubic-bezier(.25,1,.5,1)}
  23.33%{transform:translateY(58px);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  26.67%{transform:translateY(80px);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  29.33%{transform:translateY(77px);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  32%{transform:translateY(80px);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  34.67%{transform:translateY(77px);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  36%{transform:translateY(79px);animation-timing-function:cubic-bezier(.55,0,1,.45)}
  38.33%,100%{transform:translateY(119px)}}
@keyframes r-jy-vase-s{0%,12%{transform:scale(.8);opacity:1;animation-timing-function:cubic-bezier(.3,1.4,.6,1)}14.67%{transform:scale(1.04)}16%{transform:scale(1)}37.67%{opacity:1}38.33%,100%{transform:scale(1);opacity:0}}
/* 3–4 s the camera pans to the workshop; 4–8 s check, pack, seal, load */
@keyframes r-jy-world{0%,20%{transform:translateX(-1600px);animation-timing-function:cubic-bezier(.65,0,.35,1)}26.67%,54.67%{transform:translateX(-1200px);animation-timing-function:cubic-bezier(.45,0,.4,1)}80%,100%{transform:translateX(0)}}
@keyframes r-jy-far{0%,20%{transform:translateX(-560px);animation-timing-function:cubic-bezier(.65,0,.35,1)}26.67%,54.67%{transform:translateX(-420px);animation-timing-function:cubic-bezier(.45,0,.4,1)}80%,100%{transform:translateX(0)}}
@keyframes r-jy-lens{
  0%,27.33%{transform:translate(36px,-26px) rotate(24deg);opacity:0;animation-timing-function:cubic-bezier(.25,1,.5,1)}
  31.33%{transform:translate(0,0) rotate(0);opacity:1;animation-timing-function:cubic-bezier(.65,0,.35,1)}
  32.33%{transform:translate(-5px,2px) rotate(-5deg);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  33.33%{transform:translate(0,0) rotate(0);opacity:1;animation-timing-function:cubic-bezier(.25,1,.5,1)}
  35%,100%{transform:translate(30px,-22px) rotate(16deg);opacity:0}}
@keyframes r-jy-ok{0%,32%{transform:scale(.6);opacity:0;animation-timing-function:cubic-bezier(.3,1.4,.6,1)}34%{transform:scale(1);opacity:1}36%{opacity:1}37.33%,100%{transform:scale(1);opacity:0}}
@keyframes r-jy-box-x{0%,20%{transform:translateX(-400px);animation-timing-function:cubic-bezier(.65,0,.35,1)}26.67%,48.67%{transform:translateX(0);animation-timing-function:cubic-bezier(.3,.6,.4,1)}51.67%,83%{transform:translateX(-113px);animation-timing-function:cubic-bezier(.3,.6,.4,1)}87.33%,100%{transform:translateX(-210px)}}
@keyframes r-jy-box-y{0%,48.67%{transform:translateY(0);animation-timing-function:cubic-bezier(.25,1,.5,1)}50%{transform:translateY(-10px);animation-timing-function:cubic-bezier(.55,0,1,.45)}51.67%,83%{transform:translateY(23px);animation-timing-function:cubic-bezier(.25,1,.5,1)}85%{transform:translateY(-6px);animation-timing-function:cubic-bezier(.55,0,1,.45)}87.33%,100%{transform:translateY(38px)}}
@keyframes r-jy-box-in{0%,48.67%{transform:scale(1);opacity:1;animation-timing-function:cubic-bezier(.65,0,.35,1)}50.33%{opacity:1}51.67%{transform:scale(.5)}52.33%,82.67%{transform:scale(.5);opacity:0;animation-timing-function:cubic-bezier(.25,1,.5,1)}83.67%{opacity:1}87.33%,100%{transform:scale(1);opacity:1}}
@keyframes r-jy-squash{0%,38.33%{transform:scale(1)}39.33%{transform:scale(1.03,.93)}40.67%,42%{transform:scale(1)}43%{transform:scale(1.02,.95)}44.33%,87.33%{transform:scale(1)}88.33%{transform:scale(1.04,.92)}90%,100%{transform:scale(1)}}
@keyframes r-jy-lid{0%,39.33%{transform:translate(29px,12px) rotate(86deg);animation-timing-function:cubic-bezier(.25,1,.5,1)}40.67%{transform:translate(15px,-20px) rotate(26deg);animation-timing-function:cubic-bezier(.55,0,1,.45)}42%,100%{transform:translate(0,0) rotate(0)}}
@keyframes r-jy-tape{0%,43%{transform:scaleY(0);animation-timing-function:cubic-bezier(.25,1,.5,1)}45%,100%{transform:scaleY(1)}}
@keyframes r-jy-sticker{0%,45.33%{transform:scale(1.7);opacity:0;animation-timing-function:cubic-bezier(.3,1.4,.6,1)}47.33%,100%{transform:scale(1);opacity:1}}
@keyframes r-jy-van{0%,41.33%{transform:translateX(-260px);animation-timing-function:cubic-bezier(.2,.7,.3,1)}46.67%,100%{transform:translateX(0)}}
@keyframes r-jy-vdoor{0%,47.33%{transform:translateX(0)}48.67%,52.33%{transform:translateX(22px)}53.67%,82%{transform:translateX(0)}83.33%,86%{transform:translateX(22px)}87.33%,100%{transform:translateX(0)}}
/* 8.2–12 s the drive; 12–15 s the door */
@keyframes r-jy-tilt{0%,45.33%{transform:rotate(0)}46.67%{transform:rotate(1.6deg)}48%{transform:rotate(-.4deg)}49.33%,54.67%{transform:rotate(0)}56.67%{transform:rotate(1.4deg)}60%,76%{transform:rotate(0)}80%{transform:rotate(-2.4deg)}81.67%{transform:rotate(.6deg)}83%,100%{transform:rotate(0)}}
@keyframes r-jy-wheel{0%,41.33%{transform:rotate(0);animation-timing-function:cubic-bezier(.2,.7,.3,1)}46.67%,54.67%{transform:rotate(300deg);animation-timing-function:cubic-bezier(.45,0,.4,1)}80%,100%{transform:rotate(-1140deg)}}
@keyframes r-jy-puffs{0%,54.67%{opacity:0}56%,78.67%{opacity:1}80%,100%{opacity:0}}
@keyframes r-jy-door{0%,88%{transform:scaleX(1);animation-timing-function:cubic-bezier(.25,1,.5,1)}90.67%,96.67%{transform:scaleX(.16)}100%{transform:scaleX(1)}}
@keyframes r-jy-wave{0%,90.67%{transform:rotate(0)}92%{transform:rotate(-26deg)}93.33%{transform:rotate(6deg)}94.67%{transform:rotate(-26deg)}96%{transform:rotate(6deg)}97.33%,100%{transform:rotate(-16deg)}}
@keyframes r-jy-love{0%,88.67%{transform:translateY(12px) scale(.6);opacity:0;animation-timing-function:cubic-bezier(.3,1.4,.6,1)}91.33%{transform:translateY(0) scale(1);opacity:1;animation-timing-function:cubic-bezier(.65,0,.35,1)}96.67%{opacity:1}100%{transform:translateY(-6px) scale(1);opacity:0}}
@keyframes r-jy-bit{0%,88%{transform:translate(0,0) rotate(0) scale(.6);opacity:0;animation-timing-function:cubic-bezier(.25,1,.5,1)}88.67%{opacity:1}93.33%{transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(1);opacity:1;animation-timing-function:cubic-bezier(.55,0,1,.45)}96%,100%{transform:translate(var(--dx),calc(var(--dy) + 8px)) rotate(var(--r)) scale(1);opacity:0}}
@keyframes r-jy-glow{from{transform:scale(1);opacity:.6}to{transform:scale(1.18);opacity:1}}
@keyframes r-jy-bob{to{transform:translateY(-.7px)}}
@keyframes r-jy-puff{0%{transform:translate(0,0) scale(.5);opacity:.8}100%{transform:translate(16px,-5px) scale(1.4);opacity:0}}
/* Steps: waiting (surface), now (cypress, a small pop), done (tint) */
@keyframes r-jy-bar{0%,20%{transform:scaleX(0);animation-timing-function:cubic-bezier(.65,0,.35,1)}26.67%,48.67%{transform:scaleX(.3333);animation-timing-function:cubic-bezier(.65,0,.35,1)}54.67%{transform:scaleX(.6667);animation-timing-function:cubic-bezier(.45,0,.4,1)}80%,96.67%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes r-jy-step1{0%,26.67%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress)}28.33%,96.67%{background-color:var(--tint);border-color:var(--cypress);color:var(--cypress)}100%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress)}}
@keyframes r-jy-step2{0%,26.67%{background-color:var(--surface);border-color:var(--line);color:var(--ink-muted);transform:scale(1)}28.33%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress);transform:scale(1.12)}30%,54.67%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress);transform:scale(1)}56.33%,96.67%{background-color:var(--tint);border-color:var(--cypress);color:var(--cypress)}100%{background-color:var(--surface);border-color:var(--line);color:var(--ink-muted)}}
@keyframes r-jy-step3{0%,54.67%{background-color:var(--surface);border-color:var(--line);color:var(--ink-muted);transform:scale(1)}56.33%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress);transform:scale(1.12)}58%,80%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress);transform:scale(1)}81.67%,96.67%{background-color:var(--tint);border-color:var(--cypress);color:var(--cypress)}100%{background-color:var(--surface);border-color:var(--line);color:var(--ink-muted)}}
@keyframes r-jy-step4{0%,80%{background-color:var(--surface);border-color:var(--line);color:var(--ink-muted);transform:scale(1)}81.67%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress);transform:scale(1.12)}83.33%,96.67%{background-color:var(--cypress);border-color:var(--cypress);color:var(--on-cypress);transform:scale(1)}100%{background-color:var(--surface);border-color:var(--line);color:var(--ink-muted)}}