/* ═══════════════════════════════════════════════════════════════
   my:ME 디자인 시스템 — 근로자 앱 · 파트너 콘솔 · 통합 플랫폼 · 운영 화면이
   같은 토큰과 같은 글꼴을 쓴다. 각 화면이 자기 팔레트를 새로 만들지 않는다.
   Pretendard 는 자체 호스팅(외부 CDN 없음). /static/* 은 Worker 를 타지 않는다.
   ═══════════════════════════════════════════════════════════════ */
@font-face{font-family:Pretendard;font-weight:400;font-display:swap;
  src:url('/static/fonts/pretendard-400.woff2') format('woff2')}
@font-face{font-family:Pretendard;font-weight:500;font-display:swap;
  src:url('/static/fonts/pretendard-400.woff2') format('woff2')}
@font-face{font-family:Pretendard;font-weight:600;font-display:swap;
  src:url('/static/fonts/pretendard-600.woff2') format('woff2')}
@font-face{font-family:Pretendard;font-weight:700;font-display:swap;
  src:url('/static/fonts/pretendard-700.woff2') format('woff2')}
@font-face{font-family:Pretendard;font-weight:800;font-display:swap;
  src:url('/static/fonts/pretendard-700.woff2') format('woff2')}

:root{
  --brand:#0B5CFB; --brand-700:#0A4AD0; --brand-50:#EBF1FF; --violet:#6D74F8;
  --ink:#0F1B38; --ink-2:#3D4A66; --ink-3:#6B7793; --ink-4:#9AA5BE;
  --line:#E3E9F5; --line-2:#EFF3FA;
  --bg:#F1F5FD; --surface:#FFFFFF; --surface-2:#F7F9FE;
  --ok:#0E9F6E; --ok-bg:#E7F8F1; --warn:#B7791F; --warn-bg:#FDF6E7;
  --danger:#D93855; --danger-bg:#FDEEF1;

  /* 타이포 — 데스크톱 업무 화면 기준. 콘솔이 쓰던 13px 본문을 15px 로 올린다 */
  --t-display:30px; --t-h1:26px; --t-h2:20px; --t-h3:17px;
  --t-body:15px; --t-sm:14px; --t-cap:12.5px;

  --r-lg:20px; --r-md:14px; --r-sm:10px;
  --sh-1:0 1px 2px rgba(16,38,92,.05), 0 6px 18px rgba(16,38,92,.06);
  --sh-2:0 10px 34px rgba(16,38,92,.12);
  --font:Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',
    'Noto Sans KR','Malgun Gothic',system-ui,sans-serif;
}

html,body{font-family:var(--font)}
body{color:var(--ink);letter-spacing:-.01em;word-break:keep-all;overflow-wrap:break-word}
button,input,select,textarea{font-family:var(--font)}
button{cursor:pointer}

/* ── 공통 상단바 (myme-shell.js 가 주입한다) ───────────────────── */
.mmbar{position:fixed;top:0;left:0;right:0;z-index:9000;height:52px;
  display:flex;align-items:center;gap:12px;padding:0 18px;
  background:rgba(255,255,255,.93);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-2);font-family:var(--font)}
body.mmbar-on{padding-top:52px!important}
.mmbar-brand{font-size:16px;font-weight:700;letter-spacing:-.4px;color:var(--ink);
  text-decoration:none;flex:0 0 auto}
.mmbar-brand span{color:var(--brand)}
.mmbar-nav{display:flex;gap:4px;flex:1 1 auto;min-width:0;overflow:hidden}
.mmbar-nav a{padding:7px 13px;border-radius:999px;font-size:13.5px;font-weight:600;
  color:var(--ink-3);text-decoration:none;white-space:nowrap;transition:.14s}
.mmbar-nav a:hover{background:var(--surface-2);color:var(--ink-2)}
.mmbar-nav a[aria-current=page]{background:var(--brand-50);color:var(--brand)}
.mmbar-role{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding:6px 12px;
  border-radius:999px;background:var(--surface-2);border:1px solid var(--line);
  font-size:12.5px;font-weight:600;color:var(--ink-2)}
.mmbar-role i{width:7px;height:7px;border-radius:50%;background:var(--ok);font-style:normal}
.mmbar-out{flex:0 0 auto;padding:7px 13px;border-radius:999px;border:1px solid var(--line);
  background:#fff;font-size:12.5px;font-weight:600;color:var(--ink-3);text-decoration:none}
.mmbar-out:hover{color:var(--danger);border-color:#F3D3DA}
@media (max-width:760px){
  .mmbar{height:48px;padding:0 12px;gap:8px}
  body.mmbar-on{padding-top:48px!important}
  .mmbar-nav{display:none}
  .mmbar-role span{display:none}
}