/* 걸어가는 늑대들 — 페이지 껍데기 스타일. index.html(한국어)과
en/index.html(영어)이 함께 읽는다. 엔진(scrub-engine.js)이 주입하는
기본값 위에 얹히는 규칙만 여기 둔다. */
:root, .sw-root {
--sw-bg: #F7F3EC;
--sw-ink: #2B2B28;
--sw-ink-soft: #6a6461;
--sw-accent: #2F4BC8;
}
/* Unlayered on purpose — scrub-engine.js injects its own defaults inside
@layer sw, so a plain (unlayered) rule here always wins regardless of
injection order, same trick the engine's own header comment describes
for the --sw-* theme tokens. */
/* Single pill showing the language you'd SWITCH TO (not a KO|EN segmented
control) — a two-segment version measured ~90px and clipped off-screen
next to the hamburger + CTA on a 390px viewport; this is ~40px.
It is an to the other language's URL, not a button: Korean lives at /
and English at /en/, so switching is a navigation, and a real link is what
lets a crawler discover the other page at all. */
.sw-langtoggle {
font: inherit;
text-decoration: none;
display: inline-block;
line-height: 1;
font-size: .78rem;
font-weight: 700;
letter-spacing: .02em;
color: var(--sw-ink);
border: 1px solid color-mix(in srgb, var(--sw-accent) 16%, transparent);
background: color-mix(in srgb, #fff 55%, transparent);
backdrop-filter: blur(10px);
cursor: pointer;
padding: 9px 14px;
border-radius: 999px;
flex: none;
margin-left: 8px;
transition: background .25s;
}
.sw-langtoggle:hover { background: color-mix(in srgb, #fff 75%, transparent); }
@media (max-width: 860px) { .sw-langtoggle { padding: 8px 12px; font-size: .74rem; margin-left: 6px; } }
/* brand + hamburger + CTA already nearly fill a narrow phone's topbar (see
AGENTS.md / the audit note on mobile crowding); let the toggle wrap to
its own line there rather than clip off-screen. Additive only — the
engine's own .sw-topbar rule never sets flex-wrap. */
@media (max-width: 420px) { .sw-topbar { flex-wrap: wrap; row-gap: 8px; } }
/* ---- 카페 메뉴 ------------------------------------------------------------
site-menu.js가 이 섹션을