/* Shinfulife Design System tokens — :root custom properties only, copied from the Claude Design export.
   The DS text helper classes (.body, .price, .page-title …) are omitted: they are unused here and their generic names could collide with SWELL. */
:root{
  --color-primary: var(--color-orange);
  --color-on-primary: var(--color-white);
  --color-black: #000000;
  --color-black__a8: rgba(0, 0, 0, 0.8);
  --color-black__a6: rgba(0, 0, 0, 0.6);
  --color-black__a4: rgba(0, 0, 0, 0.4);
  --color-black__a2: rgba(0, 0, 0, 0.2);
  --color-black__a1: rgba(0, 0, 0, 0.1);
  --color-black__a0: rgba(0, 0, 0, 0);
  --color-white: #ffffff;
  --color-white__a9: rgba(255, 255, 255, 0.9);
  --color-white__a8: rgba(255, 255, 255, 0.8);
  --color-white__a6: rgba(255, 255, 255, 0.6);
  --color-white__a4: rgba(255, 255, 255, 0.4);
  --color-white__a2: rgba(255, 255, 255, 0.2);
  --color-white__a0: rgba(255, 255, 255, 0);
  --color-gray: #e5e5e5;
  --color-gray--light: #f6f6f6;
  --color-gray--thin: #fafafa;
  --color-gray--dark: #666666;
  --color-beige: #b5a574;
  --color-beige--light: #f7f6e9;
  --color-beige--thin: #fffdfa;
  --color-green: #3fb15e;
  --color-orange: #ff6b00;
  --color-red: #b30005;
  --color-bg--yellow: #ffffc1;
  --color-bg--pink: #ff91e5;
  --color-bg--blue: #91afff;
  --color-bg--green: #93ff91;
  --color-border--primary: #999999;
  --color-border--secondary: var(--color-gray--light);
  --color-text__body: #3c3c3c;
  --color-linkbg: var(--color-border--primary);
  --color-linkbg--active: var(--color-gray--dark);
  --color-link--primary: #3572b0;
  --color-link--primary__visited: #551a8b;
  --color-link--primary__hover: #3790e8;
  --color-link--primary__active: #3381ce;
  --color-link--secondary: var(--color-black);
  --color-link--secondary__hover: var(--color-gray--dark);
  --color-link--secondary__active: var(--color-gray);
  --color-icon--primary: #818181;
  --color-text--primary: var(--color-text__body);
  --color-text--strong: #333333;
  --color-gray--block: #f7f7f7;
  --color-border--light: #cccccc;
  --color-border--tertiary: #dddddd;
  --color-border--title: #414141;
  --color-border--bubble: #474747;
  --color-brown--dark: #2d2518;
  --color-brown: #5a2e18;
  --color-red--price: #a1251b;
  --color-red--text: #ff0033;
  --color-link--content: #0964fd;
  --color-navy: #001c91;
  --color-marker--yellow: #fff666;
  --color-marker--pink: #ffe4e1;
  --color-logo--blue: #062d8d;
  --color-logo--lemon: #fad618;
  --color-logo--leaf: #2ea443;
  --color-logo--cat: #f2521d;
  /* semantic aliases (added) */
  --surface-page: var(--color-white);
  --surface-band: var(--color-beige--light);
  --surface-soft: var(--color-beige--thin);
  --surface-block: var(--color-gray--block);
  --surface-block-thin: var(--color-gray--thin);
  --surface-dark: var(--color-brown--dark);
  --text-body: var(--color-text__body);
  --text-strong: var(--color-text--strong);
  --text-muted: var(--color-gray--dark);
  --text-on-dark: var(--color-white);
  --text-price: var(--color-red--price);
  --text-link: var(--color-link--content);
  --accent-line: var(--color-beige);
  --border-default: var(--color-border--light);
  --border-heading: var(--color-border--primary);
}
:root{
  --font-weight: 400;
  --font-weight--s: 300;
  --font-weight--l: 600;
  --lineHeight--primary: 1.65; /* @kind other */
  --font-sans: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif;
  --font-serif: "Roboto Slab", Garamond, "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  --font-weight--medium: 500;
  --font-weight--bold: 700;
  --font-size--xxxl: 28px;
  --font-size--xxl: 24px;
  --font-size--xl: 18px;
  --font-size--l: 16px;
  --font-size--body: 14px;
  --font-size--md: 13px;
  --font-size--s: 12px;
  --font-size--xs: 11px;
  --font-size--xxs: 9px;
  /* semantic aliases (added) */
  --font-body: var(--font-sans);
  --font-display: var(--font-serif);
}
:root{
  --gutter--xs: 4px;
  --gutter--s: 8px;
  --gutter: 16px;
  --gutter--l: 32px;
  --gutter--xl: 64px;
  --gutter--xxl: 96px;
  --width-content--primary: 700px;
  --width-page--max: 1216px;
  --breakpoint--md: 768px;
  --breakpoint--lg: 1200px;
}
:root{
  --radius--xs: 3px;
  --radius--s: 4px;
  --radius--m: 8px;
  --radius--l: 16px;
  --radius--full: 50%;
  --shadow-header: 0 4px 8px rgba(0, 0, 0, 0.1);
  --shadow-card: 0 4px 8px rgba(0, 0, 0, 0.06);
  --shadow-drawer: 6px 0 25px rgba(0, 0, 0, 0.15);
  --shadow-photo: 0 4px 4px -3px #8d8c8c;
  --shadow-banner: 0 4px 4px -4px #8d8c8c;
  --opacity-hover: 0.7; /* @kind other */
  --duration-hover: 0.3s; /* @kind other */
  --easing-standard: ease-in-out; /* @kind other */
}