/*  바탕 테마 — 나오크린 (NaOClean)
 *  ─────────────────────────────────────────────────────────────────
 *  (주)디엔디전자의 살균수(차아염소산수) 브랜드. 소금·물·전기로 만든다.
 *
 *  ★ 브랜드 「나오크린」의 임자는 «(주)디엔디전자 하나»다
 *    (2026-09-07 폐하께서 확인하시고 CLAUDE.md 에 못박으심).
 *
 *  ★ 얹는 차례:  themes/naoclean.css  →  base.css  →  프로젝트 제 파일
 *    테마가 «먼저»다. 뒤엣것이 이기므로 프로젝트는 여기 값을 언제든 덮는다.
 *
 *  ══ 값을 어디서 가져왔나 — 하나도 지어내지 않았다 ══════════════════
 *
 *  ★★ 2026-09-04 «저녁»에 폐하께서 «원본»을 주셨다. 그 픽셀을 세어 잡았다.
 *     identity/원본/로고모음/NAOCLEAN-LOGO(RGB).png  (2418×387, 배경 «투명»)
 *
 *        #005baa   317,159px   「NaOC」 — 파랗게 씌어 있는 넉 자
 *        #6d6e71   101,861px   「lean」 + ® — 회색으로 씌어 있는 넉 자
 *        #ed1c24     3,668px   O 위의 붉은 물방울
 *
 *     ★ 그래서 이름을 로고에서 따왔다 — --naoc · --lean · --drop.
 *       누구든 «로고를 보고» 이 이름이 맞는지 확인할 수 있다.
 *       뜻이 흐려지는 --blue-700 같은 이름으로 바꾸지 않는다.
 *
 *  ★★★ 이 붉음이 «어미 회사의 붉음»이다 — 디엔디전자 CI 의 #ed1c24 와 거리 «0».
 *      우연이 아니다. 이 값을 고치면 그 이음이 끊어진다. themes/dnd.css 를 보라.
 *
 *  ══ 앞서 적었다가 «틀린 것»으로 드러난 것 — 지우지 않고 남긴다 ═══════
 *
 *  ★★ 2026-09-04 «낮»에는 `Jade/SeosLegacy/img/naoclean-logo.png`(1200×198)로
 *     쟀고, 값이 #015aaa · #6c6d70 · #ee1d23 이었다. 지금 값과 채널마다 1~2 다르다.
 *     그것은 한 번 눌렸다 펴진 «사본»이었다.
 *
 *  ★★★ 더 나쁜 것은 그때 **「로고 배경이 불투명 흰색이라 어두운 판에 못 올린다」**
 *      고 적은 것이다. 그 사본이 그랬을 뿐, **원본은 투명하다**(비침 512,948px).
 *      ⇒ 「내가 가진 것의 성질」을 「그 물건의 성질」로 적으면 이렇게 된다.
 *        가진 것이 원본인지 «먼저» 묻는다. identity/나오크린.md 에 남겼다.
 *
 *  ★ 글꼴도 재었다 (dev-www/site/html/_skin/css/style.css)
 *        본문  Noto Sans KR   (html { font-family })
 *        제목  GmarketSans    (15곳 — 제목·숫자에 쓰고 있었다)
 *
 *  ★★★ 옛 사이트에서 «안 가져온 것»이 하나 있다 —
 *      @media (max-width: 767px) { html { font-size: 75% } }
 *      폰에서 뿌리 글자를 16px → 12px 로 줄이고 있었다. 가장 읽기 어려운
 *      자리에서 가장 작아진다. 옮기지 않았고, 되살리지 않기를 청한다.
 *
 *  ══ 대비는 다 재었다 (preview/solo/color-lab-naoclean2.html) ═══════
 *     흰 글씨가 올라가는 면 일곱, 바탕 위 글자 여덟, 알림 넷 — 아래에 값을 적었다.
 */

:root {
    /* ══ 소금 · 물 · 전기 ══════════════════════════════════════════
       ★ 로고 파랑의 색조(208)와 채도(100%)를 «그대로 두고» 밝기만 옮긴 층이다.
         그래서 층 어디를 집어도 로고와 같은 파랑으로 보인다.
       ★★ --naoc 가 정확히 로고 원색이다(밝기 33%). 우연이 아니라, 로고 색이
          이미 「흰 글씨가 올라갈 수 있는」 자리(대비 6.83)에 서 있었다.
       ★★★ --naoc 만은 «계산값이 아니라 원본 값 그대로»다. 층 셈으로는 #005aa8 이
          나오는데 1 이 어긋난다. **로고 색은 반올림하지 않는다.** */
    --brine: #002c52;   /* 16%  소금물이 가라앉은 자리. 흰글씨 14.17 */
    --cell: #00396b;   /* 21%  전해조.                 흰글씨 11.68 */
    --anode: #00498a;   /* 27%  양극.                   흰글씨  9.05 */
    --naoc: #005baa;   /* 33%  ★로고 원색 그대로.      흰글씨  6.83 */
    --spark: #0075db;   /* 43%  전기가 튀는 자리.       흰글씨  4.60 — 겨우 넘는다 */
    --sky: #3da5ff;   /* 62%  밝은 쪽. 어두운 판의 강조로 쓴다 */
    --foam: #c2e2ff;   /* 88%  강조를 «면»으로 옅게 깔 때 */
    --mist: #e5f3ff;   /* 95%  얹었을 때 아주 옅게 */

    /* 로고의 회색 넉 자. 흰 바탕 위 5.10 — 본문으로도 쓸 수 있다 */
    --lean: #6d6e71;

    /*  ★★ 붉은 물방울. 로고에서 894px «뿐»이다 — 그만큼만 쓰라는 뜻이다.
     *  ★★★ 이것은 «경고»가 아니라 «점»이다. --danger 와 섞지 마십시오.
     *      섞으면 로고의 물방울이 「무언가 잘못됐다」로 읽힌다.
     *  ★ 흰 바탕 위 4.38 — 본문 기준(4.5)에 «못 미친다». 글자로 쓰지 마십시오.
     *    면·점·밑줄로만 쓴다. 글자가 필요하면 --drop-ink 를 쓴다.
     *  ★★★ 이 값은 «어미 회사 CI 의 붉음»과 같다(거리 0). 함부로 옮기지 않는다. */
    --drop: #ed1c24;
    --drop-ink: #bd0f15;   /* 흰 바탕 위 6.48. 글자로 쓸 때는 이것 */

    /* ── 중성 — 파란 기가 아주 조금 섞인 회색 ── */
    --ink: #101d29;        /* 흰 바탕 17.08 */
    --ink-soft: #31414f;   /* 10.50 */
    --muted: #5f6c78;      /*  5.38 */
    /*  ★ --faint 를 «가람보다 진하게» 잡았다. 가람은 2.53 인데 여기는 4.52 다.
     *  까닭 — base.css 의 .field .hint 가 이 이름을 딛는다. 가람은 사내 시스템이라
     *  폐하께서 「옅은 결을 그대로 두라」 하셨지만, 나오크린은 «밖에서 처음 오는
     *  사람»이 보는 화면이다. 도움말이 안 읽히면 그 사람은 되물을 데가 없다.
     *  ★ 되돌리시려면 이 한 줄만 #93a0ab 로 바꾸면 가람과 같은 결이 된다. */
    --faint: #6b7884;

    --bg: #f2f6fa;
    --surface: #ffffff;
    /*  ★ 흰 판 «위»에 올라앉는 옅은 면. 기본 알약(.badge)과 .notice 가 이것을 딛는다.
     *  ★★ 처음에 #f7fafd 로 잡았다가 «띄워 보고» 내렸다 — 흰 카드 위에서 알약이
     *     거의 안 보였다. 가람(#f5f9fc)·오이북도 같은 자리에 서 있으니 이것은
     *     나오크린만의 흠이 아니다. 다만 여기는 «밖에서 오는 사람»이 보는 화면이라
     *     반 걸음 내렸다. 다른 브랜드를 따라 되돌리시려면 #f7fafd 로 올리면 된다. */
    --surface-2: #eaf1f8;
    --border: #dae3ec;         /* 흰 면 위 1.30 — 가람(1.32)과 같은 결 */
    --border-strong: #bfcdda;  /* 1.62 */

    /* ── 강조 — 부품이 딛는 자리 ──
       ★ base.css 는 --naoc 를 «직접» 부르지 않는다. 부품은 --accent 계열만 딛는다. */
    --accent: var(--naoc);
    --accent-2: var(--spark);      /* 단추 기울기의 끝 색 */
    --accent-deep: var(--anode);   /* 링크처럼 «글자»로 쓰는 강조. 흰 바탕 8.76 */
    --accent-hover: var(--cell);
    --accent-ink: var(--cell);     /* 강조 계열에서 가장 진한 글자 */
    --accent-soft: var(--foam);
    --accent-mist: var(--mist);
    --on-accent: #ffffff;          /* --accent 위 6.90 */
    --on-danger: #ffffff;          /* --danger 위 5.95 */

    /* ── 의미 색 ──
       ★ --danger 를 로고의 붉음(#ee1d23)에서 «떼어» 잡았다. 같은 값을 쓰면
         브랜드의 점과 오류 표시가 한 색이 되어, 로고를 볼 때마다 경고로 읽힌다.
         색조는 이웃에 두어 팔레트가 갈라지지는 않게 했다. */
    --good: #16805f;    /* 흰글씨 4.90 */
    --warn: #96680b;    /* 흰글씨 4.90 */
    --danger: #c22026;  /* 흰글씨 5.95 */

    --good-soft: #dcefe8;
    --good-line: #b3d9c9;
    --good-ink: #0f5a42;   /* --good-soft 위 6.85 */

    --warn-soft: #f7ecd8;
    --warn-line: #e9dabb;
    --warn-ink: #7d5709;   /* --warn-soft 위 5.54 */

    --danger-soft: #fdeceb;
    --danger-line: #f3c9c7;
    --danger-ink: #9b1a1f; /* --danger-soft 위 7.17 */

    /*  ★ 「알림」 넷 가운데 정보(info)만 새 이름이 없다 — 이미 있는 것으로 된다.
     *    --anode on --foam 을 재니 6.51 이다. 필요하지 않은 이름은 만들지 않는다. */
    --info-soft: var(--foam);
    --info-line: var(--border-strong);
    --info-ink: var(--anode);

    /* ── 글씨 ──
       ★ 둘 다 옛 사이트에서 «재어» 옮긴 것이다. 지어내지 않았다.
       ★★ --display 는 base.css 가 «안 부른다». 제목에 쓰려면 프로젝트가 부른다.
          이름을 하나 더 두는 까닭은 이 브랜드가 실제로 글꼴을 «둘» 쓰기 때문이다 —
          제목은 지마켓산스, 본문은 노토산스. 그것이 이 브랜드의 목소리다. */
    --sans: "Noto Sans KR", "Malgun Gothic", "맑은 고딕", -apple-system, sans-serif;
    --display: "GmarketSans", "Noto Sans KR", "Malgun Gothic", sans-serif;
    --mono: Consolas, "D2Coding", monospace;

    /* ── 그림자 — 로고 파랑을 눕혀 만든다. 검정 그늘은 색이 죽는다 ── */
    --shadow: 0 1px 2px rgba(1, 75, 142, .05), 0 10px 26px -16px rgba(1, 75, 142, .22);
    --shadow-lift: 0 2px 4px rgba(1, 75, 142, .06), 0 16px 34px -18px rgba(1, 75, 142, .28);
    --shadow-accent: 0 6px 16px -8px rgba(1, 90, 170, .9);
    --shadow-accent-lift: 0 8px 20px -8px rgba(1, 90, 170, 1);
    --ring: rgba(1, 118, 223, .24);

    /* ── 크기 ──
       ★★ 여기는 «가람 것을 빌려 왔다». 나오크린 화면을 아직 안 지었으므로
          잴 것이 없었다. 지어내는 것보다 이미 서 있는 것을 빌리는 편이 낫다.
       ★ 다만 «밖에서 오는 사람»이 보는 화면이라 가람보다 반 걸음 크게 잡았다 —
         가람 14px / 여기 15px. 사무실 조밀한 판과 제품 소개 화면은 몸집이 다르다.
       ★★★ 나오크린 화면을 짓기 시작하면 «그때 재어» 이 칸을 다시 잡는다.
            지금 값은 「빌린 것」이라 적어 둔다. */
    --radius: 10px;
    --radius-sm: 7px;
    --radius-round: 999px;  /* ★완전히 둥근 것(알약·동그란 단추).
                               다섯 프로젝트가 제각기 999px 를 박고 있었다 —
                               가람 20 · 오이북 22 · 콘솔 4 · 서가유산 2 · 바탕 1
                               (2026-09-07 재어 확인). 값은 안 바뀐다 */
    /* ── ★몸글 층계 — v3.37 에서 섰다 ────────────────────────────
       ★이 위의 글자 크기 이름 열은 «전부 부품 이름»이다(ctl · link · field ·
         label · hint · alert · notice · badge). ★몸글 층계는 «없었다».
       그래서 목록·표·설명글을 적는 쪽이 ★부품 이름을 빌려 쓰거나 px 를 박았다 —
         2026-09-18 살림님 13.5px · 2026-09-19 아람님 12.5px(--ctl-font-sm 을 빌리심) ·
         ★오이북은 «위쪽»을 스스로 지어 채웠다(--font · --font-lead · --font-card).
       ⇒ ★두 집이 같은 빈자리를 양쪽에서 메우고 있었다. 둘째가 서서 올린다.

       ★--text-sm 으로 짓지 «않았다» — --text 는 이 집에서 «색 이름»이다
         (asgard · seoslegacy). 2026-09-18 에 아람님이 바로 그 이름에 걸리셨다.
       ★값은 지어내지 않고 «이 테마가 이미 쓰던 층계»에서 골랐다. 뿌리는 16px. */
    --body-font: 1rem;          /* 몸글. ★뿌리가 정한다 — 지금 서 있는 그 크기다 */
    --body-font-sm: .875rem;  /* 14px · 목록 줄·표 칸처럼 «촘촘한» 글 */
    --body-font-xs: .8125rem;  /* 13px · 곁들이는 글. ★이보다 작게 가지 않는다 */

    --ctl-font: .9375rem;  /* 15px */
    --ctl-font-sm: .8125rem;  /* 13px */
    --link-font: .875rem;  /* 14px */
    --link-pad: .25rem .375rem;  /* 4px 6px */
    --ctl-pad: .625rem 1.125rem;  /* 10px 18px */
    --ctl-pad-sm: .375rem .6875rem;  /* 6px 11px */
    --ctl-pad-block: .75rem 1.125rem;  /* 12px 18px */
    --field-pad: .6875rem .8125rem;  /* 11px 13px */
    --field-font: .9375rem;  /* 15px */
    --label-font: .84375rem;  /* 13.5px */
    --hint-font: .78125rem;  /* 12.5px */
    --alert-pad: .75rem .9375rem;  /* 12px 15px */
    --alert-font: .875rem;  /* 14px */

    /* ── 틈 사다리 — 「무엇과 무엇 «사이»」 (2026-09-07 세움) ──────────
       ★ base.css 에 «값으로» 박혀 있던 것을 그대로 옮겼다. --gap-block 이 그랬듯이
         **지금은 한 픽셀도 안 바뀐다.**
       ★★ 왜 있는가 — 바탕 부품 «안»의 틈을 브랜드가 만질 길이 없었다. 가람은 사무실
         판(14px)이고 나오크린은 파는 판(15px)인데, 단추 안 틈은 둘 다 6px 로 같았다.
       ★★★ 그리고 바탕 «자신»이 한 역할에 여섯 값을 쓰고 있었다 — 아이콘과 글자
         사이가 4·5·6·8·9·10px. 아무도 고른 적 없고 쌓인 것이다. 색에서 「파랑이
         마흔 가지가 된다」던 그 병이다. 이 다섯이 그것을 가른 자리다.
     ★ 5px·9px·14px 였던 「사다리 밖」 여섯도 2026-09-07 에 얹었다 —
         폐하께서 띄워서 보시고 「여섯 다 얹으라」 이르셨다. 1~2px 움직였다.
         무엇이 얼마나 움직였는지는 CHANGELOG v3.31 과
         preview/solo/size-ladder-six.html 에 있다. */
    --gap-xs: .25rem;      /* 4px · 알약 안 — 표시와 글자 */
    --gap-sm: .375rem;      /* 6px · 부품 안 — 아이콘과 글자. ★바탕에서 가장 흔하다 */
    --gap: .5rem;         /* 8px · 부품끼리 위아래로 붙을 때 */
    --gap-lg: .625rem;      /* 10px · 큰 부품 안 · 줄 안 항목 사이 */
    --gap-xl: .75rem;      /* 12px · 단추 줄이 갈라설 때 */

    --gap-block: 1rem;  /* 16px */

    --notice-strip: 3px;
    --notice-bg: var(--surface-2);
    --notice-pad: .625rem .75rem;  /* 10px 12px */
    --notice-font: .875rem;  /* 14px */

    --badge-pad: .125rem .5625rem;  /* 2px 9px */
    --badge-font: .75rem;  /* 12px */
    --badge-round: 1.4rem;

    --zone-pad: 1.5rem 1.25rem;  /* 24px 20px */
    --zone-pad-sm: 1rem .75rem;  /* 16px 12px */
    --zone-icon: 1.5rem;  /* 24px */

    /*  ★ 손가락으로 누르는 최소 크기. 제품을 폰으로 보는 사람이 많아 세워 둔다.
     *  가람은 auto(사무실 PC), 오이북은 3rem(조부모). 여기는 그 사이다. */
    --touch: 2.75rem;

    /*  ══ 「우리 색을 못 쓰는 어두운 면」 위 ══════════════════════════
     *  ★ 사진·어두운 브랜드 면 위에는 테마 색을 못 얹는다. 밑에 무엇이 깔릴지
     *    모르거나(사진), 이미 어두운 면이라(머리글·뷰어) 대비가 안 선다.
     *  ★★ 이름을 «새로» 짓지 않았다 — 위의 글자 사다리와 «같은 모양»이다.
     *     --ink / --ink-soft / --muted / --faint 를 어두운 쪽에서 되쓴 것이다.
     *     배울 낱말이 늘지 않고, 「0.45 와 0.5 중 뭘 쓰지」가
     *     「진한 것이냐 옅은 것이냐」로 바뀐다.
     *  ★★★ ★아직 «안 잰» 값이다. 이 브랜드에는 어두운 면이 (거의) 없어 고를 자료가 없었다.
     *     가람·오이북에서 잰 것의 «모양»만 빌렸다. 어두운 면이 생기면 그때 재어 잡는다.
     *  ★ 이것은 «어두운 판(data-theme=dark)»이 아니다. 밝은 판 «안»의 어두운 면
     *    하나(사진 뷰어·어두운 머리글)를 위한 것이라 dark 블록에서 다시 잡지 않는다. */
    --on-dark: #ffffff;                     /* 가장 읽히는 글자 — ★«불투명» 흰색이다 */
    --on-dark-soft: rgba(255, 255, 255, .75);   /* 그다음 */
    --on-dark-muted: rgba(255, 255, 255, .58);   /* 부수적인 것 */
    --on-dark-faint: rgba(255, 255, 255, .42);   /* 거의 안 보여도 되는 것 */
    --on-dark-line: rgba(255, 255, 255, .22);   /* 선 */
    --on-dark-plate: rgba(255, 255, 255, .10);   /* 면 — 단추 바탕 따위 */
}

/*  ══ 이 브랜드가 사는 «빛의 세상» ═══════════════════════════════════
 *  ★ 없으면 폰이 어두운 모드일 때 브라우저가 화면을 통째로 뒤집어 그린다.
 *    색을 아무리 잘 골라도 그 위에서 다시 칠해진다. 네 테마 다 이 줄을 가진다. */
:root { color-scheme: light; }

/*  ══ 어두운 판 — 나오크린 ══════════════════════════════════════════
 *
 *  ★ OS 를 «따라가지 않는다». prefers-color-scheme 을 쓰지 않고 우리가 거는
 *    표(data-theme)로만 켠다. 폐하께서 그렇게 정해 두셨다.
 *  ★★ 그런데 «안 지으면 브라우저가 제멋대로 뒤집는다». 한 벌 주면 대비도
 *     색결도 우리 손에 남는다.
 *
 *  ── 값을 어디서 가져왔나 ──
 *  깊은 쪽(brine · cell)이 이미 밤이다. 강조는 반대로 얕은 쪽(sky)으로 올린다 —
 *  어두운 바탕 위에서 로고 원색(#015aaa)은 대비가 너무 낮아 안 읽힌다.
 *  ★ 그러니 «어두운 판에서는 로고 원색이 강조가 아니다». 그것이 이 판의 규칙이다.
 */
:root[data-theme="dark"] {
    color-scheme: dark;

    --bg: #071726;
    --surface: #0c2135;
    --surface-2: #091b2c;

    --ink: #e6eff7;
    --ink-soft: #b7cadb;
    --muted: #8da3b8;
    --faint: #6c8298;

    --border: rgba(62, 163, 254, .18);
    --border-strong: rgba(62, 163, 254, .34);

    --accent: var(--sky);
    --accent-2: var(--spark);
    --accent-deep: var(--sky);
    --accent-hover: #7cc0ff;
    --accent-ink: var(--sky);
    --accent-soft: rgba(62, 163, 254, .12);
    --accent-mist: rgba(62, 163, 254, .07);
    --on-accent: #05192b;
    --on-danger: #05192b;

    /* ★ 붉은 물방울도 어두운 판에서는 올려야 보인다 */
    --drop: #ff5a5f;
    --drop-ink: #ff8f92;

    --good: #4fcfa4;
    --good-soft: rgba(79, 207, 164, .12);
    --good-line: rgba(79, 207, 164, .28);
    --good-ink: #8ee5c7;

    --warn: #e0b463;
    --warn-soft: rgba(224, 180, 99, .12);
    --warn-line: rgba(224, 180, 99, .28);
    --warn-ink: #efd19b;

    --danger: #ec8580;
    --danger-soft: rgba(236, 133, 128, .12);
    --danger-line: rgba(236, 133, 128, .30);
    --danger-ink: #f6b2ae;

    --info-soft: rgba(62, 163, 254, .12);
    --info-line: rgba(62, 163, 254, .30);
    --info-ink: var(--sky);

    --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 10px 26px -16px rgba(0, 0, 0, .6);
    --shadow-lift: 0 2px 4px rgba(0, 0, 0, .4), 0 16px 34px -18px rgba(0, 0, 0, .7);
    --shadow-accent: 0 6px 18px -10px rgba(62, 163, 254, .55);
    --shadow-accent-lift: 0 8px 24px -10px rgba(62, 163, 254, .75);
    --ring: rgba(62, 163, 254, .32);
}


/* ══ 고르개(select) 화살표 ═══════════════════════════════════════════
 *
 *  ★ 왜 «테마»가 이것을 주나 — base.css 가 고르개를 벗기면 운영체제가
 *    그리던 화살표가 사라져 우리가 그려야 한다. 그런데 그 그림은 배경
 *    그림이라 «별개 문서»여서 currentColor 가 안 든다. 색을 CSS 쪽에서
 *    넣을 길이 아예 없다.
 *
 *  ★★ 그래서 «그림째» 이름으로 준다. base.css 는 var(--select-arrow)
 *    한 줄만 쓰고, 무슨 색인지는 브랜드가 정한다 — 「이름은 base.css,
 *    값과 단위는 테마」라는 이 파일의 결 그대로다.
 *
 *  ★ 값은 이 테마의 --muted 다. 글자보다 여리고 테두리보다 진한 자리다.
 *    ★★고치실 때 «두 곳»을 함께 고치십시오 — 밝은 판과 어두운 판.
 *      한쪽만 고치면 다른 판에서 화살표만 옛 색으로 남는다.
 *      (그림 안에 색이 «문자»로 박혀 있어 var() 로 엮을 수가 없다.)
 *
 *  ★ 2026-09-07 에 폐하께서 판을 보시고 정하셨다. PC(크로미움) ·
 *    안드로이드(갤럭시 A20 · 삼성 인터넷) · 아이폰 셋에서 재었다 —
 *    어느 판에서도 화살표가 글자를 따라온다.
 *    ⇒ 판: preview/solo/select-arrow-test.html
 */
:root {
    --select-arrow:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%235f6c78' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

:root[data-theme="dark"] {
    --select-arrow:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%238da3b8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/*  ── 가로 줄에 서는 «작은» 칸 — base.css 의 .field-row.compact 가 딛는다 ──
 *  아직 쓰는 곳이 없다. 오이북 자와 같은 결로 둔다
 *  ★ 「글자를 두 배로 키우면 이것도 두 배가 되어야 하나」 — 그렇다. 그래서 rem 이다. */
:root {
    --field-h-sm: 2.25rem;
    --field-font-sm: .9rem;
}