/* ROWAN v1 · 2026-11-12. Project specifications, not measured product data.
   Import after reset, before component styles. Only .rw-* classes opt in. */
:root {
  --rw-canvas: #F8F9FB;
  --rw-surface: #FFFFFF;
  --rw-subtle: #EFF1F4;
  --rw-ink: #1F2326;
  --rw-muted: #60666B;
  --rw-line: #D9DEE4;
  --rw-dark: #171C20;
  --rw-dark-text: #F7F6F2;
  --rw-dark-muted: #BCC2C4;
  --rw-accent: #735844;
  --rw-focus: #735844;
  --rw-success: #356448;
  --rw-error: #A2342A;
  --rw-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
  --rw-weight-regular: 400;
  --rw-weight-medium: 500;
  --rw-weight-semibold: 600;
  --rw-hero-size: 38px;
  --rw-hero-leading: 42px;
  --rw-hero-tracking: -1.2px;
  --rw-section-size: 30px;
  --rw-section-leading: 34px;
  --rw-section-tracking: -0.7px;
  --rw-body-size: 16px;
  --rw-body-leading: 24px;
  --rw-caption-size: 13px;
  --rw-caption-leading: 20px;
  --rw-space-1: 4px;
  --rw-space-2: 8px;
  --rw-space-3: 12px;
  --rw-space-4: 16px;
  --rw-space-5: 20px;
  --rw-space-6: 24px;
  --rw-space-8: 32px;
  --rw-space-10: 40px;
  --rw-space-12: 48px;
  --rw-space-16: 64px;
  --rw-space-20: 80px;
  --rw-space-24: 96px;
  --rw-space-30: 120px;
  --rw-content-max: 1200px;
  --rw-gutter: 20px;
  --rw-grid-columns: 4;
  --rw-grid-gap: 16px;
  --rw-section-gap: 64px;
  --rw-nav-height: 64px;
  --rw-product-nav-height: 48px;
  --rw-radius-small: 12px;
  --rw-radius-card: 24px;
  --rw-radius-film: 28px;
  --rw-radius-dialog: 28px;
  --rw-radius-pill: 999px;
  --rw-button-height: 48px;
  --rw-touch-min: 44px;
  --rw-button-pad-x: 24px;
  --rw-card-padding: 20px;
  --rw-comparison-image-height: 208px;
  --rw-dialog-max: 960px;
  --rw-drawer-max: 440px;
  --rw-border: 1px solid var(--rw-line);
  --rw-focus-width: 2px;
  --rw-focus-offset: 4px;
  --rw-motion-feedback: 120ms;
  --rw-motion-transition: 220ms;
  --rw-motion-reveal: 480ms;
  --rw-reveal-travel: 16px;
  --rw-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --rw-ratio-film: 16 / 9;
  --rw-ratio-mobile-film: 4 / 5;
  --rw-ratio-product: 1 / 1;
  --rw-ratio-lifestyle: 3 / 2;
  --rw-z-header: 30;
  --rw-z-product-nav: 25;
  --rw-z-backdrop: 80;
  --rw-z-dialog: 90;
  --rw-z-toast: 100;
}
@media (max-width: 359px) { :root { --rw-gutter: 16px; } }
@media (min-width: 768px) {
  :root {
    --rw-gutter: 32px;
    --rw-grid-columns: 8;
    --rw-grid-gap: 24px;
    --rw-section-gap: 80px;
  }
}
@media (min-width: 1024px) {
  :root {
    --rw-gutter: 40px;
    --rw-grid-columns: 12;
    --rw-section-gap: 120px;
    --rw-nav-height: 72px;
    --rw-card-padding: 32px;
    --rw-comparison-image-height: 300px;
    --rw-hero-size: 64px;
    --rw-hero-leading: 68px;
    --rw-hero-tracking: -2.4px;
    --rw-section-size: 40px;
    --rw-section-leading: 44px;
    --rw-section-tracking: -1.2px;
  }
}
.rw-container { width: min(var(--rw-content-max), calc(100% - var(--rw-gutter) * 2)); margin-inline: auto; }
.rw-grid { display: grid; grid-template-columns: repeat(var(--rw-grid-columns), minmax(0, 1fr)); gap: var(--rw-grid-gap); }
.rw-display { font: var(--rw-weight-semibold) var(--rw-hero-size)/var(--rw-hero-leading) var(--rw-font); letter-spacing: var(--rw-hero-tracking); }
.rw-heading { font: var(--rw-weight-semibold) var(--rw-section-size)/var(--rw-section-leading) var(--rw-font); letter-spacing: var(--rw-section-tracking); }
.rw-body { font: var(--rw-weight-regular) var(--rw-body-size)/var(--rw-body-leading) var(--rw-font); }
.rw-caption { font: var(--rw-weight-regular) var(--rw-caption-size)/var(--rw-caption-leading) var(--rw-font); }
.rw-button { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--rw-button-height); padding: 10px var(--rw-button-pad-x); border-radius: var(--rw-radius-pill); border: 1px solid transparent; font: 500 16px/24px var(--rw-font); text-align: center; text-decoration: none; background: var(--rw-ink); color: var(--rw-surface); cursor: pointer; transition: background-color var(--rw-motion-feedback), box-shadow var(--rw-motion-feedback); }
.rw-button--secondary { background: var(--rw-subtle); color: var(--rw-ink); }
.rw-button:focus-visible, .rw-focus:focus-visible { outline: var(--rw-focus-width) solid var(--rw-focus); outline-offset: var(--rw-focus-offset); }
.rw-button:disabled, .rw-button[aria-disabled="true"] { cursor: not-allowed; opacity: .5; }
.rw-card { border-radius: var(--rw-radius-card); padding: var(--rw-card-padding); background: var(--rw-surface); }
.rw-product-image { display: block; width: 100%; height: var(--rw-comparison-image-height); object-fit: contain; }
.rw-dark { background: var(--rw-dark); color: var(--rw-dark-text); --rw-muted: var(--rw-dark-muted); --rw-focus: #D1B9A4; }
@media (prefers-reduced-motion: reduce) {
  :root { --rw-motion-feedback: 0ms; --rw-motion-transition: 0ms; --rw-motion-reveal: 0ms; --rw-reveal-travel: 0px; }
  .rw-button { transition: none; }
  /* JavaScript must also disable autoplay and scroll-linked transforms. */
}