/* 가독성 · 버튼 동적 효과 · 수동 포지션 진입 디자인 (2026-10-08) — theme-v1.css · layout-v1.css 뒤에 읽힌다.
   원본 번들(index-*.js)은 인라인 스타일이 많아 전역 효과는 transform·shadow·filter 로만 준다(색은 건드리지 않는다).
   수동 포지션 진입(🎯)의 버튼은 Work/patch-manual-v1.mjs 가 아래 me-* 클래스로 바꿔 단다. */

/* ── 전체 가독성 ── */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
.card{transition:box-shadow .2s ease,border-color .2s ease}
.card:hover{box-shadow:0 6px 22px rgba(0,0,0,.18)}
:root[data-theme="light"] .card:hover{box-shadow:0 6px 22px rgba(15,23,42,.10)}

/* ── 버튼 공통 효과 — 올리면 살짝 떠오르고, 누르면 눌린다 ── */
button,.btn,.btn-sm,a.btn{transition:transform .12s ease,box-shadow .18s ease,filter .18s ease,background-color .18s ease,border-color .18s ease,color .18s ease}
button:not(:disabled):hover,a.btn:hover{transform:translateY(-1px);filter:brightness(1.07);box-shadow:0 4px 12px rgba(0,0,0,.22)}
button:not(:disabled):active,a.btn:active{transform:translateY(0) scale(.97);filter:brightness(.96);box-shadow:none}
button:focus-visible,a.btn:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
button:disabled{cursor:not-allowed}
.theme-tog:hover,.theme-tog:active{transform:none!important;box-shadow:none!important;filter:none!important}

/* ── 🎯 수동 포지션 진입 ── */
.me-lbl{font-size:11px;font-weight:800;color:var(--text);margin-bottom:5px;text-align:center;letter-spacing:.3px}
.me-seg{display:inline-flex;gap:6px;padding:4px;border-radius:11px;background:var(--bg3);border:1px solid var(--border)}
.me-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:8px;border:2px solid transparent;
  background:transparent;font-weight:800;font-size:12.5px;letter-spacing:.2px;cursor:pointer;white-space:nowrap}
.me-long{color:#4d8df7;border-color:rgba(77,141,247,.35)}
.me-long.on{background:linear-gradient(180deg,#3d7ff0,#2a62d4);border-color:#2a62d4;color:#fff;box-shadow:0 4px 14px rgba(47,111,219,.45)}
.me-short{color:#ff5a55;border-color:rgba(229,57,53,.40)}
.me-short.on{background:linear-gradient(180deg,#ff4d4a,#d62f2c);border-color:#d62f2c;color:#fff;box-shadow:0 4px 14px rgba(229,57,53,.45)}
.me-single{color:#00b8d4;border-color:rgba(0,184,212,.35)}
.me-single.on{background:linear-gradient(180deg,#2be3ff,#00b8d4);border-color:#00b8d4;color:#03242b;box-shadow:0 4px 14px rgba(0,184,212,.40)}
.me-dual{color:#ff8a80;border-color:rgba(255,138,128,.40)}
.me-dual.on{background:linear-gradient(180deg,#ffc9c4,#ff9e96);border-color:#ff8a80;color:#5a1210;box-shadow:0 4px 14px rgba(255,138,128,.40)}
.me-ico{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;font-size:11px;line-height:1;background:rgba(255,255,255,.25)}
.me-act{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:8px;border:2px solid;background:var(--bg2);
  font-weight:800;font-size:12.5px;cursor:pointer;white-space:nowrap}
.me-ana{border-color:#4d8df7;color:#4d8df7}
.me-chart{border-color:#5c7cfa;color:#5c7cfa}
.me-go{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:180px;padding:11px 22px;border:none;border-radius:9px;
  font-weight:900;font-size:14px;letter-spacing:.3px;color:#fff;cursor:pointer;white-space:nowrap}
.me-go.long{background:linear-gradient(180deg,#3d7ff0,#2059c9);box-shadow:0 6px 18px rgba(47,111,219,.45)}
.me-go.short{background:linear-gradient(180deg,#ff4d4a,#cc2724);box-shadow:0 6px 18px rgba(229,57,53,.45)}
.me-go.dual{background:linear-gradient(90deg,#2f6fdb,#7c4dff 50%,#e53935);box-shadow:0 6px 18px rgba(124,77,255,.40)}
.me-go:disabled{opacity:.45;box-shadow:none}
.me-go.ready{animation:mePulse 1.8s ease-in-out infinite}
@keyframes mePulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.15)}}
.me-dirtag{font-size:12.5px;font-weight:800;margin-top:6px;letter-spacing:.2px}
.me-dirtag.long{color:#4d8df7}
.me-dirtag.short{color:#ff5252}
.me-dirtag.dual{color:#9b7bff}

/* 움직임 줄이기를 켠 기기에서는 효과를 끈다 */
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  button:hover,a.btn:hover{transform:none!important}
}
