/* 페이지 기본 스타일. 기존 style 위치에서 읽어 우선순위를 유지한다. */
:root {

      --text:var(--ink);
      /* #71727F 는 canvas(var(--canvas)) 위 4.33:1 로 AA 미달 → 디자인 시스템 muted 값 */
      --text-soft:var(--ink-2);
      --line-soft:var(--rule);
      --line-mid:var(--rule);
      --identity:var(--ink);
      --identity-wash: var(--selected-fill);
      --action-deep:var(--ink);
      --r-sm: var(--r-inset);
      --r-md: var(--radius-md);

      --font-sans:var(--font);
      --font-mono:var(--font);
      --font-serif:var(--font);
      --type-h1: var(--fs-h1);
      --type-body-l: var(--fs-lead);
      --type-body: var(--fs-body);
      --type-label: var(--fs-caption);
      --type-meta: var(--fs-caption);
    }
    [data-theme="dark"] {
      /* --action-deep(호버)가 밝아지는데 --action-text 가 흰색이라 호버가 약 2:1 이었다 → 홈과 같은 램프 */
    }
    * { box-sizing: border-box; }
    body {
      margin: 0;
      font-family: var(--font);
      background: var(--canvas);
      color: var(--text);
      line-height: 1.6;
    }
    .wrap {
      width: min(var(--page-max), calc(100% - 2 * var(--page-gutter)));
      margin: 0 auto;
      padding: var(--space-7) 0 var(--space-8);
    }
    .top {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: var(--space-3);
      margin-bottom: var(--space-5);
    }
    .back {
      color: var(--ink);
      text-decoration: none;
      font-size: var(--fs-body);
    }
    h1 {
      margin: 0 0 var(--space-2);
      font-family: var(--font);
      font-size: var(--type-h1);
      line-height: 1.12;
      letter-spacing: -0.02em;
    }
    .desc {
      margin: 0 0 var(--space-6);
      color: var(--ink);
      font-size: var(--type-body-l);
      line-height: 1.75;
    }
    .card {
      padding: var(--space-5);
    }
    .alert {
      display: none;
      position: relative;
      margin-bottom: var(--space-4);
      padding: var(--space-4) var(--space-4) var(--space-4) var(--space-5);
      border: 1px solid var(--line-soft);
      border-radius: 0 var(--r-md) var(--r-md) 0;
      background: var(--glass);
      box-shadow: none;
      overflow: hidden;
      grid-template-columns: 1fr auto;
      gap: var(--space-4);
      align-items: start;
    }
    .alert::before {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 8px;
      background: var(--line-mid);
    }
    .alert-body {
      display: grid;
      gap: var(--space-1);
      min-width: 0;
    }
    .alert-body b {
      color: var(--text);
      font-size: var(--type-body);
      font-weight: 600;
      letter-spacing: -0.005em;
    }
    .alert-body span {
      color: var(--ink);
      font-size: var(--type-body);
      line-height: 1.55;
      word-break: keep-all;
    }
    .alert-meta {
      font-family: var(--font);
      font-size: var(--fs-small);
      font-weight: 600;
      letter-spacing: 0.14em;
      padding-top: var(--space-1);
    }
    .a-success::before { background: var(--ok); }
    .a-success .alert-meta { color: var(--ok); }
    .a-success .alert-body span { color: color-mix(in srgb, var(--ok) 76%, var(--ink)); }
    .a-danger {
      background: color-mix(in srgb, var(--bad) 12%, var(--glass));
    }
    .a-danger::before { background: var(--bad); }
    .a-danger .alert-meta,
    .a-danger .alert-body b { color: var(--bad); }
    .row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: var(--space-3);
    }
    .field {
      margin-bottom: var(--space-3);
    }
    label {
      display: block;
      margin-bottom: var(--space-2);
      font-size: var(--type-label);
      font-weight: 600;
      color: var(--ink);
    }
    input, select, textarea {
      width: 100%;
      max-width: 100%;
    }
    /* placeholder 를 지정하지 않으면 브라우저 기본 #757575 가 쓰여
       라이트 4.19:1 · 다크 3.72:1 로 양쪽 다 AA 미달이었다.
       (입력칸 배경은 shared.css 가 --canvas 로 덮으므로 그 위에서 계산) */
    input::placeholder, textarea::placeholder { color: var(--text-soft); opacity: 1; }
    input:focus, select:focus, textarea:focus {
      outline: none;
      border-color: var(--identity);
      box-shadow: 0 0 0 3px var(--identity-wash);
    }
    textarea { min-height: 160px; resize: vertical; }
    .hidden { display: none; }
    .submit {
      margin-top: var(--space-2);
      width: 100%;
      cursor: pointer;
    }
    .hint {
      margin-top: var(--space-2);
      color: var(--text-soft);
      font-size: var(--type-meta);
    }
    .count {
      margin-top: var(--space-2);
      color: var(--text-soft);
      font-size: var(--type-meta);
      font-family: var(--font);
      text-align: right;
    }
    .notice {
      margin-top: var(--space-3);
      color: var(--ink);
      font-size: var(--fs-small);
      line-height: 1.6;
    }
    .req {
      color: var(--bad);
      font-weight: 600;
      margin-left: var(--space-1);
    }
    @media (max-width: 680px) {
      .row { grid-template-columns: 1fr; }
      .card { padding: var(--space-4); }
    }

  /* ── [design.4 · point-overlay] 아쿠아마린 포인트 전역 배선 ──────────
     링크·현재 위치 인디케이터·텍스트 링크에 포인트를 앉힌다. 주 CTA(근흑)와
     페이지 고유 스타일(특이도 높은 규칙)은 그대로 이긴다. */
.text-link, a.more, .link-arrow, .ilink { color:var(--ink); }
  .text-link:hover, a.more:hover, .link-arrow:hover, .ilink:hover { color:var(--ink); }
  main p > a:not(.btn):not([class*="btn"]), main li > a:not(.btn):not([class*="btn"]),
  article p > a:not(.btn):not([class*="btn"]), .prose a:not(.btn) { color:var(--ink); text-underline-offset:3px; }
  main p > a:not(.btn):hover, main li > a:not(.btn):hover, article p > a:not(.btn):hover { color:var(--ink); }

    /* Turnstile 의 iframe 은 닫힌 shadow root 안이라 :has(iframe) 이 맞지 않는다 — 아무것도 그리지 않았을 때만 숨긴다 */
    .contact-challenge:has(> #contactChallenge:empty){display:none}
