/* COREON ESTIMA AX Design System v1 — Light Professional
   적용 원칙: 화면 표현만 바꾼다. 계산·저장·API·JS 동작은 이 파일과 무관하다.
   각 페이지의 기존 <style> 뒤에 링크되어 같은 클래스(.top .card .btn .badge ...)를 덮어쓴다.
   상태 구분: 완료(초록) / 경고(호박) / HOLD(주황 + 'HOLD' 글자) / 오류(빨강) / 작업중(보라) — 색만으로 구분하지 않고 글자를 함께 표시한다. */
:root{
  --navy:#16345C;--navy2:#16345C;--blue:#2563EB;--blue-d:#1D4ED8;--blue-l:#EAF1FF;--teal:#0F766E;
  --ink:#0F1E33;--mut:#556377;--line:#E1E7EF;--line2:#EEF2F7;--bg:#F7F9FC;--card:#fff;
  --ok:#168568;--ok-b:#E6F5EF;--warn:#8A5300;--warn-b:#FFF6E0;--hold:#B4470C;--hold-b:#FFF0E3;
  --err:#B42318;--err-b:#FEECEB;--work:#6941C6;--work-b:#F3EEFF;--na:#4A5565;--na-b:#EFF2F6;
  --r:12px;--sh:0 1px 2px rgba(15,30,51,.04),0 4px 16px rgba(15,30,51,.05);
  font-family:"Pretendard","Pretendard Variable","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif
}
body{background:var(--bg);color:var(--ink);font-size:14.5px;line-height:1.55;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:anywhere}
a{color:var(--blue)}
/* 머리글: 짙은 그라데이션 → 흰 바탕 + 얇은 경계선, 로고 원형 유지 */
.top{background:#fff!important;color:var(--ink)!important;border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(15,30,51,.02);height:64px}
.top a,.top .toplink{color:var(--navy)!important;font-weight:600}
.logo-tile{background:#fff;border:1px solid var(--line);border-radius:10px;width:46px;height:46px;padding:3px}
.pname b{color:var(--navy);letter-spacing:-.01em}.pname small{color:var(--mut);opacity:1}
.demo,.badge-demo{background:var(--blue-l)!important;color:var(--blue-d)!important;border:1px solid #CFDDFB;font-weight:700}
#fbBtn{background:#fff;color:var(--navy);border-color:var(--line)}
/* 'BETA/TEST ONLY' 워터마크는 유지하되 작업 화면을 가리지 않도록 약하게 */
.wm{color:rgba(22,52,92,.022)!important;font-size:84px}
.wrap{padding-top:24px}
h1{color:var(--navy);letter-spacing:-.015em}h2,h3{color:var(--navy)}
.sub,.sp{color:var(--mut)}
.card{border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:22px}
/* 버튼: 주 행동은 브랜드 블루 하나, 터치 크기 확보 */
.btn{border-radius:9px;min-height:40px;border-color:var(--line);color:var(--navy);transition:background .12s,border-color .12s}
.btn:hover{background:#F2F5FA;border-color:#D3DCE8}
.btn.p{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 1px 2px rgba(37,99,235,.25)}
.btn.p:hover{background:var(--blue-d);border-color:var(--blue-d)}
.btn.d{color:var(--err);border-color:#F5C2BE}
.btn.sm{min-height:32px}
.btn:focus-visible,.step:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,.drop:focus-visible{outline:3px solid #93B4F8;outline-offset:2px}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=search],select,textarea{border:1px solid #D3DCE8;border-radius:9px;background:#fff;color:var(--ink)}
/* 진행 단계 */
.step{border-radius:12px;border-color:var(--line);background:#fff}
.step.on{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-l)}
.step.done .n{background:var(--ok)}
/* KPI 카드: 숫자 가독성(고정폭 숫자) */
.kpi{border-radius:12px;border-color:var(--line);padding:14px}
.kpi b{font-variant-numeric:tabular-nums;color:var(--navy);letter-spacing:-.01em}
.kpi.ok b{color:var(--ok)}.kpi.hold b{color:var(--hold)}.kpi.work b{color:var(--work)}
/* 표 */
.tbl{border-color:var(--line);border-radius:12px;background:#fff}
th{background:#F4F7FB;color:#3A4A60;font-weight:700;border-bottom:1px solid var(--line)}
td{border-bottom:1px solid var(--line2)}tr:hover td{background:#F8FAFD}
td.num,.num{font-variant-numeric:tabular-nums}
/* 상태 배지: 색 + 글자 */
.badge{border-radius:999px;font-weight:700;letter-spacing:-.005em}
.b-ok{background:var(--ok-b);color:var(--ok)}.b-warn{background:var(--warn-b);color:var(--warn)}
.b-hold{background:var(--hold-b);color:var(--hold)}.b-work{background:var(--work-b);color:var(--work)}.b-na{background:var(--na-b);color:var(--na)}
.b-err{background:var(--err-b);color:var(--err)}
/* 안내 상자: 왼쪽 강조선으로 종류 구분 */
.note{background:var(--warn-b);border:1px solid #F3DDA6;border-left:4px solid #E3A008;color:#4D3300;border-radius:10px}
.info{background:var(--blue-l);border:1px solid #CFDDFB;border-left:4px solid var(--blue);color:#173A75;border-radius:10px}
.err-box{background:var(--err-b);border:1px solid #F5C2BE;border-left:4px solid var(--err);color:#7A1A12;border-radius:10px}
.drop{border-color:#B9CCF0;background:#FAFCFF;border-radius:14px}
.toast{background:var(--navy);border-radius:12px}
.modal{background:rgba(15,30,51,.42)}.mbox{border-radius:14px}
details.scope,details.card{border-color:var(--line)!important;border-radius:12px!important}
code{background:#F1F4F9}
/* 모바일: 진행 단계는 한 줄 가로 이동 칩, 터치 44px, 카드 여백 축소 */
@media(max-width:640px){
  body{font-size:15px}
  .top{height:58px}.logo-tile{width:40px;height:40px}
  .wrap{padding:14px 14px 72px}
  .card{padding:16px;border-radius:12px}
  .steps{flex-wrap:nowrap;overflow-x:auto;gap:6px;margin:0 -14px 14px;padding:2px 14px 6px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .steps .step{flex:0 0 auto;min-width:0!important;padding:8px 12px;scroll-snap-align:start}
  .steps .step span{display:none}
  .btn{min-height:44px}.btn.sm{min-height:38px}
  input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=search],select{min-height:44px;font-size:16px}
  h1{font-size:20px}
  .kpi b{font-size:19px}
  .wm{font-size:56px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
