/* ============================================================
   SOAVIZ Editor Theme — 편집기 4종 공통 디자인 토큰 (2026-07-23)
   editor.html · photo.html · border.html · publish-kit.html이
   각자의 <style> 뒤에 로드하여 토큰 드리프트를 한 값으로 수렴시킨다.
   ─ 이름 별칭 통일: --line=--border · --muted=--dim (양쪽 파일군 호환)
   ─ 레이아웃 폭(--panel-w 등)은 도구별 기능 차이므로 건드리지 않는다
   ─ 소비자는 인라인 토큰 폴백 유지 (이 파일이 없어도 기존 모습 동작)
   ============================================================ */
:root{
  color-scheme:dark;
  --bg:#06050F; --bg-1:#09091A; --bg-elev:#0D0D20;
  --card:rgba(255,255,255,0.032); --card-h:rgba(255,255,255,0.058);
  --border:rgba(255,255,255,0.08); --border-strong:rgba(255,255,255,0.135);
  --line:var(--border); --line-strong:var(--border-strong);
  --text:#F0EFF8; --dim:#B4B2C8; --muted:var(--dim); --faint:#76748C; --whisper:#46455A;
  --accent:#A78BFA; --accent-2:#818CF8; --accent-h:#8B6BF5;
  --accent-soft:rgba(167,139,250,0.13); --accent-glow:rgba(167,139,250,0.30); --accent-line:rgba(167,139,250,0.42);
  --danger:#F87171; --success:#34D399; --warn:#FBBF24;
  --r-xs:6px; --r-sm:9px; --r-md:12px; --r-lg:16px; --r-pill:999px;
  --rail-w:62px;
}

/* ── 공통 크롬 — 4종 동일 질감 ── */
::selection{background:rgba(167,139,250,.30)}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.10);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.16)}
::-webkit-scrollbar-track{background:transparent}
.topbar{background:rgba(9,9,26,.86);border-bottom:1px solid var(--border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
:focus-visible{outline:2px solid var(--accent-line);outline-offset:1px}

/* ── 2단계: 컴포넌트 수렴 — 기존 클래스명을 그대로 두고 시각 언어만 통일 ──
   · 프라이머리 = 브랜드 그라데이션 + 글로우 (editor/photo 기준으로 border/publish 승격)
   · 보조 버튼 = 라운드 --r-sm · 12.5px/700 · dim→hover text (규칙 15: 라운드 스케일 준수)
   · 토스트 = bg-elev + 보더 + 필 라운드 (하드코딩 #1b1b22 제거) · 위치는 도구별 유지 */

/* 보조 버튼 — border/publish 전용 스코프 (editor/photo의 .btn은 바이올렛 패널 버튼이라 제외)
   각 파일 body에 data-swb-tool 마커 필요 */
body[data-swb-tool="poster"] .btn,
body[data-swb-tool="publish"] .btn{border-radius:var(--r-sm);font-size:12.5px;font-weight:700;border:1px solid var(--border);background:var(--card);color:var(--dim);transition:background .14s,color .14s,border-color .14s}
body[data-swb-tool="poster"] .btn:hover,
body[data-swb-tool="publish"] .btn:hover{background:var(--card-h);color:var(--text);border-color:var(--border-strong)}

/* 프라이머리 — 4종 동일 그라데이션 시그니처 */
body[data-swb-tool="poster"] .btn.primary,
body[data-swb-tool="publish"] .btn.primary,
.top-btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0b0a16;border:none;box-shadow:0 4px 16px -4px var(--accent-glow)}
body[data-swb-tool="poster"] .btn.primary:hover,
body[data-swb-tool="publish"] .btn.primary:hover,
.top-btn.primary:hover{filter:brightness(1.08);color:#0b0a16}
body[data-swb-tool="poster"] .btn.primary:disabled,
body[data-swb-tool="publish"] .btn.primary:disabled{filter:none;opacity:.4}

/* 칩 (publish-kit .chip — 라운드 스케일 정렬) */
body[data-swb-tool="publish"] .chip{border-radius:var(--r-sm);border:1px solid var(--border);background:var(--card);color:var(--dim)}
body[data-swb-tool="publish"] .chip:hover{background:var(--card-h);color:var(--text)}
body[data-swb-tool="publish"] .chip.on{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent)}

/* 토스트 — 질감 통일 (위치·표시 로직은 각 파일 유지) */
.toast{background:var(--bg-elev);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--r-pill);font-size:12.5px;font-weight:600;box-shadow:0 12px 40px rgba(0,0,0,.5)}