/* ============================================================
   StayOS Design System
   흰 카드 / 회색 배경 / 넉넉한 여백 / 큰 숫자 / 평면
   선(border)으로 나누지 않고 여백과 배경색으로 나눈다.
   ============================================================ */
:root{
  --bg:#F2F4F6;
  --surface:#FFFFFF;
  --surface-sub:#F9FAFB;
  --divider:#F2F4F6;
  --border:#E5E8EB;

  /* 글자 색.
     --t3 는 본문 보조 설명에 두루 쓰이는데 전에는 #8B95A1 로
     흰 배경 대비 3.04 였다. WCAG AA 기준(4.5)에 못 미쳐
     밝은 화면이나 나이 든 눈에는 글자가 흐려 보인다.
     앱 배경(#F7F8FA) 위에서도 4.5 를 넘도록 낮췄다.
       --t3  3.04 → 4.95 (앱 배경 4.66)
       --t4  2.01 → 3.90 (앱 배경 3.67, 작은 라벨 전용) */
  --t1:#191F28;
  --t2:#454F5F;
  --t3:#5C6675;
  --t4:#656F7C;

  --blue:#3182F6;
  --blue-dk:#1B64DA;
  --blue-bg:#E8F3FF;
  --red:#F04452;
  --red-bg:#FDEDEE;
  --green:#12B886;
  --green-bg:#E7F8F2;
  --amber:#F59F00;
  --amber-bg:#FFF7E6;

  /* 글자용 어두운 짝.
     --blue/--red/--green/--amber 는 점·막대·배경을 칠하기엔 좋지만
     글자로 쓰면 흰 배경 대비가 2.1~3.3 이라 읽기 어렵다.
     (주황 2.13, 초록 2.55, 파랑 3.31, 빨강 3.28)
     칠하는 색은 그대로 두고, 글자에는 아래를 쓴다. 흰 배경과
     각 색 연배경 양쪽에서 4.5 를 넘는다. */
  --blue-t:#1B5FD0;
  --red-t:#C2262B;
  --green-t:#0A7A5C;
  --amber-t:#9A6400;
  --purple-t:#5B3FE0;

  /* 색을 깔고 그 위에 흰 글자를 얹는 자리.
     --blue 위의 흰 글자는 3.71, --red 위는 3.71 로 둘 다 4.5 에 못 미친다.
     칠하는 --blue/--red 는 그대로 두고 여기서만 한 단계 어둡게 쓴다. */
  --blue-solid:#2A6FD8;
  --red-solid:#DE2C3B;
  --violet:#7B61FF;
  --violet-t:#5B3FE0;   /* 글자용 — #7B61FF 는 연보라 위 3.66 */
  --violet-bg:#F0EDFF;
  --navy:#0B1B33;
  --shadow-card:0 1px 2px rgba(15,23,42,.035),0 10px 28px rgba(15,23,42,.045);

  --r-card:16px;
  --r-btn:10px;
  --r-chip:8px;
  --r-sheet:24px;

  --sb-w:248px;
  --safe-b:env(safe-area-inset-bottom,0px);
  --safe-t:env(safe-area-inset-top,0px);
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{
  background:var(--bg);color:var(--t1);min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;font-feature-settings:"tnum" 1;
  /* 한글은 글자 사이를 좁히면 받침이 붙어 읽기 어렵다.
     자간을 -0.2 에서 -0.1 로 풀고 줄 간격을 1.5 → 1.6 으로 벌렸다. */
  font-size:16px;line-height:1.62;letter-spacing:-0.08px;
}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;letter-spacing:inherit}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:8px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------------- Shell ---------------- */
.app{display:flex;min-height:100vh}

.sb{
  width:var(--sb-w);flex:0 0 var(--sb-w);background:var(--surface);
  border-right:1px solid var(--divider);
  display:flex;flex-direction:column;padding:24px 0 20px;
  position:sticky;top:0;height:100vh;overflow-y:auto;
}
.sb-brand{display:flex;align-items:center;gap:11px;padding:0 20px 22px;text-decoration:none;cursor:pointer;border-radius:12px}
.sb-brand:hover .sb-name{color:var(--blue-dk)}
.sb-brand:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.sb-mark{width:36px;height:36px;border-radius:11px;background:var(--navy);display:flex;align-items:center;justify-content:center;flex:0 0 36px}
.sb-name{font-size:19px;font-weight:800;letter-spacing:-0.5px;line-height:1.1;color:var(--t1)}
.sb-name span{display:block;font-size:11px;font-weight:600;color:var(--t4);letter-spacing:0.3px;margin-top:3px}
.sb-nav{padding:0 12px;display:flex;flex-direction:column;gap:2px}
.sb-cap{font-size:12px;font-weight:700;color:var(--t4);padding:18px 12px 8px}
.sb-item{
  display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;
  color:var(--t2);font-size:15px;font-weight:600;line-height:1;
  background:none;border:0;width:100%;text-align:left;cursor:pointer;min-height:46px;position:relative;
}
.sb-item{text-decoration:none}
.sb-item svg{flex:0 0 20px;opacity:.65}
.sb-item:hover{background:var(--bg)}
.sb-item.on{background:var(--blue-bg);color:var(--blue-dk);font-weight:700}
.sb-item.on svg{opacity:1}
.sb-item.soon{color:var(--t4);cursor:default}
.sb-item.soon:hover{background:none}
.sb-item span.label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}
.sb-item .soon-tag{
  font-size:11px;font-weight:700;color:var(--t4);background:var(--bg);
  border-radius:6px;padding:3px 6px;white-space:nowrap;flex:0 0 auto;
}
.sb-item .count-tag{
  font-size:11px;font-weight:800;color:#fff;background:var(--red-solid);
  border-radius:99px;padding:2px 7px;min-width:20px;text-align:center;flex:0 0 auto;
}
.sb-foot{margin-top:auto;padding:20px 20px 0}
.sb-foot-box{background:var(--bg);border-radius:14px;padding:14px}
.sb-foot-t{font-size:13px;color:var(--t2);font-weight:700;display:flex;align-items:center;gap:7px}
.sb-foot-s{font-size:12px;color:var(--t3);margin-top:6px;line-height:1.5;word-break:keep-all}
.dot-live{width:7px;height:7px;border-radius:50%;background:var(--green);flex:0 0 7px}
.dot-off{background:var(--amber)}
.dot-err{background:var(--red)}

.main{flex:1;display:flex;flex-direction:column;min-width:0}
.topbar{
  min-height:64px;background:rgba(255,255,255,.9);border-bottom:1px solid rgba(229,232,235,.9);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 28px;position:sticky;top:0;z-index:30;backdrop-filter:saturate(160%) blur(14px);
}
.tb-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.tb-right{display:flex;align-items:center;gap:10px;justify-content:flex-end;flex-shrink:0}
.prop-select{
  background:var(--bg);border:0;border-radius:12px;padding:11px 34px 11px 14px;
  font-size:15px;font-weight:700;color:var(--t1);min-height:44px;
  max-width:min(50vw,300px);cursor:pointer;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 4.5 6 7.5 9 4.5' fill='none' stroke='%238B95A1' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
}
.content{flex:1;padding:28px 28px 64px;display:flex;flex-direction:column;gap:14px;min-width:0;max-width:1240px;width:100%}

/* ---------------- Page head ---------------- */
.phead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:4px 0 8px}
.ph-t{font-size:26px;font-weight:800;letter-spacing:-0.8px;line-height:1.25;color:var(--t1);display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.ph-s{font-size:15px;color:var(--t3);margin-top:7px;line-height:1.55;word-break:keep-all}
.tag{font-size:11.5px;font-weight:800;padding:5px 9px;border-radius:var(--r-chip);background:var(--blue-bg);color:var(--blue-dk);letter-spacing:0}

.badge-sandbox,.badge-live{
  display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;
  border-radius:var(--r-chip);padding:6px 10px;white-space:nowrap;
}
.badge-sandbox{color:var(--violet-t);background:var(--violet-bg)}
.badge-live{color:var(--green-t);background:var(--green-bg)}

.banner{
  border-radius:var(--r-card);padding:16px 18px;font-size:13.5px;line-height:1.6;word-break:keep-all;
  background:var(--violet-bg);color:#4B3BB0;
}
.banner b{font-weight:800}
.banner.warn{background:var(--amber-bg);color:#8A5A00}
.banner.info{background:var(--blue-bg);color:var(--blue-dk)}

/* ---------------- Card ---------------- */
.card{background:var(--surface);border:1px solid rgba(229,232,235,.82);box-shadow:var(--shadow-card);border-radius:var(--r-card);display:flex;flex-direction:column;min-width:0;overflow:hidden}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 20px 4px;flex-wrap:wrap}
.card-t{font-size:17px;font-weight:800;letter-spacing:-0.4px;color:var(--t1);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card-sub{font-size:13.8px;color:var(--t3);font-weight:500;letter-spacing:-0.05px;line-height:1.5}
.card-b{padding:16px 20px 20px;min-width:0}
.card-b.flush{padding:8px 0}

.stack{display:flex;flex-direction:column;gap:12px}
.grid{display:grid;gap:12px}
.grid-kpi{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.grid-cards{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
.row-wrap{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------------- 큰 숫자 ---------------- */
.kpi{background:var(--surface);border-radius:var(--r-card);padding:18px 20px;display:flex;flex-direction:column;gap:6px;min-width:0}
.kpi-l{font-size:13.5px;color:var(--t3);font-weight:600}
.kpi-v{font-size:30px;font-weight:800;letter-spacing:-1.2px;line-height:1.1;color:var(--t1);display:flex;align-items:baseline;gap:3px}
.kpi-v small{font-size:15px;font-weight:700;letter-spacing:-0.3px;color:var(--t2)}
.kpi-d{font-size:12.5px;color:var(--t3);font-weight:500;line-height:1.45;word-break:keep-all}
.kpi.accent .kpi-v{color:var(--blue-t)}
.kpi.danger .kpi-v{color:var(--red-t)}

.hero{background:var(--surface);border-radius:var(--r-card);padding:24px 22px}
.hero-l{font-size:14px;color:var(--t3);font-weight:600}
.hero-v{font-size:36px;font-weight:800;letter-spacing:-1.6px;line-height:1.15;margin-top:6px;color:var(--t1)}
.hero-d{font-size:14px;color:var(--t2);margin-top:8px;line-height:1.5;word-break:keep-all}

/* ---------------- 리스트 행 ---------------- */
.list{display:flex;flex-direction:column}
.list-row{
  display:flex;align-items:center;gap:14px;padding:16px 20px;
  background:none;border:0;width:100%;text-align:left;cursor:pointer;min-height:64px;
  color:inherit;position:relative;
}
.list-row:not(:last-child)::after{
  content:"";position:absolute;left:20px;right:20px;bottom:0;height:1px;background:var(--divider);
}
.list-row:hover{background:var(--surface-sub)}
.list-row.static{cursor:default}
.list-row.static:hover{background:none}
.lr-main{flex:1;min-width:0}
.lr-t{font-size:15.5px;font-weight:700;color:var(--t1);letter-spacing:-0.3px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.lr-s{font-size:13.8px;color:var(--t3);margin-top:5px;line-height:1.55;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.lr-sep{color:var(--t4);flex:0 0 auto}
.lr-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}
.lr-v{font-size:17px;font-weight:800;letter-spacing:-0.5px;color:var(--t1);white-space:nowrap;font-variant-numeric:tabular-nums}
.lr-v.muted{color:var(--t4);font-weight:600;font-size:14.5px}
.lr-sub{font-size:12.5px;color:var(--t3);white-space:nowrap;font-variant-numeric:tabular-nums}
.lr-avatar{
  width:42px;height:42px;border-radius:13px;flex:0 0 42px;
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;
  background:var(--bg);color:var(--t2);
}
.lr-avatar.me{background:var(--blue-bg);color:var(--blue-dk)}
.lr-actions{display:flex;gap:6px;flex-shrink:0}

/* ---------------- 칩 ---------------- */
.chip{
  display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;
  border-radius:var(--r-chip);padding:5px 9px;background:var(--bg);color:var(--t2);white-space:nowrap;
}
.chip.blue{background:var(--blue-bg);color:var(--blue-dk)}
.chip.green{background:var(--green-bg);color:var(--green-t)}
.chip.red{background:var(--red-bg);color:#D3232F}
.chip.amber{background:var(--amber-bg);color:#8A5A00}
.chip.violet{background:var(--violet-bg);color:var(--violet-t)}
.chip.ghost{background:none;color:var(--t3);padding:5px 0}

.delta{font-size:13px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.delta.up{color:var(--red-t)}
.delta.dn{color:var(--blue-t)}
.delta.flat{color:var(--t4)}

/* ---------------- 버튼 ---------------- */
.btn{
  background:var(--blue-solid);color:#fff;border:0;border-radius:var(--r-btn);padding:0 18px;min-height:52px;
  font-size:15.5px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:7px;
  cursor:pointer;white-space:nowrap;letter-spacing:-0.3px;
}
.btn:active{background:var(--blue-dk)}
.btn.ghost{background:var(--bg);color:var(--t2)}
.btn.ghost:active{background:var(--border)}
.btn.danger{background:var(--red-bg);color:var(--red-t)}
.btn.sm{min-height:40px;padding:0 14px;font-size:14px;border-radius:11px}
.btn.xs{min-height:34px;padding:0 11px;font-size:13px;border-radius:9px}
.btn.full{width:100%}
.btn[disabled]{opacity:.4;cursor:not-allowed}

.seg{display:inline-flex;background:var(--bg);border-radius:12px;padding:3px;gap:2px;max-width:100%;overflow-x:auto}
.seg button{
  border:0;background:none;padding:9px 15px;border-radius:10px;font-size:14px;font-weight:700;
  color:var(--t3);cursor:pointer;white-space:nowrap;min-height:40px;
}
.seg button.on{background:var(--surface);color:var(--t1);box-shadow:0 1px 3px rgba(0,0,0,.06)}

.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field-l{font-size:13px;font-weight:700;color:var(--t3)}
.field select,.field input{
  background:var(--bg);border:0;border-radius:12px;padding:13px 14px;font-size:15px;font-weight:600;
  color:var(--t1);min-height:48px;width:100%;appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 4.5 6 7.5 9 4.5' fill='none' stroke='%238B95A1' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;padding-right:34px;cursor:pointer;
}
.field input::placeholder{color:var(--t4);font-weight:500}
.filters{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap}
.filters .field{min-width:150px}

/* ---------------- 근거 ---------------- */
.reasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.reason-box{border-radius:16px;padding:16px 18px}
.reason-box.for{background:var(--green-bg)}
.reason-box.against{background:var(--amber-bg)}
.reason-h{font-size:13.5px;font-weight:800;margin-bottom:10px}
.reason-box.for .reason-h{color:var(--green-t)}
.reason-box.against .reason-h{color:var(--amber-t)}
.reason-l{list-style:none;display:flex;flex-direction:column;gap:8px}
.reason-l li{font-size:14px;line-height:1.55;color:var(--t2);padding-left:15px;position:relative;word-break:keep-all}
.reason-l li::before{content:"";position:absolute;left:2px;top:8px;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.35}

/* ---------------- 알림 ---------------- */
.alert-i{
  display:flex;gap:12px;padding:16px 20px;background:none;border:0;width:100%;text-align:left;
  cursor:pointer;align-items:flex-start;min-height:64px;position:relative;color:inherit;
}
.alert-i:not(:last-child)::after{content:"";position:absolute;left:20px;right:20px;bottom:0;height:1px;background:var(--divider)}
.alert-i:hover{background:var(--surface-sub)}
.alert-dot{width:8px;height:8px;border-radius:50%;flex:0 0 8px;margin-top:7px;background:var(--t4)}
.alert-i.URGENT .alert-dot{background:var(--red)}
.alert-i.ATTENTION .alert-dot{background:var(--amber)}
.alert-i.INFO .alert-dot{background:var(--blue)}
.alert-i.read .alert-dot{background:var(--border)}
.alert-t{font-size:15px;font-weight:700;line-height:1.45;word-break:keep-all;color:var(--t1)}
.alert-b{font-size:13.5px;color:var(--t3);margin-top:4px;line-height:1.5;word-break:keep-all}
.alert-m{font-size:12px;color:var(--t4);margin-top:6px}

/* ---------------- 차트 ---------------- */
/* 가격 그래프 범례 — 눌러서 선을 끄고 켠다 */
.lg{display:flex;align-items:center;gap:6px 8px;flex-wrap:wrap}
.lg-i{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--t2);
  font-weight:700;background:var(--bg);border:1px solid transparent;border-radius:999px;
  padding:5px 11px 5px 9px;cursor:pointer;line-height:1.3;
  transition:background .12s,opacity .12s,border-color .12s}
.lg-i:hover{background:#EDF2FA;border-color:var(--line)}
.lg-i:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.lg-i b{font-weight:800;color:var(--t1)}
.lg-i.off{opacity:.42}
.lg-i.off .lg-s{background:var(--t4)!important}
.lg-s{width:15px;height:3px;border-radius:2px;display:inline-block;flex:none}
.chart-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.chart-wrap svg{display:block;max-width:100%;height:auto}
.chart-hint{display:none;font-size:12.5px;color:var(--t4);margin-top:8px}
.chart-read{
  font-size:14px;color:var(--t2);line-height:1.7;margin-top:16px;padding:16px 18px;
  background:var(--bg);border-radius:16px;word-break:keep-all;
}
.chart-read b{color:var(--t1);font-weight:800}

/* ---------------- 테이블 ---------------- */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.t{width:100%;border-collapse:collapse;min-width:620px}
table.t th{font-size:13px;font-weight:700;color:var(--t3);text-align:left;padding:0 14px 12px;white-space:nowrap}
table.t td{font-size:15px;padding:14px;color:var(--t2);vertical-align:middle;border-top:1px solid var(--divider)}
table.t td.num,table.t th.num{text-align:right;font-variant-numeric:tabular-nums}
table.t td.name{font-weight:700;color:var(--t1);white-space:nowrap}
table.t tbody tr{cursor:pointer}
table.t tbody tr:hover td{background:var(--surface-sub)}
.swatch{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:9px;vertical-align:1px}

/* ---------------- 빈 상태 ---------------- */
.empty{padding:44px 24px;text-align:center;color:var(--t3);font-size:14px;line-height:1.7;word-break:keep-all}
.empty b{display:block;color:var(--t1);font-size:16.5px;font-weight:800;margin-bottom:8px;letter-spacing:-0.4px}
.foot-note{font-size:13.5px;color:var(--t3);line-height:1.68;word-break:keep-all;padding:4px 2px}

.spinner{width:20px;height:20px;border:2.5px solid var(--border);border-top-color:var(--blue);border-radius:50%;animation:spin .7s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:56px 0;color:var(--t3);font-size:14px;font-weight:600}

.toast-stack{
  position:fixed;right:16px;bottom:calc(16px + var(--safe-b));z-index:200;
  display:flex;flex-direction:column;gap:8px;align-items:flex-end;pointer-events:none;
}
.toast{
  pointer-events:auto;cursor:pointer;
  background:var(--t1);color:#fff;padding:11px 15px;border-radius:12px;
  font-size:13.5px;font-weight:600;line-height:1.45;
  box-shadow:0 6px 22px rgba(0,0,0,.20);max-width:min(80vw,340px);
  border-left:3px solid transparent;
  animation:toast-in .22s cubic-bezier(.2,.9,.3,1);
}
.toast.out{opacity:0;transform:translateX(14px);transition:opacity .18s,transform .18s}
.toast-t{font-size:11.5px;font-weight:800;opacity:.72;margin-bottom:2px;letter-spacing:.2px}
.toast.t-good{border-left-color:var(--green)}
.toast.t-warn{border-left-color:var(--amber)}
.toast.t-bad{border-left-color:var(--red)}
@keyframes toast-in{from{opacity:0;transform:translateX(20px) scale(.97)}to{opacity:1;transform:none}}
@media (max-width:700px){
  .toast-stack{right:10px;left:10px;bottom:calc(80px + var(--safe-b));align-items:stretch}
  .toast{max-width:none}
}
@media (prefers-reduced-motion:reduce){ .toast{animation:none} }
.offline-bar{background:var(--amber-bg);color:#8A5A00;font-size:13px;font-weight:700;padding:11px 24px;text-align:center}

/* ---------------- 시트 ---------------- */
.sheet-back{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:150;display:flex;align-items:flex-end}
.sheet{
  background:var(--surface);width:100%;border-radius:var(--r-sheet) var(--r-sheet) 0 0;
  padding:8px 20px calc(24px + var(--safe-b));max-height:88vh;overflow-y:auto;
}
.sheet-grip{width:40px;height:4px;border-radius:2px;background:var(--border);margin:8px auto 12px}
.sheet-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}
.sheet-t{font-size:20px;font-weight:800;letter-spacing:-0.5px;line-height:1.3}
.sheet-x{
  border:0;background:var(--bg);border-radius:50%;width:34px;height:34px;flex:0 0 34px;
  color:var(--t3);font-size:17px;cursor:pointer;display:flex;align-items:center;justify-content:center;
}
@media (min-width:768px){
  .sheet-back{align-items:center;justify-content:center;padding:24px}
  .sheet{max-width:520px;border-radius:var(--r-sheet);padding-bottom:24px}
  .sheet-grip{display:none}
}

.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px 12px}
.kv-l{font-size:12.5px;color:var(--t3);font-weight:600}
.kv-v{font-size:15px;font-weight:700;color:var(--t1);margin-top:3px;font-variant-numeric:tabular-nums;word-break:keep-all}

/* 숫자 입력 */
.price-display{
  background:var(--bg);border-radius:16px;padding:22px;text-align:center;
  font-size:34px;font-weight:800;letter-spacing:-1.4px;font-variant-numeric:tabular-nums;color:var(--t1);
}
.price-display.empty-val{color:var(--t4)}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.keypad button{
  min-height:56px;border:0;background:var(--bg);border-radius:14px;
  font-size:20px;font-weight:700;color:var(--t1);cursor:pointer;
}
.keypad button:active{background:var(--border)}
.quick-amounts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}

/* ---------------- 모바일 ---------------- */
.bottomnav{display:none}

@media (max-width:1023px){
  .content{padding:20px 20px 56px}
  .topbar{padding:10px 20px}
}

@media (max-width:767px){
  .sb{display:none}
  .topbar{padding:10px 16px;padding-top:calc(10px + var(--safe-t));min-height:58px}
  .content{padding:14px 16px calc(100px + var(--safe-b));gap:10px}
  .ph-t{font-size:23px}
  .phead{padding:0 0 4px}
  .card-h{padding:18px 18px 4px}
  .card-b{padding:14px 18px 18px}
  .list-row{padding:15px 18px;gap:12px}
  .lr-s{font-size:13.5px}
  .lr-avatar{width:38px;height:38px;flex:0 0 38px;border-radius:12px;font-size:14px}
  .list-row:not(:last-child)::after{left:18px;right:18px}
  .alert-i{padding:15px 18px}
  .alert-i:not(:last-child)::after{left:18px;right:18px}
  .grid-kpi{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .kpi{padding:16px}
  .kpi-v{font-size:25px}
  .hero-v{font-size:32px}
  .desktop-table{display:none}
  .prop-select{max-width:none;flex:1;min-width:0}
  .tb-right .btn{padding:0 12px;min-height:40px;font-size:13.5px}
  /* 도움말·소리·수동 새로고침은 더보기/설정과 브라우저 동작으로 접근한다.
     좁은 화면 상단에 모두 두면 숙소명이 사라지고 가로 스크롤이 생긴다. */
  .tb-right > .btn{display:none}
  .filters{width:100%}
  .filters .field{flex:1;min-width:0}
  .seg{width:100%}
  .seg button{flex:1}
  .chart-wrap svg{max-width:none}
  .chart-hint{display:block}
  .reasons{grid-template-columns:1fr}

  .bottomnav{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:120;
    background:var(--surface);border-top:1px solid var(--divider);
    padding:6px 4px calc(6px + var(--safe-b));
  }
  .bn-item{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    background:none;border:0;padding:7px 2px;min-height:56px;color:var(--t4);
    font-size:11px;font-weight:700;cursor:pointer;position:relative;
  }
  .bn-item.on{color:var(--blue-t)}
  .bn-badge{
    position:absolute;top:3px;right:calc(50% - 20px);min-width:18px;height:18px;padding:0 5px;
    background:var(--red);color:#fff;border-radius:9px;font-size:10.5px;font-weight:800;
    display:flex;align-items:center;justify-content:center;
  }
}

@media (min-width:768px) and (max-width:1023px){
  :root{--sb-w:76px}
  .sb-name,.sb-cap,.sb-foot,.sb-item span.label,.sb-item .soon-tag{display:none}
  .sb-brand{justify-content:center;padding:0 0 18px}
  .sb-item{justify-content:center;padding:12px 0}
  .sb-item .count-tag{position:absolute;top:6px;right:12px}
}

/* 표시가(정가) — 쿠폰·할인 전 가격을 지워서 보여준다 */
.strike { text-decoration: line-through; color: var(--t4); font-weight: 600; }

/* ── 내 숙소 요약 (주변 업장 화면의 첫 카드) ───────────────── */
.me-card { background: #fff; border-radius: var(--r-card); padding: 22px 24px 18px; }
.me-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.me-name { font-size: 15px; font-weight: 700; color: var(--t2); display: flex; align-items: center; gap: 8px; }
.me-price { font-size: 38px; font-weight: 800; letter-spacing: -1.6px; color: var(--t1); line-height: 1.15; margin-top: 6px; }
.me-sub { font-size: 13.5px; color: var(--t3); margin-top: 6px; font-weight: 600; }
.me-rank { text-align: right; }
.me-rank-v { font-size: 26px; font-weight: 800; letter-spacing: -1px; color:var(--blue-t); line-height: 1.2; }
.me-rank-l { font-size: 12.5px; color: var(--t3); font-weight: 600; margin-top: 2px; }

/* 시장 안에서 우리 위치를 한 줄로 */
.spread { margin-top: 18px; }
.spread-bar { position: relative; height: 6px; border-radius: 999px; background: var(--bg); }
.spread-fill { position: absolute; inset: 0; border-radius: 999px; background: linear-gradient(90deg, #DCE9FF, #B8D3FF); }
.spread-me { position: absolute; top: -5px; width: 16px; height: 16px; border-radius: 50%; background: var(--blue); border: 3px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.18); transform: translateX(-8px); }
.spread-ends { display: flex; justify-content: space-between; font-size: 12px; color: var(--t4); font-weight: 600; margin-top: 8px; }

/* 원인 배지 */
.cause { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 8px; }
.cause.sold { background: #FFF1E8; color: #C2410C; }
.cause.rate { background: #EEF2FF; color: #4338CA; }
.cause.supply { background: #ECFDF5; color: #047857; }

/* 후보 검토 줄 */
.cand-q { font-size: 14px; color: var(--t2); font-weight: 600; line-height: 1.5; }
.cand-q b { color: var(--t1); font-weight: 800; }

/* ── 운영 캘린더 ────────────────────────────────────────── */
.cal { background: #fff; border-radius: var(--r-card); padding: 18px; overflow: hidden; }
.cal-head { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin-bottom: 8px; }
.cal-dow { text-align: center; font-size: 12px; font-weight: 700; color: var(--t3); padding: 4px 0; }
.cal-dow.sun { color:var(--red-t); }
.cal-dow.sat { color:var(--blue-t); }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.cal-cell {
  min-height: 84px; border-radius: 12px; background: var(--bg); padding: 7px 8px;
  display: flex; flex-direction: column; gap: 4px; cursor: pointer;
  border: 2px solid transparent; text-align: left; font: inherit; color: inherit;
  min-width: 0; overflow: hidden;
}
.cal-cell:hover { background: #EDF0F3; }
.cal-cell.today { border-color: var(--blue); background: #fff; }
.cal-cell.out { opacity: .35; }
.cal-d { font-size: 13px; font-weight: 700; color: var(--t2); }
.cal-cell.sun .cal-d { color:var(--red-t); }
.cal-cell.sat .cal-d { color:var(--blue-t); }
.cal-tags { display: flex; flex-direction: column; gap: 3px; overflow: hidden; }
.cal-tag {
  font-size: 11px; font-weight: 700; border-radius: 6px; padding: 2px 5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cal-tag.ev { background: #FFF1E8; color: #C2410C; }
.cal-tag.ar { background: #E8F0FF; color: #1D5BF0; }
.cal-tag.me { background: #ECFDF5; color: #047857; }
.cal-more { font-size: 10.5px; color: var(--t4); font-weight: 700; }

/* 달력 칸의 입실·메모 — 글자로 늘어놓지 않고 숫자와 표로 줄인다 */
.cal-marks{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.cal-m{font-size:10.5px;font-weight:800;border-radius:5px;padding:1px 5px;white-space:nowrap}
.cal-m.ar{background:#E8F0FF;color:var(--blue-t)}
.cal-m.me{background:#ECFDF5;color:var(--green-t)}
/* 행사 제목은 두 줄까지 보여 준다. 한 줄로 자르면 무슨 행사인지 모른다. */
.cal-tag.ev{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  line-height:1.3;max-height:2.6em}

@media (max-width: 640px) {
  .cal { padding: 12px; }
  .cal-cell { min-height: 62px; padding: 5px 5px; }
  .cal-tag { font-size: 10px; padding: 1px 4px; }
}

/* 하루 상세 */
.day-sec { margin-bottom: 18px; }
.day-sec-h { font-size: 13px; font-weight: 800; color: var(--t3); margin-bottom: 8px; }
.arr-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: var(--bg); border-radius: 12px; margin-bottom: 6px; }
.arr-row.done { opacity: .5; }
.arr-t { font-size: 15px; font-weight: 800; color: var(--t1); min-width: 46px; }
.arr-m { flex: 1; min-width: 0; }
.arr-n { font-size: 14.5px; font-weight: 700; color: var(--t1); }
.arr-s { font-size: 12.5px; color: var(--t3); margin-top: 2px; }
.memo-row { padding: 12px 14px; background: var(--bg); border-radius: 12px; margin-bottom: 6px; font-size: 14.5px; color: var(--t1); line-height: 1.55; white-space: pre-wrap; }

/* ── 도움말 하이라이트 ──────────────────────────────────── */
.tour-mask { position: fixed; inset: 0; z-index: 300; pointer-events: auto; }
.tour-dim { position: absolute; background: rgba(15, 23, 32, .58); transition: all .18s ease; }
.tour-ring {
  position: absolute; border-radius: 14px; box-shadow: 0 0 0 3px var(--blue), 0 0 0 9px rgba(49,130,246,.25);
  transition: all .18s ease; pointer-events: none;
}
.tour-card {
  position: absolute; z-index: 301; width: min(340px, calc(100vw - 32px));
  background: #fff; border-radius: 18px; padding: 18px 20px 16px;
  box-shadow: 0 12px 40px rgba(0,0,0,.24); transition: all .18s ease;
}
.tour-step { font-size: 12px; font-weight: 800; color:var(--blue-t); letter-spacing: .2px; }
.tour-t { font-size: 17px; font-weight: 800; color: var(--t1); margin-top: 6px; letter-spacing: -.4px; }
.tour-b { font-size: 14px; color: var(--t2); line-height: 1.6; margin-top: 8px; white-space: pre-line; }
.tour-do { margin-top: 12px; padding: 11px 13px; background: var(--blue-bg); border-radius: 12px;
           font-size: 13.5px; font-weight: 700; color: #1D4ED8; line-height: 1.5; }
.tour-nav { display: flex; align-items: center; gap: 8px; margin-top: 16px; }
.tour-dots { display: flex; gap: 5px; flex: 1; }
.tour-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--t4); opacity: .35; }
.tour-dot.on { opacity: 1; background: var(--blue); width: 18px; border-radius: 3px; }

/* 도움말 목록 */
.help-item { display: flex; gap: 12px; padding: 14px 0; align-items: flex-start; }
.help-ic {
  width: 34px; height: 34px; border-radius: 10px; background: var(--blue-bg); color:var(--blue-t);
  display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; flex: none;
}
.help-t { font-size: 15px; font-weight: 700; color: var(--t1); }
.help-b { font-size: 13.5px; color: var(--t3); line-height: 1.55; margin-top: 3px; }

/* ── 로그인 ────────────────────────────────────────────── */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--bg); }
.login-box { width: min(400px, 100%); background: #fff; border-radius: 22px; padding: 32px 28px; box-shadow: 0 8px 30px rgba(0,0,0,.06); }
.login-mark { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.login-logo { width: 38px; height: 38px; border-radius: 11px; background: var(--blue); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 17px; }
.login-t { font-size: 21px; font-weight: 800; color: var(--t1); letter-spacing: -.6px; }
.login-s { font-size: 13.5px; color: var(--t3); margin-top: 4px; line-height: 1.55; }
.login-err { background: #FFF0F0; color: #C2262B; font-size: 13.5px; font-weight: 600; border-radius: 12px; padding: 11px 14px; margin-bottom: 12px; line-height: 1.5; }
.login-tabs { display: flex; gap: 6px; margin-bottom: 18px; }
.login-tab { flex: 1; padding: 10px; border-radius: 12px; border: 0; background: var(--bg); font: inherit; font-weight: 700; font-size: 14px; color: var(--t3); cursor: pointer; }
.login-tab.on { background: var(--blue-bg); color:var(--blue-t); }
.pin-people { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; max-height: 190px; overflow-y: auto; }
.pin-person { display: flex; align-items: center; gap: 10px; padding: 11px 13px; border-radius: 12px; background: var(--bg); border: 2px solid transparent; cursor: pointer; font: inherit; text-align: left; }
.pin-person.on { border-color: var(--blue); background: #fff; }
.pin-name { font-size: 14.5px; font-weight: 700; color: var(--t1); flex: 1; }
.pin-dots { display: flex; gap: 9px; justify-content: center; margin: 14px 0 4px; }
.pin-dot { width: 13px; height: 13px; border-radius: 50%; background: var(--bg); border: 2px solid var(--t4); }
.pin-dot.on { background: var(--blue); border-color: var(--blue); }

/* 상단바 계정 */
.who { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; color: var(--t2); }
.who-av { width: 26px; height: 26px; border-radius: 50%; background: var(--blue-bg); color:var(--blue-t); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; }

/* ── 객실 현황판 ────────────────────────────────────────── */
.rb-counts { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; margin-bottom: 16px; }
.rb-c { background: #fff; border-radius: 14px; padding: 12px 14px; }
.rb-c-v { font-size: 22px; font-weight: 800; color: var(--t1); letter-spacing: -.6px; }
.rb-c-l { font-size: 12px; color: var(--t3); font-weight: 700; margin-top: 2px; }
.rb-c.warn .rb-c-v { color: #C2410C; }
.rb-c.ok .rb-c-v { color: #047857; }

.rb-floor { font-size: 12.5px; font-weight: 800; color: var(--t3); margin: 16px 0 8px; }
.rb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 8px; }
.rb-room {
  position: relative;
  border-radius: 14px; padding: 12px 12px 10px; background: var(--bg); border: 2px solid transparent;
  cursor: pointer; text-align: left; font: inherit; min-height: 88px;
  display: flex; flex-direction: column; gap: 3px;
}
.rb-no { font-size: 18px; font-weight: 800; color: var(--t1); letter-spacing: -.5px; }
.rb-st { font-size: 12px; font-weight: 700; }
.rb-sub { font-size: 11.5px; color: var(--t3); font-weight: 600; margin-top: auto; }
.rb-room.free { background: #F0FDF4; } .rb-room.free .rb-st { color: #047857; }
.rb-room.use { background: #EFF4FF; } .rb-room.use .rb-st { color: #1D4ED8; }
.rb-room.day { background: #FFF7ED; } .rb-room.day .rb-st { color: #C2410C; }
.rb-room.clean { background: #FEF3C7; } .rb-room.clean .rb-st { color: #92400E; }
.rb-room.block { background: #F3F4F6; opacity: .7; } .rb-room.block .rb-st { color: var(--t3); }
.rb-room.over { border-color: #E5484D; }
.rb-time { font-size: 13px; font-weight: 800; }
.rb-time.soon { color: #C2410C; }
.rb-time.over { color:var(--red-t); }

/* ── 프런트 대시보드 ────────────────────────────────────── */
.dash { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin-bottom: 14px; }
.dash-c { background: #fff; border-radius: 18px; padding: 16px 18px; }
.dash-l { font-size: 12.5px; font-weight: 700; color: var(--t3); }
.dash-v { font-size: 26px; font-weight: 800; color: var(--t1); letter-spacing: -.9px; margin-top: 4px; line-height: 1.2; }
.dash-v small { font-size: 14px; font-weight: 700; color: var(--t3); margin-left: 3px; letter-spacing: 0; }
.dash-d { font-size: 12.5px; color: var(--t3); margin-top: 5px; font-weight: 600; line-height: 1.5; }
.dash-c.hot .dash-v { color: #C2410C; }
.dash-c.good .dash-v { color: #047857; }
.dash-read { font-size: 13px; color: var(--t2); line-height: 1.6; background: var(--bg); border-radius: 12px; padding: 11px 13px; margin-top: 10px; }

/* 요금 줄 */
.chg { display: flex; justify-content: space-between; align-items: baseline; padding: 8px 0; font-size: 14.5px; }
.chg-l { color: var(--t2); font-weight: 600; }
.chg-a { font-weight: 700; color: var(--t1); }
.chg.total { border-top: 1px solid #EEF1F4; margin-top: 6px; padding-top: 12px; }
.chg.total .chg-l { font-weight: 800; color: var(--t1); font-size: 15px; }
.chg.total .chg-a { font-size: 21px; font-weight: 800; letter-spacing: -.6px; }
.pay-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 12px; }

/* ── Today's Action Board ────────────────────────────────── */
.ab-head { margin-bottom: 18px; }
.ab-t { font-size: 27px; font-weight: 800; color: var(--t1); letter-spacing: -1.1px; line-height: 1.2; }
.ab-en { font-size: 12.5px; font-weight: 700; color: var(--t4); letter-spacing: .3px; margin-top: 5px; }

.acard { background: #fff; border-radius: var(--r-card); padding: 20px 22px; margin-bottom: 10px; border-left: 4px solid var(--t4); }
.acard.HIGH { border-left-color: var(--red); }
.acard.MEDIUM { border-left-color: var(--amber); }
.acard.EVENT { border-left-color: var(--violet); }
.acard.LOW, .acard.INFO { border-left-color: var(--t4); }

.acard-top { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 12px; }
.acard-lv { font-size: 11px; font-weight: 800; letter-spacing: .4px; padding: 3px 9px; border-radius: 7px; }
.acard.HIGH .acard-lv { background: var(--red-bg); color: #C2262B; }
.acard.MEDIUM .acard-lv { background: var(--amber-bg); color: #B45309; }
.acard.EVENT .acard-lv { background: var(--violet-bg); color: #5B44CC; }
.acard.LOW .acard-lv, .acard.INFO .acard-lv { background: var(--bg); color: var(--t3); }
.acard-ti { font-size: 17.5px; font-weight: 800; color: var(--t1); letter-spacing: -.5px; flex: 1; min-width: 0; }
.acard-cf { font-size: 11.5px; font-weight: 700; color: var(--t3); white-space: nowrap; }

.acard-row { display: grid; grid-template-columns: 58px 1fr; gap: 10px; padding: 5px 0; align-items: baseline; }
.acard-k { font-size: 11.5px; font-weight: 800; color: var(--t4); letter-spacing: .2px; }
.acard-v { font-size: 14.5px; color: var(--t2); line-height: 1.6; }

.acard-ev { background: var(--bg); border-radius: 12px; padding: 11px 14px; margin: 10px 0 0; }
.acard-ev-r { display: flex; justify-content: space-between; align-items: baseline; padding: 3px 0; font-size: 13.5px; gap: 12px; }
.acard-ev-l { color: var(--t3); font-weight: 600; }
.acard-ev-v { color: var(--t1); font-weight: 800; text-align: right; }
.acard-ev-s { color: var(--t4); font-weight: 600; font-size: 12px; margin-left: 5px; }

.acard-do { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.acard-cfn { font-size: 12px; color: var(--t4); margin-top: 10px; line-height: 1.55; }

.ab-clear { background: #fff; border-radius: var(--r-card); padding: 34px 24px; text-align: center; }
.ab-clear-i { font-size: 30px; margin-bottom: 10px; }
.ab-clear-t { font-size: 16px; font-weight: 800; color: var(--t1); }
.ab-clear-b { font-size: 13.5px; color: var(--t3); margin-top: 6px; line-height: 1.6; }

/* KPI 4칸 */
.kpi4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 10px; margin: 18px 0 14px; }
.kpi4-c { background: #fff; border-radius: 18px; padding: 16px 18px; }
.kpi4-l { font-size: 12px; font-weight: 700; color: var(--t3); }
.kpi4-v { font-size: 24px; font-weight: 800; color: var(--t1); letter-spacing: -.9px; margin-top: 5px; line-height: 1.2; }
.kpi4-v small { font-size: 13px; font-weight: 700; color: var(--t3); margin-left: 3px; letter-spacing: 0; }
.kpi4-d { font-size: 12.5px; margin-top: 5px; font-weight: 600; color: var(--t3); }
.kpi4-d.up { color:var(--red-t); } .kpi4-d.dn { color:var(--blue-t); }
.kpi4-c.empty .kpi4-v { color: var(--t4); font-size: 17px; }

/* 미니 차트 3칸 */
.mini3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.mini-c { background: #fff; border-radius: 18px; padding: 16px 18px; }
.mini-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; }
.mini-t { font-size: 13.5px; font-weight: 800; color: var(--t1); }
.mini-a { font-size: 12px; font-weight: 700; color:var(--blue-t); background: none; border: 0; cursor: pointer; padding: 0; }
.mini-r { font-size: 12.5px; color: var(--t3); line-height: 1.55; margin-top: 9px; }
.mini-empty { font-size: 12.5px; color: var(--t4); padding: 18px 0; text-align: center; line-height: 1.6; }

/* ── 가격 포지션 ────────────────────────────────────────── */
.pos { background: #fff; border-radius: var(--r-card); padding: 24px 26px; }
.pos-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.pos-l { font-size: 12.5px; font-weight: 700; color: var(--t3); }
.pos-v { font-size: 38px; font-weight: 800; color: var(--t1); letter-spacing: -1.6px; line-height: 1.15; margin-top: 5px; }
.pos-tag { display: inline-block; font-size: 13px; font-weight: 800; padding: 6px 13px; border-radius: 10px; margin-top: 9px; }
/* 적게 받는 중 = 주의. 더 받는 중 = 정보. 싼 것이 파란색이면 안 된다. */
.pos-tag.under { background: var(--amber-bg); color: #8A5A00; }
.pos-tag.over  { background: var(--blue-bg); color: var(--blue-dk); }
.pos-tag.mid   { background: var(--bg); color: var(--t2); }
.pos-head { margin-top: 12px; background: var(--amber-bg); border-radius: 12px; padding: 11px 14px; }
.pos-head.over { background: var(--blue-bg); }
.pos-head-l { font-size: 11.5px; font-weight: 700; color: #8A5A00; }
.pos-head.over .pos-head-l { color: var(--blue-dk); }
.pos-head-v { font-size: 17px; font-weight: 800; color: var(--t1); margin-top: 2px; }
.pos-gap { text-align: right; }
.pos-gap-v { font-size: 27px; font-weight: 800; letter-spacing: -1px; line-height: 1.2; }
.pos-gap-v.over { color:var(--blue-t); } .pos-gap-v.under { color:var(--amber-t); }
.pos-gap-l { font-size: 12.5px; color: var(--t3); font-weight: 600; margin-top: 3px; }
.pos-read { font-size: 13.5px; color: var(--t2); line-height: 1.6; background: var(--bg); border-radius: 12px; padding: 12px 15px; margin-top: 18px; }

/* 플랫폼별 가격표 */
.plat { width: 100%; border-collapse: collapse; font-size: 14px; }
.plat th { text-align: right; font-size: 11.5px; font-weight: 700; color: var(--t3); padding: 0 0 9px; }
.plat th:first-child { text-align: left; }
.plat td { padding: 11px 0; border-top: 1px solid var(--divider); text-align: right; }
.plat td:first-child { text-align: left; font-weight: 700; color: var(--t1); }
.plat .rack { color: var(--t4); text-decoration: line-through; font-weight: 600; }
.plat .cpn { color:var(--blue-t); font-weight: 700; }
.plat .fin { font-weight: 800; color: var(--t1); font-size: 15.5px; }
.plat tr.best td { background: #F5F9FF; }
.plat .badge { font-size: 10.5px; font-weight: 800; color:var(--blue-t); background: var(--blue-bg); padding: 2px 6px; border-radius: 6px; margin-left: 6px; }

/* 경쟁 변동표 */
.trend { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.trend th { text-align: right; font-size: 11.5px; font-weight: 700; color: var(--t3); padding: 0 0 9px; }
.trend th:first-child { text-align: left; }
.trend td { padding: 10px 0; border-top: 1px solid var(--divider); text-align: right; }
.trend td:first-child { text-align: left; }
.trend .nm { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--t1); }
.trend .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.trend .up { color:var(--red-t); font-weight: 700; }
.trend .dn { color:var(--blue-t); font-weight: 700; }
.trend .flat { color: var(--t4); }
.trend .none { color: var(--t4); font-size: 12px; }

/* ── Data Hub ───────────────────────────────────────────── */
.hub-top { background: #fff; border-radius: var(--r-card); padding: 22px 26px; margin-bottom: 12px; }
.hub-pct { font-size: 34px; font-weight: 800; letter-spacing: -1.4px; color: var(--t1); line-height: 1.15; }
.hub-pct small { font-size: 15px; color: var(--t3); font-weight: 700; margin-left: 4px; letter-spacing: 0; }
.hub-bar { height: 8px; border-radius: 999px; background: var(--bg); overflow: hidden; margin: 14px 0 10px; display: flex; }
.hub-seg { height: 100%; }
.hub-seg.on { background: var(--blue); }
.hub-seg.part { background: #A9C9F8; }
.hub-legend { display: flex; gap: 16px; font-size: 12.5px; color: var(--t3); font-weight: 600; flex-wrap: wrap; }
.hub-legend i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; margin-right: 5px; }

.src { background: #fff; border-radius: 16px; padding: 17px 19px; margin-bottom: 10px;
  display: flex; flex-direction: column; align-items: stretch; }
.src-h { display: flex; align-items: baseline; gap: 8px 10px; flex-wrap: wrap; }
.src-n { font-size: 15.5px; font-weight: 800; color: var(--t1); flex: none; }
.src-a { font-size: 12.5px; color: var(--t3); font-weight: 600; flex: 1 1 140px; min-width: 0;
  line-height: 1.5; }
.src-st { font-size: 11.5px; font-weight: 800; padding: 3px 9px; border-radius: 7px;
  white-space: nowrap; flex: none; align-self: center; }
.src-st.CONNECTED { background: var(--green-bg); color: #0A7A5C; }
.src-st.PARTIAL { background: var(--amber-bg); color: #B45309; }
.src-st.STALE { background: var(--red-bg); color: #C2262B; }
.src-st.EMPTY { background: var(--bg); color: var(--t3); }
.src-m { display: grid; grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 6px 16px; margin-top: 13px; }
.src-m-l { font-size: 11px; font-weight: 700; color: var(--t4); line-height: 1.4; }
.src-m-v { font-size: 14.5px; font-weight: 800; color: var(--t1); margin-top: 2px;
  line-height: 1.35; font-variant-numeric: tabular-nums; }
.src-m-v.dim { color: var(--t4); font-weight: 700; font-size: 13px; }

.src-ways { margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--divider);
  display: flex; flex-direction: column; gap: 9px; }
.src-way { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; }
.src-way-i { width: 15px; text-align: center; font-size: 11px; flex: none;
  line-height: 1.5; padding-top: 1px; }
.src-way.on .src-way-i { color:var(--green-t); }
.src-way.off .src-way-i { color: var(--t4); }
.src-way-b { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline;
  gap: 2px 8px; }
.src-way-t { font-weight: 700; color: var(--t1); flex: none; line-height: 1.5; }
.src-way-n { color: var(--t3); flex: 1 1 200px; min-width: 0; line-height: 1.5;
  font-size: 12.5px; }
.src-way .btn.xs { flex: none; align-self: flex-start; }
.src-way.soon .src-way-t, .src-way.soon .src-way-n { color: var(--t4); }
.src-blocks { font-size: 12px; color: var(--t4); margin-top: 11px; line-height: 1.55;
  padding-top: 10px; border-top: 1px dashed var(--divider); }

/* Revenue Timeline */
.tl { position: relative; padding-left: 4px; }
.tl-row { display: grid; grid-template-columns: 52px 22px 1fr; gap: 10px; align-items: flex-start; padding: 9px 0; }
.tl-t { font-size: 12.5px; font-weight: 800; color: var(--t3); padding-top: 2px; text-align: right; }
.tl-i { position: relative; display: flex; justify-content: center; padding-top: 4px; }
.tl-i::before { content: ''; position: absolute; top: 14px; bottom: -18px; width: 2px; background: var(--divider); }
.tl-row:last-child .tl-i::before { display: none; }
.tl-dot { width: 10px; height: 10px; border-radius: 50%; z-index: 1; background: var(--t4); }
.tl-dot.COMPETITOR_PRICE { background: #F59F00; }
.tl-dot.OUR_PRICE { background: var(--blue); width: 13px; height: 13px; }
.tl-dot.RESERVATION { background: var(--green); }
.tl-dot.DAY_USE_IN, .tl-dot.DAY_USE_OUT { background: var(--violet); }
.tl-dot.REVENUE { background: var(--navy); }
.tl-dot.EVENT { background: #E5484D; }
.tl-b { min-width: 0; }
.tl-k { font-size: 11px; font-weight: 800; color: var(--t4); letter-spacing: .2px; }
.tl-s { font-size: 14.5px; font-weight: 700; color: var(--t1); margin-top: 1px; }
.tl-x { font-size: 13.5px; color: var(--t2); margin-top: 2px; line-height: 1.5; }
.tl-n { font-size: 12px; color: var(--t4); margin-top: 3px; line-height: 1.5; }
.tl-row.ours .tl-s { color: var(--blue-dk); }

.tl-days { display: flex; gap: 5px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 14px; }
.tl-day { flex: none; min-width: 52px; padding: 8px 6px; border-radius: 11px; background: var(--bg); border: 2px solid transparent; cursor: pointer; text-align: center; font: inherit; }
.tl-day.on { border-color: var(--blue); background: #fff; }
.tl-day-d { font-size: 12.5px; font-weight: 800; color: var(--t1); }
.tl-day-n { font-size: 11px; color: var(--t3); font-weight: 600; margin-top: 2px; }
.tl-day.empty .tl-day-d, .tl-day.empty .tl-day-n { color: var(--t4); }

/* ── 예약 반응 ──────────────────────────────────────────── */
.move { background: #fff; border-radius: 16px; padding: 16px 18px; margin-bottom: 8px; }
.move-h { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.move-t { font-size: 12.5px; font-weight: 800; color: var(--t3); }
.move-p { font-size: 15.5px; font-weight: 800; color: var(--t1); }
.move-d { font-size: 13px; font-weight: 800; }
.move-d.up { color:var(--red-t); } .move-d.dn { color:var(--blue-t); }
.move-c { font-size: 11.5px; font-weight: 700; background: var(--bg); color: var(--t2); padding: 3px 8px; border-radius: 7px; }
.move-b { display: grid; grid-template-columns: 1fr 26px 1fr; gap: 8px; align-items: center; margin-top: 13px; }
.move-side { background: var(--bg); border-radius: 12px; padding: 11px 13px; text-align: center; }
.move-side.after { background: var(--blue-bg); }
.move-side-l { font-size: 11px; font-weight: 700; color: var(--t3); }
.move-side-v { font-size: 19px; font-weight: 800; color: var(--t1); margin-top: 3px; }
.move-side.after .move-side-v { color: var(--blue-dk); }
.move-side-s { font-size: 11.5px; color: var(--t3); margin-top: 2px; font-weight: 600; }
.move-ar { text-align: center; color: var(--t4); font-size: 15px; font-weight: 800; }

.mem { background: #fff; border-radius: 16px; padding: 16px 18px; margin-bottom: 8px; }
.mem-h { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; margin-bottom: 11px; }
.mem-t { font-size: 15px; font-weight: 800; color: var(--t1); flex: 1; min-width: 0; }
.mem-d { font-size: 12.5px; font-weight: 800; color:var(--violet-t); background: var(--violet-bg); padding: 3px 9px; border-radius: 7px; }
.mem-g { display: grid; grid-template-columns: repeat(auto-fit, minmax(94px, 1fr)); gap: 10px; }
.mem-l { font-size: 11px; font-weight: 700; color: var(--t4); }
.mem-v { font-size: 15px; font-weight: 800; color: var(--t1); margin-top: 2px; }
.mem-v.dim { color: var(--t4); font-weight: 700; font-size: 13px; }

/* ── 객실 편집 / 문·키 신호 ─────────────────────────────── */
.edit-bar{
  background:var(--navy);color:#fff;border-radius:16px;padding:14px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.edit-t{font-size:14.5px;font-weight:800}
.edit-s{font-size:12px;opacity:.72;margin-top:2px;line-height:1.5}
.edit-a{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.edit-n{font-size:12.5px;font-weight:800;opacity:.85}
.edit-bar .btn.ghost{background:rgba(255,255,255,.14);color:#fff;border-color:transparent}
.warn-box{background:var(--red-bg);border-radius:12px;padding:13px 15px;font-size:13.5px;color:#8A2226;line-height:1.6}
.warn-box b{display:block;font-size:15px;margin-bottom:4px}

.rb-room.editing{cursor:pointer}
.rb-room.editing:hover{outline:2px solid var(--blue);outline-offset:-2px}
.rb-room.picked{outline:2px solid var(--red);outline-offset:-2px;background:var(--red-bg)}
.rb-pick{
  position:absolute;top:7px;right:8px;width:19px;height:19px;border-radius:6px;
  border:1.5px solid var(--t4);display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:900;color:#fff;line-height:1;
}
.rb-room.picked .rb-pick{background:var(--red);border-color:var(--red)}
.rb-sig{position:absolute;top:6px;right:7px;display:flex;gap:3px;font-size:11px;line-height:1}
.sig{opacity:.34;filter:grayscale(1)}
.sig.open{opacity:1;filter:none}
.sig.key{opacity:1;filter:none}
.sig.out{opacity:.45}
.sig.clean{opacity:1;filter:none}
.sig.dnd{opacity:1;filter:none}
.sig-list{display:flex;flex-direction:column;gap:1px}
.sig-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.sig-row:last-child{border-bottom:none}
.sig-l{font-size:13.5px;font-weight:700;color:var(--t1)}
.sig-t{font-size:12.5px;color:var(--t3);font-weight:600;white-space:nowrap}
.field-h{font-size:11.5px;color:var(--t3);font-weight:600;line-height:1.5;margin-top:4px;display:block}

/* ── 채널 최적화 ────────────────────────────────────────── */
.grid-f{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:11px}
.ch-scroll{overflow-x:auto;margin:0 -2px}
.ch-t{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}
.ch-t th{
  text-align:left;font-size:11px;font-weight:800;color:var(--t3);padding:0 10px 9px;
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.ch-t th.n,.ch-t td.n{text-align:right;font-variant-numeric:tabular-nums}
.ch-t td{padding:13px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.ch-t tbody tr:last-child td{border-bottom:none}
.ch-r{cursor:pointer}
.ch-r:hover{background:var(--bg)}
.ch-r:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.ch-r.off{opacity:.5}
.ch-n{font-weight:800;color:var(--t1);font-size:14px}
.ch-sub{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:2px}
.ch-t td.n b{font-size:14.5px;font-weight:800;color:var(--t1)}
.ch-gap{font-size:11.5px;font-weight:800;margin-top:2px}
.ch-gap.bad{color:var(--red-t)} .ch-gap.ok{color:var(--green-t)}
.need{color:var(--t4);font-weight:700;font-size:12.5px}

.warn-line{
  background:var(--amber-bg);color:#8A5A00;border-radius:10px;padding:10px 13px;
  font-size:12.5px;font-weight:600;line-height:1.6;margin-top:8px;
}

.calc{background:var(--bg);border-radius:14px;padding:6px 15px}
.calc-r{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 0;border-bottom:1px solid var(--line)}
.calc-r:last-child{border-bottom:none}
.calc-r.last{border-top:2px solid var(--navy);margin-top:2px;padding-top:13px}
.calc-l{font-size:13.5px;font-weight:600;color:var(--t2)}
.calc-note{font-size:11px;color:var(--t4);font-weight:600;margin-left:7px}
.calc-v{font-size:14.5px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums;white-space:nowrap}
.calc-v.neg{color:var(--red-t)}
.calc-r.last .calc-v{font-size:19px}
.kvline{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--t2);font-weight:600}
.kvline:last-child{border-bottom:none}
.kvline b{color:var(--t1);font-weight:800;font-variant-numeric:tabular-nums}

.lock-row{display:flex;gap:11px;align-items:flex-start;background:var(--bg);border-radius:12px;padding:13px 15px;cursor:pointer}
.lock-row input{margin-top:2px;width:17px;height:17px;flex-shrink:0}
.lock-t{font-size:13.5px;font-weight:800;color:var(--t1)}
.lock-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:2px;line-height:1.5}

.apply-box{background:var(--navy);color:#fff;border-radius:14px;padding:15px 17px}
.apply-t{font-size:14px;font-weight:800}
.apply-s{font-size:12px;opacity:.72;margin-top:4px;line-height:1.6;margin-bottom:12px}
.apply-box .btn{background:#fff;color:var(--navy)}

.alert-row{display:flex;justify-content:space-between;align-items:center;gap:14px;border-radius:12px;padding:13px 15px}
.alert-row.bad{background:var(--red-bg)} .alert-row.warn{background:var(--amber-bg)}
/* .alert-row 안의 제목. 알림 목록의 .alert-t 와 이름이 겹치면 안 된다 —
   겹치는 동안 알림 목록 제목이 15px 에서 13.5px 로 줄어 있었다. */
.arow-t{font-size:13.5px;font-weight:800;color:var(--t1)}
.alert-s{font-size:12px;color:var(--t2);font-weight:600;margin-top:3px;line-height:1.5}
.alert-v{font-size:18px;font-weight:800;color:var(--red-t);white-space:nowrap}

.sim-out{min-height:44px}
.sim-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:9px}
.sim-c{background:var(--bg);border-radius:12px;padding:12px 13px}
.sim-n{font-size:11.5px;font-weight:800;color:var(--t3)}
.sim-p{font-size:17px;font-weight:800;color:var(--t1);margin-top:4px;font-variant-numeric:tabular-nums}
.sim-s{font-size:11.5px;color:var(--blue-dk);font-weight:700;margin-top:2px}
.sim-b{font-size:11.5px;color:var(--t4);font-weight:600;margin-top:6px;line-height:1.5}

.hist{display:flex;flex-direction:column}
.hist-r{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.hist-r:last-child{border-bottom:none}
.hist-t{font-size:11.5px;font-weight:800;color:var(--t3);white-space:nowrap;padding-top:2px;min-width:76px}
.hist-n{font-size:13.5px;font-weight:800;color:var(--t1)}
.hist-p{font-weight:800;color:var(--blue-dk);font-variant-numeric:tabular-nums}
.hist-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:3px;line-height:1.5}

.prev-h{background:var(--navy);color:#fff;border-radius:14px;padding:15px 17px}
.prev-l{font-size:11.5px;font-weight:700;opacity:.72}
.prev-v{font-size:22px;font-weight:800;margin-top:3px;font-variant-numeric:tabular-nums}
.prev-list{display:flex;flex-direction:column}
.prev-r{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.prev-r:last-child{border-bottom:none}
.prev-n{font-size:13.5px;font-weight:800;color:var(--t1)}
.prev-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:3px;line-height:1.5}
.prev-p{font-size:14px;font-weight:800;color:var(--t1);white-space:nowrap;font-variant-numeric:tabular-nums}

/* ── 링크 붙여넣기로 업장 추가 ─────────────────────────── */
.paste-row{display:flex;gap:8px;align-items:center}
.paste-row input{flex:1;min-width:0}
.paste-out:empty{display:none}
.paste-load{font-size:13px;color:var(--t3);font-weight:600;padding:12px 0}
.paste-card{background:var(--bg);border-radius:14px;padding:14px 16px;border:2px solid transparent}
.paste-card.ok{background:var(--blue-bg);border-color:rgba(49,130,246,.22)}
.paste-card.dim{opacity:.75}
.paste-h{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap}
.paste-n{font-size:16.5px;font-weight:800;color:var(--t1);letter-spacing:-.3px}
.paste-s{font-size:12.5px;color:var(--t2);font-weight:600;margin-top:4px;line-height:1.6}

/* ── 객실 현황판 v2 ─────────────────────────────────────── */
.rb-split{display:grid;grid-template-columns:1fr 316px;gap:14px;align-items:start}
.rb-col{display:flex;flex-direction:column;gap:12px;min-width:0}
@media (max-width:1080px){ .rb-split{grid-template-columns:1fr} }

/* 주변 업장 가격판 — 객실 현황 옆에 세워 둔다 */
.mk .card-b{padding-top:4px}
.mk-ch{display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  margin:12px 0 5px;padding-bottom:5px;border-bottom:1px solid var(--divider)}
.mk-ch:first-child{margin-top:0}
.mk-ch-n{font-size:12px;font-weight:800;color:var(--t2)}
.mk-ch-r{font-size:11px;font-weight:700;color:var(--t4);white-space:nowrap}
.mk-r{display:flex;align-items:baseline;gap:7px;padding:5px 0;font-size:12.5px;line-height:1.4}
.mk-n{flex:1;min-width:0;color:var(--t2);font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mk-p{font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums;white-space:nowrap}
.mk-d{font-size:10.5px;font-weight:800;white-space:nowrap}
.mk-d.up{color:var(--green-t)} .mk-d.dn{color:var(--red-t)}
.mk-r.self{background:var(--blue-bg);border-radius:8px;margin:2px -8px;padding:6px 8px}
.mk-r.self .mk-n{color:var(--blue-t);font-weight:800}
.mk-r.self .mk-p{color:var(--blue-t)}
.mk-off{font-size:11px;color:var(--t4);line-height:1.55;margin-top:12px;
  padding-top:10px;border-top:1px dashed var(--divider)}
.mk-none{font-size:12.5px;color:var(--t3);line-height:1.6;display:flex;
  flex-direction:column;gap:7px;align-items:flex-start;padding:6px 0}
.mk-none b{color:var(--t1);font-size:13.5px}
.mk-tag{font-size:10.5px;font-weight:700;color:var(--t4);background:var(--bg);
  border-radius:5px;padding:2px 6px;margin-left:6px}
.stack-s{display:flex;flex-direction:column;gap:6px}

.rb-legend{display:flex;gap:14px;flex-wrap:wrap;padding-bottom:14px;margin-bottom:2px;border-bottom:1px solid var(--line)}
/* 객실현황 범례 — 가격 그래프의 .lg 와 이름이 겹치면 안 된다 */
.rlg{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--t3)}
.rlg-d{width:10px;height:10px;border-radius:3px;display:inline-block}

/* 색: 멀리서 봐도 바로 안다 */
.rb-room.v-free{background:#E8F8EE}      .rb-room.v-free .rb-st{color:#0B7A45}
.rb-room.v-in{background:#FFF1E0}        .rb-room.v-in .rb-st{color:#B45309}
.rb-room.v-out{background:#26303C}       .rb-room.v-out .rb-st{color:#C9D4E2}
.rb-room.v-out .rb-no{color:#fff}        .rb-room.v-out .rb-sub{color:#8FA0B4}
.rb-room.v-dirty{background:#FDE7E9}     .rb-room.v-dirty .rb-st{color:#C2262B}
.rb-room.v-cleaning{background:#E4EFFE}  .rb-room.v-cleaning .rb-st{color:#1D4ED8}
.rb-room.v-blocked{background:#EFF1F4;opacity:.72} .rb-room.v-blocked .rb-st{color:var(--t3)}
.rlg-d.v-free{background:#38C172}.rlg-d.v-in{background:#F59F00}.rlg-d.v-out{background:#26303C}
.rlg-d.v-dirty{background:#F04452}.rlg-d.v-cleaning{background:#3182F6}.rlg-d.v-blocked{background:#C4CBD4}

.rb-room.drop{outline:3px dashed var(--blue);outline-offset:-3px;background:var(--blue-bg)}
body.dragging .rb-room.v-free{outline:2px dashed rgba(56,193,114,.5);outline-offset:-2px}

/* 오른쪽 버튼 메뉴 */
.ctx-menu{
  position:fixed;z-index:220;background:var(--surface);border-radius:13px;
  box-shadow:0 12px 40px rgba(0,0,0,.20);padding:6px;min-width:174px;
  border:1px solid var(--line);
}
.ctx-h{font-size:11px;font-weight:800;color:var(--t3);padding:7px 11px 6px}
.ctx-i{
  display:block;width:100%;text-align:left;background:none;border:none;font:inherit;
  padding:9px 11px;border-radius:9px;font-size:13.5px;font-weight:700;color:var(--t1);cursor:pointer;
}
.ctx-i:hover{background:var(--bg)}
.ctx-i.red{color:var(--red-t)} .ctx-i.green{color:#0B7A45}
.ctx-sep{height:1px;background:var(--line);margin:5px 8px}

/* 오늘 도착 명단 */
.arr-panel{position:sticky;top:14px;max-height:calc(100vh - 28px);overflow-y:auto}
.arr-empty{text-align:center;padding:26px 14px;font-size:13px;color:var(--t3);line-height:1.7}
.arr-empty b{display:block;font-size:14.5px;color:var(--t1);margin-bottom:6px}
.arr-empty .btn{margin-top:14px}
.arr-div{font-size:11px;font-weight:800;color:var(--t4);margin:14px 0 8px}
.arr-c{
  background:var(--bg);border-radius:12px;padding:11px 13px;margin-bottom:7px;
  cursor:grab;border:2px solid transparent;
}
.arr-c:active{cursor:grabbing}
.arr-c:hover{border-color:rgba(49,130,246,.3)}
.arr-c.done{opacity:.55;cursor:default}
.arr-c.late{border-color:rgba(240,68,82,.34)}
.arr-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:5px}
.arr-p{font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:6px;background:var(--navy);color:#fff}
.arr-p.pyanolja,.arr-p.pyanoljapartner{background:#FF3D4A}
.arr-p.pyeogi,.arr-p.pyeogipartner,.arr-p.pgoodchoice{background:#F03F5B}
.arr-p.pnaver,.arr-p.pnaverbooking{background:#03C75A}
.arr-p.pagoda{background:#5B4FE9}
.arr-p.ptripcom{background:#2577E3}
.arr-p.pbookingcom{background:#0C3B7C}
.arr-time{font-size:12.5px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
.arr-name{font-size:14.5px;font-weight:800;color:var(--t1)}
.arr-meta{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:3px;line-height:1.5}
.arr-in{font-size:11.5px;font-weight:800;color:var(--blue-dk);margin-top:6px}
.arr-late{font-size:11.5px;font-weight:800;color:var(--red-t);margin-top:6px}

/* ── 현황판 정리: 소음 줄이기 ─────────────────────────── */
.rb-bar{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:4px;
}
.rb-tally{display:flex;gap:16px;flex-wrap:wrap}
/* 객실현황의 시각 표시. Data Hub 타임라인 목록(.tl)과 이름이 겹치면
   그 목록이 inline-flex 가 돼 세로로 쌓이지 않는다. */
.rtl{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--t3)}
.tl b{font-size:16px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
.rlg-d.v-over{background:#F04452}.rlg-d.v-soon{background:#F59F00}
.rb-rate{font-size:12px;font-weight:800;color:var(--t3)}
.rb-legend{padding:14px 0 0;margin:14px 0 0;border-top:1px solid var(--line);border-bottom:none}

.fold{overflow:hidden}
.fold-h{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  background:none;border:none;font:inherit;cursor:pointer;padding:16px 20px;
  font-size:14px;font-weight:800;color:var(--t1);text-align:left;
}
.fold-h:hover{background:var(--bg)}
.fold-x{color:var(--t4);font-size:12px;transition:transform .18s}
.fold-h.open .fold-x{transform:rotate(180deg)}
.fold > div > .card{box-shadow:none;border-radius:0}

/* 칸 안쪽: 좁아도 안 깨지게 */
.rb-grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}
.rb-room{min-height:92px;padding:11px 11px 9px}
.rb-no{font-size:17px}
.rb-st{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rb-time{font-size:12.5px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.rb-time.soon{color:var(--amber-t)} .rb-time.over{color:var(--red-t)}
.rb-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 외출(검정) 칸 — 글씨가 보여야 한다 */
.rb-room.v-out .rb-time{color:#FFC97A}
.rb-room.v-out .rb-time.over{color:#FF8A8A}
.rb-room.v-out .rb-sub{color:#A9B8C9}
.rb-room.v-out .rb-pick{border-color:#6B7A8C}
.rb-room.v-out:hover{background:#31404F}

/* ── 후기 관리 ──────────────────────────────────────────── */
.rv-bar{display:flex;height:34px;border-radius:9px;overflow:hidden;gap:2px}
.rv-seg{display:flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:800;color:#fff;min-width:6px}
.rv-seg.pos{background:#12B886}.rv-seg.neu{background:#94A3B8}
.rv-seg.mix{background:#F59F00}.rv-seg.neg{background:#F04452}
.rv-plats{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:9px}
.rv-plat{background:var(--bg);border-radius:11px;padding:11px 13px}
.rv-plat-n{font-size:11.5px;font-weight:800;color:var(--t3)}
.rv-plat-v{font-size:18px;font-weight:800;color:var(--t1);margin-top:3px}
.rv-plat-s{font-size:11.5px;color:var(--t4);font-weight:600}

.tp-list{display:flex;flex-direction:column;gap:13px}
.tp-h{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.tp-n{font-size:13.5px;font-weight:800;color:var(--t1)}
.tp-c{font-size:11.5px;font-weight:700;color:var(--t3)}
.tp-bar{height:7px;background:var(--bg);border-radius:4px;overflow:hidden}
.tp-fill{position:relative;height:100%;background:#B9D4FB;border-radius:4px}
.tp-bad{position:absolute;inset:0 auto 0 0;background:var(--red);border-radius:4px}

.rv-list{display:flex;flex-direction:column;gap:9px}
.rv-c{background:var(--surface);border-radius:16px;padding:16px 18px;border-left:3px solid transparent}
.rv-c.human{border-left-color:var(--amber)}
.rv-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:9px}
.rv-star{font-size:13px;font-weight:800;color:#B45309}
.rv-when{font-size:13px;color:var(--t3);font-weight:600;margin-left:auto;font-variant-numeric:tabular-nums}
.rv-body{font-size:15px;color:var(--t1);line-height:1.8;white-space:pre-wrap;word-break:break-word}
.rv-topics{display:flex;gap:5px;flex-wrap:wrap;margin-top:9px}
.rv-t{font-size:11px;font-weight:700;color:var(--t3);background:var(--bg);padding:3px 8px;border-radius:6px}
.rv-reply{background:var(--bg);border-radius:12px;padding:12px 14px;margin-top:11px}
.rv-reply-h{font-size:11px;font-weight:800;color:var(--t3);margin-bottom:5px}
.rv-reply-b{font-size:13px;color:var(--t2);line-height:1.7;white-space:pre-wrap}
.rv-acts{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap}
.rv-extra{position:relative;font-size:13px;color:var(--t3)}
.rv-extra>summary{cursor:pointer;padding:7px 10px;border-radius:8px}
.rv-extra[open]>summary{background:var(--bg)}
.rv-extra-actions{display:flex;gap:7px;flex-wrap:wrap;padding:8px 0}
.rv-quote{background:var(--bg);border-radius:12px;padding:13px 15px;font-size:13.5px;color:var(--t2);line-height:1.7}
.rv-quote-h{font-size:11.5px;font-weight:800;color:var(--t3);margin-bottom:6px}
textarea{width:100%;font:inherit;font-size:14px;line-height:1.7;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);color:var(--t1);resize:vertical}
textarea:focus{outline:none;border-color:var(--blue)}

/* ── 오늘 대실 여유 ─────────────────────────────────────── */
.wd-list{display:flex;flex-direction:column;gap:2px}
.wd{
  display:grid;grid-template-columns:96px 1fr auto;gap:14px;align-items:center;
  padding:13px 14px;border-radius:12px;
}
.wd.tight{background:var(--amber-bg)}
.wd.risky{background:#FFF1F2}
.wd.no{background:var(--bg);opacity:.68}
.wd-l{display:flex;flex-direction:column;gap:4px}
.wd-no{font-size:15.5px;font-weight:800;color:var(--t1)}
.wd-tag{font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:6px;align-self:flex-start;
  background:#E8F8EE;color:#0B7A45}
.wd-tag.tight{background:#FFE9BF;color:#8A5A00}
.wd-tag.risky{background:#FFDCDF;color:#C2262B}
.wd-tag.no{background:#E9EDF2;color:var(--t3)}
.wd-time{font-size:13px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
.wd-why{font-size:12px;color:var(--t2);font-weight:600;line-height:1.6;margin-top:2px}
.wd-r{text-align:right;white-space:nowrap}
.wd-min{font-size:16px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
.wd-slack{font-size:11.5px;font-weight:700;color:#0B7A45;margin-top:2px}
.wd-slack.neg{color:var(--red-t)}
@media (max-width:640px){
  .wd{grid-template-columns:1fr auto;gap:8px}
  .wd-l{grid-column:1/-1;flex-direction:row;align-items:center;gap:8px}
}

/* 새 창으로 열기 — 화면 두 개인 업장을 위해 */
.sb-pop{
  margin-left:auto;font-size:13px;line-height:1;color:var(--t4);
  padding:5px 6px;border-radius:7px;opacity:0;transition:opacity .12s;cursor:pointer;
}
.sb-item:hover .sb-pop{opacity:1}
.sb-pop:hover{background:var(--surface);color:var(--blue-dk)}
.sb-item.on .sb-pop{color:var(--blue-dk)}
.count-tag + .sb-pop{margin-left:6px}
@media (hover:none){ .sb-pop{opacity:.45} }

/* PDF 생성기의 HTML을 sandbox iframe에 그대로 보여 준다. 별도 화면 양식은 두지 않는다. */
.doc-stage{
  position:relative;background:#737D89;padding:20px 14px;border-radius:16px;
  overflow:auto;min-height:420px;text-align:center;
}
.doc-preview-frame{
  display:block;width:210mm;height:297mm;margin:0 auto;border:0;background:#fff;
  box-shadow:0 8px 28px rgba(7,19,33,.26);opacity:0;transition:opacity .16s;
}
.doc-preview-frame.ready{opacity:1}
.doc-preview-loading{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:13px;font-weight:700;letter-spacing:-.1px;
}
.doc-preview-loading.error{color:#7F1D1D;background:#FFF1F2;inset:20px;border-radius:12px}
@media (max-width:700px){
  .doc-stage{padding:12px 8px}
  .doc-preview-frame{margin:0;width:210mm;height:297mm}
}

/* ── 문서 화면 ──────────────────────────────────────────── */
.doc-view{display:flex;flex-direction:column;gap:14px}
.doc-bar{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  background:var(--navy);border-radius:14px;padding:13px 17px;color:#fff;
}
.doc-bar-l{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13px}
.doc-bar-l b{font-size:14.5px;font-weight:800}
.doc-bar-l span{opacity:.7;font-family:ui-monospace,monospace;font-size:12px}
.doc-bar-r{display:flex;gap:7px;flex-wrap:wrap}
.doc-bar .btn{background:#fff;color:var(--navy)}
.doc-bar .btn.ghost{background:rgba(255,255,255,.14);color:#fff;border-color:transparent}

.doc-row{
  display:flex;align-items:center;gap:13px;width:100%;text-align:left;
  background:none;border:0;font:inherit;cursor:pointer;padding:13px 20px;
  border-bottom:1px solid var(--line);
}
.doc-row:hover{background:var(--bg)}
.doc-row:last-child{border-bottom:none}
.doc-row-l{display:flex;gap:5px;flex-shrink:0}
.doc-row-m{flex:1;min-width:0}
.doc-row-n{font-size:14px;font-weight:700;color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-row-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:2px;font-variant-numeric:tabular-nums}
.doc-row-r{font-size:13.5px;font-weight:800;color:var(--t1);white-space:nowrap;font-variant-numeric:tabular-nums}

.doc-sec2{font-size:12px;font-weight:800;color:var(--t3);margin:18px 0 4px}

/* 견적 품목 줄 — 정의는 아래 한 곳에만 둔다. */

/* 로고 · 직인 */
.asset-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.asset{display:flex;gap:13px;align-items:flex-start;background:var(--bg);border-radius:12px;padding:13px}
.asset-box{
  width:74px;height:74px;flex:0 0 74px;border-radius:10px;background:#fff;
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.asset-box img{max-width:100%;max-height:100%;object-fit:contain}
.asset-empty{font-size:11px;color:var(--t4);font-weight:600}
.asset-m{min-width:0}
.asset-t{font-size:13.5px;font-weight:800;color:var(--t1)}
.asset-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:2px;line-height:1.5}

/* 문서는 A4 비율이라 넓게 펼쳐야 글자가 안 깨진다 */
@media (min-width:700px){
  .sheet-back:has(.doc-view){padding:20px}
  .sheet:has(.doc-view){max-width:min(880px,96vw) !important;max-height:94vh}
}

/* ── 설정 · 문서 시작점 ─────────────────────────────────── */
.set-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px}
.set-c{
  display:flex;align-items:center;gap:14px;background:var(--surface);border:0;
  border-radius:16px;padding:18px 20px;cursor:pointer;text-align:left;font:inherit;width:100%;
}
.set-c:hover{background:var(--blue-bg)}
.set-c:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.set-i{font-size:22px;line-height:1;flex:0 0 auto}
.set-m{flex:1;min-width:0}
.set-t{font-size:15.5px;font-weight:800;color:var(--t1)}
.set-d{font-size:12.5px;color:var(--t3);font-weight:600;margin-top:3px;line-height:1.5}
.set-x{font-size:20px;color:var(--t4);flex:0 0 auto}

.doc-start{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}
.ds{
  display:flex;align-items:flex-start;gap:15px;background:var(--surface);border:2px solid transparent;
  border-radius:18px;padding:22px;cursor:pointer;text-align:left;font:inherit;width:100%;position:relative;
}
.ds:hover{border-color:var(--blue)}
.ds:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ds-i{font-size:28px;line-height:1;flex:0 0 auto}
.ds-m{flex:1;min-width:0}
.ds-t{font-size:17px;font-weight:800;color:var(--t1);letter-spacing:-.2px}
.ds-d{font-size:12.5px;color:var(--t3);font-weight:600;margin-top:5px;line-height:1.6}
.ds-w{font-size:11.5px;color:#8A5A00;background:var(--amber-bg);border-radius:7px;
  padding:4px 8px;margin-top:9px;display:inline-block;font-weight:700}
.ds-c{
  font-size:12.5px;font-weight:800;color:var(--blue-dk);background:var(--blue-bg);
  padding:7px 12px;border-radius:9px;white-space:nowrap;flex:0 0 auto;align-self:center;
}

/* 예약 고르기 */
.rp-list{display:flex;flex-direction:column;gap:2px;max-height:52vh;overflow-y:auto}
.rp{display:flex;align-items:center;gap:12px;background:none;border:0;font:inherit;width:100%;
  text-align:left;cursor:pointer;padding:11px 12px;border-radius:11px}
.rp:hover{background:var(--bg)}
.rp-l{display:flex;flex-direction:column;gap:4px;flex:0 0 auto}
.rp-m{flex:1;min-width:0}
.rp-n{font-size:14.5px;font-weight:800;color:var(--t1)}
.rp-room{font-size:12.5px;font-weight:700;color:var(--blue-dk)}
.rp-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-r{font-size:13px;font-weight:800;color:var(--t1);white-space:nowrap;font-variant-numeric:tabular-nums}
.rp-empty{text-align:center;padding:26px 12px;font-size:13.5px;color:var(--t3);line-height:1.7}

/* 계정 · API 키 · 출처 */
.acc{display:flex;align-items:center;gap:14px;padding:13px 20px;border-bottom:1px solid var(--line);cursor:pointer}
.acc:last-child{border-bottom:none}
.acc:hover{background:var(--bg)}
.acc-m{flex:1;min-width:0}
.acc-n{display:flex;align-items:center;gap:7px;font-size:14.5px;font-weight:800;color:var(--t1)}
.acc-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:3px}
.acc input{width:18px;height:18px;flex:0 0 auto}

.cred{background:var(--bg);border-radius:13px;padding:15px 17px}
.cred-h{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:6px}
.cred-n{font-size:14.5px;font-weight:800;color:var(--t1)}
.cred-d{font-size:12px;color:var(--t2);font-weight:600;line-height:1.65;margin-bottom:11px}
.cred-a{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.cred-a input{flex:1;min-width:180px}
.cred-a a{text-decoration:none;display:inline-flex;align-items:center}

/* 행사 출처 목록 (설정) — 데이터 허브의 .src 와 이름이 겹치면 안 된다 */
.esrc{display:flex;align-items:center;gap:14px;padding:13px 20px;border-bottom:1px solid var(--line)}
.esrc:last-child{border-bottom:none}
.esrc-m{flex:1;min-width:0}
.esrc-n{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:var(--t1);flex-wrap:wrap}
.esrc-s{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:3px;line-height:1.5}

/* ── 시설 경쟁력 ────────────────────────────────────────── */
.fac-pos{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;
  background:var(--bg);border-radius:14px;padding:15px 17px}
.fac-l{font-size:11.5px;font-weight:700;color:var(--t3)}
.fac-v{font-size:27px;font-weight:800;color:var(--t1);letter-spacing:-.8px;margin-top:3px;
  font-variant-numeric:tabular-nums}
.fac-v.over{color:var(--blue-t)} .fac-v.under{color:var(--amber-t)}
.fac-r{text-align:right}
.fac-avg{font-size:19px;font-weight:800;color:var(--t1);margin-top:3px;font-variant-numeric:tabular-nums}

.fac-th{border-radius:12px;padding:13px 15px;background:var(--amber-bg)}
.fac-th.high{background:var(--red-bg)}
.fac-th-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
.fac-th-n{font-size:14px;font-weight:800;color:var(--t1)}
.fac-th-s{font-size:11.5px;font-weight:700;color:var(--t2);background:rgba(255,255,255,.6);
  padding:2px 7px;border-radius:6px}
.fac-th-b{font-size:12.5px;color:var(--t2);font-weight:600;line-height:1.65}

/* 점수 매기기 */
.fs{display:flex;align-items:center;gap:14px;background:var(--bg);border-radius:13px;padding:13px 15px}
.fs.none{background:var(--surface);border:1.5px dashed var(--border)}
.fs-m{flex:1;min-width:0}
.fs-n{display:flex;align-items:center;gap:7px;font-size:14.5px;font-weight:800;color:var(--t1);flex-wrap:wrap}
.fs-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.fs-memo{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:5px;line-height:1.5}
.fs-score{
  flex:0 0 62px;height:52px;border-radius:13px;border:0;cursor:pointer;font:inherit;
  font-size:20px;font-weight:800;background:var(--navy);color:#fff;font-variant-numeric:tabular-nums;
}
.fs-score.empty{background:var(--surface);border:1.5px solid var(--border);color:var(--t3);font-size:12.5px;font-weight:700}
.fs-score:hover{opacity:.88}

.sc-box{background:var(--navy);border-radius:16px;padding:22px 20px;text-align:center;color:#fff}
.sc-v{font-size:48px;font-weight:800;letter-spacing:-2px;line-height:1;margin-bottom:16px;
  font-variant-numeric:tabular-nums}
.sc-box input[type=range]{width:100%;accent-color:#fff}
.sc-ends{display:flex;justify-content:space-between;font-size:11px;opacity:.62;margin-top:8px;font-weight:600}
.sc-tags{display:flex;gap:6px;flex-wrap:wrap}
.sc-tag{
  background:var(--bg);border:1.5px solid transparent;border-radius:9px;padding:7px 11px;
  font:inherit;font-size:12.5px;font-weight:700;color:var(--t2);cursor:pointer;
}
.sc-tag.on{background:var(--blue-bg);border-color:var(--blue);color:var(--blue-dk)}
input[type=range]{width:100%;accent-color:var(--blue)}

/* ── 중앙 복도 배치 ─────────────────────────────────────── */
.rb-corr{display:grid;grid-template-columns:1fr 46px 1fr;gap:8px;align-items:start}
.rb-side{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;min-width:0}
.rb-side.empty{min-height:1px}
.rb-hall{
  align-self:stretch;min-height:92px;border-radius:10px;
  background:repeating-linear-gradient(45deg,var(--bg),var(--bg) 6px,var(--surface) 6px,var(--surface) 12px);
  border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
}
.rb-hall span{
  font-size:10.5px;font-weight:800;color:var(--t4);letter-spacing:.1em;
  writing-mode:vertical-rl;text-orientation:upright;
}
@media (max-width:760px){
  .rb-corr{grid-template-columns:1fr;gap:6px}
  .rb-hall{min-height:22px}
  .rb-hall span{writing-mode:horizontal-tb;text-orientation:mixed}
}

/* ── 견적 품목 줄 ─────────────────────────────────────────
   여덟 칸을 한 줄에 나란히 두면 시트 폭이 모자랄 때
   fr 칸이 폭 0 으로 눌려 글자가 겹쳐 보였다.
   이름줄 / 숫자줄 두 단으로 나눠 어느 폭에서도 칸이 살아 있게 한다. */
.ql{
  display:grid;
  grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) 30px;
  grid-template-areas:"name spec del" "nums nums nums";
  gap:10px 9px;margin-bottom:10px;
  padding:11px 12px;border:1px solid var(--line);border-radius:12px;
  background:var(--surface);
}
.ql-name{grid-area:name}
.ql-spec{grid-area:spec}
.ql-x{grid-area:del;align-self:end}
.ql-nums{
  grid-area:nums;display:grid;
  grid-template-columns:minmax(112px,1.1fr) minmax(112px,1.1fr) 58px 52px
                        minmax(92px,1fr) minmax(84px,.9fr);
  gap:9px;align-items:end;
}
.ql-f{display:flex;flex-direction:column;gap:3px;min-width:0}
.ql-f.r{align-items:flex-end}
.ql-l{font-size:10px;font-weight:700;color:var(--t4);letter-spacing:.02em;
  white-space:nowrap}
.ql input{min-width:0;width:100%}
.ql-sum{
  font-size:13px;font-weight:800;color:var(--t1);white-space:nowrap;
  font-variant-numeric:tabular-nums;padding:9px 0;
}
.ql-x{background:none;border:0;font-size:19px;color:var(--t4);cursor:pointer;
  line-height:1;border-radius:7px;padding:6px 4px;justify-self:end}
.ql-x:hover{background:var(--red-bg);color:var(--red-t)}
.ql-total{
  display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;
  background:var(--bg);border-radius:12px;padding:12px 15px;margin-top:10px;
  font-size:12.5px;color:var(--t2);font-weight:600;
}
.ql-total b{font-size:16px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
@media (max-width:720px){
  .ql{grid-template-columns:minmax(0,1fr) 30px;
      grid-template-areas:"name del" "spec spec" "nums nums"}
  .ql-nums{grid-template-columns:1fr 1fr 58px 52px;}
  .ql-nums .ql-f:nth-child(5){grid-column:1/3}
  .ql-nums .ql-f:nth-child(6){grid-column:3/5}
}

/* 견적서 작성처럼 칸이 많은 시트는 넓게 연다. */
@media (min-width:768px){
  .sheet.wide{max-width:880px}
}

/* ── 채널별 예약 비율 ────────────────────────────────────── */
.mix-wrap{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.mix-donut{position:relative;flex:0 0 140px;width:140px;height:140px}
.mix-hole{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;pointer-events:none}
.mix-hole-v{font-size:26px;font-weight:800;color:var(--t1);line-height:1;font-variant-numeric:tabular-nums}
.mix-hole-l{font-size:11px;font-weight:700;color:var(--t3);margin-top:3px}
.mix-wrap .mix-list{flex:1;min-width:220px}
.mix-list{display:flex;flex-direction:column}
.mix-row{display:grid;grid-template-columns:12px 1fr auto auto auto;gap:10px;align-items:center;
  padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.mix-row:last-child{border-bottom:none}
.mix-dot{width:9px;height:9px;border-radius:3px}
.mix-n{font-weight:700;color:var(--t1);display:flex;align-items:center;gap:6px;min-width:0}
.mix-v{font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums;white-space:nowrap}
.mix-s{color:var(--t2);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:74px;text-align:right}
.mix-net{color:var(--blue-dk);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:82px;text-align:right}
@media (max-width:640px){
  .mix-row{grid-template-columns:12px 1fr auto}
  .mix-s,.mix-net{display:none}
}

/* ── 요금 · 재고 달력 ────────────────────────────────────── */
.inv-scroll{overflow-x:auto;margin:0 -2px;padding-bottom:6px}
.inv-grid{display:inline-block;min-width:100%}
.inv-row{display:flex;gap:3px;margin-bottom:3px}
.inv-rt{
  flex:0 0 82px;position:sticky;left:0;z-index:2;background:var(--surface);
  display:flex;align-items:center;font-size:12px;font-weight:800;color:var(--t1);
  padding-right:8px;
}
.inv-row.head .inv-rt{background:var(--surface)}
.inv-d{
  flex:0 0 58px;text-align:center;padding:5px 0 7px;border-radius:8px 8px 0 0;
}
.inv-d.wk{background:var(--amber-bg)}
.inv-dm{font-size:12px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
.inv-dw{font-size:10.5px;font-weight:700;color:var(--t3);margin-top:1px}
.inv-d.wk .inv-dw{color:#8A5A00}
.inv-ev{font-size:8px;color:var(--violet-t);line-height:1;margin-top:2px}
.inv-c{
  flex:0 0 58px;min-height:56px;border:0;border-radius:9px;background:var(--bg);
  cursor:pointer;font:inherit;padding:7px 4px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1px;
}
.inv-c:hover{outline:2px solid var(--blue);outline-offset:-2px}
.inv-c.full{background:#E4EFFE}
.inv-c.tight{background:var(--amber-bg)}
.inv-c.over{background:var(--red-bg);outline:2px solid var(--red);outline-offset:-2px}
.inv-c.stop{background:#2A3340}
.inv-p{font-size:13px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums;line-height:1.15}
.inv-n{font-size:10.5px;font-weight:700;color:var(--t3)}
.inv-los{font-size:9.5px;font-weight:800;color:var(--violet-t);line-height:1}
.inv-c.stop .inv-p,.inv-c.stop .inv-n{color:#9FB2CB}
.inv-c.over .inv-n{color:var(--red-t)}

.inv-now{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  background:var(--bg);border-radius:12px;padding:13px 15px}
.inv-now-l{font-size:11px;font-weight:700;color:var(--t3)}
.inv-now-v{font-size:19px;font-weight:800;color:var(--t1);margin-top:2px;font-variant-numeric:tabular-nums}
.inv-now-v.bad{color:var(--red-t)}
.warn-line.hot{background:var(--red-bg);color:#8A2226}
.kpi4-c.bad .kpi4-v{color:var(--red-t)}

.apply-l{display:flex;flex-direction:column}
.apply-r{display:grid;grid-template-columns:104px 90px 1fr;gap:10px;align-items:baseline;
  padding:8px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.apply-r:last-child{border-bottom:none}
.apply-d{font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
/* 요금·재고 옮겨 적을 목록의 타입 이름.
   전에는 .apply-t 라 채널 화면의 남색 카드 제목(.apply-box .apply-t)까지
   덮어써서, 남색 위에 회색 글자가 얹혀 대비가 17.2 → 3.5 로 떨어졌다. */
.apply-rt{color:var(--t3);font-weight:700}
.apply-w{color:var(--t2);font-weight:600}
@media (max-width:640px){ .apply-r{grid-template-columns:1fr 1fr} .apply-w{grid-column:1/-1} }

/* 견적서 — 투숙기간 줄 */
.doc-band{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  border:1px solid #DDD;background:#FAFAFB;border-radius:4px;
  padding:9px 14px;margin:0 0 12px;
}
.doc-band-l{font-size:11px;font-weight:800;color:#444;letter-spacing:.04em;white-space:nowrap}
.doc-band-v{font-size:13px;font-weight:700;color:#111;font-variant-numeric:tabular-nums}

/* 문서 시작 카드 — 두 번째 길 */
.ds-wrap{display:flex;flex-direction:column}
.ds-wrap .ds{border-radius:18px 18px 0 0}
.ds-wrap:only-child .ds,.ds-wrap .ds:only-child{border-radius:18px}
.ds-alt{
  background:var(--surface);border:2px solid transparent;border-top:1px solid var(--line);
  border-radius:0 0 18px 18px;padding:11px;font:inherit;font-size:12.5px;font-weight:700;
  color:var(--t2);cursor:pointer;width:100%;
}
.ds-alt:hover{background:var(--bg);color:var(--blue-dk)}


/* ── 대시보드: 지금 우리 집 상태 한 줄 ─────────────────────
   프런트가 대시보드를 여는 첫 이유는 "몇 실 찼나" 다.
   가격 분석보다 위에, 한눈에 들어오게. */
.ts{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));
  gap:1px;background:var(--line);border-radius:14px;overflow:hidden;
  border:1px solid var(--line)}
.ts-c{background:var(--surface);border:0;padding:14px 12px;text-align:left;
  display:flex;flex-direction:column;gap:3px;min-width:0;font:inherit}
button.ts-c{cursor:pointer;transition:background .12s}
button.ts-c:hover{background:var(--bg)}
button.ts-c:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.ts-v{font-size:21px;font-weight:800;color:var(--t1);letter-spacing:-.6px;
  font-variant-numeric:tabular-nums;line-height:1.15}
.ts-l{font-size:11.5px;font-weight:700;color:var(--t3)}
.ts-c.lead .ts-v{color:var(--blue-t);font-size:24px}
.ts-c.good .ts-v{color:var(--green-t)}
.ts-c.warn .ts-v{color:var(--amber-t)}
.ts-c.bad .ts-v{color:var(--red-t)}

/* 구역 머리 — 카드가 줄줄이 이어지면 묶음이 안 보인다 */
.sec-cap{display:flex;align-items:baseline;gap:9px;margin:6px 2px -2px}
.sec-cap-t{font-size:12.5px;font-weight:800;color:var(--t2);letter-spacing:-.2px}
.sec-cap-n{font-size:11.5px;font-weight:700;color:var(--t4)}

/* 근거 접기 */
.acard-more{background:none;border:0;padding:7px 0 2px;cursor:pointer;
  font-size:11.5px;font-weight:800;color:var(--blue-t);align-self:flex-start;
  border-radius:6px}
.acard-more:hover{text-decoration:underline}
.acard-more:focus-visible{outline:2px solid var(--blue);outline-offset:2px}


/* ── 기준 요금 ─────────────────────────────────────────── */
.br{display:flex;flex-direction:column;gap:8px}
.br-r{display:grid;grid-template-columns:minmax(0,1fr) minmax(118px,150px) minmax(118px,150px);
  gap:10px;align-items:end;padding:11px 13px;border:1px solid var(--line);
  border-radius:12px;background:var(--surface)}
.br-n{font-size:13.5px;font-weight:800;color:var(--t1);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.br-f{display:flex;flex-direction:column;gap:3px;min-width:0}
.br-l{font-size:10.5px;font-weight:700;color:var(--t4)}
.br-f input{width:100%;min-width:0;font-variant-numeric:tabular-nums}
.br-do{display:flex;justify-content:flex-end}
@media (max-width:640px){
  .br-r{grid-template-columns:1fr 1fr;gap:8px}
  .br-n{grid-column:1/3}
}
/* 기준가 그대로인 칸은 옅게 — 고친 날과 구분된다 */
.inv-p.base{color:var(--t4);font-weight:700}


/* ── 주의 손님 ─────────────────────────────────────────── */
.arr-c.flag-hi{border-color:var(--red);box-shadow:inset 3px 0 0 var(--red)}
.arr-c.flag-lo{box-shadow:inset 3px 0 0 var(--amber)}
.arr-flag{font-size:10.5px;font-weight:800;border-radius:5px;padding:2px 6px;
  margin-left:6px;vertical-align:middle;white-space:nowrap}
.arr-flag.hi{background:var(--red-bg);color:#C2262B}
.arr-flag.lo{background:var(--amber-bg);color:#B45309}
.arr-flag-b{margin-top:6px;padding:8px 9px;border-radius:9px;background:var(--bg)}
.arr-flag-r{font-size:11.5px;font-weight:700;color:var(--t2);line-height:1.55}
.arr-flag-n{font-size:11.5px;color:var(--t3);line-height:1.55;margin-top:4px;
  font-style:normal;word-break:keep-all}

.gf .card-b{padding-top:4px;display:flex;flex-direction:column;gap:8px}
.gf-r{border:1px solid var(--line);border-radius:11px;padding:10px 11px;
  cursor:pointer;background:var(--surface);transition:background .12s,border-color .12s}
.gf-r:hover{background:var(--bg)}
.gf-r:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
.gf-r.hi{border-color:#F5C2C4;background:#FFF7F7}
.gf-r.hi:hover{background:#FFEFEF}
.gf-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.gf-n{font-size:13.5px;font-weight:800;color:var(--t1);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gf-lv{font-size:10.5px;font-weight:800;border-radius:5px;padding:2px 6px;
  background:var(--amber-bg);color:#B45309;white-space:nowrap;flex:none}
.gf-lv.hi{background:var(--red-bg);color:#C2262B}
.gf-m{font-size:11.5px;color:var(--t3);font-weight:600;margin-top:4px;line-height:1.5}
.gf-note{font-size:12px;color:var(--t2);line-height:1.6;margin-top:6px;
  padding-top:6px;border-top:1px dashed var(--divider);word-break:keep-all}
.gf-none{font-size:12.5px;color:var(--t3);line-height:1.65;display:flex;
  flex-direction:column;gap:7px;padding:4px 0}
.gf-none b{color:var(--t1);font-size:13.5px}
.gf-why{font-size:11.5px;color:var(--t4);line-height:1.6;padding-top:8px;
  border-top:1px dashed var(--divider);margin-top:2px}
.gf-more{font-size:11.5px;color:var(--t4);font-weight:700;text-align:center;padding:4px 0}
.field-h{font-size:11.5px;color:var(--t4);line-height:1.55;margin-top:4px}

/* ── 공식 CMS 동기화 상태 ─────────────────────────────── */
.sync-mode{display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:17px 19px;border:1px solid #D9E2EE;border-radius:18px;background:#F8FAFC;
  box-shadow:0 1px 2px rgba(15,23,42,.025)}
.sync-mode.armed{background:#F1FBF7;border-color:#CBE9DC}
.sync-mode-main{display:flex;align-items:center;gap:13px;min-width:0}
.sync-mode-icon{display:flex;align-items:center;justify-content:center;width:38px;height:38px;
  flex:0 0 38px;border-radius:12px;background:#E8EEF6;color:#204D7C;font-size:18px;font-weight:900}
.sync-mode.armed .sync-mode-icon{background:#DDF4EA;color:var(--green-t)}
.sync-mode-title{font-size:15.5px;font-weight:850;color:var(--t1)}
.sync-mode-sub{font-size:13.5px;color:var(--t3);line-height:1.5;margin-top:2px;word-break:keep-all}
.sync-mode-stats{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.sync-mode-stats span{font-size:12.5px;font-weight:750;color:var(--t2);padding:5px 9px;
  border-radius:999px;background:#fff;border:1px solid var(--border);white-space:nowrap}
.sync-mode-stats span.warn{color:var(--amber-t);background:var(--amber-bg);border-color:#F5DEAB}

.cms-ready{display:flex;flex-direction:column;gap:14px}
.cms-ready-state{display:flex;align-items:center;gap:12px;padding:14px 15px;border-radius:14px;background:#F6F8FB}
.cms-ready-state.on{background:#F0FAF6}
.cms-ready-mark{display:flex;align-items:center;justify-content:center;width:36px;height:36px;
  border-radius:11px;background:#E5EBF3;color:#245484;font-weight:900;font-size:17px;flex:0 0 36px}
.cms-ready-state.on .cms-ready-mark{background:#DDF4EA;color:var(--green-t)}
.cms-ready-title{font-size:15px;font-weight:850;color:var(--t1)}
.cms-ready-sub{font-size:13.5px;color:var(--t3);line-height:1.55;margin-top:2px;word-break:keep-all}
.cms-provider-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}
.cms-provider{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:10px 11px;border:1px solid var(--border);border-radius:11px;background:#fff}
.cms-provider-name{font-size:13.5px;font-weight:750;color:var(--t2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cms-provider-state{font-size:11.5px;font-weight:800;color:var(--t4);white-space:nowrap}
.cms-provider-state.on{color:var(--green-t)}
.cms-queue{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:13px;font-weight:700;color:var(--t3)}
.cms-queue .btn{margin-left:auto}
@media (max-width:720px){
  .sync-mode{align-items:flex-start;flex-direction:column}
  .sync-mode-stats{justify-content:flex-start}
  .cms-provider-grid{grid-template-columns:1fr 1fr}
  .cms-queue .btn{width:100%;margin-left:0}
}


/* ── 알림 날짜 묶음 ────────────────────────────────────── */
.ag{margin-bottom:10px;overflow:hidden}
.ag.hi{border-left:3px solid var(--red)}
.ag.mid{border-left:3px solid var(--amber)}
.ag-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:14px 18px 12px;border-bottom:1px solid var(--divider)}
.ag-l{min-width:0;display:flex;flex-direction:column;gap:4px}
.ag-d{font-size:15px;font-weight:800;color:var(--t1);letter-spacing:-.3px;
  display:flex;align-items:baseline;gap:7px}
.ag-wk{font-size:10.5px;font-weight:800;color:#B45309;background:var(--amber-bg);
  border-radius:5px;padding:2px 6px}
.ag-ev{font-size:12px;font-weight:700;color:#8A6100;line-height:1.55;
  display:flex;align-items:baseline;gap:5px;word-break:keep-all}
.ag-ev-i{color:var(--amber-t);flex:none;font-size:10px}
.ag-c{font-size:11.5px;font-weight:700;color:var(--t3);display:flex;
  align-items:center;gap:8px;flex-wrap:wrap}
.ag-new{font-size:10.5px;font-weight:800;color:var(--blue-t);background:var(--blue-bg);
  border-radius:5px;padding:2px 6px}
.ag-x{background:none;border:0;cursor:pointer;font-size:11.5px;font-weight:800;
  color:var(--blue-t);white-space:nowrap;flex:none;padding:4px 2px;border-radius:6px}
.ag-x:hover{text-decoration:underline}
.ag-x:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

.arr-recv{font-size:11.5px;color:var(--t4);font-weight:700}
.gf-warn{font-size:11px;color:var(--amber-t);font-weight:700;margin-top:4px}

/* 방 카드의 손님 줄 — 이름 · 플랫폼 · 퇴실 시각 */
.rb-guest{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:3px;
  font-size:11.5px;line-height:1.4;min-width:0}
.rb-gn{font-weight:800;color:var(--t1);overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;min-width:0;flex:0 1 auto}
.rb-ch{font-size:10px;font-weight:800;border-radius:4px;padding:1px 5px;flex:none;
  background:var(--bg);color:var(--t2)}
.rb-ch.pyanoljapartner,.rb-ch.pyanolja{background:#FFF1E0;color:#9A6400}
.rb-ch.pyeogipartner,.rb-ch.pyeogi{background:#FFE8EC;color:#B3243A}
.rb-ch.pnaverpartner,.rb-ch.pnaver{background:#E7F8F2;color:#0A7A5C}
.rb-out{font-size:10.5px;font-weight:700;color:var(--t3);flex:none;
  font-variant-numeric:tabular-nums}

/* 같은 알림이 여러 번 오면 개수로 센다 */
.toast-n{display:inline-block;margin-left:6px;font-size:10.5px;font-weight:800;
  background:rgba(255,255,255,.22);border-radius:999px;padding:1px 7px;vertical-align:middle}
.toast-n[hidden]{display:none}

/* 도착 명단 날짜 이동 — 지난 날도 열어 본다 */
.arr-nav{display:flex;align-items:center;gap:4px;flex:none}
.arr-nav-b{width:28px;height:28px;border:0;border-radius:8px;background:var(--bg);
  color:var(--t2);font-size:15px;font-weight:800;cursor:pointer;line-height:1}
.arr-nav-b:hover{background:var(--line)}
.arr-nav-t{border:0;border-radius:8px;background:var(--blue-bg);color:var(--blue-t);
  font-size:11.5px;font-weight:800;padding:6px 9px;cursor:pointer}

/* 내린 뒤 팔렸는가 */
.cr-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:12px;overflow:hidden;margin-bottom:12px}
.cr-num{background:var(--surface);padding:12px 14px}
.cr-v{font-size:22px;font-weight:800;color:var(--t1);line-height:1.15;
  font-variant-numeric:tabular-nums}
.cr-num.good .cr-v{color:var(--green-t)}
.cr-num.warn .cr-v{color:var(--amber-t)}
.cr-l{font-size:11.5px;font-weight:700;color:var(--t3);margin-top:3px}
.cr-r{border-left:3px solid var(--line);padding:9px 0 9px 11px;margin-top:9px}
.cr-r.sold{border-left-color:var(--green)}
.cr-r.flat{border-left-color:var(--amber)}
.cr-r.wait{border-left-color:var(--line)}
.cr-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.cr-n{font-size:13.5px;font-weight:800;color:var(--t1)}
.cr-d{font-size:11.5px;font-weight:700;color:var(--t3);white-space:nowrap}
.cr-m{font-size:12.5px;color:var(--t2);line-height:1.65;margin-top:3px;word-break:keep-all}

/* 대시보드 — 한 주제를 한 칸에 (숫자 + 그 숫자의 흐름) */
.topic3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.topic-c{background:var(--surface);border-radius:var(--r-card);overflow:hidden;
  display:flex;flex-direction:column}
.topic-h{border-radius:0!important;text-align:left;border:0;width:100%;
  background:transparent!important;box-shadow:none!important}
.topic-b{border-radius:0!important;background:transparent!important;
  padding-top:0!important;margin-top:-2px}
.topic-c .mini-c{background:transparent}
.pair2{display:grid;grid-template-columns:minmax(220px,1fr) minmax(280px,1.6fr);gap:10px;
  align-items:stretch}
@media (max-width:760px){ .pair2{grid-template-columns:1fr} }

/* 수집 상태 — 채널별 한 줄 */
.ch-row{display:flex;align-items:center;gap:9px;padding:8px 0;
  border-bottom:1px solid var(--divider);font-size:13px}
.ch-row:last-of-type{border-bottom:none}
.ch-dot{width:8px;height:8px;border-radius:50%;flex:none}
.ch-dot.ok{background:var(--green)} .ch-dot.late{background:var(--amber)}
.ch-dot.none{background:var(--t4)}
.ch-name{font-weight:700;color:var(--t1);flex:1;min-width:0}
.ch-n{font-size:11.5px;color:var(--t3);font-weight:700}
.ch-when{font-size:11.5px;color:var(--t3);font-weight:700;white-space:nowrap}


/* 오래 걸리는 단추 — 멈춘 게 아니라 일하는 중이라고 보이게 */
.btn.working{position:relative;overflow:hidden}
.btn.working::after{
  content:'';position:absolute;inset:auto 0 0 0;height:3px;
  background:rgba(255,255,255,.85);animation:btn-work 1.1s ease-in-out infinite;
}
@keyframes btn-work{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){ .btn.working::after{animation:none;opacity:.6} }

/* ── 외부 연결 — 키가 둘이든 하나든 사장님에겐 연결 하나다 ── */
.conn{border:1px solid var(--line);border-radius:14px;padding:17px 18px;
  background:var(--surface);display:flex;flex-direction:column;gap:11px}
.conn.on{border-color:#BFE3D3}
.conn-h{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.conn-dot{width:9px;height:9px;border-radius:50%;background:var(--t4);flex:none}
.conn.on .conn-dot{background:var(--green)}
.conn-n{font-size:15.5px;font-weight:800;color:var(--t1)}
.conn-w{font-size:13px;color:var(--t2);line-height:1.65;word-break:keep-all}
.conn-fs{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:9px}
.conn-f{display:flex;flex-direction:column;gap:4px;min-width:0}
.conn-fl{font-size:11px;font-weight:700;color:var(--t3)}
.conn-f input{width:100%;min-width:0}
.conn-a{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.conn-msg:empty{display:none}
.conn-msg{font-size:12.5px;font-weight:700;line-height:1.6;padding:10px 13px;
  border-radius:10px;background:var(--bg);color:var(--t2);word-break:keep-all}
.conn-msg.ok{background:var(--green-bg);color:var(--green-t)}
.conn-msg.bad{background:var(--red-bg);color:var(--red-t)}
.conn-hint{font-size:11.5px;color:var(--t3);line-height:1.55}

/* 달 이동 — 단추 셋이 아니라 한 덩어리 */
.mnav{display:inline-flex;align-items:center;gap:2px;background:var(--bg);
  border-radius:11px;padding:3px}
.mnav-b{width:32px;height:32px;border:0;border-radius:8px;background:transparent;
  color:var(--t2);font-size:17px;font-weight:800;cursor:pointer;line-height:1}
.mnav-b:hover{background:var(--line)}
.mnav-b:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.mnav-t{font-size:14.5px;font-weight:800;color:var(--t1);padding:0 10px;
  white-space:nowrap;font-variant-numeric:tabular-nums}

/* 겹쳐서 커지는 날 */
.sd{display:flex;flex-direction:column;gap:9px}
.sd-r{text-align:left;border:1px solid var(--line);border-radius:12px;
  padding:12px 14px;background:var(--surface);cursor:pointer;font:inherit;
  display:flex;flex-direction:column;gap:5px;transition:background .12s}
.sd-r:hover{background:var(--bg)}
.sd-r:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
.sd-r.hi{border-color:#F2C9A8;background:#FFFCF8}
.sd-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.sd-d{font-size:15px;font-weight:800;color:var(--t1)}
.sd-n{font-size:11.5px;font-weight:800;color:var(--amber-t);
  background:var(--amber-bg);border-radius:5px;padding:2px 7px}
.sd-w{font-size:12.5px;color:var(--t2);line-height:1.6;word-break:keep-all}
.sd-m{font-size:11.5px;color:var(--t3);font-weight:700}

/* 우리 동네 행사 출처 */
.csrc-r{display:flex;align-items:flex-start;gap:12px;padding:11px 13px;
  border:1px solid var(--line);border-radius:11px;background:var(--surface)}
.csrc-n{font-size:14px;font-weight:800;color:var(--t1)}
.csrc-u{font-size:11.5px;color:var(--t3);margin-top:2px;overflow-wrap:anywhere}
.csrc-c{font-size:11.5px;color:var(--t3);font-weight:700;margin-top:3px}
.csrc-form{background:var(--bg);border-radius:12px;padding:14px;
  display:flex;flex-direction:column;gap:10px}

/* 쉬고 있는 관측 대상 — 숨기지 않는다. 왜 값이 안 들어오는지가 여기서 갈린다 */
.pz{border-left:3px solid var(--amber);background:var(--bg);border-radius:0 9px 9px 0;
  padding:9px 12px;margin-top:8px}
.pz.hard{border-left-color:var(--red)}
.pz-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.pz-n{font-size:13px;font-weight:800;color:var(--t1);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pz-s{font-size:11px;font-weight:800;color:var(--amber-t);white-space:nowrap;flex:none}
.pz.hard .pz-s{color:var(--red-t)}
.pz-r{font-size:11.5px;color:var(--t3);line-height:1.55;margin-top:3px;word-break:keep-all}

/* 행사 후보 — 아직 일정이 아니다. 확정 버튼이 눈에 들어와야 한다 */
.cand{background:var(--bg);border-radius:12px;padding:14px 16px;margin-bottom:10px}
.cand-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.cand-d{font-size:12.5px;font-weight:800;color:var(--blue-t);font-variant-numeric:tabular-nums}
.cand-t{font-size:15px;font-weight:800;color:var(--t1);line-height:1.45;word-break:keep-all}
.cand-m{font-size:12.5px;color:var(--t3);margin-top:4px;line-height:1.55}
.cand-tier{font-size:11.5px;color:var(--amber-t);background:var(--amber-bg);
  display:inline-block;border-radius:6px;padding:3px 8px;margin-top:8px;font-weight:700}
.cand-src{display:flex;flex-direction:column;gap:3px;margin-top:9px}
.cand-link{font-size:11.5px;color:var(--t3);text-decoration:none;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cand-link:hover{color:var(--blue-t);text-decoration:underline}
.cand-a{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}

/* 연동 진단 — 평소엔 한 줄, 펼치면 상세 */
.diag{background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:12px}
.diag-s{display:flex;align-items:center;gap:9px;padding:12px 15px;cursor:pointer;
  font-size:13.5px;font-weight:700;color:var(--t1);list-style:none}
.diag-s::-webkit-details-marker{display:none}
.diag-dot{width:7px;height:7px;border-radius:50%;background:var(--amber);flex:none}
.diag-dot.on{background:var(--green)}
.diag-more{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--t3)}
.diag-b{padding:2px 15px 15px;border-top:1px solid var(--line)}
.diag-q{margin:10px 0;padding:10px 12px;background:var(--bg);border-radius:9px}
.diag-ql{font-size:11px;font-weight:800;color:var(--t3);margin-bottom:4px}
.diag-qs{font-size:12px;color:var(--t2);line-height:1.7;word-break:keep-all}

/* 새 값 알림 — 화면을 가로채지 않는다. 보던 자리를 잃지 않게 */
.fresh-bar{display:flex;align-items:center;gap:10px;background:var(--blue-bg);
  border-bottom:1px solid var(--line);padding:9px 16px;font-size:13px;
  color:var(--blue-t);font-weight:600}
.fresh-bar>span{flex:1;min-width:0}
.fresh-b{border:0;background:var(--blue-solid);color:#fff;font-size:12px;font-weight:800;
  border-radius:7px;padding:5px 11px;cursor:pointer;flex:none}
.fresh-b:hover{background:var(--blue-dk)}
.fresh-x{border:0;background:transparent;color:var(--blue-t);font-size:17px;
  line-height:1;cursor:pointer;padding:2px 5px;flex:none}

/* 가격대 — 몇 번째인지보다 어느 구간인지가 먼저 읽혀야 한다 */
.me-band{font-size:19px;font-weight:900;letter-spacing:-.5px;line-height:1.25}
.me-band.high{color:var(--red-t)}
.me-band.middle{color:var(--t2)}
.me-band.competitive{color:var(--green-t)}

/* 접어 두는 상세 — 요약이 먼저 읽히고, 원본은 눌러서 본다.
   이름 앞에 d 를 붙인 것은 기존 .fold(버튼형 카드 접기)와 겹치지 않게 하기 위함이다 */
.dfold{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.dfold-s{cursor:pointer;list-style:none;font-size:12.5px;font-weight:700;
  color:var(--t3);padding:4px 0;display:flex;align-items:center;gap:6px}
.dfold-s::-webkit-details-marker{display:none}
.dfold-s::before{content:'▸';font-size:10px;transition:transform .18s}
.dfold[open] .dfold-s::before{transform:rotate(90deg)}
.dfold-s:hover{color:var(--blue-t)}
.cr-rows{margin-top:10px}

/* 예약 반응 — 세 질문에 답하는 칸 */
.ba{display:flex;flex-direction:column;gap:2px}
.ba-r{padding:14px 16px;border-radius:11px;background:var(--bg);border-left:3px solid var(--line-2)}
.ba-r.good{border-left-color:var(--green);background:var(--green-bg)}
.ba-r.warn{border-left-color:var(--amber);background:var(--amber-bg)}
.ba-q{font-size:11.5px;font-weight:800;color:var(--t3);margin-bottom:5px}
.ba-a{font-size:17px;font-weight:900;color:var(--t1);letter-spacing:-.02em;
  line-height:1.35;word-break:keep-all}
.ba-w{font-size:12px;color:var(--t3);margin-top:6px;line-height:1.6;word-break:keep-all}

/* 보내는 중인 답글 — 공개되는 글이라 지금 무엇이 나가는지 늘 보여야 한다 */
.ob-r{background:var(--bg);border-radius:11px;padding:12px 14px;margin-bottom:8px}
.ob-t{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-bottom:6px}
.ob-s{font-size:11.5px;font-weight:800;color:var(--t3)}
.ob-s.queued{color:var(--blue-t)}
.ob-s.sending{color:var(--amber-t)}
.ob-s.failed{color:var(--red-t)}
/* 어느 곳에, 누가 정해서 나가는지 — 공개되는 글이라 둘 다 보여야 한다 */
.ob-plat,.ob-who{font-size:11px;font-weight:700;color:var(--t3);
  background:var(--card);border-radius:6px;padding:2px 7px}
.ob-t>.btn{margin-left:auto}
/* 가려진 후기 안내 — 왜 답글을 못 다는지 후기 옆에 그대로 적는다 */
.rv-vis{font-size:12px;color:var(--amber-t);margin-top:6px;line-height:1.55;word-break:keep-all}
/* 후기 칸 이름표 — 파트너센터가 실제로 쓰는 이름을 그대로 보여준다 */
.shape-list{display:flex;flex-wrap:wrap;gap:6px}
/* 퇴실할 때 왜 결제를 묻는지, 또는 왜 바로 퇴실하는지 */
.co-why{font-size:12.5px;color:var(--t2);line-height:1.55;margin:2px 0 10px;word-break:keep-all}
.shape-k{font-size:11.5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  background:var(--bg);color:var(--t2);border-radius:6px;padding:3px 8px;white-space:nowrap}
.ob-b{font-size:13px;color:var(--t2);line-height:1.6;word-break:keep-all}
.ob-e{font-size:11.5px;color:var(--red-t);margin-top:6px}

/* 발급 전 누락 항목 — 문서 대신 무엇을 채워야 하는지 보여준다 */
.miss-h2{font-size:12px;font-weight:800;color:var(--t3);margin:14px 0 6px}
.miss-r{background:var(--bg);border-radius:10px;padding:11px 13px;margin-bottom:7px}
.miss-l{font-size:14px;font-weight:800;color:var(--t1)}
.miss-h{font-size:12.5px;color:var(--t3);margin-top:3px;line-height:1.55;word-break:keep-all}

/* 시설이 비슷한 집의 움직임 */
.peer-r{background:var(--bg);border-radius:11px;padding:11px 13px;margin-bottom:7px}
.peer-t{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.peer-n{font-size:14px;font-weight:800;color:var(--t1)}
.peer-f{font-size:11.5px;color:var(--t3);font-weight:600}
.peer-b{display:flex;align-items:center;gap:9px;margin-top:5px;font-size:13px;
  color:var(--t2);font-variant-numeric:tabular-nums;flex-wrap:wrap}
.peer-d{font-weight:800}
.peer-d.dn{color:var(--red-t)}
.peer-d.up{color:var(--green-t)}
.peer-s{font-size:11.5px;font-weight:700;color:var(--amber-t);
  background:var(--amber-bg);border-radius:6px;padding:2px 7px}
.peer-w{font-size:11.5px;color:var(--t3)}

/* 학습 단계 — 아직 이른 것은 이르다고 보여준다 */
.lg-r{background:var(--bg);border-radius:11px;padding:12px 14px;margin-bottom:8px;
  border-left:3px solid var(--line-2)}
.lg-r.on{border-left-color:var(--green);background:var(--green-bg)}
.lg-t{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lg-n{font-size:11.5px;font-weight:800;color:var(--t3);font-variant-numeric:tabular-nums}
.lg-name{font-size:14.5px;font-weight:800;color:var(--t1)}
.lg-w{font-size:12.5px;color:var(--t3);margin-top:4px;line-height:1.55;word-break:keep-all}
.lg-bar{height:4px;background:var(--line);border-radius:99px;margin-top:9px;overflow:hidden}
.lg-fill{height:100%;background:var(--blue);border-radius:99px}
.lg-need{font-size:12px;color:var(--amber-t);margin-top:7px;line-height:1.55;word-break:keep-all}

/* 판단 가중치 — 무엇으로 판단하는지 숨기지 않는다 */
.wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:12px 0}
.wg-c{background:var(--bg);border-radius:9px;padding:9px 11px}
.wg-l{font-size:11.5px;color:var(--t3);font-weight:600;line-height:1.4;word-break:keep-all}
.wg-v{font-size:16px;font-weight:800;color:var(--t1);margin-top:3px;
  font-variant-numeric:tabular-nums}
.mv-r{background:var(--bg);border-radius:9px;padding:10px 12px;margin-bottom:6px}
.mv-t{display:flex;align-items:center;gap:8px}
.mv-n{font-size:13px;font-weight:800;color:var(--t1)}
.mv-o{font-size:11px;font-weight:700;color:var(--t3)}
.mv-t button{margin-left:auto}
.mv-w{font-size:12px;color:var(--t3);margin-top:5px;line-height:1.5;word-break:keep-all}

/* 취소 알림 — 그 자리에서 정할 수 있게 */
.alert-i.cancel{cursor:default;align-items:flex-start}
.alert-acts{display:flex;gap:6px;flex-wrap:wrap;margin:9px 0 4px}

/* 운영 업무 중심의 탐색: 주 메뉴는 짧게, 같은 업무는 화면 안에서 연결 */
.workspace-nav{min-width:0;padding:4px 0 12px;border-bottom:1px solid var(--divider);margin-bottom:4px}
.workspace-caption{font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--t3);margin-bottom:8px}
.workspace-tabs{display:flex;gap:5px;overflow-x:auto;max-width:100%;padding:2px 0 5px;scrollbar-width:thin}
.workspace-tab{flex:none;padding:10px 15px;border-radius:10px;text-decoration:none;color:var(--t2);font-size:14px;font-weight:650;white-space:nowrap}
.workspace-tab:hover{background:var(--surface)}
.workspace-tab.on{background:var(--navy);color:white;font-weight:750}
.workspace-tab:focus-visible,.directory-link:focus-visible,.disclosure>summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.workspace-hint{font-size:13px;line-height:1.6;color:var(--t3);margin:5px 0 0;word-break:keep-all}
.disclosure{background:var(--surface);border:1px solid var(--divider);border-radius:14px;min-width:0}
.disclosure>summary{padding:18px 20px;cursor:pointer;font-size:15px;font-weight:700;color:var(--t2)}
.disclosure>summary small{display:inline-block;margin-left:12px;font-size:12px;font-weight:500;color:var(--t3)}
.disclosure[open]>summary{border-bottom:1px solid var(--divider)}
.disclosure-body{padding:16px;min-width:0}
.disclosure-body>.card{box-shadow:none}
.directory-search{min-height:48px;font-size:15px!important;width:100%}
.directory-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.directory-card{background:var(--surface);border:1px solid var(--divider);border-radius:16px;padding:22px}
.directory-card h2{font-size:18px;margin:0 0 6px}
.directory-card p{font-size:13px;line-height:1.7;color:var(--t3);margin:0 0 14px}
.directory-link{display:block;padding:12px 0;border-top:1px solid var(--divider);text-decoration:none;color:var(--t1);font-size:15px}
.directory-link:hover{color:var(--blue-t)}
.directory-card[hidden],.directory-link[hidden]{display:none}
.review-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--surface);border:1px solid var(--divider);border-radius:16px;padding:20px 8px}
.review-overview>div{padding:0 18px;border-right:1px solid var(--divider)}
.review-overview>div:last-child{border:0}
.review-overview span{display:block;font-size:13px;color:var(--t3);margin-bottom:6px}
.review-overview strong{font-size:23px;color:var(--t1);font-variant-numeric:tabular-nums}
.review-toolbar,.review-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.review-toolbar .field{min-width:150px}
.review-pagination{justify-content:center;padding:10px 0;font-size:13px;color:var(--t3)}
.event-signal-note{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;background:var(--blue-bg);border-radius:14px;color:var(--t1)}
.event-signal-note b{font-size:14px}
.event-signal-note p{font-size:13px;line-height:1.6;color:var(--t2);margin:6px 0 0}
@media(max-width:767px){
  .workspace-tab{padding:10px 12px;font-size:13px}
  .workspace-hint{font-size:12px}
  .directory-grid{grid-template-columns:1fr}
  .disclosure>summary{padding:16px}
  .disclosure>summary small{display:block;margin:6px 0 0 16px}
  .disclosure-body{padding:10px}
  .review-overview{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 0}
  .review-overview>div:nth-child(2){border:0}
  .review-overview strong{font-size:22px}
  .rv-top{gap:8px}
  .rv-when{font-size:12px;margin-left:0;flex-basis:100%}
  .event-signal-note{align-items:flex-start;flex-direction:column}
}
/* 운영 홈: 한 줄 상태 → 우선 업무 → 판매 판단. 상세 분석은 요청할 때만 펼친다. */
.ops-home .ts {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:8px;background:var(--card,#fff);border-radius:20px;gap:4px}
.ops-home .ts-c {min-width:0;padding:22px 16px;text-align:left;align-items:flex-start;border:0}
.ops-home .ts-v {font-size:28px;line-height:1.3;letter-spacing:-1px;overflow-wrap:anywhere}
.ops-home .ts-l {font-size:14px;margin-top:6px}
.ops-home .ts-c.lead {border-radius:14px;background:#eaf2ff;color:#195cc5}
.ops-deadline {grid-column:1/-1;padding:10px 16px;background:#fff4e4;color:#875000;border-radius:10px;font-size:14px}
.ops-layout {display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:24px;align-items:start}
.ops-tasks,.ops-selling {min-width:0}
.ops-task {display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;padding:20px 0;border-bottom:1px solid var(--line,#e8edf2);align-items:start}
.ops-task>.btn {grid-column:2;justify-self:start}
.ops-task-no {display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#eaf2ff;color:#195cc5;font-size:13px;font-weight:700}
.ops-task-no.HIGH {background:#fff0e8;color:#a54515}
.ops-task-main h2 {font-size:17px;line-height:1.5;margin:0 0 5px}
.ops-task-main>p {font-size:15px;line-height:1.65;color:var(--muted,#536171);margin:0 0 10px}
.ops-task-main .disclosure {box-shadow:none;border:0;background:transparent}
.ops-task-main .disclosure>summary {padding:8px 0;gap:10px;flex-wrap:wrap;font-size:13px}
.ops-task-main .disclosure-body {padding:12px;background:var(--bg,#f5f7fa);border-radius:12px}
.ops-selling {background:var(--card,#fff);border-radius:18px;padding:20px;display:grid;gap:14px}
.ops-rate {display:grid;grid-template-columns:1fr auto;gap:6px;border:0;border-bottom:1px solid var(--line,#e8edf2);padding:12px 0;background:none;text-align:left;font:inherit;cursor:pointer;color:inherit}
.ops-rate strong {font-size:24px;letter-spacing:-.7px}
.ops-rate span {font-size:15px;align-self:center}
.ops-rate small {grid-column:1/-1;color:var(--muted,#536171);font-size:13px}
.ops-calendar-link {display:grid;gap:8px;padding:16px;border-radius:12px;background:#f1f5ff;color:#214b85;text-decoration:none}
.ops-calendar-link span {font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.demand-toolbar {display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.demand-toolbar .seg {display:flex;background:var(--card,#fff);padding:4px;border-radius:12px}
.demand-toolbar .seg button {border:0;border-radius:9px;padding:10px 16px;background:transparent;color:inherit;cursor:pointer;font:inherit;font-size:14px}
.demand-toolbar .seg button.active {background:#eaf2ff;color:#195cc5;font-weight:700}
.cal .cal-cell {min-height:125px;height:auto;justify-content:flex-start}
.cal .cal-cell.has-demand {background:#f2f6ff}
.cal-sale {display:grid;gap:3px;margin:6px 0}
.cal-sale strong {font-size:17px;color:var(--text,#202d40);letter-spacing:-.5px;white-space:nowrap}
.cal-sale span {font-size:11px;color:var(--muted,#536171)}
.cal-sale .cal-amount-short {display:none}
.demand-stats {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:10px 0}
.demand-stat {display:grid;gap:8px;padding:16px;background:var(--bg,#f5f7fa);border-radius:14px;min-width:0}
.demand-stat span {font-size:13px;color:var(--muted,#536171)}
.demand-stat strong {font-size:24px;letter-spacing:-.8px;overflow-wrap:anywhere}
.demand-reading {font-size:15px;line-height:1.7;padding:16px;border-radius:12px;background:#eaf2ff;color:#214b85}
.demand-event {padding:12px 0;border-bottom:1px solid var(--line,#e8edf2)}
.demand-event b {font-size:16px;line-height:1.5}
.demand-event p {font-size:14px;color:var(--muted,#536171);margin:6px 0;line-height:1.6}
.demand-line {display:flex;gap:12px;flex-wrap:wrap;align-items:center;padding:10px 0;font-size:14px;border-bottom:1px solid var(--line,#e8edf2)}
.demand-line b {flex:1;min-width:100px}
.demand-line small {flex-basis:100%;color:var(--muted,#536171)}
.demand-timing {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.demand-timing.hours {grid-template-columns:repeat(4,minmax(0,1fr));margin-top:14px;border-top:1px solid var(--line,#e8edf2);padding-top:14px}
.demand-timing>div {display:grid;gap:6px;padding:10px;background:var(--bg,#f5f7fa);border-radius:10px}
.demand-timing b {font-size:18px}.demand-timing span {font-size:12px;color:var(--muted,#536171)}
.demand-record {display:grid;gap:6px;font-size:14px;line-height:1.5;padding:12px 0;border-bottom:1px solid var(--line,#e8edf2)}
.demand-record small {color:var(--muted,#536171)}
/* 업무 화면 정리: 강조는 핵심 가격에만, 세부 기능은 보조 메뉴로. */
.workspace-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 0 12px;border-bottom:1px solid var(--border)}
.workspace-tabs{padding:0;min-width:0}
.workspace-more{max-width:210px;min-height:40px;border:1px solid var(--border);border-radius:9px;background:var(--surface);padding:8px 10px;font-size:13px;color:var(--t2)}
.sb-foot-box{display:block}
.content>.stack{gap:20px}
.phead .filters{align-items:center}
.ops-tasks{background:var(--surface);padding:20px;border-radius:16px}
.ops-task:last-child{border-bottom:0;padding-bottom:0}
.ops-home .ab-t{font-size:28px;line-height:1.3}
.ops-home .ab-en{font-size:14px;color:var(--t3)}
.ops-home .ts{border-radius:16px}
.pricing-overview{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:stretch}
.pricing-overview>*{min-width:0;margin:0}
.pricing-overview .pos{padding:24px}
.pricing-overview .pos-top{gap:20px;flex-wrap:wrap}
.pricing-overview .pos-v{font-size:36px}
.pricing-overview .pos-read{font-size:14px;line-height:1.7}
.pricing-next{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 4px;font-size:14px;color:var(--t2)}
.graph-date{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--t3);white-space:nowrap}
.graph-date input{min-height:40px;min-width:150px;border:1px solid var(--border);border-radius:9px;background:var(--surface);padding:7px 10px;font-size:14px;color:var(--t1)}
.graph-view-tabs{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.graph-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px 0}
.graph-metric{display:grid;gap:6px;padding:0 24px;border-right:1px solid var(--border);min-width:0}
.graph-metric:last-child{border:0}
.graph-metric>span{color:var(--t2);font-size:14px}
.graph-metric strong{font-size:28px;line-height:1.4;letter-spacing:-.6px;overflow-wrap:anywhere}
.graph-metric:first-child strong{color:var(--blue-t)}
.graph-metric small{font-size:12px;color:var(--t3)}
.graph-card{padding:22px}
.graph-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.graph-options{font-size:13px;min-width:180px}
.graph-options>summary{cursor:pointer;text-align:right;padding:8px;color:var(--t2)}
.graph-options-body{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:12px;background:var(--surface-sub);border-radius:10px;margin-top:6px}
.graph-check{display:flex;align-items:center;gap:7px;cursor:pointer}
.graph-check input,.graph-compare-row input{accent-color:var(--blue-t);width:17px;height:17px;flex-shrink:0}
.graph-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start}
.graph-main,.graph-canvas{min-width:0}
.history-chart svg{width:100%;max-width:100%;height:auto}
.history-chart .chart-hint{font-size:12px;color:var(--t3)}
.graph-compare{border-left:1px solid var(--border);padding-left:20px;min-width:0}
.graph-compare-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:6px}
.graph-compare-head>b{font-size:15px}
.graph-comparison-list{margin:12px 0}
.graph-compare-row{display:grid;grid-template-columns:17px 6px minmax(0,1fr) auto;gap:8px;align-items:center;padding:12px 4px;border-bottom:1px solid var(--divider);cursor:pointer}
.graph-compare-row:hover{background:var(--surface-sub)}
.graph-compare-row i{height:24px;border-radius:3px}
.graph-compare-name{font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.graph-compare-name small{display:block;font-size:11px;color:var(--blue-t);margin-bottom:2px}
.graph-compare-value{text-align:right;white-space:nowrap}
.graph-compare-value b{display:block;font-size:17px;letter-spacing:-.4px}
.graph-compare-value small{display:block;font-size:11px;color:var(--t3)}
.graph-compare-row.self .graph-compare-value b{color:var(--blue-t)}
.graph-note{font-size:12px;line-height:1.7;color:var(--t3);border-top:1px solid var(--divider);padding-top:14px;margin-top:18px}
.graph-change-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;width:100%;gap:12px;align-items:center;padding:14px 2px;border:0;border-bottom:1px solid var(--divider);background:none;text-align:left;cursor:pointer}
.graph-change-row:hover{background:var(--surface-sub)}
.graph-change-sign{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--bg);font-size:20px}
.graph-change-sign.down{color:var(--blue-t);background:var(--blue-bg)}
.graph-change-sign.up{color:var(--amber-t);background:var(--amber-bg)}
.graph-change-name b,.graph-change-price b{display:block;font-size:15px}
.graph-change-name small,.graph-change-price small{display:block;font-size:12px;color:var(--t3)}
.graph-change-price{text-align:right}
.graph-assessment,.graph-calendar-legend{display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-size:14px}
.graph-calendar-legend{font-size:12px;color:var(--t2);margin-bottom:14px}
.graph-event-list>div{display:grid;gap:4px;padding:10px 0;border-bottom:1px solid var(--border)}
.graph-event-list span{font-size:13px;color:var(--t3)}
.review-filters{display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.review-selects{display:flex;gap:10px;flex-wrap:wrap}
.review-selects .field{min-width:150px}
.review-workspace .rv-c{border:1px solid var(--border);border-left:3px solid transparent;padding:20px 22px}
.review-workspace .rv-c.human{border-left-color:var(--amber)}
.review-workspace .rv-body{font-size:16px;line-height:1.8;margin-top:14px}
.review-workspace .rv-reply>summary{cursor:pointer;font-size:13px;font-weight:650;padding:2px 0}
.review-workspace .rv-reply[open] .rv-reply-b{margin-top:10px}
@media(min-width:1400px){.content{max-width:1440px}.graph-layout{grid-template-columns:minmax(0,1fr) 300px}}
@media(max-width:1100px){.graph-layout{grid-template-columns:minmax(0,1fr)}.graph-compare{border-left:0;border-top:1px solid var(--border);padding:18px 0 0}.graph-comparison-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}.pricing-overview{grid-template-columns:1fr}}
@media(max-width:767px){
  .content>.stack{gap:16px}.workspace-nav{flex-wrap:wrap;gap:8px}.workspace-more{max-width:100%;width:100%}.workspace-tabs{width:100%}
  .workspace-tab{padding:9px 11px}.price-workspace .phead{gap:12px}.price-workspace .filters{width:100%;justify-content:space-between}
  .price-workspace .phead .seg,.pricing-workspace .phead .seg,.nearby-workspace .phead .seg{width:auto;flex:none}
  .graph-date{gap:6px}.graph-date input{min-width:132px;padding:7px}.graph-view-tabs>.foot-note{font-size:12px}
  .graph-metrics{padding:16px 0;gap:12px 0;grid-template-columns:repeat(2,minmax(0,1fr))}
  .graph-metric{padding:0 16px}.graph-metric:first-child{grid-column:1/-1;border:0;padding-bottom:14px;border-bottom:1px solid var(--border)}
  .graph-metric strong{font-size:23px}.graph-metric:first-child strong{font-size:30px}.graph-metric>span{font-size:12px}.graph-metric small{font-size:11px}
  .graph-card{padding:16px 10px}.graph-card-head{gap:6px;padding:0 4px}.graph-options{min-width:0}.graph-options>summary{text-align:left}
  .graph-comparison-list{grid-template-columns:1fr}.graph-compare{padding:16px 6px 0}.graph-note{margin:16px 6px 0}.history-chart svg{max-width:100%}
  .graph-change-row{grid-template-columns:26px minmax(0,1fr) auto;gap:8px}.graph-change-sign{width:26px;height:26px}.graph-change-price small{font-size:11px}
  .pricing-next{align-items:flex-start;flex-direction:column}.pricing-overview .pos{padding:20px}.ops-tasks{padding:16px}
  .review-filters{align-items:stretch}.review-selects{width:100%}.review-selects .field{flex:1;min-width:120px}.review-workspace .rv-c{padding:16px}
}
@media(max-width:900px) {.ops-layout{grid-template-columns:1fr}.ops-home .ts-v{font-size:24px}}
@media(max-width:600px) {
  .ops-home .ts{grid-template-columns:repeat(2,minmax(0,1fr))}.ops-home .ts-c{padding:16px 12px}
  .ops-task-main .disclosure>summary small{font-size:11px}.ops-selling{padding:16px}
  .cal .cal-cell{min-height:100px;padding:7px 3px}.cal-sale strong{font-size:11px;letter-spacing:-.5px}.cal-sale span{font-size:9px}
  .cal-sale .cal-amount-full{display:none}.cal-sale .cal-amount-short{display:block}
  .demand-stats{gap:6px;grid-template-columns:repeat(2,minmax(0,1fr))}.demand-stat{padding:12px}.demand-stat strong{font-size:20px}.demand-stat span{font-size:12px}
  .demand-stat:first-child{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px}
  .demand-stat:first-child strong{font-size:26px;white-space:nowrap}
}
.event-evidence { border:1px solid var(--line,#dce2e8); border-radius:12px; padding:16px; margin:12px 0; background:var(--bg,#f7f9fc); overflow-wrap:anywhere; }
.event-evidence p { line-height:1.65; margin:8px 0; }
.event-detail .kv { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; }
.event-detail .kv-v { line-height:1.6; overflow-wrap:anywhere; }
.event-detail .event-signal-note { margin-bottom:20px; }
@media(max-width:480px){ .event-detail .kv { gap:16px 14px; } .event-detail .event-signal-note { align-items:stretch; flex-direction:column; } }

/* ============================================================
   StayOS 2026 visual system

   흰 작업면, 차콜 탐색 메뉴, 절제된 민트 강조색.
   장식보다 데이터의 위계를 우선하며 색은 상태와 행동에만 사용한다.
   기존 화면의 selector 계약을 유지하는 공통 시각 레이어.
   ============================================================ */
:root{
  color-scheme:light;

  /* Warm-cool neutrals: 호텔의 온기와 운영 도구의 정확성을 함께 유지한다. */
  --bg:#F7F8FA;
  --surface:#FFFFFF;
  --surface-sub:#F7F8F9;
  --divider:#ECEEF0;
  --border:#E1E5E8;
  --line:var(--border);
  --line-2:#C7D2CD;
  --card:var(--surface);

  --t1:#151A19;
  --t2:#414B48;
  --t3:#616A67;
  --t4:#68716E;
  --text:var(--t1);
  --muted:var(--t3);

  /* Coastal green is the StayOS action color. Status colors keep their own jobs. */
  --blue:#147D64;
  --blue-dk:#0B614D;
  --blue-bg:#EAF5F0;
  --blue-t:#116C56;
  --blue-solid:#147D64;
  --navy:#151A19;
  --violet:#526F99;
  --violet-t:#405A82;
  --violet-bg:#EDF2F8;

  --red:#DF4A52;
  --red-solid:#C93642;
  --red-t:#B72B35;
  --red-bg:#FCEBEC;
  --green:#13936E;
  --green-t:#087456;
  --green-bg:#E5F5EE;
  --amber:#D98A1D;
  --amber-t:#8A570B;
  --amber-bg:#FFF3DE;

  --shadow-card:0 1px 2px rgba(21,26,25,.025);
  --shadow-float:0 16px 48px rgba(21,26,25,.16);
  --r-card:14px;
  --r-btn:9px;
  --r-chip:6px;
  --r-sheet:20px;
  --sb-w:236px;

  --duration-fast:120ms;
  --duration-default:200ms;
  --duration-slow:300ms;
  --ease-out:cubic-bezier(0,0,.2,1);
  --ease-in-out:cubic-bezier(.4,0,.2,1);
}

html{background:var(--bg);scrollbar-color:#B8C5BF transparent}
body{
  background:var(--bg);color:var(--t1);
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard Variable","Segoe UI",sans-serif;
  font-size:15px;line-height:1.58;letter-spacing:0;
  font-feature-settings:"tnum" 1,"ss01" 1;
}
body,button,a,input,select,textarea{touch-action:manipulation}
::selection{background:#BFE8DC;color:#0A332A}
.sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}
.skip-link{
  position:fixed;left:16px;top:12px;z-index:1000;padding:11px 15px;border-radius:11px;
  background:var(--navy);color:#FFFFFF;font-size:13px;font-weight:700;
  transform:translateY(-150%);transition:transform var(--duration-fast) var(--ease-out);
}
.skip-link:focus{transform:translateY(0)}
body.sheet-open{overflow:hidden}
:focus-visible{
  outline:2px solid var(--blue)!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 4px rgba(13,128,111,.12);
}

/* Fixed visual anchors keep operational content easy to scan. */
.app{background:var(--bg)}
.sb{
  background:var(--navy);border-right:0;padding:22px 12px 18px;
  box-shadow:inset -1px 0 rgba(255,255,255,.04);
}
.sb-brand{gap:11px;padding:4px 10px 24px;color:#F5FAF8;transition:background-color var(--duration-fast) var(--ease-out)}
.sb-brand:hover{background:rgba(255,255,255,.055)}
.sb-brand:hover .sb-name{color:#FFFFFF}
.sb-mark{
  width:34px;height:34px;flex-basis:34px;border-radius:9px;background:#147D64;
  box-shadow:none;
}
.sb-name{color:#F4F8F6;font-size:19px;font-weight:750;letter-spacing:-.45px}
.sb-name span{color:#95AAA2;font-size:10.5px;font-weight:600;letter-spacing:.04em;margin-top:4px}
.sb-nav{padding:0;gap:2px}
.sb-cap{
  color:#929D99;font-size:10.5px;font-weight:650;letter-spacing:.06em;
  padding:24px 12px 9px;
}
.sb-item{
  color:#B9C3BF;border-radius:8px;min-height:42px;padding:11px 12px;
  font-size:13.5px;font-weight:550;transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);
}
.sb-item svg{opacity:.82}
.sb-item:hover{background:rgba(255,255,255,.065);color:#F2F8F5}
.sb-item.on{
  background:#2B3632;color:#BCF9DC;font-weight:650;
  box-shadow:none;
}
.sb-item.on::before{
  content:none;
}
.sb-item .count-tag{background:#F05C62;box-shadow:0 0 0 3px var(--navy)}
.sb-pop{color:#7F9790}
.sb-pop:hover{background:rgba(255,255,255,.1);color:#FFFFFF}
.sb-item.on .sb-pop{color:#BDEADD}
.sb-foot{padding:18px 4px 0}
.sb-foot-box{
  background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);
  border-radius:10px;padding:12px;transition:background-color var(--duration-fast) var(--ease-out);
}
.sb-foot-box:hover{background:rgba(255,255,255,.085)}
.sb-foot-t{color:#DDEAE5;font-size:12.5px}
.sb-foot-s{color:#8FA59D;font-size:11.5px}
.sb-foot-arrow{margin-left:auto;color:#7FE0C6}
.sb-foot .dot-live{box-shadow:0 0 0 4px rgba(19,147,110,.15)}

.main{background:var(--bg)}
.topbar{
  min-height:64px;margin:0;padding:9px 28px;
  border:0;border-bottom:1px solid var(--border);border-radius:0;
  background:var(--surface);box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;top:0;
}
.tb-property{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;min-width:0}
.tb-kicker{
  font-size:10.5px;font-weight:750;letter-spacing:.06em;color:var(--t4);white-space:nowrap;
}
.prop-select{
  min-height:40px;max-width:min(38vw,310px);padding:8px 32px 8px 10px;
  border:1px solid transparent;border-radius:8px;background-color:var(--surface);
  color:var(--t1);font-size:14px;font-weight:700;
}
.tb-right{gap:7px}
.who{min-height:40px;padding:4px 8px 4px 5px!important;border-radius:12px!important;color:var(--t2)!important}
.who:hover{background:var(--surface-sub)!important}
.who-av{
  width:30px;height:30px;background:var(--navy);color:#D9FFF4;font-size:11.5px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.09);
}
.tb-action svg{flex:none}
.content{
  max-width:1600px;padding:30px clamp(22px,2.4vw,38px) 64px;gap:18px;
  margin:0 auto;
}

/* Headings and section navigation. */
.phead{padding:4px 0 10px;gap:18px}
.ph-t,.ab-t{font-size:clamp(25px,1.9vw,30px);font-weight:740;letter-spacing:-.025em;line-height:1.2;text-wrap:balance}
.ph-s,.ab-en{font-size:14px;color:var(--t3);font-weight:500;line-height:1.6;margin-top:8px;letter-spacing:0}
.workspace-nav{
  min-height:44px;padding:0;margin-bottom:2px;border-bottom:1px solid var(--border);
}
.workspace-tabs{gap:4px;padding:0;overflow-y:hidden}
.workspace-tab{
  min-height:44px;display:inline-flex;align-items:center;padding:10px 13px;border-radius:0;
  border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--t3);font-size:13.5px;font-weight:550;
  transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);
}
.workspace-tab:hover{background:transparent;color:var(--t1);border-bottom-color:#BFCBC5}
.workspace-tab.on{background:transparent;color:var(--blue-t);border-bottom-color:var(--blue);font-weight:700;box-shadow:none}
.workspace-more{min-height:42px;border-color:var(--border);background:var(--surface);border-radius:11px}

/* Shared surfaces: fewer, clearer layers instead of a card around everything. */
.card,.disclosure,.directory-card,.review-overview,.graph-metrics{
  border:1px solid var(--border);box-shadow:var(--shadow-card);border-radius:var(--r-card);
}
.card{background:var(--surface)}
.card-h{padding:20px 22px 5px}
.card-t{font-size:16px;font-weight:740;letter-spacing:-.018em}
.card-sub{font-size:12.8px;color:var(--t3)}
.card-b{padding:16px 22px 22px}
.stack{gap:16px}
.content>.stack{gap:22px}
.kpi,.hero,.dash-c,.kpi4-c,.mini-c,.move,.mem,.me-card{
  border:1px solid var(--border);box-shadow:none;
}
.kpi-v,.hero-v,.dash-v,.kpi4-v,.me-price,.graph-metric strong{
  font-variant-numeric:tabular-nums;letter-spacing:-.04em;
}
.banner,.event-signal-note,.chart-read,.demand-reading{border:1px solid color-mix(in srgb,currentColor 12%,transparent)}

/* Controls */
.btn{
  min-height:42px;padding:0 16px;border-radius:var(--r-btn);background:var(--blue-solid);
  color:#FFFFFF;font-size:13.5px;font-weight:650;letter-spacing:0;
  box-shadow:none;
  transition:background-color var(--duration-fast) var(--ease-out),transform 90ms var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);
}
.btn:hover{background:var(--blue-dk);box-shadow:none}
.btn:active{transform:scale(.98);background:#064D45}
.btn.ghost{
  background:var(--surface);color:var(--t2);border:1px solid var(--border);box-shadow:none;
}
.btn.ghost:hover{background:var(--surface-sub);border-color:#C7D2CD;color:var(--t1)}
.btn.danger{background:var(--red-bg);color:var(--red-t);border-color:#F3CDD0;box-shadow:none}
.btn.sm{min-height:40px;padding:0 13px;font-size:13.5px}
.btn.xs{min-height:38px;padding:0 11px;font-size:12.5px}
.seg{padding:3px;background:#EEF1F2;border:1px solid #E7EAEB;border-radius:9px}
.seg button{min-height:34px;border-radius:6px;color:var(--t3);font-size:13px}
.seg button.on,.seg button.active{background:var(--surface);color:var(--t1);box-shadow:0 2px 8px rgba(16,35,31,.08)}
.field{gap:7px}
.field-l{font-size:12px;color:var(--t2);font-weight:700}
.field select,.field input,textarea,.directory-search,.graph-date input{
  min-height:44px;background:var(--surface);border:1px solid var(--border);border-radius:9px;
  color:var(--t1);box-shadow:inset 0 1px 0 rgba(16,35,31,.015);
  transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);
}
.field select:focus,.field input:focus,textarea:focus,.graph-date input:focus{
  outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(13,128,111,.11);
}
.chip,.tag,.badge-sandbox,.badge-live{font-weight:700;letter-spacing:.015em}
.badge-live{background:var(--green-bg);color:var(--green-t);border:1px solid #CAE8DC}
.badge-sandbox{background:var(--violet-bg);color:var(--violet-t);border:1px solid #D9E2F0}

/* Rows and tables carry information; borders and rhythm do the grouping. */
.list-row,.alert-i,.doc-row,.graph-change-row{
  transition:background-color var(--duration-fast) var(--ease-out);
}
.list-row:hover,.alert-i:hover,.doc-row:hover,.graph-change-row:hover{background:#F5F8F6}
.lr-avatar{border-radius:12px;background:#EEF2F0;color:var(--t2)}
.lr-t{font-size:14.5px;font-weight:700}
.lr-s{font-size:13px}
.tbl-wrap{border-radius:10px}
table.t th{font-size:11.5px;letter-spacing:.02em;color:var(--t3);padding:11px 14px;background:var(--surface-sub)}
table.t td{font-size:13.5px;padding:14px;border-bottom:1px solid var(--divider)}
table.t tbody tr:hover td{background:#F4F8F6}

/* Today's command center. */
.ops-home .ts{
  padding:0;gap:0;border:1px solid var(--border);background:var(--surface);
  border-radius:14px;box-shadow:none;overflow:hidden;
}
.ops-home .ts-c{padding:23px 20px;border-radius:0;border-right:1px solid var(--divider)}
.ops-home .ts-c:last-child{border-right:0}
.ops-home .ts-c.lead{background:#F1F8F4;color:var(--t1)}
.ops-home .ts-c.lead .ts-v{color:var(--blue-t)}
.ops-home .ts-c.lead .ts-l{color:var(--t3)}
.ops-home .ts-v{font-size:27px;font-weight:760;letter-spacing:-.04em}
.ops-home .ts-l{font-size:12.5px;color:var(--t3)}
.ops-layout{gap:20px}
.ops-tasks{
  padding:22px 24px;border:1px solid var(--border);border-radius:14px;background:var(--surface);
  box-shadow:var(--shadow-card);
}
.ops-task{padding:21px 0;grid-template-columns:30px minmax(0,1fr);gap:13px}
.ops-task-no{width:30px;height:30px;border-radius:10px;background:var(--blue-bg);color:var(--blue-t)}
.ops-task-no.HIGH{background:var(--red-bg);color:var(--red-t)}
.ops-task-main h2{font-size:16px;letter-spacing:-.015em}
.ops-task-main>p{font-size:14px;color:var(--t3)}
.ops-selling{
  padding:22px;border-radius:14px;background:var(--navy);color:#F4FAF7;box-shadow:none;
}
.ops-selling .sec-cap-t,.ops-selling .sec-cap-n{color:#C9D9D3}
.ops-rate{border-bottom-color:rgba(255,255,255,.11);color:#FFFFFF}
.ops-rate small{color:#98AEA6}
.ops-calendar-link{background:rgba(86,216,184,.12);color:#E4FFF7;border:1px solid rgba(110,226,198,.14)}
.ops-selling>.btn.ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12);color:#F1F8F5}
.ops-selling>.btn.ghost:hover{background:rgba(255,255,255,.13)}

/* Room board: compact enough for the front desk, legible enough from a distance. */
.rb-split{grid-template-columns:minmax(0,1fr) minmax(280px,310px);gap:22px}
.rb-bar{padding:0 2px 15px;border-bottom-color:var(--divider)}
.rb-tally{gap:14px}
.rb-grid{grid-template-columns:repeat(auto-fill,minmax(144px,1fr));gap:10px}
.rb-floor{margin:18px 0 10px;font-weight:650}
.rb-room{
  min-height:108px;padding:14px 12px 12px;border:1px solid rgba(21,26,25,.07);
  border-radius:12px;box-shadow:none;
  transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);
}
.rb-room:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(16,35,31,.09)}
.rb-room.v-free{background:#FFFFFF;border-color:#D8E5DC}.rb-room.v-free .rb-st{color:#147D64}
.rb-room.v-in{background:#FBF3E3}.rb-room.v-in .rb-st{color:#8C580A}
.rb-room.v-out{background:#27332E}.rb-room.v-out:hover{background:#34443C}
.rb-room.v-dirty{background:#FBE9E9}.rb-room.v-dirty .rb-st{color:#A92D35}
.rb-room.v-cleaning{background:#E8F0F5}.rb-room.v-cleaning .rb-st{color:#315F78}
.rb-room.v-blocked{background:#EAEEEC;opacity:.74}
.rb-no{font-size:19px;font-weight:750;letter-spacing:-.02em}
.rb-sub{margin-top:2px}
.rb-st{font-size:11.5px;letter-spacing:.01em}
.rb-sig{top:8px;right:8px;gap:4px;color:var(--t3)}
.sig{display:grid;place-items:center;width:17px;height:17px;opacity:.38;filter:none}
.sig.open,.sig.key,.sig.clean,.sig.dnd{opacity:1;color:var(--blue-t)}
.sig.dnd{color:var(--red-t)}
.arr-panel{top:84px;max-height:calc(100vh - 104px);scrollbar-width:thin}
.rb-legend{border-top-color:var(--divider)}

/* Settings and documents use a consistent icon language. */
.set-grid{gap:12px}
.set-c,.ds{
  border:1px solid var(--border);box-shadow:none;
  transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);
}
.set-c:hover,.ds:hover{background:var(--surface);border-color:#9FB6AA;box-shadow:0 3px 12px rgba(16,35,31,.05);transform:translateY(-1px)}
.set-i,.ds-i{
  width:40px;height:40px;display:grid;place-items:center;border-radius:10px;
  background:var(--blue-bg);color:var(--blue-t);
}
.set-x{color:var(--blue-t)}
.ds-c{background:var(--blue-bg);color:var(--blue-t)}

/* Guest QR guide editor: hotel copy, curated places, and provider candidates. */
.guest-admin-section{
  display:flex;flex-direction:column;gap:14px;margin-top:6px;padding-top:24px;
  border-top:1px solid var(--divider);
}
.guest-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.guest-section-head>.btn{flex:0 0 auto}
.guest-section-head .card-t{display:flex;align-items:center;gap:9px}
.guest-count{
  display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border-radius:999px;
  background:var(--surface-sub);color:var(--t3);font-size:12px;font-weight:700;
}
.guest-locale-tabs{
  display:flex;gap:4px;width:max-content;max-width:100%;padding:4px;overflow-x:auto;
  border:1px solid #E1E7E4;border-radius:13px;background:#E9EEEB;scrollbar-width:thin;
}
.guest-locale-tab{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:7px 12px;
  border:0;border-radius:9px;background:transparent;color:var(--t3);font:inherit;font-size:12px;font-weight:780;
  white-space:nowrap;cursor:pointer;
}
.guest-locale-tab span{font-size:12.5px;font-weight:620}
.guest-locale-tab:hover{color:var(--t1)}
.guest-locale-tab.on{background:var(--surface);color:var(--t1);box-shadow:0 2px 8px rgba(16,35,31,.08)}
.guest-locale-tabs.compact .guest-locale-tab{min-height:36px;padding:6px 10px}
.guest-locale-panel[hidden]{display:none}
.guest-locale-panel{padding-top:2px}
.guest-guide-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.guest-guide-block{
  display:flex;flex-direction:column;gap:8px;min-width:0;padding:16px;
  border:1px solid var(--border);border-radius:15px;background:var(--surface-sub);
}
.guest-guide-block-title{font-size:14px;font-weight:750;color:var(--t1)}
.guest-pair-editor{display:flex;flex-direction:column;align-items:flex-start;gap:9px;margin-top:3px}
.guest-pair-list{display:flex;flex-direction:column;width:100%;gap:9px}
.guest-pair{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:7px;
  padding:10px;border:1px solid var(--divider);border-radius:12px;background:var(--surface);
}
.guest-pair-fields{display:grid;gap:7px;min-width:0}
.guest-pair-fields input,.guest-pair-fields textarea{
  width:100%;min-width:0;min-height:42px;padding:9px 11px;border:1px solid var(--border);
  border-radius:10px;background:var(--surface);color:var(--t1);font:inherit;font-size:13px;
}
.guest-pair-fields textarea{min-height:68px;resize:vertical}
.guest-pair-fields input:focus,.guest-pair-fields textarea:focus{
  outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(13,128,111,.1);
}
.guest-pair-delete{min-height:34px!important;padding-inline:9px!important}

.guest-place-list{display:flex;flex-direction:column;gap:10px}
.guest-place-card{
  display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:start;gap:12px;
  padding:15px;border:1px solid var(--border);border-radius:15px;background:var(--surface);
  transition:border-color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);
}
.guest-place-card.is-hidden{background:var(--surface-sub);border-style:dashed}
.guest-place-order{
  display:grid;place-items:center;width:32px;height:32px;border-radius:10px;
  background:var(--blue-bg);color:var(--blue-t);font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;
}
.guest-place-copy{min-width:0}
.guest-place-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:750;color:var(--t1)}
.guest-place-sub{margin-top:4px;color:var(--t3);font-size:12.5px;line-height:1.5}
.guest-place-note{margin-top:8px;color:var(--t2);font-size:13px;line-height:1.55;white-space:pre-wrap}
.guest-place-meta{display:flex;gap:9px;flex-wrap:wrap;margin-top:9px;color:var(--t4);font-size:11.5px}
.guest-place-meta span:not(:last-child)::after{content:'\00b7';margin-left:9px;color:var(--border-strong)}
.guest-place-tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.guest-place-tags span{padding:4px 7px;border-radius:999px;background:var(--surface-sub);color:var(--t3);font-size:11.5px;font-weight:650}
.guest-place-controls{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;max-width:260px}
.guest-visibility,.guest-found-actions label{
  display:inline-flex;align-items:center;gap:5px;min-height:38px;padding:0 9px;border-radius:10px;
  background:var(--surface-sub);color:var(--t2);font-size:12.5px;font-weight:680;cursor:pointer;white-space:nowrap;
}
.guest-visibility input,.guest-found-actions input{width:16px;height:16px;accent-color:var(--blue)}
.guest-order-actions{display:flex;gap:4px}
.guest-order-actions .btn{width:38px;padding:0}
.guest-place-empty{
  display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:22px;
  border:1px dashed var(--border);border-radius:15px;background:var(--surface-sub);color:var(--t3);font-size:13px;
}
.guest-place-empty b{color:var(--t2)}
.guest-place-empty.compact{padding:16px}
.guest-candidate-toolbar{display:flex;align-items:center;gap:8px}
.guest-candidate-toolbar select{
  min-height:38px;padding:0 34px 0 11px;border:1px solid var(--border);border-radius:10px;
  background-color:var(--surface);color:var(--t2);font:inherit;font-size:12.5px;
}
.guest-found-list{overflow:hidden;border:1px solid var(--border);border-radius:15px;background:var(--surface)}
.guest-found-list .list-row{align-items:center;gap:14px;padding:14px 15px}
.guest-found-copy{flex:1;min-width:180px}
.guest-found-title{font-size:14px;font-weight:720;color:var(--t1)}
.guest-found-map-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:7px}
.guest-found-map-links a{color:var(--blue-t);font-size:12px;font-weight:700;text-decoration:none}
.guest-found-map-links a:hover{text-decoration:underline}
.guest-found-actions{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap}
.guest-save-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:20px;border-top:1px solid var(--divider)}
.guest-save-bar>.btn:first-child{margin-right:auto}

.guest-place-sheet .guest-locale-panels{min-height:210px}
.guest-place-language-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.guest-editor-divider{
  display:flex;align-items:center;gap:10px;margin-top:3px;color:var(--t3);font-size:12px;font-weight:760;
}
.guest-editor-divider::after{content:'';height:1px;flex:1;background:var(--divider)}
.guest-place-meta-grid{grid-template-columns:2fr 1fr 1fr}
.guest-published-row{margin-top:3px}
.guest-editor-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:4px}

/* Authentication keeps the same quiet, high-trust language as the operator app. */
.login-wrap{
  background:
    radial-gradient(circle at 18% 16%,rgba(87,214,180,.13),transparent 30%),
    radial-gradient(circle at 86% 82%,rgba(220,164,75,.09),transparent 28%),
    var(--bg);
}
.login-box{
  width:min(430px,100%);padding:34px 32px;border:1px solid rgba(215,225,220,.9);
  border-radius:24px;box-shadow:0 24px 70px rgba(16,35,31,.12);
}
.login-logo{width:42px;height:42px;border-radius:14px;background:var(--navy);color:#E2FFF7}
.login-t{font-size:23px;font-weight:760;letter-spacing:-.025em}
.login-tabs{padding:4px;background:#E9EEEB;border-radius:14px}
.login-tab{min-height:42px;background:transparent;border-radius:10px;color:var(--t3)}
.login-tab.on{background:var(--surface);color:var(--t1);box-shadow:0 3px 10px rgba(16,35,31,.08)}
.pin-person{border:1px solid var(--border);background:var(--surface-sub)}
.pin-person.on{border-color:var(--blue);background:var(--blue-bg)}

/* Overlays are the only deliberately elevated glass-like surfaces. */
.sheet-back{background:rgba(10,22,19,.52);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.sheet{
  border:1px solid rgba(255,255,255,.72);box-shadow:var(--shadow-float);
  overscroll-behavior:contain;
}
.sheet-x{width:40px;height:40px;flex-basis:40px;background:#EEF2F0;color:var(--t2)}
.ctx-menu{box-shadow:var(--shadow-float);border-color:var(--border)}
.bottomnav{backdrop-filter:saturate(150%) blur(18px);-webkit-backdrop-filter:saturate(150%) blur(18px)}

@media (hover:hover){
  .btn:hover{transform:translateY(-1px)}
  .btn:active{transform:scale(.98)}
}

@media (max-width:1279px){
  .rb-split{grid-template-columns:1fr}
  .arr-panel{position:static;max-height:none}
}

@media (max-width:1023px){
  .topbar{margin:0;padding-inline:24px}
  .content{padding:26px 24px 64px}
}

@media (min-width:768px) and (max-width:1023px){
  :root{--sb-w:76px}
  .sb{padding-inline:8px}
}

@media (max-width:767px){
  .topbar{
    margin:0;padding:8px 10px;padding-top:calc(8px + var(--safe-t));
    min-height:60px;top:0;border-radius:0;
  }
  .tb-kicker,.who-name,.tb-right>.badge-live,.tb-right>.badge-sandbox{display:none}
  .tb-property{display:block;min-width:0;flex:1}
  .prop-select{max-width:none;width:100%;min-height:42px;background-color:transparent;border-color:transparent;padding-left:8px}
  .who{padding:4px!important;min-height:40px}
  .who-av{width:32px;height:32px}
  .content{padding:22px 14px calc(106px + var(--safe-b));gap:14px}
  .content>.stack{gap:17px}
  .ph-t,.ab-t{font-size:26px}
  .rb-grid{grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:8px}
  .phead{gap:14px}
  .card-h{padding:18px 17px 4px}
  .card-b{padding:14px 17px 18px}
  .btn{min-height:46px}
  .btn.xs{min-height:42px}
  .workspace-nav{margin:0 -2px}
  .workspace-tab{min-height:42px;padding:9px 12px}
  .bottomnav{
    left:0;right:0;bottom:0;border:0;border-top:1px solid var(--border);border-radius:0;
    background:#FFFFFF;box-shadow:none;
    padding:5px 4px calc(5px + var(--safe-b));overflow:hidden;
  }
  .bn-item{min-height:54px;border-radius:9px;color:var(--t4)}
  .bn-item.on{background:var(--blue-bg);color:var(--blue-t)}
  .ops-home .ts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ops-home .ts-c{padding:17px 13px}
  .ops-layout{gap:14px}
  .ops-tasks,.ops-selling{padding:18px;border-radius:14px}
  .set-grid{grid-template-columns:1fr}
  .list-row:has(.lr-actions){flex-wrap:wrap}
  .list-row:has(.lr-actions) .lr-main{min-width:calc(100% - 58px)}
  .list-row:has(.lr-actions) .lr-actions{flex:1 0 100%;padding-left:50px}
  .list-row:has(.lr-actions) .lr-actions .btn{flex:1;min-height:42px}
  .guest-section-head{flex-direction:column;gap:10px}
  .guest-section-head>.btn{width:100%}
  .guest-guide-columns{grid-template-columns:1fr}
  .guest-locale-tabs{width:100%}
  .guest-locale-tab{flex:1;min-width:54px;padding-inline:8px}
  .guest-locale-tab span{display:none}
  .guest-place-card{grid-template-columns:32px minmax(0,1fr);padding:13px}
  .guest-place-controls{grid-column:1/-1;justify-content:flex-start;max-width:none;padding-top:2px}
  .guest-place-language-grid,.guest-place-meta-grid{grid-template-columns:1fr}
  .guest-place-sheet .guest-locale-panels{min-height:0}
  .guest-found-list .list-row{align-items:flex-start;flex-wrap:wrap}
  .guest-found-copy{flex:1 0 100%;min-width:0}
  .guest-found-actions{justify-content:flex-start;width:100%}
  .guest-candidate-toolbar{align-items:stretch;flex-direction:column}
  .guest-candidate-toolbar select{width:100%;min-height:44px}
  .guest-save-bar{align-items:stretch;flex-direction:column}
  .guest-save-bar>.btn,.guest-save-bar>.btn:first-child{width:100%;margin-right:0}
  .guest-editor-actions>.btn{flex:1}
  .sheet{border-radius:24px 24px 0 0}
}

@media (max-width:390px){
  .tb-right{gap:3px}
  .tb-right>.tb-action{display:none}
  .prop-select{font-size:13.5px}
  .ops-home .ts-c.lead .ts-v{font-size:22px}
  .grid-kpi{grid-template-columns:1fr 1fr}
  .lr-actions{gap:5px}
}

@media (prefers-reduced-motion:reduce){
  :root{--duration-fast:0ms;--duration-default:0ms;--duration-slow:80ms}
  .rb-room:hover,.set-c:hover,.ds:hover,.btn:hover{transform:none}
}

/* ── 공식 로고 ─────────────────────────────────────────────
   원본 SVG(흰 글자 · 민트 심볼, 230×51)를 그대로 쓰고 폭만 정한다. 어두운 면 위에만 둔다. */
.sb-brand{flex-direction:column;align-items:flex-start;gap:7px;padding:8px 10px 24px}
.sb-logo{display:block;width:124px;overflow:hidden}
.sb-logo-img{display:block;width:124px;height:auto;aspect-ratio:230/51}
.sb-name{display:block;font-size:0;line-height:1}
.sb-name span{margin-top:0;font-size:10.5px}
@media (min-width:768px) and (max-width:1023px){
  /* 좁은 사이드바: 같은 로고 이미지에서 심볼 부분(왼쪽 39/230)만 보이게 자른다. */
  .sb-brand{align-items:center;padding:6px 0 18px}
  .sb-logo{width:32px;height:33px}
  .sb-logo-img{width:189px;max-width:none}
}

.login-brand{
  margin:-34px -32px 26px;padding:26px 32px 22px;border-radius:24px 24px 0 0;
  background:var(--navy);color:#F4F8F6;
}
.login-brand-logo{display:block;width:148px;height:auto;aspect-ratio:230/51}
.login-brand-line{margin-top:14px;font-size:14px;font-weight:650;letter-spacing:-.01em;color:#DDE8E3}
.login-brand-line span+span{color:#00FFAA}
.login-mark{margin-bottom:18px}
@media (max-width:480px){
  .login-box{padding:28px 22px}
  .login-brand{margin:-28px -22px 22px;padding:22px 22px 18px}
  .login-brand-logo{width:128px}
}

/* 외출(어두운 카드)에서도 손님 이름이 읽히게 한다. 기본 글자색(--t1)은 어두운 면 위에서 대비가 거의 없었다. */
.rb-room.v-out .rb-gn{color:#fff}

/* ─────────────────────────────────────────────────────────────
   EXPO V3 (2026-09-27) — 운영자 화면 브랜드 층.
   원래 Stay OS 8788 빌드(brand.css)와 같은 토큰: 차콜 #101010 탐색, 민트 #00FFAA 활성·주요 행동(차콜 글자),
   흰 바탕 글자·보조 버튼은 딥그린 #007851/#006848, 캔버스 #F4F6F5.
   DESIGN_SYSTEM_2026 §3(11px 미만 금지)·V2 지시(제목 자간 -0.01em 이내, 굵기 400/500/600/700)로 다듬는다.
   한 화면에서 민트 주요 버튼은 하나(.btn.primary)만 쓴다.
   ───────────────────────────────────────────────────────────── */
:root{
  --brand-ink:#101010;
  --brand-mint:#00FFAA;
  --brand-soft:#E1FFF3;
  --bg:#F4F6F5;
  --blue:#00885D;
  --blue-dk:#006848;
  --blue-t:#006848;
  --blue-bg:#E1FFF3;
  --blue-solid:#007851;
  --navy:#101010;
}
.app,.main,html,body{background:var(--bg)}
:focus-visible{outline-color:#007851!important;box-shadow:0 0 0 4px rgba(0,120,81,.14)}

/* 탐색: 차콜 면 + 민트 활성 */
.sb{background:var(--brand-ink);box-shadow:none}
.sb-brand{padding:4px 12px 22px}
.sb-brand:hover{background:transparent;opacity:.92}
.sb-cap{color:#98A7A0;font-size:11px;font-weight:500;letter-spacing:.02em}
.sb-item{color:#D8E2DD;font-size:14px;font-weight:500;min-height:44px;border-radius:10px}
.sb-item:hover{background:#232A26;color:#FFFFFF}
.sb-item.on{background:var(--brand-mint);color:var(--brand-ink);font-weight:700}
.sb-item.on svg{opacity:1}
.sb-item.on .sb-pop{color:#10402C}
.sb-foot-box{background:#1E2521;border-color:#2B332F}
.sb-foot-t{color:#EAF5EF;font-size:13px}
.sb-foot-s{color:#AABBB2;font-size:12px}
.sb-foot-arrow{color:var(--brand-mint)}
.tb-kicker{font-size:11px;font-weight:600;letter-spacing:.02em}

/* 버튼: 주요 행동 하나만 민트, 나머지는 딥그린·고스트 */
.btn{font-weight:600;letter-spacing:0;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}
.btn.primary{background:var(--brand-mint);border-color:var(--brand-mint);color:#0D2A1E;box-shadow:none}
.btn.primary:hover:not(:disabled){background:#00E89B;border-color:#00E89B}
.btn.primary:disabled{background:#DFE8E3;border-color:#DFE8E3;color:#66756C}

/* 타이포: 제목 자간·굵기 정리(한글 과도한 자간 축소 금지) */
h1,h2,h3,.ab-t,.ph-t,.card-t,.sec-cap-t,.login-t{letter-spacing:-.01em}
.ab-t,.ph-t{font-weight:700}
.card-t,.sec-cap-t{font-weight:700}
.ts-v,.kpi-v,.kpi4-v{font-weight:700;letter-spacing:-.01em}
.ops-home .ts-v{font-weight:700;letter-spacing:-.01em}
.card{border-radius:14px;box-shadow:none}

/* 오늘 객실 현황 한 줄: 첫 칸(지금 판매 가능)을 차콜로 — 원래 8788 첫 화면과 같은 강조 */
.ts-c.lead,.ops-home .ts-c.lead{background:var(--brand-ink);color:#FFFFFF;border-radius:12px;border-right:0}
.ts-c.lead .ts-v,.ops-home .ts-c.lead .ts-v{color:var(--brand-mint)}
.ts-c.lead .ts-l,.ops-home .ts-c.lead .ts-l{color:#D1DBD6}
button.ts-c.lead:hover,.ops-home button.ts-c.lead:hover{background:#1E2521}

/* 운영자 첫 화면 V3: 객실 현황 → 처리할 요청 → 가격 판단 근거 */
.ops-v3{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:20px;align-items:start}
.ops-panel{border:1px solid var(--border);border-radius:14px;background:var(--surface);padding:20px 22px}
.ops-panel-h{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.ops-panel-h h2{margin:0;font-size:18px;font-weight:700}
.ops-panel-h p{margin:4px 0 0;color:var(--t3);font-size:13px;line-height:1.5}
.ops-step{display:inline-block;margin-right:8px;color:var(--blue-t);font-size:12px;font-weight:700;letter-spacing:.02em}
.ops-req-list{display:grid}
.ops-req{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:56px;padding:10px 4px;
  border:0;border-top:1px solid var(--divider);background:transparent;color:var(--t1);text-align:left;cursor:pointer;font:inherit;
  transition:background-color var(--duration-fast) var(--ease-out)}
.ops-req:first-child{border-top:0}
.ops-req:hover{background:#F6FAF8}
.ops-req-room{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}
.ops-req-what{min-width:0}
.ops-req-what strong{display:block;font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ops-req-what small{display:block;color:var(--t3);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ops-req-state{padding:4px 9px;border-radius:7px;font-size:12px;font-weight:700;white-space:nowrap}
.ops-req-state.new{background:var(--brand-soft);color:#005E42}
.ops-req-state.working{background:#FFF1D6;color:#7A4B00}
.ops-req-state.pay{background:#EDF2F8;color:#405A82}
.ops-req-empty{margin:6px 0 0;color:var(--t3);font-size:14px;line-height:1.6}
.ops-price{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ops-price-c{display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px 16px;border:1px solid var(--border);border-radius:12px;
  background:var(--surface);color:var(--t1);text-align:left;cursor:pointer;font:inherit;transition:border-color var(--duration-fast) var(--ease-out)}
.ops-price-c:hover{border-color:#9FCDB8}
.ops-price-k{color:var(--t3);font-size:13px;font-weight:600}
.ops-price-v{font-size:26px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.ops-price-d{color:var(--t2);font-size:13px;line-height:1.5}
.ops-price-d>span{display:block}
.ops-price-d b{font-weight:700;color:var(--t1)}
.ops-price-note{margin:12px 0 0;color:var(--t3);font-size:12px;line-height:1.55}
.ops-review{margin-top:14px;padding-top:14px;border-top:1px solid var(--divider)}
.ops-review h3{margin:0 0 6px;font-size:15px;font-weight:700}
.ops-review p{margin:0;color:var(--t2);font-size:14px;line-height:1.55}
.ops-review .btn{margin-top:10px}
@media (max-width:1180px){.ops-v3{grid-template-columns:1fr}}
@media (max-width:520px){
  .ops-panel{padding:16px}
  .ops-price{grid-template-columns:1fr}
  .ops-req{grid-template-columns:52px minmax(0,1fr) auto;gap:8px}
}
@media (prefers-reduced-motion:reduce){.ops-req,.ops-price-c,.btn{transition:none}}

/* 가격 판단 첫 묶음(오늘의 가격 검토). 8788 가격 판단 화면과 같은 구성: 차콜 요약 + 흰 비교 막대. */
.decision-overview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);overflow:hidden;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.decision-summary{background:var(--brand-ink);color:#FFFFFF;padding:26px 28px}
.decision-eyebrow{color:var(--brand-mint);font-size:12px;font-weight:700;letter-spacing:.02em}
.decision-summary h2{margin:14px 0 22px;font-size:21px;font-weight:700;letter-spacing:-.01em;color:#FFFFFF}
.decision-value{color:var(--brand-mint);font-size:clamp(24px,2.1vw,32px);font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.decision-label{margin:8px 0 18px;color:#CBD5CF;font-size:12px}
.decision-reason{margin:0;color:#EEF3F0;font-size:14px;line-height:1.65}
.decision-note{margin:14px 0 0;color:#ABB8B0;font-size:11px;line-height:1.5}
.decision-summary details{margin-top:14px;background:#1E2521;border-color:#39423C;color:#EDF4EF}
.decision-summary details p{margin:0;padding-top:8px;font-size:12px;line-height:1.6;color:#DCE6E0}
.decision-summary .disclosure>summary{color:#EDF4EF}
.decision-summary .disclosure>summary small{color:#B9C9BF}
.decision-comparison{padding:26px 28px}
.decision-comparison h3{margin:0;font-size:17px;font-weight:700;letter-spacing:-.01em}
.decision-comparison>p{margin:6px 0 18px;color:var(--t3);font-size:12px;line-height:1.5}
.decision-rate{display:grid;grid-template-columns:120px minmax(40px,1fr) 78px;align-items:center;gap:12px;min-height:38px;font-size:13px}
.decision-rate>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.decision-rate strong{text-align:right;font-variant-numeric:tabular-nums}
.decision-track{height:7px;border-radius:2px;background:#EEF2F0;overflow:hidden}
.decision-track>div{height:100%;border-radius:2px;background:#909D96}
.decision-rate.self{color:var(--blue-t);font-weight:700}
.decision-rate.self .decision-track>div{background:#00D891}
@media (max-width:1024px){.decision-overview{grid-template-columns:1fr}}
@media (max-width:520px){.decision-summary,.decision-comparison{padding:20px}.decision-rate{grid-template-columns:96px minmax(30px,1fr) 70px;gap:8px}}

/* DESIGN_SYSTEM_2026 §3: 11px 미만 글자를 쓰지 않는다. 운영 밀도는 유지하고 작은 칩·꼬리표만 11px 로 올린다. */
.rb-ch,.rb-out,.rb-hall span,.arr-p,.arr-flag,.gf-lv,.mk-d,.mk-tag,.wd-tag,.ag-wk,.ag-new,.inv-dw,.inv-n,.br-l,.toast-n,
.ql-l,.cal-m,.bn-badge,.tb-kicker,.sb-cap,.sb-name span,.pricing-workspace .badge,.badge{font-size:11px}
.rb-ch{padding:1px 5px;line-height:1.35}
/* 예전 초록(#147D64)이 남아 있던 곳을 브랜드 딥그린으로 */
.rb-room.v-free .rb-st{color:var(--blue-t)}
.sb-mark{background:var(--blue-solid)}
