/*
  글로벌 1차 3 URL 공통 시트 — /ideal-type · /en/flames · /es/calculadora-del-amor.

  · 리터럴 색상값은 **한 개도 없다**. 색·크기·간격·라운드는 전부 assets/site.css의 토큰이다.
  · 래퍼 폭·좌우 패딩·상단 고정 바·푸터·언어 토글은 site.css 공통 층이 소유한다 —
    여기서 다시 정의하지 않는다(중심축 620/430은 전 페이지 공통).
  · 각 페이지는 강조 계약(--accent*)을 자기 계열에 묶기만 한다.
      /ideal-type   → KR 계열(멀베리)
      /en/flames · /es/calculadora-del-amor → 기본 중립 계열(먹)
    EN·ES에 새 색 계열을 만들지 않은 이유: 새 계열은 토큰 층에 **새 리터럴 색**을 요구한다.
    이번 발주의 "리터럴 hex 신규 0"과 충돌하므로, 두 언어는 중립 계약으로 열고
    언어 구분은 색이 아니라 라벨·언어 토글이 한다.
  · 모바일 우선 430px. W3C 표준만 사용한다.
*/

.page-game{font-size:var(--fs-60);line-height:var(--lh-normal)}
.page-game a{color:var(--accent-ink);text-underline-offset:3px}
.page-game a:focus-visible,
.page-game button:focus-visible,
.page-game input:focus-visible,
.page-game summary:focus-visible{outline:var(--focus-w) solid var(--focus);outline-offset:var(--focus-gap)}
.page-game .skip:focus{border-color:var(--accent-ink);color:var(--accent-ink)}
.page-game .langtoggle a[aria-current]{background:var(--accent);color:var(--accent-on);font-weight:var(--fw-bold)}

/* ── 머리 ─────────────────────────────────────────────────────────────── */
.page-game header{padding:var(--sp-5) var(--sp-1) 0}
.page-game .brand{font-size:var(--fs-20);color:var(--muted);letter-spacing:var(--track-wide)}
.page-game h1{font-size:var(--fs-75);font-weight:var(--fw-bold);line-height:var(--lh-tight);margin-top:var(--sp-3)}
.page-game .lead{font-size:var(--fs-45);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}
.page-game .notice{font-size:var(--fs-35);color:var(--muted);margin-top:var(--sp-5);line-height:var(--lh-relaxed);border-left:3px solid var(--accent-line);padding-left:var(--sp-5)}
.page-game .privacy{font-size:var(--fs-30);color:var(--muted);margin-top:var(--sp-4);line-height:var(--lh-relaxed)}
.page-game .entry{margin-top:var(--sp-6);display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-5)}
.page-game .cta{display:inline-flex;align-items:center;justify-content:center;min-height:var(--tap);padding:var(--sp-5) var(--sp-8);border-radius:var(--r-md);background:var(--accent);color:var(--accent-on);font-size:var(--fs-50);font-weight:var(--fw-bold);text-decoration:none}
.page-game .quiet{font-size:var(--fs-35);color:var(--muted);min-height:var(--tap-sm);display:inline-flex;align-items:center}

/* ── 구획 ─────────────────────────────────────────────────────────────── */
.page-game .block{margin-top:var(--sp-10)}
.page-game .block>h2{font-size:var(--fs-65);font-weight:var(--fw-bold);line-height:var(--lh-snug)}
.page-game .block>h3{font-size:var(--fs-50);font-weight:var(--fw-bold);margin-top:var(--sp-7)}
.page-game .block>p{font-size:var(--fs-40);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}
.page-game .note{font-size:var(--fs-25);color:var(--muted);line-height:var(--lh-relaxed)}
.page-game .guide{font-weight:var(--fw-medium)}
.page-game .noscript{font-size:var(--fs-40);background:var(--surface);border:1px solid var(--accent-line);border-radius:var(--r-md);padding:var(--sp-6);line-height:var(--lh-relaxed)}
.page-game .backtop{margin-top:var(--sp-10);font-size:var(--fs-30)}
.page-game ol,.page-game ul{margin:var(--sp-5) 0 0 var(--sp-8)}
.page-game li{font-size:var(--fs-40);margin-bottom:var(--sp-4);line-height:var(--lh-relaxed)}
.page-game code{font-family:var(--font-mono);font-size:.92em;background:var(--surface-sunk);border-radius:var(--r-xs);padding:1px var(--sp-2);overflow-wrap:anywhere}

/* ── 문항(이상형) ─────────────────────────────────────────────────────── */
.page-game fieldset{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--sh-card);padding:var(--sp-6) var(--sp-7) var(--sp-7);margin-top:var(--sp-6);min-width:0}
.page-game fieldset.is-missing{border-color:var(--danger)}
.page-game legend{display:flex;flex-wrap:wrap;gap:var(--sp-4);align-items:baseline;padding:0 var(--sp-3)}
.page-game .q-num{font-size:var(--fs-20);color:var(--muted);font-weight:var(--fw-bold)}
.page-game .q-axis{font-size:var(--fs-15);color:var(--accent-ink);border:1px solid var(--accent-line);background:var(--accent-tint);border-radius:var(--r-pill);padding:var(--sp-2) var(--sp-5)}
.page-game .q-text{font-size:var(--fs-50);font-weight:var(--fw-medium);line-height:var(--lh-snug);margin-top:var(--sp-4)}
.page-game .opts{display:grid;gap:var(--sp-4);margin-top:var(--sp-6)}
.page-game .opts input{position:absolute;opacity:0;width:1px;height:1px}
.page-game .opts label{display:block;border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-5) var(--sp-6);min-height:var(--tap);cursor:pointer;background:var(--surface)}
.page-game .opts input:checked+label{border-color:var(--accent);background:var(--accent-tint);border-width:2px;padding:calc(var(--sp-5) - 1px) calc(var(--sp-6) - 1px)}
.page-game .opts input:focus-visible+label{outline:var(--focus-w) solid var(--focus);outline-offset:var(--focus-gap)}
.page-game .opt-text{display:block;font-size:var(--fs-40);line-height:var(--lh-snug)}
.page-game .opts input:checked+label .opt-text{font-weight:var(--fw-bold)}
.page-game .opt-map{display:block;font-size:var(--fs-20);color:var(--muted);margin-top:var(--sp-2)}
.page-game .fielderr{font-size:var(--fs-30);color:var(--danger);margin-top:var(--sp-5)}
.page-game .progress{font-size:var(--fs-30);color:var(--muted);margin-top:var(--sp-8)}
.page-game .changed{font-size:var(--fs-30);color:var(--accent-ink);margin-top:var(--sp-5)}
.page-game .formstatus{font-size:var(--fs-35);color:var(--danger);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}
.page-game .go{width:100%;margin-top:var(--sp-5);padding:var(--sp-6);border:0;border-radius:var(--r-md);background:var(--accent);color:var(--accent-on);font-size:var(--fs-60);font-weight:var(--fw-bold);min-height:var(--tap);font-family:inherit;cursor:pointer}

/* ── 이름 입력(FLAMES·LOVES) ──────────────────────────────────────────── */
.page-game .namecard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-card);padding:var(--sp-7);margin-top:var(--sp-6)}
.page-game .field+.field{margin-top:var(--sp-7)}
.page-game .field label{display:block;font-size:var(--fs-35);font-weight:var(--fw-medium);margin-bottom:var(--sp-3)}
.page-game .field input{width:100%;max-width:100%;min-width:0;padding:var(--sp-6);font-size:var(--fs-65);border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);font-family:inherit;color:inherit}
.page-game .field input[aria-invalid="true"]{border-color:var(--danger);border-width:2px}
.page-game .field .hint{font-size:var(--fs-25);color:var(--muted);margin-top:var(--sp-3);line-height:var(--lh-relaxed)}
.page-game .field .err{font-size:var(--fs-30);color:var(--danger);margin-top:var(--sp-3);line-height:var(--lh-relaxed)}
.page-game .example{margin-top:var(--sp-5);background:none;border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-4) var(--sp-6);font-size:var(--fs-35);font-family:inherit;color:var(--accent-ink);min-height:var(--tap-sm);cursor:pointer}

/* ── 결과 ─────────────────────────────────────────────────────────────── */
.page-game .result{background:var(--accent-tint);border:1px solid var(--accent-line);border-radius:var(--r-2xl);padding:var(--sp-8) var(--sp-7)}
.page-game .result>h2{font-size:var(--fs-70);font-weight:var(--fw-bold)}
.page-game .result .summary-row{font-size:var(--fs-45);font-weight:var(--fw-bold);margin-top:var(--sp-6);line-height:var(--lh-snug)}
.page-game .result .all-unknown{font-size:var(--fs-40);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}
.page-game .result .standing{font-size:var(--fs-30);color:var(--muted);margin-top:var(--sp-8);padding-top:var(--sp-6);border-top:1px solid var(--accent-line);line-height:var(--lh-relaxed)}
.page-game .axis{background:var(--surface);border:1px solid var(--accent-line);border-radius:var(--r-lg);padding:var(--sp-7);margin-top:var(--sp-6)}
.page-game .axis h3{font-size:var(--fs-55);font-weight:var(--fw-bold);line-height:var(--lh-snug)}
.page-game .axis-body{font-size:var(--fs-40);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}
.page-game .axis-say{font-size:var(--fs-40);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}
.page-game .say-label{font-size:var(--fs-20);color:var(--muted);display:block}
.page-game .evidence{margin-top:var(--sp-7);padding-top:var(--sp-6);border-top:1px solid var(--line)}
.page-game .evidence h4{font-size:var(--fs-30);font-weight:var(--fw-bold);margin-top:var(--sp-6)}
.page-game .evidence h4:first-child{margin-top:0}
.page-game .evidence .counts{font-size:var(--fs-30);color:var(--muted);margin-top:var(--sp-3);line-height:var(--lh-relaxed)}
.page-game .evidence .flag{font-size:var(--fs-30);margin-top:var(--sp-4);line-height:var(--lh-relaxed)}
.page-game .evidence dt{font-size:var(--fs-25);color:var(--muted);margin-top:var(--sp-5);line-height:var(--lh-snug)}
.page-game .evidence dd{font-size:var(--fs-35);margin:var(--sp-2) 0 0;line-height:var(--lh-snug)}

/* 이름 게임 결과 카드 */
.page-game .big-letter{font-size:var(--fs-99);line-height:var(--lh-none);font-weight:var(--fw-heavy);color:var(--accent-ink)}
.page-game .big-value{font-size:var(--fs-95);line-height:var(--lh-none);font-weight:var(--fw-heavy);color:var(--accent-ink);font-variant-numeric:tabular-nums}
.page-game .result .headline{font-size:var(--fs-65);font-weight:var(--fw-bold);margin-top:var(--sp-5)}
.page-game .result .body{font-size:var(--fs-40);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}
.page-game .result .aside{font-size:var(--fs-30);color:var(--muted);margin-top:var(--sp-5);line-height:var(--lh-relaxed)}

/* ── 계산 과정 ────────────────────────────────────────────────────────── */
.page-game .calc{margin-top:var(--sp-8)}
.page-game .calc h3{font-size:var(--fs-55);font-weight:var(--fw-bold)}
.page-game .calc h4{font-size:var(--fs-35);font-weight:var(--fw-bold);margin-top:var(--sp-7)}
.page-game .calc p,.page-game .calc li{font-size:var(--fs-35);line-height:var(--lh-relaxed)}
.page-game .calc .mono{font-family:var(--font-mono);font-size:var(--fs-35);overflow-wrap:anywhere;line-height:var(--lh-relaxed)}
.page-game .tablescroll{overflow-x:auto;margin-top:var(--sp-5)}
.page-game table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
.page-game th,.page-game td{border:1px solid var(--line);padding:var(--sp-3) var(--sp-5);font-size:var(--fs-30);text-align:left;vertical-align:top}
.page-game th{background:var(--surface-sunk);font-weight:var(--fw-bold);white-space:nowrap}
.page-game .rows{margin-top:var(--sp-5);display:grid;gap:var(--sp-4)}
.page-game .rowline{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-5);align-items:baseline}
.page-game .rowline .rowname{font-size:var(--fs-25);color:var(--muted);white-space:nowrap}
.page-game .rowline .rowval{font-family:var(--font-mono);font-size:var(--fs-35);overflow-wrap:anywhere;line-height:var(--lh-relaxed)}

/* ── 동작 버튼 ────────────────────────────────────────────────────────── */
.page-game .acts{display:flex;flex-wrap:wrap;gap:var(--sp-4)}
.page-game .acts button,.page-game .acts a{flex:1 1 auto;min-width:0;text-align:center;padding:11px var(--sp-6);border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);font-size:var(--fs-35);min-height:var(--tap);font-family:inherit;color:inherit;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.page-game .linkout{font-family:var(--font-mono);overflow-wrap:anywhere;margin-top:var(--sp-4)}
.page-game #copySay{margin-top:var(--sp-5)}

/* ── 푸터 ─────────────────────────────────────────────────────────────── */
.page-game footer{font-size:var(--fs-20);color:var(--muted);border-top:1px solid var(--line);padding-top:var(--sp-6);margin-top:var(--sp-11);line-height:var(--lh-relaxed)}
.page-game footer nav a{color:var(--muted);text-decoration:none}