/* UMASOO! — 2026-09-07 redesign / 2026-09-25 05_UIのモック実測色・丸ゴシックへ寄せた
   Canonical CSS tokens. Plain HTML can link this file directly.
   Structured counterpart: design-tokens.json. Changes must match both files.
   Logo source values are exact SVG fills/stops; UI values are design choices.
   Tailwind bridge lives separately in tailwind-theme.css, never linked by HTML.
*/
:root {
  color-scheme: light;
  --background: #FBF9F5;
  --foreground: #200804;
  --card: #FFFFFF;
  --card-foreground: #200804;
  --popover: #FFFFFF;
  --popover-foreground: #200804;
  --primary: #FEC339;
  --primary-foreground: #200804;
  --secondary: #EE8373;
  --secondary-foreground: #200804;
  --accent: #FEF1D4;
  --accent-foreground: #200804;
  --muted: #F4F0EC;
  --muted-foreground: #686155;
  --border: #E5E1D6;
  --input: #8B8578;
  --ring: #200804;
  --destructive: #AE3522;
  --destructive-foreground: #FFFFFF;
  --disabled: #E5E1D6;
  --disabled-foreground: #686155;
  --toast: #292722;
  --toast-foreground: #FFFFFF;
  --brand-yellow-deep: #F8B108;
  --brand-yellow-light: #FFD87B;
  --brand-white: #FEFDFC;
  --brand-brown: #4F2E08;
  --deco-sparkle-orange: #E45208;
  --deco-sparkle-orange-light: #FF975A;
  --deco-sparkle-blue: #4F88E4;
  --deco-sparkle-blue-deep: #162765;
  --deco-tongue: #FC5953;
  --deco-tongue-light: #FE807C;
  --pin-want: #FEB303;
  /* 🔄2026-09-27 50_UI/codex作成版の実測に寄せた(ユーザー「画像を一定は実装する」)。
     ピンと状態の記号は白抜き。記号の白と塗りの差は3:1以上(まあアリ3.2・リピなし3.3)。行きたいの黄は旧来どおり形(◆✦)で見分ける */
  --pin-repeat: #F8665E;
  --pin-maybe: #BD8452;
  --pin-none: #948C84;
  /* リピあり・ごちリスの印(舌の形。モック01・08・16)。本体と中央の筋 */
  --mark-repeat: #F46E72;
  --mark-repeat-deep: #D65A60;
  /* 状態の札。文字は札の地に4.5:1以上(2026-09-25 05_UI 08の実測を2026-09-27にcodex作成版の赤へ) */
  --repeat-soft: #FCE9E8;
  --repeat-ink: #C8312A;
  --maybe-soft: #F6EDE3;
  --maybe-ink: #8A5A2B;
  --pin-ink: #200804;
  --pin-glyph: #FFFFFF;
  --map-land: #F2F0E9;
  --map-building: #EAE7DD;
  --map-road: #FFFFFF;
  --map-road-arterial: #FFFFFF;
  --map-road-stroke: #E3DED1;
  --map-road-highway: #FFE17D;
  --map-road-highway-stroke: #D8C470;
  --map-water: #E7E6DF;
  --map-park: #E4E7BE;
  --map-label: #686155;
  --map-label-station: #292722;
  --map-label-halo: #FFFFFF;
  --map-line: #D4CFBD;
  --map-water-label: #686155;
  --surface-yellow: #FFE17D;
  --surface-orange: #FFAA4C;
  --surface-tomato: #FF7855;
  --surface-leaf: #D6DF66;
  --surface-neutral: #F5F3EC;
  /* 2026-09-27 前回の感想・案内・記録のまとめのクリーム色の面(モック08・06・17の実測) */
  --cream: #FDF6E6;
  --scrim: rgb(41 39 34 / .20);
  /* 2026-09-27 取り消せない操作の確認の背面(モック22の濃さ) */
  --scrim-strong: rgb(41 39 34 / .45);
  /* 2026-09-25 05_UIのモックに合わせ丸ゴシック。アプリでは next/font が --font-rounded を定義する */
  --font-sans: var(--font-rounded, "M PLUS Rounded 1c"), "Hiragino Maru Gothic ProN", "Hiragino Sans", system-ui, sans-serif;
  --font-brand: var(--font-sans);
  --font-weight-body: 400;
  --font-weight-label: 600;
  --font-weight-heading: 700;
  --radius: 1.5rem;
  --radius-sm: .5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-xl: 2rem;
  --radius-full: 999px;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --font-size-caption: .75rem;
  --font-size-label: .875rem;
  --font-size-body: .875rem;
  --font-size-title: 1.25rem;
  --font-size-page: 1.375rem;
  --font-size-display: clamp(2rem, 4.5vw, 4rem);
  /* 2026-09-27 codex作成版の実寸: 大きな見出し(取り込み・保存確認のGOCHIDESU)と件数の数字(プロフィール・取り込み) */
  --font-size-hero: 2rem;
  --font-size-stat: 3rem;
  /* 一覧行。🔄2026-09-26 モック01の実寸に合わせ名前15/700、メモ12/400、補助12(旧2026-09-09: 16/13/12。ユーザー「まだ画像に近づいていない」)。入力は16pxを保つ。 */
  --font-size-row-name: .9375rem;
  --font-size-row-summary: .75rem;
  --font-size-detail-name: 1.375rem;
  /* 2026-09-26 カードの見出し(訪問履歴の日付・確認ダイアログの見出し)。モック16・22の実寸 約17px */
  --font-size-card-title: 1.0625rem;
  --line-height-body: 1.6;
  --line-height-label: 1.5;
  --line-height-heading: 1.3;
  --line-height-row-name: 1.4;
  --line-height-row-summary: 1.5;
  /* 一覧行は上下8px。横の16pxは親パネルに集約し、二重に余白を付けない。 */
  --row-pad-y: .5rem;
  --row-pad-x: 0;
  --size-tap: 2.75rem;
  /* 2026-09-25 実装で使う高さ。保存バー・主ボタン52px(本書§部品)・条件ラベル36px・ホーム上部の高さ */
  --size-primary: 3.25rem;
  /* 2026-09-27 画面の下の大きな確定ボタン(モック09・14・18・20・21)と、UMASOO!/GOCHIDESUのボタン(横並び=13・縦に大きく=11) */
  --size-primary-lg: 3.5rem;
  --size-brand-button: 4rem;
  --size-brand-button-lg: 5rem;
  --size-chip: 2.25rem;
  --size-header: 4.75rem;
  /* 2026-09-26 ロゴ(茶のワードマーク)の高さ。モック01の実測 約23px */
  --size-logo: 1.4375rem;
  --size-control: 2.75rem;
  --size-pin: 2.75rem;
  --panel-collapsed: 8.75rem;
  --panel-half: 50dvh;
  /* 起動時パネル。180pxの操作部と写真付きの一覧3〜4件を見せる（390px幅）。 */
  --panel-initial: 34rem;
  --panel-initial-compact: 27.5rem;
  --content-width: 75rem;
  --content-reading: 40rem;
  --shadow-float: 0 8px 28px -16px rgb(41 39 34 / .18);
  --shadow-press: none;
  --motion-fast: 140ms;
  --motion-panel: 220ms;
  --ease-standard: cubic-bezier(.2, .8, .2, 1);
  --z-map: 0;
  --z-float: 10;
  --z-panel: 20;
  --z-bar: 30;
  --z-screen: 40;
  --z-scrim: 50;
  --z-sheet: 60;
  --z-toast: 70;
}

/* Public Places UI Kit properties verified against the Google reference on
   2026-09-07. Bind this class to the gmp-place-details host. Attribution remains
   Google-controlled; never recolor or replace its contents. API rendering is
   a production integration check, not demonstrated by the HTML mock.
   https://developers.google.com/maps/documentation/javascript/places-ui-kit/custom-styling
*/
.gmp-block {
  color-scheme: light;
  border: 0;
  border-radius: var(--radius-lg);
  --gmp-mat-color-surface: var(--card);
  --gmp-mat-color-on-surface: var(--foreground);
  --gmp-mat-color-on-surface-variant: var(--muted-foreground);
  --gmp-mat-color-primary: var(--foreground);
  --gmp-mat-color-secondary-container: var(--accent);
  --gmp-mat-color-on-secondary-container: var(--foreground);
  --gmp-mat-color-outline-decorative: var(--border);
  --gmp-mat-color-positive: var(--foreground);
  --gmp-mat-color-negative: var(--muted-foreground);
  --gmp-mat-color-neutral-container: var(--muted);
  --gmp-mat-color-on-neutral-container: var(--muted-foreground);
  --gmp-mat-font-family: var(--font-sans);
  --gmp-mat-font-display-small: 700 1.25rem/1.4 var(--font-sans);
  --gmp-mat-font-headline-medium: 700 1.25rem/1.4 var(--font-sans);
  --gmp-mat-font-body-medium: 400 1rem/1.7 var(--font-sans);
  --gmp-mat-font-label-large: 600 .875rem/1.5 var(--font-sans);
  --gmp-mat-font-label-medium: 400 .8125rem/1.5 var(--font-sans);
}
