/* 바이어핀 색 — 시안 3번(다크 + 형광 라임) 확정, 라이트/다크 두 모드 (2026-10-07 17:41 대표님).
   html[data-mode] 는 <head> 의 MODE_JS 가 정한다(기억값 → 기기 설정 → 다크). 색은 토큰만 바꾼다.
   라이트에선 라임 글자가 안 읽혀서 라임은 버튼 바탕·막대에만, 글자 강조·링크는 짙은 초록(--brand, 흰 바탕 대비 6:1 이상). */
html[data-mode="dark"]{
  color-scheme:dark;
  --ink:#EDEEF0; --ink2:#B4B8BF; --mute:#8A8F98; --line:#26282D; --line2:#1B1D21;
  --bg:#08090A; --card:#111214; --head:#16181B; --field:#0C0D0F;
  --side:#0B0C0E; --side2:#17181B; --side-ink:#A3A7AE; --side-hi:#fff; --side-mute:#686C73; --side-deep:#1E2024; --nav-on:#1C1E22; --nav-on-ink:#fff;
  --brand:#C6F432; --brand2:#C6F432; --brand-soft:rgba(198,244,50,.12); --brand-dk:#B2DE22; --on-brand:#0A0A0A;
  --lime:#C6F432; --lime-dk:#B2DE22; --on-lime:#0A0A0A;
  --pin:#C6F432; --pin-soft:rgba(198,244,50,.12); --on-pin:#0A0A0A; --logo:#C6F432; --logo-ink:#0A0A0A; --hl:#3A3A10;
  --amber:#F5B83D; --amber-soft:rgba(245,184,61,.12); --blue:#7AA7FF; --blue-soft:rgba(122,167,255,.12);
  --red:#FF6B62; --red-soft:rgba(255,107,98,.12); --violet:#A894FF; --violet-soft:rgba(168,148,255,.12);
  --r:14px; --shadow:0 0 0 1px rgba(255,255,255,.02);
}
html[data-mode="light"]{
  color-scheme:light;
  --ink:#0B0C0E; --ink2:#3C4048; --mute:#666B74; --line:#E3E5E0; --line2:#F0F1EC;
  --bg:#F5F6F2; --card:#fff; --head:#FAFAF7; --field:#fff;
  --side:#fff; --side2:#F0F1EC; --side-ink:#3C4048; --side-hi:#0B0C0E; --side-mute:#81868E; --side-deep:#E3E5E0; --nav-on:#0B0C0E; --nav-on-ink:#fff;
  --brand:#2F6B00; --brand2:#B5E21C; --brand-soft:#EEF8D2; --brand-dk:#245200; --on-brand:#fff;
  --lime:#C6F432; --lime-dk:#B5E21C; --on-lime:#0A0A0A;
  --pin:#C6F432; --pin-soft:#F3FBD8; --on-pin:#0A0A0A; --logo:#0B0C0E; --logo-ink:#C6F432; --hl:#F3FFB8;
  --amber:#A86A00; --amber-soft:#FFF4DA; --blue:#2457C5; --blue-soft:#EAF0FD;
  --red:#C5322B; --red-soft:#FDECEB; --violet:#5B45C2; --violet-soft:#F0EDFC;
  --r:14px; --shadow:0 1px 2px rgba(11,12,14,.04),0 4px 14px rgba(11,12,14,.04);
}
/* 두 모드 공통 — 라임 버튼은 검정 글자 */
html[data-mode] .btn.pri,html[data-mode] .btn.hot{background:var(--lime);color:var(--on-lime)}
html[data-mode] .btn.pri:hover,html[data-mode] .btn.hot:hover{background:var(--lime-dk)}
html[data-mode] .side{border-right:1px solid var(--line)}
html[data-mode] .nav a.on svg{color:var(--lime)}
html[data-mode] .av.me1{background:var(--brand-soft);color:var(--brand)}
html[data-mode] .beta{background:var(--brand-soft);color:var(--brand)}
html[data-mode] .meter i{background:var(--lime)}
html[data-mode] .dot-on{background:var(--lime);box-shadow:0 0 0 4px var(--pin-soft)}
html[data-mode] .sw input:checked+i{background:var(--lime)}html[data-mode] .sw input:checked+i::after{background:#0A0A0A}
html[data-mode] .steps3 a.done b,html[data-mode] .iflow>li>b{background:var(--lime);color:var(--on-lime)}
html[data-mode] .fchips .chip.on{background:var(--ink);border-color:var(--ink);color:var(--bg)}
html[data-mode] dialog{background:var(--card);color:var(--ink)}
html[data-mode] .seg2 button.on{background:var(--card)}
/* 다크 전용 */
html[data-mode="dark"] .tbl tr.bad td{background:rgba(255,107,98,.08);color:#FFB3AD}
html[data-mode="dark"] .spam.lo,html[data-mode="dark"] .spam.mid,html[data-mode="dark"] .spam.hi,html[data-mode="dark"] .danger,html[data-mode="dark"] .red-b{border-color:var(--line)!important}
html[data-mode="dark"] .sheetpic th,html[data-mode="dark"] .sheetpic td{border-color:var(--line)}
html[data-mode="dark"] .sheetpic .em{color:#111}
html[data-mode="dark"] .warn,html[data-mode="dark"] .warn2{border-color:transparent}
/* 메일 본문 편집기·서명·미리보기는 실제 메일처럼 늘 흰 바탕 (bp.css 에서 #fff 고정) — 편집 글자도 검정 */
html[data-mode] .area{color:#222}
/* 해/달 전환 버튼 */
.modebtn{width:36px;height:36px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);display:inline-grid;place-items:center;cursor:pointer;flex:none}
.modebtn:hover{border-color:var(--ink2)}
.modebtn svg{display:none}
html[data-mode="dark"] .modebtn .m-sun,html[data-mode="light"] .modebtn .m-moon{display:block}
.top .modebtn{margin-left:auto}.top .modebtn+.beta{margin-left:0}
.auth{position:relative}.auth>.modebtn,.mode-fixed{position:fixed;top:14px;right:16px;z-index:20}
