:root{--color-primary: #4A7C59;--color-primary-light: #E8F0EB;--color-primary-dark: #3A6347;--color-secondary: #8B6F47;--color-secondary-light: #F5F0E8;--color-accent: #E8836B;--color-accent-light: #FDF0ED;--color-score-great: #2E8B57;--color-score-great-bg: #E6F5ED;--color-score-good: #3A8A8A;--color-score-good-bg: #E6F3F3;--color-score-explore: #C4862B;--color-score-explore-bg: #FFF4E5;--color-score-nearby: #8A8A8A;--color-score-nearby-bg: #F2F2F2;--color-success: #2E8B57;--color-success-bg: #E6F5ED;--color-warning: #C4862B;--color-warning-bg: #FFF4E5;--color-error: #E24B4A;--color-error-bg: #FCEBEB;--color-info: #378ADD;--color-info-bg: #E6F1FB;--color-info-dark: #185FA5;--color-text-primary: #1A1A1A;--color-text-secondary: #5A5A5A;--color-text-hint: #9A9A9A;--color-text-inverse: #FFFFFF;--color-bg-primary: #FFFFFF;--color-bg-page: #F7F5F2;--color-bg-surface: #FAFAF8;--color-bg-overlay: rgba(0, 0, 0, .5);--color-border: #E5E2DD;--color-border-light: #F0EDE8;--font-primary: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "SF Mono", monospace;--text-xs: .6875rem;--text-sm: .8125rem;--text-base: .9375rem;--text-lg: 1rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--weight-light: 300;--weight-regular: 400;--weight-medium: 500;--weight-semibold: 600;--leading-tight: 1.4;--leading-normal: 1.6;--leading-relaxed: 1.8;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-7: 1.75rem;--space-8: 2rem;--space-9: 2.25rem;--space-10: 2.5rem;--space-11: 2.75rem;--space-12: 3rem;--space-14: 3.5rem;--space-16: 4rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .1);--transition-fast: .12s ease;--transition-normal: .2s ease;--transition-slow: .4s ease;--z-base: 0;--z-dropdown: 100;--z-sticky: 200;--z-modal-backdrop: 300;--z-modal: 400;--z-toast: 500;--z-tooltip: 600;--content-max: 600px;--content-padding: var(--space-4);--touch-min: 44px;--topbar-height: 56px;--bottom-nav-height: 56px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--match-card-bg: #ffffff;--match-card-radius: 20px;--match-card-shadow: 0 4px 16px rgba(0, 0, 0, .08);--match-photo-radius: 14px;--match-photo-placeholder-bg: #d1dbd1;--match-score-bg: #fafaf7;--match-score-radius: 12px;--match-bar-track: #e5e3de;--match-bar-fill: #4a7d59;--match-trait-bg: #e8f0eb;--match-trait-color: #4a7d59;--match-overlap-bg: #EEEDE8;--match-btn-hello-shadow: 0 4px 12px rgba(74, 125, 89, .3);--match-btn-pass-border: #8b6f47;--color-bg-secondary: var(--color-bg-page);--color-bg-tertiary: var(--color-bg-surface);--color-text-tertiary: var(--color-text-hint);--color-border-default: var(--color-border);--color-border-strong: var(--color-text-hint)}@media(prefers-color-scheme:dark){:root{--color-primary: #6BAF82;--color-primary-light: #1E3328;--color-primary-dark: #8FCAA2;--color-secondary: #C4A87A;--color-secondary-light: #2A2419;--color-accent: #F0A08A;--color-accent-light: #3A2420;--color-score-great: #5BC088;--color-score-great-bg: #1A3025;--color-score-good: #5BBABA;--color-score-good-bg: #1A2D2D;--color-score-explore: #E0A84A;--color-score-explore-bg: #332810;--color-score-nearby: #A0A0A0;--color-score-nearby-bg: #2A2A2A;--color-success: #5BC088;--color-success-bg: #1A3025;--color-warning: #E0A84A;--color-warning-bg: #332810;--color-error: #F07070;--color-error-bg: #3A1A1A;--color-info: #6AAAE0;--color-info-bg: #1A2A3A;--color-info-dark: #90C0F0;--color-text-primary: #F0EDE8;--color-text-secondary: #A5A09A;--color-text-hint: #706B65;--color-bg-primary: #1A1917;--color-bg-page: #121110;--color-bg-surface: #222120;--color-bg-overlay: rgba(0, 0, 0, .7);--color-border: #3A3835;--color-border-light: #2A2825;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .2);--shadow-md: 0 4px 12px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .4);--match-card-bg: var(--color-bg-surface);--match-card-shadow: 0 4px 16px rgba(0, 0, 0, .3);--match-photo-placeholder-bg: #2a3a2a;--match-score-bg: var(--color-bg-surface);--match-bar-track: #3a3835;--match-bar-fill: #6BAF82;--match-trait-bg: #1E3328;--match-trait-color: #6BAF82;--match-overlap-bg: #2E2D2B;--match-btn-hello-shadow: 0 4px 12px rgba(107, 175, 130, .3);--match-btn-pass-border: #C4A87A}}.visually-hidden,.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html{font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{font-family:var(--font-primary);font-size:var(--text-base);font-weight:var(--weight-regular);line-height:var(--leading-relaxed);color:var(--color-text-primary);background-color:var(--color-bg-page);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior-y:contain}a,button,[role=button],input,select,textarea{min-height:var(--touch-min)}a{color:var(--color-primary);text-decoration:none}a:hover,a:focus-visible{color:var(--color-primary-dark);text-decoration:underline}:focus-visible{outline:none;box-shadow:0 0 0 2px var(--color-bg-primary),0 0 0 4px var(--color-primary)}[lang=ja]{letter-spacing:0}h1,h2,h3,h4,h5,h6{font-weight:var(--weight-medium);line-height:var(--leading-tight)}@media(prefers-reduced-motion:reduce){:root{--transition-fast: 0ms;--transition-normal: 0ms;--transition-slow: 0ms}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-full)}
