:root {
  --color-ink: #222222;
  --color-main: #1C3A6C;
  --color-main-2: var(--color-main);
  --color-accent: var(--color-main);
  --color-accent-2: var(--color-main);
  --color-base: #fcfcfc;
  --color-pale: #f1f5f8;
  --color-line: #c5d2e3;
  --color-on-dark: #ffffff;
  --color-on-dark-line: rgb(255 255 255 / 0.6);
  --color-error: #a82f3b;
  --color-shadow: rgb(28 58 108 / 0.09);
  --color-mix-blue: #01A4FF;
  --color-mix-yellow: #FFFF95;
  --color-mix-coral: #FBA796;
  --color-mix-pink: #FFBBFA;
  --color-mist-blue: rgb(1 164 255 / 0.16);
  --color-mist-yellow: rgb(255 255 149 / 0.7);
  --color-mist-coral: rgb(251 167 150 / 0.38);
  --color-mist-pink: rgb(255 187 250 / 0.6);
  --color-clear: rgb(252 252 252 / 0);
  --color-paper-blue: #f4f7f8;
  --color-paper-glaze: rgb(252 252 252 / 0.5);
  --color-paper-button: rgb(252 252 252 / 0.75);
  --color-paper-arc: rgb(255 255 255 / 0.75);
  --color-choice-blue: #cad7e8;
  --color-charcoal: #2d2e30;
  --color-reward-card: rgb(255 255 255 / 0.07);
  --color-reward-card-line: rgb(255 255 255 / 0.3);
  --color-photo-solid: rgb(10 16 22 / 0.97);
  --color-photo-heavy: rgb(10 16 22 / 0.82);
  --color-photo-medium: rgb(10 16 22 / 0.65);
  --color-photo-soft: rgb(10 16 22 / 0.28);
  --color-photo-floor: rgb(10 16 22 / 0.45);
  --color-job-photo-top: rgb(10 16 22 / 0.3);
  --color-job-photo-middle: rgb(10 16 22 / 0.7);
  --color-job-photo-bottom: rgb(10 16 22 / 0.9);
  --paper-image: linear-gradient(var(--color-paper-glaze), var(--color-paper-glaze)), url("assets/paper-cotton-v2.webp?v=20261028j");
  --paper-size: auto, 360px 360px;
  --paint-blue: url("assets/paint-blue-v2.webp?v=20261028j");
  --paint-curl: url("assets/paint-curl-v2.webp?v=20261028j");
  --paint-mix: url("assets/paint-mix-v2.webp?v=20261028j");
  --bg-dark: var(--color-main);
  --bg-accent: var(--color-main);
  --font-body: "Noto Sans JP", "Hiragino Sans", sans-serif;
  --font-head: "Noto Sans JP", "Hiragino Sans", sans-serif;
  --font-en: "Jost", "Noto Sans JP", sans-serif;
  --fs-min: 13px;
  --fs-base: clamp(14px, min(2.34dvh, 3.98vw), 16.5px);
  --fs-ui: 13px;
  --fs-input: 16px;
  --fw-body: 500;
  --ls-body: 0.01em;
  --lh-body: 1.7;
  --lh-head: 1.2;
  --col: 480px;
  --header-h: 56px;
  --gutter: 22px;
  --sp-1: 0.45em;
  --sp-p: 0.7em;
  --sp-g: clamp(10px, 1.85dvh, 18px);
  --pad-y: 1.2em;
  --next-h: 0px;
  --radius-pill: 999px;
  --radius-s: 6px;
  --shadow-soft: none;
  --shadow-column: 0 0 36px var(--color-shadow);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --rise: 12px;
  --dur-in: 600ms;
  --dur-hover: 250ms;
  --fs-catch: clamp(23px, min(4.1dvh, 7.3vw), 30px);
  --fs-section: clamp(21px, min(3.5dvh, 6.2vw), 25px);
  --ls-head: 0.03em;
  --fs-close: clamp(17px, 2.8dvh, 21px);
  --photo-h: clamp(100px, 23dvh, 210px);
  --fs-choice: clamp(16px, 2.7dvh, 20px);
  --choice-pad: clamp(10px, 1.7dvh, 17px);
  --motion-title: 900ms;
  --motion-step: 20ms;
  --motion-photo: 2s;
  --motion-job-photo: 1.8s;
  --motion-zoom: 7s;
  --motion-circle: 5s;
  --brand-crop-width: 228.33%;
  --brand-crop-x: -65.116%;
  --brand-crop-y: -74.696%;
}
@media (max-height: 600px) {
  :root { --pad-y: 0.7em; --sp-p: 0.5em; --photo-h: 96px; --lh-body: 1.6; --fs-close: 17px; }
}
