@layer tokens {
	/* ======================
		Color system
	====================== */
	:root{
		--neutral-white:#fff;
		--neutral-gray:#999;
		--neutral-black:#1A1A1A;

		--primary-light-1:#E1ECFB;
		--primary-light-2:#A1C5F4;
		--primary-light-3:#00B2D5;
		/*--primary-base:#3986E9;*/
		--primary-base:#061D3F;
		--primary-dark:#1D6ED7;
		--primary-darker:#0E4B9A;
		
		--secondary-light:#D0ECCC;
		--secondary-base:#5BAE08;
		--secondary-dark:#48A13A;

		--accent-light:#FFBA61;
		--accent-base:#FF9100;
		--accent-dark:#E78300;
		
		--decorative-light:#D4C37A;
		--decorative-base:#BC9D12;
		--decorative-dark:#8C7407;

		--feedback-success:#C0E6B3;
		--feedback-warning:#E69898;
		--feedback-error:#FF5959;
		--feedback-info:#3986E9;

		--surface-light-1:#F9F9F9;
		--surface-light-2:#F0F0F0;
		--surface-base:#E9E9E9;
		--surface-dark:#DDDDDD;

		--border-light:#E6E6E6;
		/*--border-base:#CCC;*/
		--border-base:#dedede;
		/*--border-dark:#999;*/
		--border-dark:#adadad;

		/* Text Color */
		--text-primary:#1A1A1A;
		--text-secondary:#666;
		--text-disabled:#AAA;
		--text-inverse:#FFF;
		--text-red:#FF5959;

		/* Link Color */
		--link-default:#3986E9;
		--link-hover:#A1C5F4;
		--link-active:#3986E9;
		--link-visited:#3986E9;

		--dark-blue: #0A213D;
		--property-name:#f5deb3;
		--fee-free-bg:#fffdd9;
		--navy-color: #1F2A44;
		--navy-ttl: #061D3F;

		/* MAP COLOR */
		--ward-bg1: #edecea;
		--ward-bg2: #f5f2e7;
	}

	:root {
		--gradient-btn-contact-base: linear-gradient(#3986E9 30%, #6DA5EF 85%);
		--gradient-btn-contact-light: linear-gradient(#A1C5F4 0%, #D1E0F5 100%);
		--shadow-contact: 0 4px 6px rgba(57, 134, 233, 0.9);
		--gradient-btn-reserve-base: linear-gradient(#BC9D12 30%, #D4C37A 85%);
		--gradient-btn-reserve-light: linear-gradient(#D4C37A 0%, #E6DBAC 100%);
		--shadow-reserve: 0 4px 6px rgba(188, 157, 18, 0.9);
		--gradient-btn-waitlist-base: linear-gradient(#00B2D5 30%, #8BD9E9 85%);
		--gradient-btn-waitlist-light: linear-gradient(#D0ECCC 0%, #E7F6E5 50%, #F7FEF7 100%);
		--shadow-waitlist: 0 4px 6px rgba(0, 178, 213, 0.9);
		--free-icon-waitlist: #66C9DC;
	}

	/* ======================
		Text size set
	====================== */
	:root{
		/* ----- 基準 1rem = 16px ----- */
		--font-ultra-xl: 2.5rem;		/*  */
		--font-body-xl: 1.25rem;        /* 20px */
		--font-body-lg: 1.125rem;       /* 18px */
		--font-body:    1rem;           /* 16px */
		--font-small:   0.875rem;       /* 14px */
		--font-caption: 0.75rem;        /* 12px */
		--font-ultra-small: 0.625rem;   /* 10px */
		--font-body-map: 3.2rem;           /* SVG map labels */
		/* ----- 見出し ----- */
		--font-h1: clamp(1.4375rem, 4vw, 1.8rem);
		--font-h2: clamp(1.1875rem, 3.2vw, 1.6875rem);  /* 19px ～ 27px */
		--font-h3: clamp(1.0625rem, 2.4vw, 1.5625rem);  /* 17px ～ 25px */
		--font-h4: 1.0625rem;							/* 17px */
		--font-h5: 0.9375rem;							/* 15px */
		--font-h6: 0.875rem;							/* 14px */

		/* 行間の基準 */
		--line-height-body: 1.4;
		--line-height-heading: 1.3;

		--line-height-small: 1.45;
		--line-height-caption: 1.4;

		/* 字間 */
		--letter-spacing-body: 0.02em;

		/* 明朝体（見出し用） */
		--font-serif: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Yu Mincho", "YuMincho", "MS PMincho", "MS Mincho", "Noto Serif JP", serif;
	}
	:root{
		--font-terms-rent: 1.2rem;		/*  */
		--font-detail-rent: 2.1875rem; 		/* 35px */
		--btn-text: 0.9375rem;				/* 15px */
	}

	@media screen and (max-width: 767px) {
		:root{
			/* ----- 基準 1rem = 15px ----- */
			--font-body-xl: 1.0625rem;		/* 17px */
			--font-body-lg: 0.9375rem;		/* 15px */
			--font-body: 0.8125rem;			/* 13px */
			--font-small: 0.6875rem;		/* 11px */
			--font-caption: 0.5625rem;		/* 9px */
			--font-ultra-small: 0.5rem;		/* 8px */
			--font-body-map: 2.5rem;		/* 56px – SVG map labels (SP) */

			/* 見出し微調整 *//*
			--font-h4: 1.125rem;	/* 18px *//*
			--font-h5: 1rem;		/* 16px *//*
			--font-h6: 0.9375rem;	/* 15px */
		}
	}


	/* ======================
		Shadow set
	====================== */
	:root{
		--shadow-soft: 0 4px 12px rgba(26, 26, 26, 0.1);
		--shadow-medium: 0 4px 12px rgba(26, 26, 26, 0.2);
		--shadow-hard: 0 4px 12px rgba(26, 26, 26, 0.3);

		--shadow-result-list-top: 0 -4px 12px rgba(26, 26, 26, 0.2);
		--shadow-result-list-bottom: 0 4px 12px rgba(26, 26, 26, 0.2);

		--shadow-reco-cell: 0 2px 8px rgba(26, 26, 26, 0.2);

		--shadow-btn: 0 3px 6px rgba(26, 26, 26, 0.4);
	}

	/* ======================
		Radius set
	====================== */
	:root{
		--radius-xxsmall: 0.1rem;
		--radius-xsmall: 0.25rem;
		--radius-small: 0.5rem;
		--radius-large: 1rem;
		--radius-xlarge: 2rem;
		--radius-maximum: 99rem;

		--radius-btn: 0.5rem;
	}

	/* ======================
		Checkbox set
	====================== */
	:root{
		--checkbox-small: scale(1.0);
		--checkbox-normal: scale(1.3);
		--checkbox-large: scale(1.6);
		--checkbox-xlarge: scale(1.7);
	}
}