@charset "utf-8";
/* ==========================================================================
	푸드노트 remaster.css
	- 기존 foodnote.css / studio.css / food-workspace.css / order-ui.css / login.css
	  "다음에" 불러오는 덮어쓰기 레이어입니다. 기존 JS·DOM 구조는 바꾸지 않습니다.
	- 우선순위: <html class="rm"> 접두(html.rm)와 #foodnote-workspace 로 확보합니다.
	  !important 는 [hidden] 보호 1곳만 사용합니다.
	- display 값은 실측으로 확인한 컨테이너에만 지정합니다.
	  (기존 CSS가 조건부로 숨기는 요소의 display 는 건드리지 않습니다)
	- 롤백: 각 HTML의 <link rel="stylesheet" href="/remaster.css"> 한 줄을 지우면 원복됩니다.
	========================================================================== */

/* 0. 디자인 토큰 ----------------------------------------------------------- */
html.rm {
	--rm-accent: #2457D6;
	--rm-accent-strong: #1A43A8;
	--rm-accent-soft: #E9EEFB;
	--rm-accent-mark: #D8E1F8;
	--rm-ink: #101828;
	--rm-ink-2: #344054;
	--rm-ink-3: #475467;
	--rm-icon: #667085;
	--rm-line: #E4E7EC;
	--rm-line-strong: #D0D5DD;
	--rm-subtle: #F2F4F7;
	--rm-subtle-2: #F9FAFB;
	--rm-page: #F5F7FA;
	--rm-surface: #FFFFFF;
	--rm-warn-bg: #FFFAEB;
	--rm-warn-line: #FEDF89;
	--rm-warn-ink: #93370D;
	--rm-ok-bg: #ECFDF3;
	--rm-ok-line: #ABEFC6;
	--rm-ok-ink: #085D3A;
	--rm-err-bg: #FEF3F2;
	--rm-err-line: #FECDCA;
	--rm-err-ink: #912018;
	--rm-r-lg: 16px;
	--rm-r-md: 12px;
	--rm-r-sm: 10px;
	--rm-r-pill: 999px;
	--rm-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
	--rm-shadow-md: 0 12px 32px rgba(16, 24, 40, 0.08);
	--rm-touch: 44px;
	--rm-shell: 1200px;
	--rm-gutter: 24px;
	--rm-font: FoodnoteUI, "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", system-ui, sans-serif;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

/* 1. 기본 ------------------------------------------------------------------ */
html.rm [hidden] {
	display: none !important;
}
html.rm body {
	margin: 0;
	background: var(--rm-page);
	color: var(--rm-ink);
	font-family: var(--rm-font);
	font-size: 16px;
	line-height: 1.6;
	word-break: keep-all;
	overflow-wrap: break-word;
	-webkit-font-smoothing: antialiased;
}
html.rm a {
	color: var(--rm-accent);
	text-underline-offset: 3px;
}
html.rm a:hover {
	color: var(--rm-accent-strong);
}
html.rm :focus-visible {
	outline: 3px solid var(--rm-accent);
	outline-offset: 2px;
	border-radius: 4px;
}
html.rm .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;
}
html.rm ::selection {
	background: var(--rm-accent-mark);
	color: var(--rm-ink);
}
html.rm .fn-skip,
html.rm .skip {
	position: absolute;
	left: 12px;
	top: -80px;
	z-index: 100;
	padding: 12px 16px;
	border-radius: var(--rm-r-sm);
	background: var(--rm-ink);
	color: #FFFFFF;
	font-weight: 700;
	text-decoration: none;
}
html.rm .fn-skip:focus,
html.rm .skip:focus {
	top: 12px;
	color: #FFFFFF;
}

/* 2. 헤더 (index/login: .fn-*, orders/account: .header/.wrap) ---------------- */
html.rm .fn-header,
html.rm .header {
	position: relative;
	z-index: 20;
	background: var(--rm-surface);
	border-bottom: 1px solid var(--rm-line);
	box-shadow: none;
}
html.rm .fn-shell,
html.rm .wrap {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--rm-shell);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--rm-gutter);
	padding-right: var(--rm-gutter);
}
/* 실측: .fn-shell / .fn-brand / .fn-nav 는 기존 CSS에서도 flex — 기존 CSS 없이도 같은 배치가 되도록 명시 */
html.rm .fn-header .fn-shell,
html.rm .header-row {
	display: flex;
	min-height: 64px;
	gap: 8px 24px;
	align-items: center;
}
html.rm .fn-brand,
html.rm .brand {
	display: flex;
	flex: 0 0 auto;
	min-height: var(--rm-touch);
	gap: 10px;
	align-items: center;
	color: var(--rm-ink);
	font-size: 19px;
	font-weight: 800;
	letter-spacing: -0.02em;
	text-decoration: none;
}
html.rm .fn-brand-mark,
html.rm .brand .mark {
	width: 32px;
	height: 32px;
	border-radius: 9px;
}
html.rm .fn-nav,
html.rm .nav {
	display: flex;
	gap: 4px;
	align-items: center;
}
html.rm .fn-nav > button,
html.rm .fn-nav > a,
html.rm .nav > a,
html.rm .fn-nav-more > summary {
	box-sizing: border-box;
	min-height: var(--rm-touch);
	padding: 0 14px;
	border: 0;
	border-radius: var(--rm-r-sm);
	background: transparent;
	color: var(--rm-ink-3);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
html.rm .fn-nav > button:hover,
html.rm .fn-nav > a:hover,
html.rm .nav > a:hover,
html.rm .fn-nav-more > summary:hover {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm .fn-nav > button[aria-current],
html.rm .fn-nav > button[aria-pressed="true"],
html.rm .fn-nav > a[aria-current],
html.rm .nav > a[aria-current] {
	background: var(--rm-accent-soft);
	color: var(--rm-accent);
	font-weight: 700;
}
html.rm #fw-saved-count {
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	box-sizing: border-box;
	border-radius: var(--rm-r-pill);
	background: var(--rm-subtle);
	color: var(--rm-ink-3);
	font-size: 12px;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
}
html.rm .fn-nav-more {
	position: relative;
}
html.rm .fn-nav-more > summary {
	list-style: none;
}
html.rm .fn-nav-more > summary::-webkit-details-marker {
	display: none;
}
html.rm .fn-nav-more > summary::after {
	content: "";
	width: 7px;
	height: 7px;
	margin-left: 2px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
}
html.rm .fn-nav-more[open] > summary {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm .fn-nav-more > div {
	position: absolute;
	right: 0;
	top: calc(100% + 6px);
	min-width: 200px;
	padding: 6px;
	box-sizing: border-box;
	background: var(--rm-surface);
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	box-shadow: var(--rm-shadow-md);
}
html.rm .fn-nav-more > div > a,
html.rm .fn-nav-more > div > button {
	box-sizing: border-box;
	width: 100%;
	min-height: var(--rm-touch);
	padding: 0 12px;
	border: 0;
	border-radius: var(--rm-r-sm);
	background: transparent;
	color: var(--rm-ink-2);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
	display: flex;
	align-items: center;
}
html.rm .fn-nav-more > div > a:hover,
html.rm .fn-nav-more > div > button:hover {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm .fn-nav-more > div > a[aria-current] {
	background: var(--rm-accent-soft);
	color: var(--rm-accent);
}

/* 3. 공통 컨트롤 ------------------------------------------------------------ */
html.rm .fw-primary,
html.rm .button.primary,
html.rm .login-submit,
html.rm .rm-btn-primary {
	box-sizing: border-box;
	min-height: var(--rm-touch);
	padding: 0 20px;
	border: 1px solid var(--rm-accent);
	border-radius: var(--rm-r-md);
	background: var(--rm-accent);
	color: #FFFFFF;
	font: inherit;
	font-size: 15px;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	box-shadow: none;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}
html.rm .fw-primary:hover,
html.rm .button.primary:hover,
html.rm .login-submit:hover,
html.rm .rm-btn-primary:hover {
	background: var(--rm-accent-strong);
	border-color: var(--rm-accent-strong);
	color: #FFFFFF;
}
html.rm .fw-primary:disabled,
html.rm .login-submit:disabled,
html.rm .fw-primary[aria-disabled="true"] {
	background: #EAECF0;
	border-color: #EAECF0;
	color: var(--rm-ink-3);
	cursor: not-allowed;
}
html.rm .fw-secondary,
html.rm .button:not(.primary),
html.rm .rm-btn-secondary {
	box-sizing: border-box;
	min-height: var(--rm-touch);
	padding: 0 16px;
	border: 1px solid var(--rm-line-strong);
	border-radius: var(--rm-r-sm);
	background: var(--rm-surface);
	color: var(--rm-ink-2);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	box-shadow: none;
}
html.rm .fw-secondary:hover,
html.rm .button:not(.primary):hover,
html.rm .rm-btn-secondary:hover {
	background: var(--rm-subtle-2);
	border-color: #98A2B3;
	color: var(--rm-ink);
}
html.rm .fw-text-button {
	min-height: var(--rm-touch);
	padding: 0 8px;
	border: 0;
	border-radius: var(--rm-r-sm);
	background: transparent;
	color: var(--rm-accent);
	font: inherit;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}
html.rm .fw-text-button:hover {
	background: var(--rm-accent-soft);
}
html.rm .fw-icon-button {
	min-width: var(--rm-touch);
	min-height: var(--rm-touch);
	border: 0;
	border-radius: var(--rm-r-sm);
	background: transparent;
	color: var(--rm-icon);
	cursor: pointer;
	place-items: center;
}
html.rm .fw-icon-button:hover {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm #foodnote-workspace input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html.rm #foodnote-workspace select,
html.rm #foodnote-workspace textarea,
html.rm #app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html.rm #app select,
html.rm #app textarea,
html.rm .login-main input:not([type="hidden"]) {
	box-sizing: border-box;
	min-height: var(--rm-touch);
	padding: 0 12px;
	border: 1px solid var(--rm-line-strong);
	border-radius: var(--rm-r-sm);
	background: var(--rm-surface);
	color: var(--rm-ink);
	font: inherit;
	font-size: 16px;
	box-shadow: none;
}
html.rm #foodnote-workspace textarea,
html.rm #app textarea {
	padding: 10px 12px;
	line-height: 1.6;
}
html.rm #foodnote-workspace input:focus,
html.rm #foodnote-workspace select:focus,
html.rm #foodnote-workspace textarea:focus,
html.rm #app input:focus,
html.rm #app select:focus,
html.rm #app textarea:focus,
html.rm .login-main input:focus {
	border-color: var(--rm-accent);
	outline: 3px solid var(--rm-accent-soft);
	outline-offset: 0;
}
html.rm #foodnote-workspace input[aria-invalid="true"],
html.rm #app input[aria-invalid="true"],
html.rm .login-main input[aria-invalid="true"] {
	border-color: #D92D20;
}
html.rm #foodnote-workspace ::placeholder,
html.rm #app ::placeholder,
html.rm .login-main ::placeholder {
	color: #667085;
	opacity: 1;
}
html.rm #foodnote-workspace summary,
html.rm #app summary {
	min-height: var(--rm-touch);
	cursor: pointer;
}

/* 4. 작업실(index) ---------------------------------------------------------- */
html.rm #foodnote-workspace {
	background: var(--rm-page);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
html.rm #foodnote-workspace .fw-device {
	flex: 1 0 auto;
	background: transparent;
}
html.rm #foodnote-workspace #fw-content {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--rm-shell);
	margin: 0 auto;
	padding: 28px var(--rm-gutter) 56px;
}
html.rm #foodnote-workspace #fw-content:focus {
	outline: none;
}
html.rm #foodnote-workspace .wb-heading {
	gap: 8px 24px;
	align-items: flex-end;
	margin-bottom: 20px;
}
html.rm #foodnote-workspace .wb-heading h1 {
	margin: 0;
	font-size: 32px;
	line-height: 1.25;
	font-weight: 800;
	letter-spacing: -0.025em;
}
html.rm #foodnote-workspace .wb-heading p {
	margin: 6px 0 0;
	color: var(--rm-ink-3);
	font-size: 16px;
}
html.rm #foodnote-workspace .wb-heading .wb-helper {
	margin: 0;
	padding: 6px 12px;
	border-radius: var(--rm-r-pill);
	background: var(--rm-subtle);
	color: var(--rm-ink-3);
	font-size: 13px;
	font-weight: 500;
}
html.rm #foodnote-workspace .wb-helper {
	color: var(--rm-ink-3);
	font-size: 13px;
}
html.rm #foodnote-workspace .wb-workspace {
	gap: 24px;
	align-items: start;
}
@media (min-width: 1024px) {
	html.rm #foodnote-workspace .wb-workspace {
		grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
	}
}
html.rm #foodnote-workspace .wb-find {
	min-width: 0;
}

/* 4-1. 자료 범위 탭 (aria-pressed) */
html.rm #foodnote-workspace .wb-tabs {
	gap: 4px;
	padding: 4px;
	margin-bottom: 16px;
	border: 0;
	border-radius: var(--rm-r-md);
	background: var(--rm-subtle);
	width: max-content;
	max-width: 100%;
}
html.rm #foodnote-workspace .wb-tabs > button {
	min-height: var(--rm-touch);
	padding: 0 16px;
	border: 0;
	border-radius: 9px;
	background: transparent;
	color: var(--rm-ink-3);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	box-shadow: none;
	cursor: pointer;
}
html.rm #foodnote-workspace .wb-tabs > button[aria-pressed="true"] {
	background: var(--rm-surface);
	color: var(--rm-ink);
	font-weight: 700;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08);
}

/* 4-2. 검색 */
html.rm #foodnote-workspace .wb-find form label,
html.rm #foodnote-workspace .wb-kind {
	color: var(--rm-ink-3);
	font-size: 13px;
	font-weight: 600;
}
html.rm #foodnote-workspace .wb-search-row {
	gap: 8px;
	align-items: stretch;
}
html.rm #foodnote-workspace .wb-search-row input {
	flex: 1 1 0;
	min-width: 0;
	min-height: 52px;
	padding: 0 16px 0 44px;
	border-width: 1.5px;
	border-radius: var(--rm-r-md);
	background: var(--rm-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 14px center;
}
html.rm #foodnote-workspace .wb-search-row .fw-primary {
	flex: 0 0 auto;
	min-height: 52px;
	padding: 0 24px;
}
html.rm #foodnote-workspace .wb-search-filters {
	gap: 12px;
	margin-top: 12px;
}
html.rm #foodnote-workspace .wb-kind select {
	width: 100%;
	margin-top: 6px;
}
html.rm #foodnote-workspace .wb-feedback {
	color: var(--rm-ink-3);
	font-size: 14px;
}

/* 4-3. 시작 화면(빈 상태) */
html.rm #foodnote-workspace .wb-start {
	margin-top: 20px;
	padding: 28px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
}
html.rm #foodnote-workspace .wb-start h2 {
	margin: 0;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.02em;
}
html.rm #foodnote-workspace .wb-start p {
	color: var(--rm-ink-3);
	font-size: 15px;
}
html.rm #foodnote-workspace .wb-quick {
	gap: 8px;
	flex-wrap: wrap;
}
html.rm #foodnote-workspace .wb-quick .fw-secondary {
	border-color: transparent;
	background: var(--rm-subtle);
	color: var(--rm-ink-2);
}
html.rm #foodnote-workspace .wb-quick .fw-secondary:hover {
	background: #EAECF0;
}

/* 4-4. 검색 결과 카드 */
html.rm #foodnote-workspace article.wb-food {
	margin: 0 0 8px;
	padding: 16px 20px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-surface);
	box-shadow: none;
	transition: border-color 0.15s ease;
}
html.rm #foodnote-workspace article.wb-food:hover {
	border-color: var(--rm-line-strong);
}
html.rm #foodnote-workspace article.wb-food.is-selected {
	border: 1.5px solid var(--rm-accent);
	background: var(--rm-surface);
}
html.rm #foodnote-workspace .wb-food-heading {
	gap: 12px;
	align-items: flex-start;
	justify-content: space-between;
}
html.rm #foodnote-workspace .wb-food-heading h2 {
	margin: 0;
	font-size: 16px;
	line-height: 1.45;
	font-weight: 700;
}
html.rm #foodnote-workspace .wb-food-heading .wb-helper {
	margin: 4px 0 0;
	font-size: 12px;
}
html.rm #foodnote-workspace .fw-pick {
	flex: 0 0 auto;
	min-height: var(--rm-touch);
	min-width: 112px;
	padding: 0 14px;
	border: 1px solid var(--rm-line-strong);
	border-radius: var(--rm-r-sm);
	background: var(--rm-surface);
	color: var(--rm-ink);
	font: inherit;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	cursor: pointer;
	justify-content: center;
	gap: 6px;
}
html.rm #foodnote-workspace .fw-pick:hover {
	border-color: #98A2B3;
	background: var(--rm-subtle-2);
}
html.rm #foodnote-workspace .fw-pick[aria-pressed="true"] {
	border-color: var(--rm-accent);
	background: var(--rm-accent-soft);
	color: var(--rm-accent);
}
html.rm #foodnote-workspace .fw-pick:disabled {
	border-color: var(--rm-line);
	background: var(--rm-subtle);
	color: var(--rm-ink-3);
	cursor: not-allowed;
}
html.rm #foodnote-workspace dl.wb-food-values {
	gap: 4px 24px;
	flex-wrap: wrap;
	margin: 12px 0 4px;
}
html.rm #foodnote-workspace dl.wb-food-values dt {
	color: var(--rm-ink-3);
	font-size: 12px;
}
html.rm #foodnote-workspace dl.wb-food-values dd {
	margin: 2px 0 0;
	color: var(--rm-ink);
	font-size: 17px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
html.rm #foodnote-workspace details.wb-raw > summary,
html.rm #foodnote-workspace details.wb-data-group > summary {
	display: inline-flex;
	align-items: center;
	padding: 0 4px;
	color: var(--rm-ink-3);
	font-size: 14px;
	font-weight: 600;
}
html.rm #foodnote-workspace details.wb-raw > summary:hover,
html.rm #foodnote-workspace details.wb-data-group > summary:hover {
	color: var(--rm-ink);
}
html.rm #foodnote-workspace details.wb-raw[open] {
	margin-top: 8px;
	padding: 4px 16px 12px;
	border-radius: var(--rm-r-sm);
	background: var(--rm-subtle-2);
}
html.rm #foodnote-workspace details.wb-data-group dl > div {
	padding: 6px 0;
	border-top: 1px solid var(--rm-line);
}
html.rm #foodnote-workspace details.wb-data-group dt {
	color: var(--rm-ink-3);
	font-size: 12px;
}
html.rm #foodnote-workspace details.wb-data-group dd {
	margin: 0;
	font-size: 14px;
}
html.rm #foodnote-workspace nav.wb-paging {
	gap: 8px;
	justify-content: center;
	margin-top: 16px;
}

/* 4-5. 비교함·분석 패널(aside) */
html.rm #foodnote-workspace aside.wb-work {
	min-width: 0;
	padding: 20px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
	box-shadow: none;
}
html.rm #foodnote-workspace details.wb-analysis-drawer > summary {
	font-size: 15px;
	font-weight: 800;
}
html.rm #foodnote-workspace .wb-section-head {
	gap: 8px;
	align-items: center;
	justify-content: space-between;
}
html.rm #foodnote-workspace .wb-section-head h2,
html.rm #foodnote-workspace .wb-analysis h2,
html.rm #foodnote-workspace .wb-analysis-empty h2 {
	margin: 0;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -0.01em;
}
html.rm #foodnote-workspace .wb-selection {
	padding: 0 0 16px;
	margin-bottom: 16px;
	border: 0;
	border-bottom: 1px solid var(--rm-subtle);
	background: transparent;
}
html.rm #foodnote-workspace .wb-selected {
	gap: 8px;
	align-items: center;
	margin-top: 8px;
	padding: 8px 4px 8px 14px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	font-size: 14px;
	font-weight: 700;
}
html.rm #foodnote-workspace .wb-selection .fw-primary {
	width: 100%;
	min-height: 52px;
	margin-top: 12px;
	font-size: 16px;
}
html.rm #foodnote-workspace .wb-analysis-empty {
	padding: 4px 0 0;
	border: 0;
	background: transparent;
	color: var(--rm-ink-3);
	font-size: 14px;
}
html.rm #foodnote-workspace .wb-analysis p {
	color: var(--rm-ink-3);
	font-size: 14px;
}
html.rm #foodnote-workspace .wb-field label {
	color: var(--rm-ink-2);
	font-size: 13px;
	font-weight: 600;
}
html.rm #foodnote-workspace .wb-input-error {
	color: #B42318;
	font-size: 13px;
}
html.rm #foodnote-workspace .wb-quick-results h3 {
	font-size: 15px;
	font-weight: 800;
}
html.rm #foodnote-workspace details.wb-accordion {
	margin-top: 8px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-surface);
	overflow: hidden;
}
html.rm #foodnote-workspace details.wb-accordion > summary {
	display: flex;
	align-items: center;
	padding: 0 14px;
	font-size: 14px;
	font-weight: 700;
	color: var(--rm-ink-2);
}
html.rm #foodnote-workspace details.wb-accordion[open] > summary {
	border-bottom: 1px solid var(--rm-line);
	background: var(--rm-subtle-2);
}
html.rm #foodnote-workspace details.wb-accordion > :not(summary) {
	margin-left: 14px;
	margin-right: 14px;
}
html.rm #foodnote-workspace .wb-input-grid {
	gap: 12px;
}
html.rm #foodnote-workspace fieldset {
	margin: 12px 0;
	padding: 12px 14px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
}
html.rm #foodnote-workspace legend {
	padding: 0 4px;
	font-size: 14px;
	font-weight: 700;
}
html.rm #foodnote-workspace .wb-offer-preview {
	color: var(--rm-ink-3);
	font-size: 13px;
}
html.rm #foodnote-workspace article.wb-goal {
	margin: 8px 0;
	padding: 14px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-surface);
}
html.rm #foodnote-workspace dl.wb-goal-values {
	gap: 8px 16px;
}
html.rm #foodnote-workspace dl.wb-goal-values dt {
	color: var(--rm-ink-3);
	font-size: 12px;
}
html.rm #foodnote-workspace dl.wb-goal-values dd {
	margin: 2px 0 0;
	font-size: 16px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
html.rm #foodnote-workspace details.wb-formula,
html.rm #foodnote-workspace .wb-mixture-result {
	margin-top: 8px;
	padding: 4px 12px 8px;
	border-radius: var(--rm-r-sm);
	background: var(--rm-subtle-2);
	font-size: 13px;
	color: var(--rm-ink-2);
}
html.rm #foodnote-workspace .wb-assessment.is-calculated {
	padding: 2px 8px;
	border-radius: var(--rm-r-pill);
	background: var(--rm-subtle);
	color: var(--rm-ink-2);
	font-size: 12px;
	font-weight: 600;
}

/* 4-6. 표 (요약표·영양성분표·비교표) */
html.rm #foodnote-workspace .fw-compare-scroll,
html.rm #foodnote-workspace .wb-quick-results {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
html.rm #foodnote-workspace table.wb-summary-table,
html.rm #foodnote-workspace table.wb-nutrition-table,
html.rm #foodnote-workspace table.fw-comparison {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-surface);
	font-size: 14px;
	font-variant-numeric: tabular-nums;
	overflow: hidden;
}
html.rm #foodnote-workspace table.wb-summary-table th,
html.rm #foodnote-workspace table.wb-summary-table td,
html.rm #foodnote-workspace table.wb-nutrition-table th,
html.rm #foodnote-workspace table.wb-nutrition-table td,
html.rm #foodnote-workspace table.fw-comparison th,
html.rm #foodnote-workspace table.fw-comparison td {
	padding: 12px 14px;
	border: 0;
	border-top: 1px solid var(--rm-line);
	text-align: left;
	vertical-align: middle;
}
html.rm #foodnote-workspace table.wb-summary-table thead th,
html.rm #foodnote-workspace table.wb-nutrition-table thead th,
html.rm #foodnote-workspace table.fw-comparison thead th {
	border-top: 0;
	background: var(--rm-subtle-2);
	color: var(--rm-ink-2);
	font-size: 13px;
	font-weight: 700;
}
html.rm #foodnote-workspace table.wb-summary-table tbody th,
html.rm #foodnote-workspace table.wb-nutrition-table tbody th,
html.rm #foodnote-workspace table.fw-comparison tbody th {
	color: var(--rm-ink-2);
	font-size: 13px;
	font-weight: 600;
}
html.rm #foodnote-workspace table.wb-summary-table td,
html.rm #foodnote-workspace table.fw-comparison td {
	font-size: 15px;
	font-weight: 600;
}
html.rm #foodnote-workspace .fw-source {
	margin-top: 8px;
	color: var(--rm-ink-3);
	font-size: 13px;
}

/* 5. 비교 보고서 ------------------------------------------------------------ */
html.rm #foodnote-workspace .fw-toolbar {
	gap: 12px;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
}
html.rm #foodnote-workspace .fw-back {
	min-height: var(--rm-touch);
	padding: 0 10px 0 6px;
	border: 0;
	border-radius: var(--rm-r-sm);
	background: transparent;
	color: var(--rm-ink-3);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
html.rm #foodnote-workspace .fw-back:hover {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm #foodnote-workspace .fw-toolbar-actions {
	gap: 8px;
	flex-wrap: wrap;
}
html.rm #foodnote-workspace article.fw-report {
	padding: 28px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
	box-shadow: none;
}
html.rm #foodnote-workspace .fw-report-top {
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--rm-line);
}
html.rm #foodnote-workspace .fw-kicker {
	margin: 0;
	color: var(--rm-accent);
	font-size: 13px;
	font-weight: 700;
}
html.rm #foodnote-workspace .fw-report-top h1 {
	margin: 4px 0 0;
	font-size: 28px;
	line-height: 1.3;
	font-weight: 800;
	letter-spacing: -0.02em;
}
html.rm #foodnote-workspace .fw-lead {
	margin: 8px 0 0;
	color: var(--rm-ink-3);
	font-size: 15px;
}
html.rm #foodnote-workspace .fw-report-meta {
	gap: 6px;
	flex-wrap: wrap;
	margin-top: 12px;
}
html.rm #foodnote-workspace .fw-tag {
	padding: 3px 10px;
	border: 0;
	border-radius: var(--rm-r-pill);
	background: var(--rm-subtle);
	color: var(--rm-ink-2);
	font-size: 13px;
	font-weight: 600;
}
html.rm #foodnote-workspace .fw-section-heading h2,
html.rm #foodnote-workspace article.fw-report h2 {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -0.01em;
}
html.rm #foodnote-workspace .fw-compare-tools {
	gap: 12px;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	margin: 16px 0 12px;
	color: var(--rm-ink-3);
	font-size: 14px;
}
html.rm #foodnote-workspace .fw-segment {
	gap: 4px;
	padding: 4px;
	border: 0;
	border-radius: var(--rm-r-md);
	background: var(--rm-subtle);
}
html.rm #foodnote-workspace .fw-segment > button {
	min-height: var(--rm-touch);
	padding: 0 14px;
	border: 0;
	border-radius: 9px;
	background: transparent;
	color: var(--rm-ink-3);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	cursor: pointer;
}
html.rm #foodnote-workspace .fw-segment > button[aria-pressed="true"] {
	background: var(--rm-surface);
	color: var(--rm-ink);
	font-weight: 700;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08);
}
html.rm #foodnote-workspace .fw-insight {
	padding: 14px 16px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-surface);
}
html.rm #foodnote-workspace .fw-insight-label {
	color: var(--rm-ink-3);
	font-size: 12px;
}
html.rm #foodnote-workspace .fw-insight-value {
	color: var(--rm-accent);
	font-size: 22px;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}
html.rm #foodnote-workspace .fw-insight-name {
	color: var(--rm-ink-2);
	font-size: 13px;
	font-weight: 600;
}
html.rm #foodnote-workspace .fw-meta {
	color: var(--rm-ink-3);
	font-size: 12px;
	font-weight: 500;
}
html.rm #foodnote-workspace .fw-evidence-value {
	min-height: var(--rm-touch);
	min-width: var(--rm-touch);
	padding: 4px 8px;
	border: 1px solid transparent;
	border-radius: 8px;
	background: transparent;
	color: var(--rm-ink);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
}
html.rm #foodnote-workspace .fw-evidence-value:hover {
	border-color: var(--rm-line-strong);
	background: var(--rm-subtle-2);
}
html.rm #foodnote-workspace .fw-evidence-value.is-best {
	background: var(--rm-accent-soft);
	color: var(--rm-accent);
	font-weight: 800;
}
html.rm #foodnote-workspace .fw-data-note {
	color: var(--rm-ink-3);
	font-size: 13px;
	line-height: 1.6;
}
html.rm #foodnote-workspace .fw-review-note {
	padding: 12px 14px;
	border: 1px solid var(--rm-warn-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-warn-bg);
	color: var(--rm-warn-ink);
	font-size: 14px;
}
html.rm #foodnote-workspace details.fw-evidence {
	margin-top: 12px;
	padding: 0 16px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-surface);
}
html.rm #foodnote-workspace details.fw-evidence > summary {
	display: flex;
	align-items: center;
	font-size: 14px;
	font-weight: 700;
}
html.rm #foodnote-workspace section.fw-export {
	margin-top: 24px;
	padding: 20px;
	border-radius: var(--rm-r-md);
	background: var(--rm-subtle-2);
	border: 1px solid var(--rm-line);
}
html.rm #foodnote-workspace .fw-status:not(:empty) {
	position: fixed;
	left: 50%;
	bottom: 24px;
	z-index: 50;
	transform: translateX(-50%);
	max-width: calc(100% - 32px);
	padding: 12px 16px;
	border-radius: 14px;
	background: var(--rm-ink);
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 600;
	box-shadow: 0 12px 32px rgba(16, 24, 40, 0.2);
}

/* 6. 근거(원본) 대화상자 ---------------------------------------------------- */
html.rm #fw-evidence-dialog {
	width: min(720px, calc(100% - 32px));
	max-height: calc(100% - 48px);
	padding: 24px;
	border: 0;
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
	color: var(--rm-ink);
	box-shadow: 0 24px 64px rgba(16, 24, 40, 0.24);
}
html.rm #fw-evidence-dialog::backdrop {
	background: rgba(16, 24, 40, 0.45);
}

/* 7. 내 조사 요청·계정 설정 (orders/account) --------------------------------- */
html.rm main#main.wrap {
	padding-top: 32px;
	padding-bottom: 56px;
}
html.rm .intro {
	margin-bottom: 20px;
}
html.rm .intro .eyebrow {
	margin: 0;
	color: var(--rm-accent);
	font-size: 13px;
	font-weight: 700;
}
html.rm .intro h1 {
	margin: 4px 0 0;
	font-size: 28px;
	line-height: 1.3;
	font-weight: 800;
	letter-spacing: -0.02em;
}
html.rm .intro .lead {
	margin: 8px 0 0;
	max-width: 640px;
	color: var(--rm-ink-3);
	font-size: 16px;
}
html.rm .test-note {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	margin: 0 0 20px;
	padding: 12px 16px;
	border: 1px solid var(--rm-warn-line);
	border-radius: var(--rm-r-md);
	background: var(--rm-warn-bg);
	color: var(--rm-warn-ink);
	font-size: 14px;
}
html.rm #app .loading {
	color: var(--rm-ink-3);
	font-size: 14px;
}
html.rm #app .panel {
	padding: 24px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
	box-shadow: none;
}
html.rm #app .panel + .panel {
	margin-top: 16px;
}
html.rm #app .panel h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -0.01em;
}
html.rm #app .panel p {
	color: var(--rm-ink-3);
	font-size: 15px;
}
html.rm #app .panel.empty {
	padding: 40px 24px;
	text-align: center;
}
html.rm #app .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
html.rm #app label {
	color: var(--rm-ink-2);
	font-size: 13px;
	font-weight: 600;
}
html.rm #app table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
html.rm #app th,
html.rm #app td {
	padding: 12px 10px;
	border-top: 1px solid var(--rm-line);
	text-align: left;
}
html.rm #app thead th {
	border-top: 0;
	color: var(--rm-ink-3);
	font-size: 12px;
	font-weight: 600;
}
html.rm .toast:not(:empty) {
	position: fixed;
	left: 50%;
	bottom: 24px;
	z-index: 50;
	transform: translateX(-50%);
	max-width: calc(100% - 32px);
	padding: 12px 16px;
	border-radius: 14px;
	background: var(--rm-ink);
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 600;
	box-shadow: 0 12px 32px rgba(16, 24, 40, 0.2);
}

/* 8. 로그인 ----------------------------------------------------------------- */
html.rm .login-guest {
	margin-left: auto;
	min-height: var(--rm-touch);
	padding: 0 12px;
	display: inline-flex;
	align-items: center;
	border-radius: var(--rm-r-sm);
	color: var(--rm-ink-2);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
}
html.rm .login-guest:hover {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm .login-wrap {
	box-sizing: border-box;
	max-width: 960px;
	margin: 0 auto;
	padding: 48px var(--rm-gutter) 56px;
}
html.rm .login-card {
	overflow: hidden;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
	box-shadow: var(--rm-shadow-md);
}
html.rm .login-aside {
	padding: 40px;
	background: var(--rm-ink);
	color: #D0D5DD;
}
html.rm .login-aside h2 {
	margin: 0 0 20px;
	color: #FFFFFF;
	font-size: 24px;
	line-height: 1.4;
	font-weight: 800;
	letter-spacing: -0.02em;
}
html.rm .login-aside ul {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}
html.rm .login-aside li {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 8px 0;
	color: #EAECF0;
	font-size: 15px;
}
html.rm .login-aside li svg {
	flex: 0 0 18px;
	margin-top: 4px;
	color: #6CE9A6;
}
html.rm .login-aside p {
	margin: 0;
	color: #D0D5DD;
	font-size: 13px;
	line-height: 1.7;
}
html.rm .login-main {
	padding: 40px;
}
html.rm .login-kicker {
	margin: 0;
	color: var(--rm-accent);
	font-size: 13px;
	font-weight: 700;
}
html.rm .login-main h1 {
	margin: 4px 0 0;
	font-size: 28px;
	font-weight: 800;
	letter-spacing: -0.02em;
}
html.rm .login-lead {
	margin: 6px 0 24px;
	color: var(--rm-ink-3);
	font-size: 15px;
}
html.rm #login-form label {
	display: block;
	margin: 14px 0 6px;
	color: var(--rm-ink-2);
	font-size: 13px;
	font-weight: 600;
}
html.rm #login-form input:not([type="hidden"]) {
	width: 100%;
	min-height: 48px;
}
html.rm .login-password {
	position: relative;
}
html.rm .login-password input {
	padding-right: 52px;
}
html.rm .login-reveal {
	position: absolute;
	right: 2px;
	top: 50%;
	transform: translateY(-50%);
	width: var(--rm-touch);
	height: var(--rm-touch);
	border: 0;
	border-radius: var(--rm-r-sm);
	background: transparent;
	color: var(--rm-icon);
	cursor: pointer;
}
html.rm .login-reveal:hover {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm .login-error:not(:empty) {
	margin: 12px 0 0;
	padding: 10px 12px;
	border: 1px solid var(--rm-err-line);
	border-radius: var(--rm-r-sm);
	background: var(--rm-err-bg);
	color: var(--rm-err-ink);
	font-size: 14px;
}
html.rm .login-submit {
	width: 100%;
	min-height: 52px;
	margin-top: 20px;
	font-size: 16px;
}
html.rm .login-help {
	margin-top: 16px;
	border-top: 1px solid var(--rm-subtle);
}
html.rm .login-help > summary {
	min-height: var(--rm-touch);
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--rm-ink-2);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	list-style: none;
}
html.rm .login-help > summary::-webkit-details-marker {
	display: none;
}
html.rm .login-help p {
	margin: 0 0 8px;
	color: var(--rm-ink-3);
	font-size: 14px;
}
html.rm .login-foot {
	margin: 16px 0 0;
	color: var(--rm-ink-3);
	font-size: 14px;
}
@media (min-width: 840px) {
	html.rm .login-card {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	}
}

/* 9. 약관·개인정보처리방침 (terms/privacy 전용 .lg-*) ------------------------- */
html.rm .lg-page {
	box-sizing: border-box;
	max-width: var(--rm-shell);
	margin: 0 auto;
	padding: 32px var(--rm-gutter) 64px;
}
html.rm .lg-head {
	padding-bottom: 24px;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--rm-line);
}
html.rm .lg-kicker {
	margin: 0;
	color: var(--rm-accent);
	font-size: 13px;
	font-weight: 700;
}
html.rm .lg-head h1 {
	margin: 4px 0 0;
	font-size: 32px;
	line-height: 1.3;
	font-weight: 800;
	letter-spacing: -0.025em;
}
html.rm .lg-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}
html.rm .lg-meta li {
	padding: 3px 10px;
	border-radius: var(--rm-r-pill);
	background: var(--rm-subtle);
	color: var(--rm-ink-2);
	font-size: 13px;
}
html.rm .lg-switch {
	display: inline-flex;
	gap: 4px;
	margin-top: 16px;
	padding: 4px;
	border-radius: var(--rm-r-md);
	background: var(--rm-subtle);
}
html.rm .lg-switch a {
	min-height: 40px;
	padding: 0 14px;
	display: inline-flex;
	align-items: center;
	border-radius: 9px;
	color: var(--rm-ink-3);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
}
html.rm .lg-switch a[aria-current="page"] {
	background: var(--rm-surface);
	color: var(--rm-ink);
	font-weight: 700;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08);
}
html.rm .lg-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
}
html.rm .lg-toc {
	padding: 16px 20px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
}
html.rm .lg-toc > summary {
	min-height: var(--rm-touch);
	display: flex;
	align-items: center;
	font-size: 15px;
	font-weight: 800;
	cursor: pointer;
}
html.rm .lg-toc > summary {
	list-style: none;
	justify-content: space-between;
}
html.rm .lg-toc > summary::-webkit-details-marker {
	display: none;
}
html.rm .lg-toc > summary::after {
	content: "";
	width: 8px;
	height: 8px;
	margin-right: 4px;
	border-right: 2px solid var(--rm-icon);
	border-bottom: 2px solid var(--rm-icon);
	transform: translateY(-3px) rotate(45deg);
	transition: transform 0.15s ease;
}
html.rm .lg-toc[open] > summary::after {
	transform: translateY(2px) rotate(-135deg);
}
html.rm .lg-toc ol {
	margin: 4px 0 4px;
	padding: 0;
	list-style: none;
	counter-reset: none;
}
html.rm .lg-toc a {
	min-height: 36px;
	display: flex;
	align-items: center;
	padding: 4px 8px;
	border-radius: 8px;
	color: var(--rm-ink-2);
	font-size: 14px;
	line-height: 1.45;
	text-decoration: none;
}
html.rm .lg-toc a:hover {
	background: var(--rm-subtle);
	color: var(--rm-ink);
}
html.rm .lg-doc {
	min-width: 0;
	padding: 32px;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-lg);
	background: var(--rm-surface);
	font-size: 15px;
	line-height: 1.8;
	color: var(--rm-ink-2);
}
html.rm .lg-doc > p:first-child {
	margin-top: 0;
}
html.rm .lg-summary {
	margin: 0 0 28px;
	padding: 16px 20px;
	border-radius: var(--rm-r-md);
	background: var(--rm-subtle-2);
	border: 1px solid var(--rm-line);
}
html.rm .lg-summary h2 {
	margin: 0 0 6px;
	font-size: 15px;
	font-weight: 800;
	color: var(--rm-ink);
}
html.rm .lg-summary ul {
	margin: 0;
	padding-left: 18px;
}
html.rm .lg-doc section {
	scroll-margin-top: 16px;
	padding-top: 8px;
}
html.rm .lg-doc section + section {
	margin-top: 20px;
	border-top: 1px solid var(--rm-subtle);
}
html.rm .lg-doc h2 {
	margin: 16px 0 8px;
	font-size: 18px;
	line-height: 1.45;
	font-weight: 800;
	color: var(--rm-ink);
	letter-spacing: -0.01em;
}
html.rm .lg-doc h3 {
	margin: 16px 0 6px;
	font-size: 15px;
	font-weight: 700;
	color: var(--rm-ink);
}
html.rm .lg-doc ol,
html.rm .lg-doc ul {
	margin: 8px 0;
	padding-left: 22px;
}
html.rm .lg-doc li + li {
	margin-top: 4px;
}
html.rm .lg-doc ol ol {
	list-style: hangul;
}
html.rm .lg-table-wrap {
	margin: 12px 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--rm-line);
	border-radius: var(--rm-r-md);
}
html.rm .lg-doc table {
	width: 100%;
	min-width: 560px;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.6;
}
html.rm .lg-doc th,
html.rm .lg-doc td {
	padding: 10px 14px;
	border-top: 1px solid var(--rm-line);
	text-align: left;
	vertical-align: top;
}
html.rm .lg-doc thead th {
	border-top: 0;
	background: var(--rm-subtle-2);
	color: var(--rm-ink);
	font-size: 13px;
	font-weight: 700;
}
html.rm .lg-doc tbody th {
	color: var(--rm-ink);
	font-weight: 600;
	white-space: nowrap;
}
html.rm .lg-note {
	margin: 12px 0;
	padding: 12px 16px;
	border-radius: var(--rm-r-md);
	background: var(--rm-warn-bg);
	border: 1px solid var(--rm-warn-line);
	color: var(--rm-warn-ink);
	font-size: 14px;
}
html.rm .lg-contact {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	gap: 6px 16px;
	margin: 12px 0;
	padding: 16px 20px;
	border-radius: var(--rm-r-md);
	background: var(--rm-subtle-2);
	border: 1px solid var(--rm-line);
}
html.rm .lg-contact dt {
	color: var(--rm-ink-3);
	font-size: 14px;
}
html.rm .lg-contact dd {
	margin: 0;
	color: var(--rm-ink);
	font-size: 14px;
	font-weight: 600;
}
html.rm .lg-top {
	margin-top: 24px;
	display: inline-flex;
	align-items: center;
	min-height: var(--rm-touch);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}
@media (min-width: 1024px) {
	html.rm .lg-layout {
		grid-template-columns: 260px minmax(0, 1fr);
		align-items: start;
	}
	html.rm .lg-toc {
		position: sticky;
		top: 16px;
		max-height: calc(100vh - 32px);
		overflow-y: auto;
	}
	html.rm .lg-doc {
		padding: 40px 48px;
	}
}

/* 10. 공통 푸터 (사업자 정보) ------------------------------------------------ */
html.rm .rm-foot {
	margin-top: auto;
	background: var(--rm-surface);
	border-top: 1px solid var(--rm-line);
	color: var(--rm-ink-3);
	font-size: 13px;
	line-height: 1.7;
}
html.rm .rm-foot-inner {
	box-sizing: border-box;
	max-width: var(--rm-shell);
	margin: 0 auto;
	padding: 20px var(--rm-gutter) 28px;
}
html.rm .rm-foot-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0 4px;
	margin: 0 0 8px -8px;
	padding: 0;
	list-style: none;
}
html.rm .rm-foot-links a {
	min-height: var(--rm-touch);
	padding: 0 8px;
	display: inline-flex;
	align-items: center;
	color: var(--rm-ink-3);
	font-weight: 600;
	text-decoration: none;
}
html.rm .rm-foot-links a:hover {
	color: var(--rm-ink);
	text-decoration: underline;
}
html.rm .rm-foot-links a.is-strong {
	color: var(--rm-ink);
	font-weight: 800;
}
html.rm .rm-foot-biz {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 2px 14px;
}
html.rm .rm-foot-biz a {
	color: var(--rm-ink-3);
}
html.rm .rm-foot-copy {
	margin: 10px 0 0;
	color: var(--rm-ink-3);
}
/* 기존 짧은 푸터(마크업을 교체하지 않은 페이지)는 새 사업자 정보 푸터로 대체 */
html.rm .fn-foot:not(.rm-foot),
html.rm body > footer:not(.rm-foot) {
	display: none;
}

/* 11. 반응형·접근성·인쇄 ----------------------------------------------------- */
@media (max-width: 720px) {
	html.rm {
		--rm-gutter: 16px;
	}
	html.rm .fn-header .fn-shell,
	html.rm .header-row {
		flex-wrap: wrap;
	}
	html.rm .fn-nav,
	html.rm .nav {
		flex: 1 1 100%;
		order: 3;
		overflow-x: auto;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
	}
	html.rm .fn-nav-more > div {
		position: fixed;
		left: 16px;
		right: 16px;
		top: auto;
	}
	html.rm #foodnote-workspace .wb-heading h1,
	html.rm .lg-head h1 {
		font-size: 26px;
	}
	html.rm #foodnote-workspace .wb-tabs {
		width: auto;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	html.rm #foodnote-workspace article.wb-food,
	html.rm #foodnote-workspace aside.wb-work,
	html.rm #foodnote-workspace .wb-start {
		padding: 16px;
	}
	html.rm #foodnote-workspace article.fw-report,
	html.rm .lg-doc,
	html.rm #app .panel {
		padding: 20px 16px;
	}
	html.rm .login-aside,
	html.rm .login-main {
		padding: 28px 20px;
	}
	html.rm .login-wrap {
		padding-top: 20px;
	}
	html.rm .lg-contact {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
	}
	html.rm .lg-contact dd {
		margin-bottom: 8px;
	}
}
@media (prefers-reduced-motion: reduce) {
	html.rm *,
	html.rm *::before,
	html.rm *::after {
		transition: none;
		animation: none;
		scroll-behavior: auto;
	}
}
@media print {
	html.rm body {
		background: #FFFFFF;
	}
	html.rm .fn-header,
	html.rm .header,
	html.rm .rm-foot,
	html.rm .lg-toc,
	html.rm .lg-switch,
	html.rm .lg-top,
	html.rm .fn-skip,
	html.rm .skip {
		display: none;
	}
	html.rm .lg-doc,
	html.rm #foodnote-workspace article.fw-report {
		border: 0;
		padding: 0;
	}
	html.rm .lg-layout {
		display: block;
	}
}

/* 현재 가입·복구·계정 화면은 한 장의 폼과 기존 입력 상태를 유지한다. */
html.rm .auth-page .login-wrap,html.rm .account-page .login-wrap{max-width:488px;padding:48px 24px 40px;min-height:calc(100dvh - 72px)}
html.rm .auth-page .login-card,html.rm .account-page .login-card{display:block;grid-template-columns:none;width:100%;padding:32px;overflow:visible}
html.rm .auth-page,html.rm .account-page{--auth-blue:var(--rm-accent);--auth-sub:var(--rm-ink-3);--auth-line:var(--rm-line)}
html.rm .auth-page .auth-heading h1,html.rm .account-page .auth-heading h1{color:var(--rm-ink);font-size:28px}
html.rm .auth-page .login-card input:not([type=hidden]),html.rm .account-page .login-card input:not([type=hidden]){border-radius:var(--rm-r-sm);border-color:var(--rm-line-strong);color:var(--rm-ink)}
html.rm .auth-page .login-card input[aria-invalid=true],html.rm .account-page .login-card input[aria-invalid=true]{border-color:var(--rm-err-ink)}
html.rm .auth-page .login-reveal,html.rm .account-page .login-reveal{top:1px;right:1px;width:44px;height:44px;min-height:44px;border:0;padding:0;transform:none}
html.rm .auth-page #login-form .login-password input,html.rm .account-page .login-password input{padding-right:52px}
html.rm .auth-page .login-submit,html.rm .account-page .login-submit{margin-top:14px}
html.rm .auth-page .auth-find-links a,html.rm .auth-page .auth-switch a,html.rm .auth-page .auth-guest,html.rm .account-page .auth-guest{min-height:44px}
html.rm .auth-page .rm-foot,html.rm .account-page .rm-foot{width:100%;box-sizing:border-box;text-align:left}
@media(max-width:600px){html.rm .auth-page .login-wrap,html.rm .account-page .login-wrap{padding:24px 16px 32px}html.rm .auth-page .login-card,html.rm .account-page .login-card{padding:24px 20px}}

/* 기본 화면은 비교 결과와 바로 저장에 집중하고 추가 입력은 펼쳐서 사용한다. */
html.rm #foodnote-workspace .wb-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 8px}
html.rm #foodnote-workspace .wb-presets button{min-height:44px;padding:8px;font-size:14px}
html.rm #foodnote-workspace .wb-presets button[aria-pressed=true]{border-color:var(--rm-accent);background:var(--rm-accent-soft);color:var(--rm-accent-strong)}
html.rm #foodnote-workspace .wb-highlights{list-style:none;padding:0;margin:12px 0 16px;border-left:3px solid var(--rm-accent)}
html.rm #foodnote-workspace .wb-highlights li{padding:8px 12px;min-width:0}
html.rm #foodnote-workspace .wb-highlights span,html.rm #foodnote-workspace .wb-highlights strong,html.rm #foodnote-workspace .wb-highlights small{display:block;overflow-wrap:anywhere}
html.rm #foodnote-workspace .wb-highlights span{font-size:12px;color:var(--rm-ink-3)}
html.rm #foodnote-workspace .wb-highlights strong{font-size:14px;line-height:1.5;color:var(--rm-ink)}
html.rm #foodnote-workspace .wb-highlights small{font-size:12px;color:var(--rm-ink-3)}
html.rm #foodnote-workspace .wb-search-options{margin:8px 0 0}
html.rm #foodnote-workspace .wb-search-options>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-size:14px;color:var(--rm-ink-3)}
html.rm #foodnote-workspace .wb-sample{display:flex;gap:8px;margin:16px 0;min-height:48px}
html.rm #foodnote-workspace .wb-sample span{font-size:12px;opacity:.85}
html.rm #foodnote-workspace .wb-instant-save{font-size:13px;min-height:44px;padding:8px 12px}
html.rm #foodnote-workspace .wb-open-report{width:100%;margin:12px 0 0;min-height:44px}
html.rm #foodnote-workspace .wb-selection{padding:0;margin-top:12px;border:0}
html.rm #foodnote-workspace .wb-selection>summary{min-height:44px;cursor:pointer;font-size:14px;font-weight:600}
html.rm #foodnote-workspace .wb-more-calculations>.wb-accordion{margin-left:0;margin-right:0}
html.rm #foodnote-workspace #wb-goal-settings>summary{font-size:13px;color:var(--rm-ink-3)}
html.rm .wb-report-menu>summary{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--rm-line);border-radius:var(--rm-r-sm);cursor:pointer}
html.rm .wb-report-menu>summary::after{display:none}
html.rm .wb-report-menu>summary svg{width:20px;height:20px}
html.rm .wb-report-menu>div{z-index:30}
html.rm .wb-quick-save-feedback:empty{display:none}

/* 전체 화면 공통 셸: PC 시안의 중앙 메뉴와 모바일 전체 메뉴. */
html.rm{--ink:var(--rm-ink);--sub:var(--rm-ink-3);--blue:var(--rm-accent);--blue-hover:var(--rm-accent-strong);--soft:var(--rm-accent-soft);--line:var(--rm-line);--line-mid:var(--rm-line-strong);--paper:var(--rm-surface);--bg:var(--rm-page);--red:var(--rm-err-ink);--red-bg:var(--rm-err-bg);--green:var(--rm-ok-ink);--green-bg:var(--rm-ok-bg);--content:1200px;--font-body:FoodnoteUI,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif}
html.rm main>.panel,html.rm .payment-result .panel{border-color:var(--rm-line);border-radius:var(--rm-r-lg);background:var(--rm-surface)}
html.rm #site-header{position:relative;z-index:60;background:#fff;border-bottom:1px solid #e4e7ec}
html.rm #site-header>.fn-shell,html.rm #foodnote-workspace #site-header>.fn-shell{max-width:1200px;width:100%;min-height:64px;margin:auto;padding:10px 24px;box-sizing:border-box;display:flex;align-items:center;flex-wrap:nowrap;gap:8px 24px}
html.rm #site-header .fn-brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;flex-shrink:0;color:#101828;font-size:19px;font-weight:800;text-decoration:none;white-space:nowrap}
html.rm #site-header .fn-brand-mark{width:32px;height:32px;display:block}
html.rm #site-header .site-primary-nav{display:flex;align-items:center;gap:4px;flex:1 1 auto;min-width:0;margin:0;order:0;overflow:visible}
html.rm #site-header .site-primary-nav>a,html.rm #site-header .site-primary-nav>button{min-height:44px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:0 0 auto;border:0;border-radius:10px;background:transparent;color:#475467;font:inherit;font-size:15px;font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer}
html.rm #site-header .site-primary-nav [aria-current=page]{background:#e9eefb;color:#2457d6;font-weight:700}
html.rm #site-header .site-auth-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border:1px solid #d0d5dd;border-radius:10px;color:#101828;background:#fff;font-size:14px;font-weight:650;text-decoration:none;white-space:nowrap}
html.rm #site-header .site-menu{position:relative;flex:0 0 auto}
html.rm #site-header .site-menu>summary{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #e4e7ec;border-radius:10px;background:#fff;color:#344054;cursor:pointer}
html.rm #site-header .site-menu>summary::after{display:none}
html.rm #site-header svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html.rm #site-header .site-menu-content{position:absolute;right:0;left:auto;top:calc(100% + 8px);bottom:auto;z-index:100;width:320px;max-height:calc(100dvh - 96px);overflow:auto;padding:12px;background:#fff;border:1px solid #e4e7ec;border-radius:12px;box-shadow:0 16px 40px #10182818;box-sizing:border-box;text-align:left;white-space:normal}
html.rm #site-header .site-menu-heading{display:flex;align-items:center;justify-content:space-between;padding:0 8px 8px;color:#101828}
html.rm #site-header .site-menu-close{width:44px;height:44px;min-height:44px;padding:0;display:grid;place-items:center;border:0;border-radius:10px;background:transparent;color:#475467;cursor:pointer}
html.rm #site-header .site-menu-content nav,html.rm #site-header .site-menu-account{display:flex;flex-direction:column;gap:4px}
html.rm #site-header .site-menu-content nav>a,html.rm #site-header .site-menu-content nav>button,html.rm #site-header .site-menu-account>a,html.rm #site-header .site-menu-account>button{display:flex;align-items:center;gap:10px;min-height:48px;width:100%;padding:10px 14px;box-sizing:border-box;border:0;border-radius:10px;background:transparent;color:#344054;font:inherit;font-size:15px;font-weight:600;text-decoration:none;text-align:left;cursor:pointer}
html.rm #site-header .site-menu-content [aria-current=page],html.rm #site-header .site-menu-content a:hover,html.rm #site-header .site-menu-content button:hover{background:#e9eefb;color:#2457d6}
html.rm #site-header .site-menu-account{border-top:1px solid #e4e7ec;margin-top:12px;padding-top:12px}
html.rm #site-header .site-menu-help{padding:18px;margin:16px 0;border:1px solid #e4e7ec;border-radius:12px;background:#f9fafb;font-size:13px;line-height:1.8;color:#344054}
html.rm #site-header .site-menu-help p{margin:6px 0;font-size:13px;line-height:1.8;color:#475467}
html.rm #site-header .site-menu-help a{display:inline-flex;align-items:center;min-height:44px;color:#2457d6;font-weight:650;text-decoration:none}
html.rm #site-header .site-menu-legal{display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid #e4e7ec;padding:12px 8px 0}
html.rm #site-header .site-menu-legal a{display:inline-flex;align-items:center;min-height:44px;color:#475467;font-size:12px;text-decoration:none}
html.rm #site-header .site-menu-saved-count{margin-left:auto;color:#475467;font-size:12px}
html.rm .site-menu-account #site-menu-auth-link{display:none}
html.rm #site-header[data-authenticated=false] .site-menu-account>a[href="/account.html"],html.rm #site-header[data-authenticated=true] #site-menu-auth-link{display:none}
html.rm #site-header[data-authenticated=true] .site-menu-account #site-menu-auth-link{display:none}

/* 검색 시작·결과는 시안처럼 행과 비교함을 분리한다. */
html.rm #foodnote-workspace .wb-search-options{margin:12px 0 0}
html.rm #foodnote-workspace .wb-search-options>summary{display:flex}
html.rm #foodnote-workspace .wb-search-options .wb-tabs{display:inline-flex;margin:0 0 12px}
html.rm #foodnote-workspace .wb-search-filters{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
html.rm #foodnote-workspace .wb-kind-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
html.rm #foodnote-workspace .wb-kind-group>span{font-size:13px;font-weight:600;color:#475467;margin-right:2px}
html.rm #foodnote-workspace .wb-kind-group>button{min-height:44px;padding:0 16px;border:1px solid #d0d5dd;border-radius:999px;background:#fff;color:#344054;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
html.rm #foodnote-workspace .wb-kind-group>button[aria-pressed=true]{background:#101828;color:#fff;border-color:#101828}
html.rm #foodnote-workspace .wb-search-filters>.wb-kind{display:flex;flex-direction:row;align-items:center;gap:10px;min-width:140px;flex:0 0 auto}
html.rm #foodnote-workspace .wb-search-filters>.wb-kind select{min-width:116px;width:auto;margin:0}
html.rm #foodnote-workspace .wb-start{border:0;border-radius:0;background:transparent;padding:0;margin:20px 0 0}
html.rm #foodnote-workspace .wb-quick{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0}
html.rm #foodnote-workspace .wb-quick>span{font-size:13px;font-weight:600;color:#475467}
html.rm #foodnote-workspace .wb-quick .fw-secondary{padding:0 14px;min-height:44px;border:0;background:#f2f4f7;border-radius:10px}
html.rm #foodnote-workspace .wb-search-example{background:#fff;border:1px solid #e4e7ec;border-radius:16px;padding:24px;min-width:0;box-shadow:0 16px 40px #10182808}
html.rm #foodnote-workspace .wb-example-label{color:#2457d6;font-size:12px;font-weight:700;margin:0 0 6px}
html.rm #foodnote-workspace .wb-search-example h2{font-size:19px;line-height:1.45;margin:0 0 18px}
html.rm #foodnote-workspace .wb-search-example table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px;font-variant-numeric:tabular-nums}
html.rm #foodnote-workspace .wb-search-example th,html.rm #foodnote-workspace .wb-search-example td{padding:12px 4px;text-align:right;border-bottom:1px solid #f2f4f7;overflow-wrap:anywhere}
html.rm #foodnote-workspace .wb-search-example tr>:first-child{text-align:left;width:28%}
html.rm #foodnote-workspace .wb-search-example thead th{font-size:12px;font-weight:600;color:#475467}
html.rm #foodnote-workspace .wb-search-example tbody td{color:#2457d6;font-weight:650}
html.rm #foodnote-workspace .wb-search-example .wb-helper{margin:14px 0;font-size:12px}
html.rm #foodnote-workspace .wb-work{border:0;background:transparent;padding:0;box-shadow:none}
html.rm #foodnote-workspace .wb-analysis-drawer[data-preview=true]{border:0;background:transparent;box-shadow:none}
html.rm #foodnote-workspace .wb-analysis-drawer[data-preview=true]>.wb-drawer-content{padding:0}
@media(min-width:901px){html.rm #foodnote-workspace .wb-analysis-drawer{border:0;background:transparent;box-shadow:none}html.rm #foodnote-workspace .wb-drawer-content{padding:0}}
html.rm #foodnote-workspace .wb-selection{padding:20px;border:1px solid #e4e7ec;border-radius:16px;background:#fff;margin:0}
html.rm #foodnote-workspace .wb-selection .wb-section-head{margin:0 0 16px}
html.rm #foodnote-workspace .wb-selection h2{font-size:18px}
html.rm #foodnote-workspace .wb-cart-slots{display:flex;flex-direction:column;gap:8px}
html.rm #foodnote-workspace .wb-cart-item{display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 12px;border:1px solid #e4e7ec;border-radius:12px}
html.rm #foodnote-workspace .wb-cart-item>div{min-width:0;flex:1}
html.rm #foodnote-workspace .wb-cart-item strong{display:block;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
html.rm #foodnote-workspace .wb-cart-item small{display:block;font-size:12px;color:#475467;margin-top:3px}
html.rm #foodnote-workspace .wb-cart-number{display:grid;place-items:center;flex-shrink:0;width:24px;height:24px;border-radius:50%;background:#2457d6;color:#fff;font-size:12px;font-weight:700}
html.rm #foodnote-workspace .wb-cart-placeholder{display:flex;align-items:center;justify-content:center;gap:8px;min-height:62px;border:1px dashed #d0d5dd;border-radius:12px;font-size:13px;color:#475467}
html.rm #foodnote-workspace .wb-cart-placeholder svg{width:16px;height:16px}
html.rm #foodnote-workspace .wb-build-report{width:100%;margin-top:16px;min-height:48px}
html.rm #foodnote-workspace .wb-cart-hint{text-align:center;font-size:12px;color:#475467;margin:10px 0}
html.rm #foodnote-workspace .wb-cart-guide{border-top:1px solid #e4e7ec;margin:14px 0 0;padding-top:14px;font-size:13px;line-height:1.8;color:#475467}
html.rm #foodnote-workspace article.wb-food{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.8fr) auto;align-items:center;gap:8px 16px;padding:14px 18px;border-radius:12px;min-width:0}
html.rm #foodnote-workspace .wb-food-values dd,html.rm #foodnote-workspace .wb-summary-table td{font-variant-numeric:tabular-nums}
html.rm #foodnote-workspace .wb-nutrition-table th small{display:block;font-size:11px;font-weight:500;color:#475467;margin-top:4px}
html.rm #foodnote-workspace #wb-food-meta:empty{display:none}
html.rm #foodnote-workspace[data-view=search] .wb-heading{display:flex;flex-direction:column;align-items:flex-start;width:calc(100% - 488px);gap:12px;margin-bottom:24px}
html.rm #foodnote-workspace[data-view=search] .wb-heading h1{font-size:40px;line-height:1.25;letter-spacing:-.025em}
html.rm #foodnote-workspace[data-view=search] .wb-heading p{font-size:17px;line-height:1.7}
html.rm #foodnote-workspace[data-view=search] #wb-source-status{order:-1;padding:5px 12px;border-radius:999px;background:#f2f4f7;font-size:12px;margin:0}
html.rm #foodnote-workspace[data-view=search]:not(.has-search-results) .wb-workspace{grid-template-columns:minmax(0,1fr) minmax(320px,460px)}
html.rm #foodnote-workspace[data-view=search].has-search-results .wb-heading{display:none}
html.rm #foodnote-workspace[data-view=search].has-search-results .wb-workspace{grid-template-columns:minmax(0,1fr) 300px}
html.rm #foodnote-workspace[data-view=search] #wb-food-search>.wb-tabs{display:inline-flex;margin:0 0 16px}
html.rm #foodnote-workspace[data-view=search] .wb-result-heading{font-size:20px;line-height:1.5;margin:8px 0 16px;font-weight:750}
html.rm #foodnote-workspace[data-view=search]:not(.has-search-results) .wb-result-heading{display:none}
html.rm #foodnote-workspace[data-view=search].has-search-results .wb-usage{display:none}
html.rm #foodnote-workspace .wb-usage{margin-top:48px;padding-top:32px;border-top:1px solid #e4e7ec}
html.rm #foodnote-workspace .wb-usage>h2{font-size:22px;margin:0 0 18px}
html.rm #foodnote-workspace .wb-workflow{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:0;margin:0}
html.rm #foodnote-workspace .wb-workflow li{display:flex;gap:14px;align-items:flex-start;padding:24px;border:1px solid #e4e7ec;border-radius:16px;background:#fff}
html.rm #foodnote-workspace .wb-workflow li>span{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border-radius:50%;background:#e9eefb;color:#2457d6;font-size:14px;font-weight:750}
html.rm #foodnote-workspace .wb-workflow strong{display:block;font-size:16px;margin:4px 0 8px}
html.rm #foodnote-workspace .wb-workflow p{font-size:13px;line-height:1.8;color:#475467;margin:0}
@media(min-width:1024px){html.rm #foodnote-workspace[data-view=search]:not(.has-search-results) .wb-work{margin-top:-184px}}
@media(max-width:1023px){html.rm #foodnote-workspace[data-view=search] .wb-heading{width:100%}html.rm #foodnote-workspace[data-view=search] .wb-heading h1{font-size:32px}html.rm #foodnote-workspace[data-view=search]:not(.has-search-results) .wb-workspace,html.rm #foodnote-workspace[data-view=search].has-search-results .wb-workspace{grid-template-columns:minmax(0,1fr)}html.rm #foodnote-workspace .wb-workflow{grid-template-columns:minmax(0,1fr)}html.rm #foodnote-workspace .wb-workflow li{padding:18px}html.rm #foodnote-workspace[data-view=search] .wb-work{margin-top:0}}
html.rm #foodnote-workspace .wb-food-main{min-width:0}
html.rm #foodnote-workspace .wb-food-meta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12px;line-height:1.5;color:#475467;margin-bottom:6px}
html.rm #foodnote-workspace .wb-food h2{font-size:16px;font-weight:700;line-height:1.5;margin:0}
html.rm #foodnote-workspace .wb-food-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}
html.rm #foodnote-workspace .wb-food-values dt{font-size:12px;margin-bottom:3px;color:#475467}
html.rm #foodnote-workspace .wb-food-values dd{font-size:14px;line-height:1.6;font-weight:650;margin:0}
html.rm #foodnote-workspace .wb-food-action .fw-pick{min-height:44px;white-space:nowrap}
html.rm #foodnote-workspace .wb-food>.wb-raw{grid-column:1/-1;border:0;margin:0;padding:0}
html.rm #foodnote-workspace .wb-food>.wb-raw>summary{min-height:44px;display:flex;align-items:center;font-size:12px;color:#475467}
html.rm #foodnote-workspace .wb-mobile-build{display:none}

/* 비교: 같은 목표 비교표와 네 개 기능 탭, 독립된 출처 영역. */
html.rm #foodnote-workspace .wb-analysis{min-width:0}
html.rm #foodnote-workspace .wb-goal-controls{display:grid;grid-template-columns:1.4fr 1fr;gap:12px;padding:16px 0;border:0;margin:0}
html.rm #foodnote-workspace .wb-goal-controls>summary{display:none}
html.rm #foodnote-workspace .wb-goal-controls .wb-field{margin:0}
html.rm #foodnote-workspace .wb-goal-controls label{font-size:13px}
html.rm #foodnote-workspace .wb-detail-tabs{border:1px solid #e4e7ec;border-radius:16px;background:#fff;margin-top:20px;overflow:hidden}
html.rm #foodnote-workspace .wb-detail-tablist{display:flex;gap:4px;padding:8px 12px 0;border-bottom:1px solid #e4e7ec;overflow-x:auto}
html.rm #foodnote-workspace .wb-detail-tablist button{flex:0 0 auto;min-height:48px;padding:0 14px;border:0;border-bottom:2px solid transparent;background:#fff;color:#475467;font:inherit;font-size:14px;font-weight:600;white-space:nowrap;cursor:pointer}
html.rm #foodnote-workspace .wb-detail-tablist button[aria-selected=true]{border-bottom-color:#2457d6;color:#101828;font-weight:750}
html.rm #foodnote-workspace .wb-detail-tablist button[data-invalid=true]::after{content:" 확인";font-size:11px;color:#b42318}
html.rm #foodnote-workspace .wb-tab-panel{padding:24px;min-width:0}
html.rm #foodnote-workspace .wb-condition-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:18px}
html.rm #foodnote-workspace .wb-condition-card{padding:16px;border:1px solid #e4e7ec;border-radius:12px;background:#f9fafb;min-width:0}
html.rm #foodnote-workspace .wb-condition-card h3{font-size:14px;margin:0 0 10px;line-height:1.6}
html.rm #foodnote-workspace .wb-condition-card p{font-size:12px;line-height:1.8;margin:10px 0 0;color:#475467}
html.rm #foodnote-workspace .wb-condition-card.is-exceeded{background:#fef3f2;border-color:#fecdca}
html.rm #foodnote-workspace .wb-condition-card.is-within{background:#ecfdf3;border-color:#abefc6}
html.rm #foodnote-workspace[data-view=report] .fw-report{background:transparent;border:0;padding:0;box-shadow:none}
html.rm #foodnote-workspace .wb-report-heading{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-bottom:24px}
html.rm #foodnote-workspace .wb-report-heading>.fw-back{align-self:flex-start;min-height:44px}
html.rm #foodnote-workspace .wb-report-heading-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
html.rm #foodnote-workspace .wb-report-heading .fw-report-top{padding:0;margin:0;border:0;flex:1 1 380px;min-width:0;background:transparent}
html.rm #foodnote-workspace .wb-report-heading h1{font-size:28px;line-height:1.35;margin:0 0 8px;letter-spacing:-.025em}
html.rm #foodnote-workspace .wb-report-heading .fw-lead{display:none}
html.rm #foodnote-workspace .wb-report-heading .fw-report-meta{margin:0;gap:6px}
html.rm #foodnote-workspace .wb-report-heading .fw-toolbar-actions{gap:8px;align-items:center}
html.rm #foodnote-workspace .wb-report-heading .fw-toolbar-actions>.fw-secondary{min-height:44px;padding:0 14px}
html.rm #foodnote-workspace .wb-save-split{display:flex;align-items:center;gap:0}
html.rm #foodnote-workspace .wb-save-split>button{border-radius:10px 0 0 10px;min-height:44px}
html.rm #foodnote-workspace .wb-save-menu>summary{border-radius:0 10px 10px 0;border-left:0}
html.rm #foodnote-workspace .wb-export-menu{position:relative}
html.rm #foodnote-workspace .wb-export-menu>summary{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 16px;border-radius:10px;background:#2457d6;color:#fff;font-size:14px;font-weight:700;cursor:pointer;list-style:none}
html.rm #foodnote-workspace .wb-export-menu>summary::after{display:none}
html.rm #foodnote-workspace .wb-export-menu>summary>svg{width:16px;height:16px;transform:rotate(90deg)}
html.rm #foodnote-workspace .wb-export-menu>div{z-index:35;min-width:210px}
html.rm #foodnote-workspace .wb-analysis{padding:0;margin:0;background:transparent;border:0}
html.rm #foodnote-workspace .wb-overview-card{padding:24px;border:1px solid #e4e7ec;border-radius:16px;background:#fff}
html.rm #foodnote-workspace .wb-overview-card>.wb-section-head{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;margin:0 0 12px}
html.rm #foodnote-workspace .wb-overview-card>.wb-section-head h2{font-size:20px;line-height:1.5;flex:1 1 250px}
html.rm #foodnote-workspace .wb-overview-card .wb-goal-controls{flex:0 1 370px;grid-template-columns:minmax(0,1.4fr) minmax(90px,1fr);padding:0;gap:12px}
html.rm #foodnote-workspace .wb-overview-card .wb-goal-controls .wb-kind{display:flex;flex-direction:column;align-items:stretch;gap:6px}
html.rm #foodnote-workspace .wb-overview-card .wb-goal-controls input,html.rm #foodnote-workspace .wb-overview-card .wb-goal-controls select{height:44px}
html.rm #foodnote-workspace .wb-overview-card>.wb-presets{display:flex;gap:8px;margin:8px 0}
html.rm #foodnote-workspace .wb-overview-card>.wb-presets button{font-size:12px;min-height:44px;padding:6px 14px}
html.rm #foodnote-workspace .wb-summary-table{margin-top:14px}
html.rm #foodnote-workspace .wb-summary-table td.is-better{color:#2457d6;font-weight:750}
html.rm #foodnote-workspace .wb-better-label{display:inline-block;margin-left:8px;padding:2px 6px;background:#e9eefb;border-radius:999px;font-size:11px;font-weight:650;white-space:nowrap}
html.rm #foodnote-workspace .fw-report>.fw-export{display:none}
html.rm #foodnote-workspace .fw-report>.fw-data-note{font-size:12px;margin-top:16px;color:#475467}
@media(max-width:900px){html.rm #foodnote-workspace .wb-mobile-build{display:flex;position:fixed;right:24px;bottom:18px;z-index:45;min-height:44px;width:112px;font-size:14px;padding:8px 12px}html.rm #foodnote-workspace .wb-analysis-drawer>summary{padding-right:136px}html.rm #foodnote-workspace .wb-analysis-drawer[open] .wb-selection{border:0}}
@media(max-width:720px){html.rm #foodnote-workspace .wb-report-heading-row{gap:16px}html.rm #foodnote-workspace .wb-report-heading .fw-toolbar-actions{width:100%;display:flex;flex-wrap:wrap;gap:8px}html.rm #foodnote-workspace .wb-report-heading .fw-toolbar-actions>.fw-secondary:first-child{display:none}html.rm #foodnote-workspace .wb-overview-card{padding:20px 16px}html.rm #foodnote-workspace .wb-overview-card>.wb-section-head{display:block}html.rm #foodnote-workspace .wb-overview-card .wb-goal-controls{margin-top:16px}html.rm #foodnote-workspace .wb-report-heading h1{font-size:25px}html.rm #foodnote-workspace .wb-summary-table td,html.rm #foodnote-workspace .wb-summary-table th{font-size:12px;padding:10px 7px}html.rm #foodnote-workspace .wb-better-label{display:block;width:max-content;margin:4px 0 0;font-size:10px}}
html.rm #foodnote-workspace .wb-tab-section{min-width:0;border:0;margin:0 0 24px;padding:0}
html.rm #foodnote-workspace .wb-tab-section:last-child{margin-bottom:0}
html.rm #foodnote-workspace .wb-tab-section>h3{margin:0 0 14px;font-size:17px}
html.rm #foodnote-workspace .wb-tab-section>label{max-width:320px;margin-bottom:14px}
html.rm #foodnote-workspace .wb-nutrition-table{width:100%;border-collapse:collapse;font-size:14px}
html.rm #foodnote-workspace .wb-nutrition-table th,html.rm #foodnote-workspace .wb-nutrition-table td{padding:12px 14px;border-bottom:1px solid #e4e7ec;text-align:right}
html.rm #foodnote-workspace .wb-nutrition-table tr>:first-child{text-align:left}
html.rm #foodnote-workspace .wb-nutrition-table thead th{background:#f9fafb;font-size:13px}
html.rm #foodnote-workspace .wb-nutrient-heading th{background:#f2f4f7;color:#344054;font-size:12px;font-weight:700}
html.rm #foodnote-workspace .wb-provenance{padding:24px;background:#fff;border:1px solid #e4e7ec;border-radius:16px;margin-top:20px;min-width:0}
html.rm #foodnote-workspace .wb-provenance>h2{font-size:20px;margin:0 0 16px}
html.rm #foodnote-workspace .wb-analysis-source{padding:16px 0;border-top:1px solid #e4e7ec}
html.rm #foodnote-workspace .wb-analysis-source>h3{font-size:15px;line-height:1.6;margin:0 0 6px}
html.rm #foodnote-workspace .wb-source-link{display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:650}
html.rm .auth-page .login-wrap{max-width:1000px;padding:40px 24px;min-height:calc(100dvh - 64px)}
html.rm .auth-shell{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);width:100%;border:1px solid #e4e7ec;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 12px 32px #1018280a}
html.rm .auth-service{padding:40px;background:#101828;color:#e4e7ec;min-width:0}
html.rm .auth-service-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#2457d6;color:#fff;margin-bottom:28px}
html.rm .auth-service-mark svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html.rm .auth-service h2{font-size:28px;font-weight:750;line-height:1.45;letter-spacing:-.025em;color:#fff;margin:0 0 20px}
html.rm .auth-service p{font-size:15px;line-height:1.85;color:#d0d5dd;margin:0 0 24px}
html.rm .auth-service ul{list-style:none;display:flex;flex-direction:column;gap:14px;margin:0;padding:0}
html.rm .auth-service li{font-size:14px;line-height:1.7;color:#e4e7ec;padding-left:22px;position:relative}
html.rm .auth-service li::before{content:"✓";position:absolute;left:0;color:#a8c0ff}
html.rm .auth-service a{display:inline-flex;align-items:center;min-height:44px;margin-top:32px;color:#d8e1f8;font-size:13px;font-weight:600;text-decoration:none}
html.rm .auth-page .auth-shell .login-card{width:100%;padding:40px;border:0;border-radius:0;box-shadow:none;background:#fff}
html.rm .account-page .login-wrap{max-width:640px}
html.rm .account-page .login-card{width:100%}
@media(max-width:720px){html.rm .auth-page .login-wrap{padding:24px 16px;max-width:520px}html.rm .auth-shell{grid-template-columns:minmax(0,1fr);box-shadow:none}html.rm .auth-service{display:none}html.rm .auth-page .auth-shell .login-card{padding:28px 20px}}
html.rm #foodnote-workspace .wb-analysis-source>.wb-raw{margin:0;border:0;padding:0}
html.rm #foodnote-workspace .wb-analysis-source>.wb-raw>summary{font-size:13px;min-height:44px}
@media(min-width:1000px){html.rm #foodnote-workspace #wb-conditions .wb-input-grid{grid-template-columns:repeat(4,minmax(0,1fr))}html.rm #foodnote-workspace #wb-prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}html.rm #foodnote-workspace #wb-prices>h3,html.rm #foodnote-workspace #wb-prices>.wb-helper,html.rm #foodnote-workspace #wb-prices>#wb-batch{grid-column:1/-1}}
@media(max-width:1000px){html.rm #foodnote-workspace article.wb-food{grid-template-columns:minmax(0,1fr) auto}html.rm #foodnote-workspace .wb-food-values{grid-column:1/-1;grid-row:2}html.rm #foodnote-workspace .wb-food-action{grid-column:2;grid-row:1}}
@media(max-width:720px){html.rm #site-header>.fn-shell,html.rm #foodnote-workspace #site-header>.fn-shell{min-height:64px;padding:10px 16px;gap:12px}html.rm #site-header .site-primary-nav,html.rm #site-header .site-auth-link{display:none}html.rm #site-header .site-menu{margin-left:auto}html.rm #site-header .site-menu-content{position:fixed;left:0;right:0;top:64px;bottom:0;width:auto;max-height:none;border:0;border-radius:0;box-shadow:none;padding:12px 16px 32px;overscroll-behavior:contain}html.rm #site-header .site-menu-heading{position:sticky;top:-12px;background:#fff;z-index:1;padding-block:4px 8px}html.rm #site-header .site-menu-account #site-menu-auth-link{display:flex;background:#2457d6;color:#fff;justify-content:center}html.rm #site-header .site-menu-content nav>a,html.rm #site-header .site-menu-content nav>button{min-height:56px;font-size:16px}html.rm #foodnote-workspace .wb-tab-panel{padding:20px 16px}html.rm #foodnote-workspace .wb-provenance{padding:20px 16px}html.rm #foodnote-workspace .wb-detail-tablist{gap:0;padding-inline:4px}html.rm #foodnote-workspace .wb-detail-tablist button{font-size:12px;padding-inline:10px}html.rm #foodnote-workspace .wb-build-report{min-height:48px}html.rm #foodnote-workspace .wb-mobile-build{display:flex;position:fixed;right:24px;bottom:18px;z-index:45;min-height:44px;width:112px;font-size:14px;padding:8px 12px}html.rm #foodnote-workspace .wb-analysis-drawer>summary{padding-right:136px}html.rm #foodnote-workspace .wb-analysis-drawer[data-preview=true]{position:static;border:0;background:none;box-shadow:none;width:100%;max-height:none;padding:0}html.rm #foodnote-workspace .wb-analysis-drawer[data-preview=true]>summary{display:none}html.rm #foodnote-workspace .wb-analysis-drawer[data-preview=true]>.wb-drawer-content{padding:0;max-height:none;overflow:visible}html.rm #foodnote-workspace .wb-search-example{padding:20px}html.rm #foodnote-workspace .wb-goal-controls{grid-template-columns:minmax(0,1.4fr) minmax(90px,1fr)}html.rm #foodnote-workspace .wb-nutrition-table th,html.rm #foodnote-workspace .wb-nutrition-table td{padding:10px 8px;font-size:12px}}
/* 검색은 한 장의 입력 영역과 실제 비교 예시로 시작한다. */
html.rm #site-header .site-primary-nav{justify-content:center}
html.rm #site-header .site-auth-link{gap:8px;padding:0 16px;border-color:#2457d6;background:#2457d6;color:#fff;text-decoration:none;font-weight:700;min-width:106px}
html.rm #site-header .site-auth-link:hover{background:#1d46ad;border-color:#1d46ad}
html.rm #site-header .site-auth-link svg{width:20px;height:20px;flex-shrink:0}
html.rm #foodnote-workspace[data-view=search] .fw-main{padding-top:40px}
html.rm #foodnote-workspace[data-view=search] .wb-workspace{grid-template-columns:minmax(0,1fr) 360px;align-items:start;gap:24px}
html.rm #foodnote-workspace[data-view=search] .wb-work{margin-top:0}
html.rm #foodnote-workspace[data-view=search] .wb-search-panel{padding:32px;border:1px solid #e4e7ec;border-radius:20px;background:#fff}
html.rm #foodnote-workspace[data-view=search] .wb-heading{display:block;width:100%;margin:0 0 24px}
html.rm #foodnote-workspace[data-view=search] .wb-heading h1{font-size:28px;line-height:1.45;letter-spacing:-.04em;margin:0 0 10px;color:#101828}
html.rm #foodnote-workspace[data-view=search] .wb-heading p{font-size:14px;line-height:1.7;margin:0;color:#475467}
html.rm #foodnote-workspace[data-view=search].has-search-results .wb-heading{display:none}
html.rm #foodnote-workspace[data-view=search] #wb-food-search>.wb-tabs{margin-bottom:22px}
html.rm #foodnote-workspace .wb-query-label{display:block;font-size:13px;font-weight:650;color:#344054;margin-bottom:8px}
html.rm #foodnote-workspace .wb-search-row{gap:10px}
html.rm #foodnote-workspace .wb-search-row input{min-height:56px;border-radius:12px;font-size:16px;background:#fff;border:1px solid #cbd2df;padding:0 16px}
html.rm #foodnote-workspace #wb-search-button{min-height:56px;border-radius:12px;padding:0 22px;gap:8px}
html.rm #foodnote-workspace .wb-search-options{border:0;border-top:1px solid #eef0f4;margin:18px 0 0;padding:0}
html.rm #foodnote-workspace .wb-search-options>summary{display:flex;gap:8px;justify-content:flex-start;min-height:48px;font-size:13px;font-weight:650;color:#475467;list-style:none;cursor:pointer}
html.rm #foodnote-workspace .wb-search-options>summary svg{width:18px;height:18px}
html.rm #foodnote-workspace .wb-search-options>summary::after{content:'+';margin-left:auto;font-size:18px;font-weight:500;transform:none;border:0;width:auto;height:auto}
html.rm #foodnote-workspace .wb-search-options[open]>summary::after{content:'−'}
html.rm #foodnote-workspace .wb-search-filters{padding:4px 0 18px;gap:16px}
html.rm #foodnote-workspace .wb-search-options:not([open])>.wb-search-filters{display:none}
html.rm #foodnote-workspace .wb-quick{gap:6px;margin-top:12px}
html.rm #foodnote-workspace .wb-quick>span{display:none}
html.rm #foodnote-workspace .wb-quick .fw-secondary{min-height:44px;padding:0 13px;background:#f5f7fa;border:1px solid transparent;border-radius:8px;font-size:13px;font-weight:600}
html.rm #foodnote-workspace .wb-quick .fw-text-button{font-size:13px;min-height:44px;margin-left:auto}
html.rm #foodnote-workspace[data-view=search] #wb-source-status{order:initial;border-top:1px solid #eef0f4;border-radius:0;background:none;margin:20px 0 0;padding:16px 0 0;font-size:12px;line-height:1.6;color:#667085}
html.rm #foodnote-workspace[data-view=search].has-search-results .wb-quick{display:none}
html.rm #foodnote-workspace[data-view=search].has-search-results .wb-search-panel{padding:24px;margin-bottom:24px}
html.rm #foodnote-workspace .wb-search-example{padding:24px;border:0;box-shadow:none}
html.rm #foodnote-workspace .wb-search-example h2{font-size:19px;line-height:1.6}
html.rm #foodnote-workspace .wb-search-example table{margin:20px 0 14px}
html.rm #foodnote-workspace .wb-search-example [data-action=quick-sample]{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;padding:8px 14px;border:1px solid #c8d6fb;background:#eff4ff;color:#2457d6;border-radius:10px;font-weight:700}
html.rm #foodnote-workspace .wb-usage{margin-top:24px;padding-top:0;border:0}
html.rm #foodnote-workspace .wb-usage>h2{display:none}
html.rm #foodnote-workspace .wb-workflow{gap:24px}
html.rm #foodnote-workspace .wb-workflow li{border:0;border-radius:0;background:transparent;padding:16px 4px;gap:12px}
html.rm #foodnote-workspace .wb-workflow strong{font-size:14px;margin:4px 0}
html.rm #foodnote-workspace .wb-workflow p{font-size:12px;line-height:1.6}
@media(max-width:1023px){html.rm #foodnote-workspace[data-view=search] .wb-workspace{grid-template-columns:minmax(0,1fr)}html.rm #foodnote-workspace[data-view=search] .wb-work{margin-top:0}html.rm #foodnote-workspace .wb-search-example{max-width:none}}
@media(max-width:720px){html.rm #site-header .site-auth-link{display:inline-flex;min-width:0;min-height:44px;padding:0 12px;font-size:13px;gap:6px;margin-left:auto}html.rm #site-header .site-auth-link svg{width:18px;height:18px}html.rm #site-header .site-menu{margin-left:0}html.rm #site-header>.fn-shell,html.rm #foodnote-workspace #site-header>.fn-shell{gap:8px}html.rm #foodnote-workspace[data-view=search] .fw-main{padding-top:24px}html.rm #foodnote-workspace[data-view=search] .wb-search-panel,html.rm #foodnote-workspace[data-view=search].has-search-results .wb-search-panel{padding:20px 16px;border-radius:16px}html.rm #foodnote-workspace[data-view=search] .wb-heading h1{font-size:24px;line-height:1.5}html.rm #foodnote-workspace[data-view=search] .wb-heading p{font-size:13px}html.rm #foodnote-workspace #wb-search-button{padding:0 16px}html.rm #foodnote-workspace .wb-quick .fw-secondary{padding:0 10px}html.rm #foodnote-workspace .wb-quick .fw-text-button{margin-left:0}html.rm #foodnote-workspace .wb-workflow{gap:0}html.rm #foodnote-workspace .wb-workflow li{padding:10px 4px}html.rm #foodnote-workspace .wb-workflow li p{display:none}html.rm #foodnote-workspace .wb-search-example{padding:20px 16px}}
html.rm #foodnote-workspace[data-view=search]:not(.has-search-results) .wb-work{margin-top:0}
html.rm #foodnote-workspace[data-view=search]:not(.has-search-results) .wb-workspace{grid-template-columns:minmax(0,1fr) 360px}
@media(max-width:1023px){html.rm #foodnote-workspace[data-view=search]:not(.has-search-results) .wb-workspace{grid-template-columns:minmax(0,1fr)}}
/* 실제 화면을 펼쳐 읽는 사용자 가이드. */
html.rm #site-header .site-guide-link svg{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:721px) and (max-width:1023px){html.rm #site-header>.fn-shell,html.rm #foodnote-workspace #site-header>.fn-shell{gap:12px}html.rm #site-header .site-primary-nav{flex-wrap:nowrap;gap:0}html.rm #site-header .site-primary-nav>a,html.rm #site-header .site-primary-nav>button{font-size:13px;padding-inline:9px}html.rm #site-header .site-auth-link{min-width:96px;padding-inline:12px}}
@media(max-width:720px){html.rm #site-header .site-primary-nav{display:flex;flex:0 0 44px;justify-content:center}html.rm #site-header .site-primary-nav>a:not(.site-guide-link),html.rm #site-header .site-primary-nav>button{display:none}html.rm #site-header .site-primary-nav>.site-guide-link{display:inline-flex;width:44px;height:44px;padding:0;border:1px solid #d0d5dd;background:#fff;color:#2457d6;box-sizing:border-box}html.rm #site-header .site-guide-link span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}html.rm #site-header>.fn-shell,html.rm #foodnote-workspace #site-header>.fn-shell{gap:6px;flex-wrap:nowrap}}
@media(max-width:400px){html.rm #site-header>.fn-shell,html.rm #foodnote-workspace #site-header>.fn-shell,html.rm #foodnote-workspace[data-view=intro] #site-header>.fn-shell{padding-inline:12px;gap:6px}html.rm #site-header .fn-brand{font-size:18px;gap:6px}html.rm #site-header .fn-brand-mark{width:28px;height:28px}html.rm #site-header .site-auth-link{padding-inline:10px;gap:4px}html.rm #site-header .site-auth-link svg{width:16px;height:16px}}
html.rm .guide-context{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;color:#2457d6;font-size:13px;font-weight:650;text-decoration:none;white-space:nowrap}
html.rm .guide-context svg{width:18px;height:18px;flex-shrink:0}
html.rm .guide-context:hover{text-decoration:underline}
html.rm #foodnote-workspace .wb-heading .guide-context{margin-top:8px}
html.rm #foodnote-workspace .wb-library-heading .guide-context{margin-top:4px}
html.rm .guide-shell{max-width:1200px;margin:0 auto;padding:40px 24px 64px;box-sizing:border-box}
html.rm .guide-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}
html.rm .guide-intro h1{font-size:32px;line-height:1.4;margin:0 0 10px;color:#101828;letter-spacing:-.03em}
html.rm .guide-intro p{font-size:16px;line-height:1.8;margin:0;color:#475467}
html.rm .guide-intro strong{padding:2px 6px;border:2px solid #e00000;color:#101828;font-weight:650}
html.rm .guide-pdf{display:inline-flex;align-items:center;justify-content:center;gap:12px;flex-shrink:0;min-height:48px;padding:0 18px;border:1px solid #cbd2df;border-radius:10px;background:#fff;color:#101828;font-size:14px;font-weight:650;text-decoration:none}
html.rm .guide-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:32px;align-items:start}
html.rm .guide-sidebar{position:sticky;top:24px;min-width:0}
html.rm .guide-sidebar nav{display:flex;flex-direction:column;gap:4px}
html.rm .guide-sidebar nav a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:0 14px;border-radius:10px;text-decoration:none;color:#475467;font-size:14px;font-weight:600}
html.rm .guide-sidebar nav a[aria-current=true]{background:#e9eefb;color:#2457d6}
html.rm .guide-sidebar nav span{font-size:12px;font-weight:500}
html.rm .guide-start{display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin-top:18px;border-top:1px solid #e4e7ec;padding-top:14px;font-size:13px;color:#2457d6;text-decoration:none}
html.rm .guide-content{min-width:0}
html.rm .guide-search{display:flex;align-items:center;gap:16px;font-size:13px;font-weight:650;color:#344054}
html.rm .guide-search input{flex:1;min-width:0;min-height:48px;padding:10px 14px;border:1px solid #cbd2df;border-radius:10px;background:#fff;font:inherit;font-size:15px}
html.rm .guide-result{font-size:13px;color:#667085;line-height:1.7;min-height:22px;margin:10px 0 22px}
html.rm .guide-topic h2{font-size:20px;line-height:1.5;letter-spacing:-.025em;color:#101828;margin:0 0 16px}
html.rm .guide-topic{margin-bottom:24px;min-width:0}
html.rm .guide-step{border:1px solid #e4e7ec;border-radius:12px;background:#fff;margin:10px 0;min-width:0;overflow:hidden}
html.rm .guide-step>summary{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 18px;box-sizing:border-box;list-style:none;cursor:pointer;color:#101828;font-size:15px;font-weight:650;line-height:1.6}
html.rm .guide-step>summary::-webkit-details-marker{display:none}
html.rm .guide-step>summary::after{content:'+';margin-left:auto;font-size:22px;font-weight:400;color:#667085}
html.rm .guide-step[open]>summary::after{content:'−'}
html.rm .guide-step-number{display:grid;place-items:center;flex-shrink:0;width:30px;height:30px;border-radius:8px;background:#f2f4f7;color:#475467;font-size:12px;font-weight:650;font-variant-numeric:tabular-nums}
html.rm .guide-step[open]{border-color:#c8d6fb}
html.rm .guide-step[open] .guide-step-number{background:#e9eefb;color:#2457d6}
html.rm .guide-step-body{border-top:1px solid #eef0f4;padding:20px;min-width:0}
html.rm .guide-steps{list-style:none;margin:0 0 18px;padding:0;color:#344054;font-size:15px;line-height:1.9}
html.rm .guide-steps li+li{margin-top:8px}
html.rm .guide-step figure{margin:0;min-width:0}
html.rm .guide-step img{display:block;width:100%;height:auto;background:#f5f7fa;border:1px solid #e4e7ec;border-radius:8px;box-sizing:border-box}
html.rm .guide-step img.guide-portrait{max-width:390px;aspect-ratio:390/680;object-fit:cover;object-position:center;margin:auto}
html.rm .guide-step figcaption{font-size:12px;line-height:1.7;color:#667085;margin-top:10px}
html.rm .guide-enlarge{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;margin-top:12px;padding:8px 14px;border:1px solid #c8d6fb;border-radius:8px;background:#eff4ff;color:#2457d6;font:inherit;font-size:13px;font-weight:650;cursor:pointer}
html.rm .guide-note,html.rm .guide-version{font-size:12px;line-height:1.8;color:#667085;margin:16px 0}
html.rm #guide-mail-state{padding:12px 14px;border-radius:8px;background:#f2f4f7;color:#475467}
html.rm .guide-empty{padding:32px 20px;border:1px solid #e4e7ec;border-radius:12px;background:#fff;font-size:14px;line-height:1.8;color:#475467}
html.rm .guide-zoom{box-sizing:border-box;width:calc(100vw - 32px);max-width:1400px;max-height:calc(100dvh - 32px);padding:20px;border:1px solid #e4e7ec;border-radius:16px;background:#fff;color:#101828;overflow:auto}
html.rm .guide-zoom::backdrop{background:rgba(16,24,40,.6)}
html.rm .guide-zoom-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
html.rm .guide-zoom-head h2{margin:0;font-size:17px;line-height:1.6}
html.rm .guide-zoom-head button{min-width:80px;min-height:44px;padding:8px 12px;border:1px solid #cbd2df;border-radius:8px;background:#fff;font:inherit;font-size:14px;cursor:pointer}
html.rm .guide-zoom>p{font-size:12px;color:#667085;line-height:1.7;margin:8px 0 14px}
html.rm .guide-zoom-canvas{max-width:100%;overflow:auto;overscroll-behavior:contain;border:1px solid #e4e7ec;border-radius:8px;background:#f5f7fa}
html.rm .guide-zoom-image,html.rm #guide-zoom-image{display:block;max-width:none;width:1280px;height:680px;object-fit:contain;background:#fff}
html.rm #guide-zoom-image.guide-portrait{width:390px;height:680px;object-fit:cover;object-position:center}
@media(max-width:900px){html.rm .guide-layout{grid-template-columns:minmax(0,1fr);gap:20px}html.rm .guide-sidebar{position:static}html.rm .guide-sidebar nav{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px}html.rm .guide-sidebar nav a{min-height:44px;padding:0 12px;border:1px solid #e4e7ec;background:#fff;font-size:13px}html.rm .guide-sidebar nav a[aria-current=true]{background:#e9eefb;border-color:#c8d6fb}html.rm .guide-start{display:none}}
@media(max-width:600px){html.rm .guide-shell{padding:24px 16px 40px}html.rm .guide-intro{display:block;margin-bottom:22px}html.rm .guide-intro h1{font-size:26px}html.rm .guide-intro p{font-size:14px}html.rm .guide-pdf{margin-top:16px;min-height:44px}html.rm .guide-search{display:block}html.rm .guide-search input{display:block;width:100%;box-sizing:border-box;margin-top:8px}html.rm .guide-step>summary{padding:12px;gap:10px;font-size:14px}html.rm .guide-step-body{padding:16px 12px}html.rm .guide-steps{font-size:14px}html.rm .guide-enlarge{width:100%}html.rm .guide-zoom{padding:12px}.guide-zoom-head h2{font-size:15px}}
html.rm .guide-zoom-canvas{max-height:calc(100dvh - 200px)}
/* 선택 즉시 보이는 짧은 계산과 한 번 받는 전체 분석표. */
html.rm #foodnote-workspace .wb-selection.has-preview .wb-cart-placeholder,html.rm #foodnote-workspace .wb-selection.has-preview .wb-cart-guide{display:none}
html.rm #foodnote-workspace .wb-selection.has-preview .wb-cart-item{padding:8px;min-height:44px;gap:8px}
html.rm #foodnote-workspace .wb-selection.has-preview .wb-cart-item small{display:none}
html.rm #foodnote-workspace .wb-selection.has-preview .wb-cart-item strong{font-size:12px;line-height:1.5}
html.rm #foodnote-workspace .wb-cart-preview{margin-top:14px;padding-top:12px;border-top:1px solid #e4e7ec}
html.rm #foodnote-workspace .wb-cart-preview-label{font-size:12px;line-height:1.7;color:#475467;margin:0 0 8px}
html.rm #foodnote-workspace .wb-cart-presets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
html.rm #foodnote-workspace .wb-cart-presets button{flex:1;min-height:44px;padding:6px 8px;border:1px solid #e4e7ec;border-radius:8px;background:#fff;color:#475467;font:inherit;font-size:12px;white-space:nowrap;cursor:pointer}
html.rm #foodnote-workspace .wb-cart-presets button[aria-pressed=true]{background:#e9eefb;border-color:#b9cbfb;color:#2457d6;font-weight:700}
html.rm #foodnote-workspace .wb-cart-preview .wb-quick-results{margin:0;padding:0;border:0;background:none}
html.rm #foodnote-workspace .wb-cart-preview h3{font-size:13px;line-height:1.6;margin:8px 0}
html.rm #foodnote-workspace .wb-cart-preview .wb-summary-table{table-layout:fixed;margin:8px 0}
html.rm #foodnote-workspace .wb-cart-preview .wb-summary-table th,html.rm #foodnote-workspace .wb-cart-preview .wb-summary-table td{padding:8px 4px;font-size:11px;line-height:1.6;overflow-wrap:anywhere;word-break:normal}
html.rm #foodnote-workspace .wb-cart-preview .wb-better-label{display:block;width:max-content;margin:3px 0 0;padding:1px 4px;font-size:10px}
html.rm #foodnote-workspace .wb-cart-preview .wb-helper{font-size:11px;line-height:1.6;margin:8px 0}
html.rm #foodnote-workspace .wb-selection.has-preview .wb-cart-hint{display:none}
html.rm #foodnote-workspace .wb-selection.has-preview .wb-build-report{margin-top:8px}
html.rm #foodnote-workspace .wb-export-split{display:flex;align-items:center;gap:0}
html.rm #foodnote-workspace .wb-export-split>.fw-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 14px;border-radius:10px 0 0 10px}
html.rm #foodnote-workspace .wb-export-split>.fw-primary svg{width:16px;height:16px;transform:rotate(90deg)}
html.rm #foodnote-workspace .wb-export-split .wb-export-menu>summary{min-width:44px;padding:0;border-radius:0 10px 10px 0;border-left:1px solid #6b8ef1}
html.rm #foodnote-workspace .wb-nutrient-fold{margin-top:14px;border-top:1px solid #e4e7ec;padding-top:4px}
html.rm #foodnote-workspace .wb-nutrient-fold>summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;font-size:14px;font-weight:650;color:#2457d6;cursor:pointer;list-style:none}
html.rm #foodnote-workspace .wb-nutrient-fold>summary::after{content:'+';font-size:20px;font-weight:400}
html.rm #foodnote-workspace .wb-nutrient-fold[open]>summary::after{content:'−'}
html.rm #foodnote-workspace .wb-cart-preview .wb-summary-table tbody tr:first-child td{font-size:12px;line-height:1.6;font-weight:700}
html.rm #foodnote-workspace .fw-status{pointer-events:none}
html.rm #foodnote-workspace .fw-status button{pointer-events:auto}
@media(max-width:900px){html.rm #foodnote-workspace .fw-status:not(:empty){top:76px;bottom:auto}}
html.rm #foodnote-workspace .wb-analysis-drawer[open]~.wb-mobile-build{display:none}
/* 기본 결과는 짧게, 저장 위치는 버튼 이름으로 알린다. */
html.rm #foodnote-workspace .wb-nutrient-fold{margin-top:0;padding-top:0;border-top:0}
html.rm #foodnote-workspace .wb-nutrient-fold>summary{min-height:48px}
html.rm #foodnote-workspace details.wb-provenance{padding:0}
html.rm #foodnote-workspace details.wb-provenance>summary{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:12px 20px;list-style:none;cursor:pointer;font-size:14px;font-weight:650;color:#475467;box-sizing:border-box}
html.rm #foodnote-workspace details.wb-provenance>summary::after{content:'+';font-size:20px;font-weight:400}
html.rm #foodnote-workspace details.wb-provenance[open]>summary::after{content:'−'}
html.rm #foodnote-workspace details.wb-provenance>.wb-analysis-source{margin:0 20px;padding:16px 0;border-top:1px solid #e4e7ec}
html.rm #foodnote-workspace .wb-cart-save-row{display:flex;align-items:stretch;gap:0;margin-top:12px}
html.rm #foodnote-workspace .wb-cart-save-row>.wb-open-report{flex:1;min-width:0;margin:0;width:auto}
html.rm #foodnote-workspace .wb-cart-save-menu{position:relative}
html.rm #foodnote-workspace .wb-cart-save-menu>summary{display:grid;place-items:center;min-height:44px;width:44px;padding:0;border:1px solid #d0d5dd;border-radius:8px;background:#fff;color:#475467;cursor:pointer;list-style:none}
html.rm #foodnote-workspace .wb-cart-save-menu>summary::after{display:none}
html.rm #foodnote-workspace .wb-cart-save-menu svg{width:20px;height:20px}
html.rm #foodnote-workspace .wb-cart-save-menu>div{position:absolute;right:0;bottom:calc(100% + 8px);z-index:55;width:200px;padding:6px;border:1px solid #d0d5dd;border-radius:10px;background:#fff;box-shadow:0 8px 20px #10182816}
html.rm #foodnote-workspace .wb-cart-save-menu button{width:100%;min-height:44px;padding:8px 12px;background:#fff;border:0;border-radius:6px;color:#344054;font:inherit;font-size:13px;text-align:left;cursor:pointer}
html.rm #foodnote-workspace .wb-cart-save-menu button:hover{background:#f2f4f7}
@media(max-width:600px){html.rm #foodnote-workspace .wb-overview-card .wb-summary-table th,html.rm #foodnote-workspace .wb-overview-card .wb-summary-table td{padding:9px 4px;font-size:12px;line-height:1.6}html.rm #foodnote-workspace .wb-overview-card .wb-summary-table tbody tr:first-child td{font-size:13px;font-weight:750}}

/* 주 내용과 키보드 순서를 맞추고 PC에서 요청 목록을 왼쪽에 둔다. */
html.rm #orders-layout>#detail-panel{grid-column:2;grid-row:1}
html.rm #orders-layout>aside{grid-column:1;grid-row:1}
@media(max-width:760px){html.rm #orders-layout>#detail-panel{grid-column:1;grid-row:1}html.rm #orders-layout>aside{grid-column:1;grid-row:2}}

/* 예산 결과는 가격을 입력한 자리에서 짧게 보여준다. */
html.rm #foodnote-workspace .wb-budget-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:14px;background:#f2f6ff;border-radius:8px;margin:12px 0 0}
html.rm #foodnote-workspace .wb-budget-values div{min-width:0}
html.rm #foodnote-workspace .wb-budget-values dt{font-size:12px;color:#475467;line-height:1.7}
html.rm #foodnote-workspace .wb-budget-values dd{margin:4px 0 0;font-size:17px;font-weight:700;color:#101828;overflow-wrap:anywhere}
@media(max-width:600px){html.rm #foodnote-workspace .wb-budget-values{display:block;padding:12px}html.rm #foodnote-workspace .wb-budget-values div{display:flex;align-items:baseline;justify-content:space-between;gap:8px}html.rm #foodnote-workspace .wb-budget-values div+div{margin-top:8px}html.rm #foodnote-workspace .wb-budget-values dt{min-width:0}html.rm #foodnote-workspace .wb-budget-values dd{margin:0;font-size:15px;white-space:nowrap}}

/* 실제 계산 가능한 항목만 짧게 알리고 세부 개수는 성분표 안에 둔다. */
html.rm #foodnote-workspace .wb-readiness{margin:8px 0 12px;font-size:12px;line-height:1.7;color:#475467}
html.rm #foodnote-workspace .wb-readiness p{margin:4px 0}
html.rm #foodnote-workspace .wb-readiness strong{color:#101828;font-weight:650}
html.rm #foodnote-workspace .wb-readiness-detail{margin:12px 0;color:#475467;font-size:12px;line-height:1.7}
html.rm #foodnote-workspace .wb-readiness-detail p{margin:4px 0}

html.rm #foodnote-workspace .wb-unit-price{margin:8px 0;font-size:12px;line-height:1.8;color:#475467;overflow-wrap:anywhere}
html.rm #foodnote-workspace .wb-unit-price:empty{display:none}
html.rm #foodnote-workspace .wb-unit-price strong{color:#101828;font-weight:700}

/* 입력한 조건의 차이를 같은 카드에서 읽는다. */
html.rm #foodnote-workspace .wb-limit-values{margin:12px 0 0}
html.rm #foodnote-workspace .wb-limit-row{padding:10px 0;border-top:1px solid #e4e7ec}
html.rm #foodnote-workspace .wb-limit-row dt{font-size:12px;color:#475467;margin:0 0 4px}
html.rm #foodnote-workspace .wb-limit-row dd{margin:0;font-size:12px;line-height:1.8;overflow-wrap:anywhere}
html.rm #foodnote-workspace .wb-limit-row span,html.rm #foodnote-workspace .wb-limit-row strong{display:block}
html.rm #foodnote-workspace .wb-limit-row strong{color:#101828;font-size:13px;font-weight:650}
html.rm #foodnote-workspace .wb-limit-row[data-limit-state=exceeded] strong{color:#b42318}

/* 여러 회분은 식품별 가격 입력과 구분해 전체 너비에서 비교한다. */
html.rm #foodnote-workspace #wb-batch>.wb-field{max-width:240px}
html.rm #foodnote-workspace #wb-batch-output{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px}
html.rm #foodnote-workspace #wb-batch-output>.wb-helper{grid-column:1/-1}
html.rm #foodnote-workspace .wb-budget-exceeded dd{color:#b42318}

/* 비교 도구 안내는 기존 본문 폭과 글꼴을 사용한다. */
html.rm .tool-choice .lg-doc{max-width:100%;min-width:0}
html.rm .tool-choice .lg-head p{max-width:760px;line-height:1.8;margin:16px 0}
html.rm .tool-choice section+section{margin-top:36px}
html.rm .tool-choice section p{line-height:1.85;max-width:880px}
html.rm .tool-table{overflow-x:auto;border:1px solid #e2e8f0;border-radius:12px;margin:20px 0}
html.rm .tool-table table{border-collapse:collapse;width:100%;min-width:650px;text-align:left}
html.rm .tool-table th,html.rm .tool-table td{padding:16px;line-height:1.8;vertical-align:top;border-bottom:1px solid #e2e8f0}
html.rm .tool-table thead{background:#f5f7fb}
html.rm .tool-choice a:focus-visible{outline:3px solid #2457d6;outline-offset:4px}
html.rm .home-help h2{font-size:18px;margin-top:24px}
html.rm .tool-choice .lg-head a.fn-button--primary{color:#fff;text-decoration:none}
