/* ================= DentaScribe · app.css =================
   프로토타입 비주얼을 클래스 기반으로 이식 + 반응형/세이프에어리어/드로어 */
:root{
  --bg:#F3F6F5; --ink:#0F1D1B; --sub:#5B6B68; --mut:#8CA09C;
  --teal:#0E7569; --teal-d:#0A5A50; --teal-l:#17B893; --teal-x:#31D1AC; --mint:#8FE3CC;
  --line:#E3E9E7; --line2:#EEF2F1; --card:#fff;
  --dark:#0C1817; --dark2:#17342F; --dark-mut:#9FB5B0;
  --warn:#B45309; --amber:#DC8A0B; --amber-bg:#FDF1DF; --amber-bd:#F3D9AE;
  --danger:#DC3D43;
  --mono:'JetBrains Mono',monospace;
  --sat:env(safe-area-inset-top,0px); --sar:env(safe-area-inset-right,0px);
  --sab:env(safe-area-inset-bottom,0px); --sal:env(safe-area-inset-left,0px);
}
*{box-sizing:border-box;}
[hidden]{display:none !important;}
html,body{margin:0;padding:0;background:var(--bg);}
body{font-family:'Pretendard Variable',Pretendard,-apple-system,'Malgun Gothic',sans-serif;color:var(--ink);}
a{color:var(--teal);text-decoration:none;} a:hover{color:var(--teal-d);}
button{cursor:pointer;font-family:inherit;}
input,select,textarea{font-family:inherit;}
input:focus,select:focus{outline:2px solid var(--teal);outline-offset:1px;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:#CBD6D3;border-radius:8px;border:3px solid var(--bg);}
.mono{font-family:var(--mono);}
@keyframes ds-pulse{0%{box-shadow:0 0 0 0 rgba(220,61,67,.5);}70%{box-shadow:0 0 0 9px rgba(220,61,67,0);}100%{box-shadow:0 0 0 0 rgba(220,61,67,0);}}
@keyframes ds-wave{0%,100%{transform:scaleY(.25);}50%{transform:scaleY(1);}}
@keyframes ds-up{from{opacity:0;transform:translateY(7px);}to{opacity:1;transform:translateY(0);}}

/* -------- 셸 / 레이아웃 -------- */
.shell{display:flex;height:100vh;overflow:hidden;min-width:0;}
@supports(height:100dvh){.shell{height:100dvh;}}

/* -------- 사이드바 -------- */
.side{width:236px;flex:none;background:var(--dark);color:var(--dark-mut);display:flex;flex-direction:column;
  padding:22px 16px calc(18px + var(--sab));padding-left:calc(16px + var(--sal));}
.side-brand{display:flex;align-items:center;gap:10px;padding:0 8px;}
.side-logo{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--teal-l),var(--teal));display:flex;align-items:center;justify-content:center;flex:none;}
.side-name{color:#fff;font-weight:800;font-size:16px;letter-spacing:-.2px;}
.side-tag{font-size:10.5px;color:#6E8580;letter-spacing:.3px;font-weight:600;}
.side-label{margin:26px 0 8px;padding:0 10px;font-size:10px;font-weight:700;letter-spacing:1.6px;color:#5A716C;}
.side-nav{display:flex;flex-direction:column;gap:3px;}
.side-item{display:flex;align-items:center;gap:10px;padding:10px;border:none;border-radius:10px;background:transparent;color:var(--dark-mut);font-size:13.5px;font-weight:600;text-align:left;width:100%;}
.side-item:hover{background:#12211F;}
.side-item.active{background:var(--dark2);color:var(--mint);}
.side-flow{display:flex;flex-direction:column;gap:2px;}
.side-flow .side-label{margin-top:24px;}
.side-step{display:flex;align-items:center;gap:10px;padding:8px 10px;border:none;border-radius:10px;background:transparent;color:var(--dark-mut);font-size:12.5px;font-weight:600;text-align:left;width:100%;}
.side-step .num{width:19px;height:19px;flex:none;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;font-family:var(--mono);background:#20302D;color:#7E938E;}
.side-step.active{background:var(--dark2);color:var(--mint);}
.side-step.active .num{background:var(--teal);color:#fff;}
.side-step.done .num{background:rgba(23,184,147,.2);color:var(--mint);}
.side-foot{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding-top:16px;}
.side-reset{display:flex;align-items:center;justify-content:center;gap:8px;padding:11px;border:1px solid #22332F;border-radius:11px;background:transparent;color:var(--dark-mut);font-size:12.5px;font-weight:700;}
.side-reset:hover{background:#12211F;color:#fff;}
.side-profile{display:flex;align-items:center;gap:10px;padding:11px 12px;background:#111F1D;border-radius:12px;width:100%;border:none;color:inherit;text-align:left;cursor:pointer;}
.side-profile:hover{background:#16302C;}
.side-avatar{width:32px;height:32px;flex:none;border-radius:99px;background:rgba(23,184,147,.16);color:var(--mint);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;}
.side-doctor{color:#fff;font-size:13px;font-weight:700;}
.side-hosp{font-size:11px;color:#6E8580;}

/* -------- 백드롭 -------- */
.nav-backdrop{display:none;}

/* -------- 메인 / 헤더 -------- */
.main{flex:1;overflow-y:auto;position:relative;min-width:0;padding-right:var(--sar);}
.topbar{position:sticky;top:0;z-index:30;backdrop-filter:blur(10px);background:rgba(243,246,245,.86);border-bottom:1px solid var(--line);
  padding:calc(14px + var(--sat)) calc(30px + var(--sar)) 14px 30px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;row-gap:8px;}
.hamburger{display:none;align-items:center;justify-content:center;width:38px;height:38px;flex:none;border:1px solid #D8E1DE;border-radius:10px;background:#fff;color:var(--ink);}
.topbar-title{font-size:17px;font-weight:800;letter-spacing:-.3px;}
.topbar-chip{display:flex;align-items:center;gap:8px;padding:5px 12px 5px 6px;background:#fff;border:1px solid var(--line);border-radius:99px;font-size:12.5px;}
.topbar-chip .av{width:24px;height:24px;border-radius:99px;background:#E4F1EE;color:var(--teal);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;}
.topbar-spacer{flex:1;}
.topbar-badge{display:flex;align-items:center;gap:8px;padding:6px 14px;background:#0F1D1B;border-radius:99px;}
.topbar-badge .lbl{font-size:10.5px;font-weight:700;letter-spacing:1px;color:#7E9993;}
.topbar-badge .val{font-size:14px;font-weight:800;color:var(--mint);font-family:var(--mono);}
.topbar-badge .unit{font-size:11px;color:#5A716C;font-family:var(--mono);}
.topbar-date{font-size:11.5px;color:var(--sub);font-family:var(--mono);}
.screen{padding:24px 30px 48px;display:flex;flex-direction:column;gap:18px;}

/* -------- 공통 요소 -------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;}
.chip{font-size:11px;font-weight:700;color:var(--teal);background:#E4F1EE;padding:3px 9px;border-radius:99px;}
.badge{font-size:11px;font-weight:700;padding:4px 10px;border-radius:99px;display:inline-block;}
.avatar{width:27px;height:27px;flex:none;border-radius:99px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;background:#EEF2F1;color:var(--sub);}
.avatar.hot{background:var(--teal);color:#fff;}
.btn-primary{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border:none;border-radius:10px;background:var(--teal);color:#fff;font-size:12px;font-weight:800;white-space:nowrap;}
.btn-primary:hover{background:var(--teal-d);}
.btn-dark{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:9px;background:#0F1D1B;color:#fff;font-size:11.5px;font-weight:800;white-space:nowrap;}
.btn-dark:hover{background:var(--dark2);color:#fff;}

/* -------- 대시보드 배너 -------- */
.banner{border-radius:20px;padding:22px 26px;background:linear-gradient(115deg,#0C1817 0%,#123A33 78%,#17594C 100%);color:#fff;display:flex;align-items:center;gap:24px;}
.banner-l{flex:1;min-width:0;}
.banner-badge{font-size:10px;font-weight:800;letter-spacing:1.4px;color:var(--mint);background:rgba(23,184,147,.14);border:1px solid rgba(23,184,147,.35);padding:3px 9px;border-radius:99px;}
.banner-time{font-size:11.5px;color:var(--dark-mut);font-family:var(--mono);margin-left:8px;}
.banner-title{font-size:21px;font-weight:800;letter-spacing:-.4px;line-height:1.3;margin-top:9px;}
.banner-title .tooth{color:var(--mint);font-family:var(--mono);}
.banner-sub{margin-top:7px;font-size:12.5px;color:var(--dark-mut);font-family:var(--mono);}
.banner-cta{flex:none;display:flex;align-items:center;gap:9px;padding:13px 22px;border:none;border-radius:13px;background:var(--teal-l);color:#06231D;font-size:14.5px;font-weight:800;}
.banner-cta:hover{background:var(--teal-x);}

/* -------- KPI -------- */
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.kpi-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 20px;}
.kpi-label{font-size:11.5px;font-weight:700;color:var(--sub);}
.kpi-value{font-size:27px;font-weight:800;letter-spacing:-.8px;font-family:var(--mono);}
.kpi-unit{font-size:12px;color:var(--sub);font-weight:600;margin-left:6px;}
.kpi-num{margin-top:9px;display:flex;align-items:baseline;}
.kpi-delta{margin-top:5px;font-size:11.5px;font-weight:600;}

/* -------- 대시보드 하단 그리드 -------- */
.dash-grid{display:grid;grid-template-columns:1fr 320px;gap:14px;align-items:start;}
.dash-right{display:flex;flex-direction:column;gap:14px;}

/* -------- 표(케이스/환자) -------- */
.card-head{padding:16px 20px 12px;display:flex;align-items:center;gap:10px;}
.card-title{font-size:14.5px;font-weight:800;}
.card-hint{font-size:11.5px;color:var(--mut);font-weight:600;margin-left:auto;}
.tbl-head,.tbl-row{display:grid;align-items:center;gap:10px;}
.tbl-head{padding:8px 20px;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2);background:#FAFCFB;}
.tbl-head .th{font-size:10.5px;font-weight:800;letter-spacing:.8px;color:var(--mut);}
.tbl-row{padding:12px 20px;border-bottom:1px solid #F2F5F4;}
.tbl-row.hot{background:#F4FAF8;}
.tbl-row.clickable{cursor:pointer;}
.tbl-row.clickable:hover{background:#F4FAF8;}
.tbl-row > *{min-width:0;}
.pinfo{display:flex;align-items:center;gap:9px;min-width:0;}
.p-name{font-size:13px;font-weight:700;}
.p-demo{font-size:11px;color:var(--mut);}
.p-proc{font-size:12.5px;font-weight:600;color:#33443F;}
.p-proc .tooth{font-family:var(--mono);color:var(--teal);font-weight:700;}
.p-when{font-size:12px;color:var(--sub);font-family:var(--mono);}
.p-score{font-size:13px;font-weight:800;font-family:var(--mono);}
.p-vals{font-size:11px;color:var(--sub);font-family:var(--mono);}
.tbl-foot{padding:11px 20px;font-size:11.5px;color:var(--mut);display:flex;align-items:center;gap:6px;}
.p-note{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:#6B4E10;background:var(--amber-bg);border:1px solid var(--amber-bd);padding:4px 10px;border-radius:99px;}
.p-none{font-size:12px;color:#C3CFCB;}
.p-action{display:flex;justify-content:flex-end;align-items:center;gap:8px;}

/* -------- 주간 차트 -------- */
.weekly-head{display:flex;align-items:baseline;gap:8px;}
.weekly-sub{font-size:11px;color:var(--mut);font-weight:600;}
.weekly-bars{margin-top:16px;display:flex;align-items:flex-end;gap:7px;height:86px;}
.wbar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;}
.wbar{width:100%;border-radius:6px 6px 3px 3px;background:#D7E6E1;}
.wbar.last{background:linear-gradient(180deg,var(--teal-l),var(--teal));}
.wbar-label{font-size:9.5px;color:var(--mut);font-family:var(--mono);}
.weekly-note{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line);font-size:11.5px;color:var(--sub);}
.weekly-note b{font-family:var(--mono);}

/* -------- 알림 -------- */
.alerts{display:flex;flex-direction:column;gap:10px;}
.alert{display:flex;gap:10px;padding:11px 12px;border-radius:12px;}
.alert-dot{width:7px;height:7px;flex:none;border-radius:99px;margin-top:5px;}
.alert-title{font-size:12.5px;font-weight:700;color:#22332F;}
.alert-desc{margin-top:2px;font-size:11.5px;color:var(--sub);}

/* -------- 환자/신규 -------- */
.head-row{display:flex;align-items:center;gap:9px;}
.head-title{font-size:15px;font-weight:800;}
.btn-new{margin-left:auto;display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border:none;border-radius:11px;background:var(--teal);color:#fff;font-size:12.5px;font-weight:800;}
.btn-new:hover{background:var(--teal-d);}
.np-card{padding:22px 24px;display:flex;flex-direction:column;gap:20px;max-width:820px;}
.np-title{font-size:16px;font-weight:800;}
.np-section{font-size:12px;font-weight:800;color:var(--sub);letter-spacing:.4px;margin-bottom:9px;}
.np-dept-row{display:flex;flex-wrap:wrap;gap:8px;}
.np-dept{padding:8px 14px;border:1px solid #D8E1DE;border-radius:99px;background:#fff;font-size:12.5px;font-weight:700;color:var(--sub);}
.np-dept.active{background:#0F1D1B;color:#fff;border-color:#0F1D1B;}
.np-proc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.np-proc{padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;text-align:left;}
.np-proc:hover{border-color:#BCDFD5;}
.np-proc.selected{border-color:var(--teal);background:#F4FAF8;}
.np-proc .pn{font-size:13.5px;font-weight:700;}
.np-proc .pm{font-size:11px;color:var(--mut);margin-top:3px;font-family:var(--mono);}
.np-proc .tag{font-size:10px;font-weight:800;color:#C0392B;background:#FDECEC;padding:2px 7px;border-radius:99px;margin-top:7px;display:inline-block;}
.np-fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.np-field label{font-size:11.5px;font-weight:700;color:var(--sub);display:block;margin-bottom:6px;}
.np-input{width:100%;padding:11px 13px;border:1px solid #D8E1DE;border-radius:10px;font-size:14px;background:#fff;}
.np-actions{display:flex;gap:10px;align-items:center;}
.np-submit{padding:12px 22px;border:none;border-radius:11px;background:var(--teal);color:#fff;font-size:14px;font-weight:800;}
.np-submit:disabled{background:#E7EDEB;color:#9FB0AC;}
.np-cancel{padding:12px 18px;border:1px solid #D8E1DE;border-radius:11px;background:#fff;font-size:13px;font-weight:700;color:var(--sub);}
.empty{padding:60px 20px;text-align:center;color:var(--mut);font-size:13px;}

/* -------- 내 정보 -------- */
.mi-card{padding:24px 26px;display:flex;flex-direction:column;gap:20px;max-width:620px;}
.mi-head{display:flex;align-items:center;gap:14px;}
.mi-avatar{width:52px;height:52px;border-radius:99px;background:linear-gradient(135deg,#17B893,#0E7569);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;}
.mi-name{font-size:17px;font-weight:800;}
.mi-hosp{font-size:12.5px;color:var(--sub);margin-top:2px;}
.mi-info{border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.mi-row{display:grid;grid-template-columns:130px 1fr;border-bottom:1px solid var(--line2);}
.mi-row:last-child{border-bottom:none;}
.mi-k{background:#FAFCFB;padding:12px 15px;font-size:12.5px;font-weight:700;color:var(--sub);border-right:1px solid var(--line2);}
.mi-v{padding:12px 15px;font-size:13.5px;font-weight:600;}
.mi-actions{display:flex;gap:10px;}

/* -------- 검색/필터 (환자 리스트) -------- */
.search{display:flex;align-items:center;gap:9px;padding:10px 14px;background:#fff;border:1px solid var(--line);border-radius:12px;}
.search input{border:none;outline:none;flex:1;font-size:13.5px;background:transparent;}
.filter-row{display:flex;gap:8px;flex-wrap:wrap;}
.fchip{display:flex;align-items:center;gap:6px;padding:7px 13px;border:1px solid #D8E1DE;border-radius:99px;background:#fff;font-size:12px;font-weight:700;color:var(--sub);}
.fchip.active{background:#0F1D1B;color:#fff;border-color:#0F1D1B;}
.fchip .n{font-family:var(--mono);opacity:.7;}

/* -------- 플로우 스텝퍼 -------- */
.stepper{padding:18px 30px 0;display:flex;align-items:center;gap:0;}
.step{display:flex;align-items:center;gap:9px;border:none;background:transparent;padding:0;}
.step .num{width:27px;height:27px;border-radius:99px;display:flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:800;font-family:var(--mono);background:#EDF2F0;color:#9FB0AC;border:1.5px solid #E2E9E6;}
.step.active .num{background:#0F1D1B;color:#fff;border-color:#0F1D1B;}
.step.done .num{background:#E4F1EE;color:var(--teal);border-color:#BCDFD5;}
.step .label{font-size:13px;font-weight:700;color:#9FB0AC;}
.step.active .label,.step.done .label{color:var(--ink);}
.step .sub{font-size:10.5px;color:var(--mut);font-weight:600;}
.step-line{flex:1;height:1.5px;margin:0 14px;background:#E2E9E6;border-radius:2px;min-width:24px;}

/* -------- 계획 화면 -------- */
.plan-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:16px;align-items:start;}
.cbct{background:#0C1817;border-radius:16px;overflow:hidden;color:#fff;}
.cbct-head{display:flex;justify-content:space-between;padding:16px 18px 10px;font-family:var(--mono);}
.cbct-head .t{font-size:12px;font-weight:700;letter-spacing:1px;color:var(--mint);}
.cbct-head .d{font-size:11px;color:#6E8580;}
.cbct-body{position:relative;height:340px;background:
  linear-gradient(rgba(143,227,204,.06) 1px,transparent 1px),
  linear-gradient(90deg,rgba(143,227,204,.06) 1px,transparent 1px);background-size:34px 34px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding-bottom:118px;}
.risk-note{position:absolute;top:16px;right:16px;border:1px solid rgba(220,180,60,.5);background:rgba(220,180,60,.08);border-radius:10px;padding:8px 12px;}
.risk-note .t{font-size:10px;font-weight:800;letter-spacing:1px;color:#E8C878;}
.risk-note .d{font-size:11px;color:#D8CBA0;margin-top:2px;}
.cbct-ph{color:#3f5b54;} .cbct-cap{color:#6E8580;font-size:12px;} .cbct-cap2{color:#4a655e;font-size:11px;font-family:var(--mono);}
.cbct-tags{position:absolute;left:18px;bottom:64px;display:flex;flex-direction:column;gap:8px;}
.cbct-tag{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:9px;padding:8px 12px;font-size:12px;}
.cbct-tag .dot{width:9px;height:9px;border-radius:3px;}
.cbct-stats{position:absolute;left:18px;right:18px;bottom:16px;display:flex;gap:22px;align-items:flex-end;}
.cbct-stat .l{font-size:11px;color:#6E8580;} .cbct-stat .v{font-size:15px;font-weight:800;font-family:var(--mono);}
.cbct-note{margin-left:auto;font-size:11px;color:#5a756e;}
.form-card{padding:20px 22px;display:flex;flex-direction:column;gap:16px;}
.form-title{font-size:15px;font-weight:800;display:flex;align-items:center;}
.form-tag{margin-left:auto;font-size:11px;font-weight:800;color:var(--teal);background:#E4F1EE;padding:4px 10px;border-radius:99px;}
.field-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.field label{font-size:12px;font-weight:700;color:var(--sub);display:block;margin-bottom:6px;}
.field .inp{width:100%;padding:11px 13px;border:1px solid #D8E1DE;border-radius:10px;font-size:16px;font-family:var(--mono);display:flex;align-items:center;justify-content:space-between;}
.bone-opts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.bone{padding:11px;border:1px solid #D8E1DE;border-radius:10px;background:#fff;font-size:14px;font-weight:700;font-family:var(--mono);color:var(--sub);}
.bone.active{background:var(--teal);color:#fff;border-color:var(--teal);}
.fixture{width:100%;padding:12px 13px;border:1px solid #D8E1DE;border-radius:10px;font-size:14px;font-family:var(--mono);background:#fff;}
.avoid-box{display:flex;gap:11px;padding:13px 15px;border:1px solid #BCDFD5;background:#F4FAF8;border-radius:13px;}
.avoid-check{width:22px;height:22px;flex:none;border-radius:7px;background:var(--teal);display:flex;align-items:center;justify-content:center;}
.avoid-box .t{font-size:13px;font-weight:800;color:#134E44;} .avoid-box .d{font-size:11.5px;color:var(--sub);margin-top:3px;line-height:1.5;}
.plan-progress{display:flex;align-items:center;gap:12px;}
.progress-track{flex:1;height:7px;border-radius:99px;background:#E7EDEB;overflow:hidden;}
.progress-fill{height:100%;background:var(--teal);border-radius:99px;}
.btn-confirm{padding:13px 22px;border:none;border-radius:12px;background:var(--teal);color:#fff;font-size:14px;font-weight:800;white-space:nowrap;}
.btn-confirm:hover{background:var(--teal-d);}

/* -------- 타임아웃 -------- */
.to-list{display:flex;flex-direction:column;gap:10px;}
.to-item{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;cursor:pointer;}
.to-item.checked{border-color:#BCDFD5;background:#F4FAF8;}
.to-item.flagged{border-color:var(--amber-bd);background:var(--amber-bg);}
.to-box{width:22px;height:22px;flex:none;border-radius:7px;border:1.5px solid #C7D3CF;background:#fff;display:flex;align-items:center;justify-content:center;margin-top:1px;}
.to-item.checked .to-box{background:var(--teal);border-color:var(--teal);}
.to-label{font-size:13.5px;font-weight:700;} .to-desc{font-size:12px;color:var(--sub);margin-top:3px;line-height:1.5;}
.to-cta{padding:13px;border:none;border-radius:12px;font-size:14px;font-weight:800;color:#fff;background:var(--teal);}
.to-cta:disabled{background:#E7EDEB;color:#9FB0AC;}

/* -------- 수술(앰비언트 캡처) -------- */
.surg-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:16px;align-items:start;}
.capture{background:#0C1817;border-radius:16px;overflow:hidden;color:#fff;display:flex;flex-direction:column;min-height:440px;}
.cap-head{display:flex;align-items:center;gap:10px;padding:16px 18px;font-family:var(--mono);border-bottom:1px solid rgba(255,255,255,.06);}
.rec-dot{width:9px;height:9px;border-radius:99px;background:#5A716C;}
.rec-dot.on{background:var(--danger);animation:ds-pulse 1.4s infinite;}
.rec-lbl{font-size:12px;font-weight:700;letter-spacing:1px;color:#7E9993;}
.cap-meta{font-size:11.5px;color:#6E8580;}
.wave{margin-left:auto;display:flex;align-items:center;gap:2px;height:16px;}
.wave i{width:2.5px;background:var(--mint);border-radius:2px;height:100%;transform-origin:center;animation:ds-wave 1s infinite;}
.cap-clock{font-size:14px;font-weight:800;color:#fff;font-family:var(--mono);}
.feed{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:10px;}
.feed-empty{margin:auto;text-align:center;color:#6E8580;}
.feed-empty .mic{width:56px;height:56px;border-radius:99px;border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.feed-line{display:flex;gap:10px;animation:ds-up .3s ease;}
.feed-line .who{font-size:10px;font-weight:800;padding:2px 7px;border-radius:6px;flex:none;height:fit-content;font-family:var(--mono);}
.who-doc{background:rgba(23,184,147,.16);color:var(--mint);}
.who-staff{background:rgba(255,255,255,.08);color:#B9CCC7;}
.who-sys{background:rgba(220,138,11,.16);color:#E8C878;}
.feed-text{font-size:12.5px;color:#DCEBE7;line-height:1.5;}
.feed-cap{font-size:10.5px;color:var(--mint);margin-top:3px;font-family:var(--mono);}
.cap-foot{padding:14px 18px;display:flex;align-items:center;gap:12px;border-top:1px solid rgba(255,255,255,.06);}
.btn-cap{padding:11px 18px;border:none;border-radius:10px;background:var(--teal-l);color:#06231D;font-size:13.5px;font-weight:800;}
.btn-cap.pause{background:rgba(255,255,255,.1);color:#fff;}
.btn-ghost{padding:11px 16px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:transparent;color:#B9CCC7;font-size:12.5px;font-weight:700;}
.cap-prog{margin-left:auto;font-size:11px;color:#7E9993;font-family:var(--mono);}
.ck-card{padding:18px 20px;}
.ck-head{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.ck-list{display:flex;flex-direction:column;gap:8px;}
.ck-item{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--line);border-radius:11px;font-size:12.5px;font-weight:600;color:var(--sub);}
.ck-item.on{border-color:#BCDFD5;background:#F4FAF8;color:var(--ink);}
.ck-mark{width:18px;height:18px;flex:none;border-radius:6px;border:1.5px solid #C7D3CF;display:flex;align-items:center;justify-content:center;}
.ck-item.on .ck-mark{background:var(--teal);border-color:var(--teal);}

/* -------- 검토/리포트 -------- */
.rev-draft{padding:22px 24px;}
.draft-head{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.draft-tag{font-size:11px;font-weight:800;color:#B45309;background:var(--amber-bg);padding:4px 10px;border-radius:99px;}
.draft-meta{margin-left:auto;font-size:11.5px;color:var(--mut);font-family:var(--mono);}
.draft-body{font-size:15px;line-height:2.1;color:#22332F;}
.hl{background:#E4F1EE;color:var(--teal);font-weight:700;font-family:var(--mono);padding:1px 7px;border-radius:6px;}
.draft-foot{margin-top:18px;display:flex;align-items:center;gap:14px;}
.draft-foot .note{font-size:11.5px;color:var(--mut);}
.btn-sign{margin-left:auto;padding:14px 22px;border:none;border-radius:12px;background:#0F1D1B;color:#fff;font-size:14px;font-weight:800;}
.score-card{padding:22px 24px;display:grid;grid-template-columns:1.08fr .92fr;gap:20px;align-items:center;}
.score-ring{width:120px;height:120px;border-radius:99px;display:flex;align-items:center;justify-content:center;flex-direction:column;}
.score-ring .in{width:96px;height:96px;border-radius:99px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.score-ring .n{font-size:30px;font-weight:800;font-family:var(--mono);color:var(--teal);}
.score-ring .l{font-size:9px;letter-spacing:2px;color:var(--mut);font-weight:800;}
.score-rows{display:flex;flex-direction:column;gap:12px;}
.score-row{display:flex;align-items:center;gap:10px;}
.score-row .name{font-size:12.5px;font-weight:700;min-width:78px;}
.score-row .bar{flex:1;height:6px;background:#EEF2F1;border-radius:99px;overflow:hidden;}
.score-row .fill{height:100%;background:var(--teal);border-radius:99px;}
.score-row .val{font-size:12px;font-weight:800;font-family:var(--mono);min-width:44px;text-align:right;}
.cmp-card{padding:20px 22px;}
.cmp-title{font-size:14.5px;font-weight:800;}
.cmp-sub{font-size:11.5px;color:var(--mut);margin-top:4px;}
.cmp-table{margin-top:14px;}
.cmp-row{display:grid;padding:10px 6px;border-bottom:1px solid #F2F5F4;align-items:center;font-size:12.5px;}
.cmp-row.head{border-bottom:1px solid var(--line2);color:var(--mut);font-size:10.5px;font-weight:800;letter-spacing:.8px;}
.cmp-row.hot{background:#F4FAF8;border-radius:8px;}
.cmp-row .mono{font-family:var(--mono);font-weight:700;}

/* ========================================================
   반응형 + 세이프에어리어 + 모바일 드로어
   ======================================================== */
@media (max-width:1120px){
  .dash-grid,.plan-grid,.surg-grid,.score-card{grid-template-columns:1fr;}
}
@media (max-width:820px){
  .kpi-grid,.np-proc-grid{grid-template-columns:repeat(2,1fr);}
  .np-fields{grid-template-columns:repeat(2,1fr);}
  .screen{padding:20px 18px 44px;}
  /* 정보량 많은 표는 가로 스크롤 */
  .tbl-scroll{overflow-x:auto;}
  .tbl-scroll .tbl-head,.tbl-scroll .tbl-row{min-width:680px;}
  /* 스텝퍼 압축 */
  .stepper{padding:16px 18px 0;overflow-x:auto;}
  .step .sub{display:none;} .step .label{white-space:nowrap;}
  .step-line{margin:0 8px;min-width:10px;}
}
@media (max-width:640px){
  .hamburger{display:flex;}
  .side{position:fixed;top:0;left:0;bottom:0;z-index:60;width:264px;max-width:82vw;
    transform:translateX(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1);box-shadow:0 0 44px rgba(0,0,0,.42);}
  .side[data-nav="open"]{transform:translateX(0);}
  .nav-backdrop{display:block;position:fixed;inset:0;z-index:55;background:rgba(6,15,13,.5);opacity:0;pointer-events:none;transition:opacity .26s ease;}
  .nav-backdrop[data-nav="open"]{opacity:1;pointer-events:auto;}
  .np-proc-grid,.np-fields{grid-template-columns:1fr;}
  .bone-opts{grid-template-columns:repeat(2,1fr);}
}
