/* 소상공인 계산기 3차 — 공통 UI */
.b3-app { margin-top:18px; }
.b3-calc { background:var(--card); border-radius:var(--radius); padding:24px 22px; box-shadow:0 4px 20px rgba(27,39,64,.07); }
.b3-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.b3-field { display:flex; flex-direction:column; gap:6px; min-width:0; }
.b3-field.wide { grid-column:1 / -1; }
.b3-field label { font-size:.84rem; font-weight:750; color:var(--ink); }
.b3-field .hint { display:block; margin-top:2px; font-size:.72rem; font-weight:450; color:var(--ink-soft); }
.b3-input { display:flex; align-items:center; border:1.5px solid var(--line); border-radius:12px; background:#FAFBFE; overflow:hidden; transition:border-color .15s,box-shadow .15s; }
.b3-input:focus-within { border-color:var(--primary); box-shadow:0 0 0 4px var(--primary-soft); background:#fff; }
.b3-input input,.b3-input select { width:100%; min-width:0; border:0; outline:0; background:transparent; padding:12px 13px; color:var(--ink); font:inherit; font-size:1rem; font-weight:700; font-variant-numeric:tabular-nums; }
.b3-input input { text-align:right; }
.b3-input select { appearance:none; cursor:pointer; }
.b3-input .unit { flex:none; padding-right:13px; color:var(--ink-soft); font-size:.82rem; font-weight:650; }
.b3-check { display:flex; align-items:center; gap:9px; min-height:47px; padding:11px 13px; border:1.5px solid var(--line); border-radius:12px; background:#FAFBFE; font-size:.88rem; font-weight:700; cursor:pointer; }
.b3-check input { width:18px; height:18px; accent-color:var(--primary); }
.b3-guide { grid-column:1 / -1; margin:2px 0 0; padding:11px 13px; border-radius:11px; background:var(--primary-soft); color:#3155B8; font-size:.77rem; line-height:1.55; }
.b3-guide a { color:inherit; font-weight:800; }
.b3-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.b3-action { border:1.5px solid var(--line); border-radius:11px; background:#fff; color:var(--ink); padding:10px 15px; font:inherit; font-size:.84rem; font-weight:800; cursor:pointer; }
.b3-action.primary { border-color:var(--primary); background:var(--primary); color:#fff; }
.b3-extra { margin-top:16px; }
.b3-kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:14px 0; }
.b3-kpi { padding:14px 12px; border:1.5px solid var(--line); border-radius:13px; background:var(--card); }
.b3-kpi span { display:block; font-size:.72rem; color:var(--ink-soft); }
.b3-kpi b { display:block; margin-top:5px; font-size:1.02rem; color:var(--ink); font-variant-numeric:tabular-nums; }
.b3-kpi.good b { color:var(--money); }
.b3-kpi.warn b { color:#C88414; }
.b3-kpi.bad b { color:var(--danger); }
.b3-funnel { display:grid; grid-template-columns:repeat(4,1fr); align-items:stretch; gap:7px; margin:15px 0; }
.b3-funnel div { padding:12px 7px; border-radius:11px; background:var(--primary-soft); text-align:center; font-size:.72rem; color:var(--ink-soft); }
.b3-funnel b { display:block; margin-top:4px; color:var(--primary); font-size:1rem; }
.b3-mix { margin:14px 0; }
.b3-mix-row { display:grid; grid-template-columns:90px 1fr 60px; gap:8px; align-items:center; margin:8px 0; font-size:.78rem; }
.b3-mix-track { height:10px; border-radius:999px; background:#E9EDF4; overflow:hidden; }
.b3-mix-track i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--primary),#6D92F1); }
.b3-mix-row b { text-align:right; font-variant-numeric:tabular-nums; }
.b3-table { width:100%; border-collapse:collapse; margin:12px 0; font-size:.8rem; }
.b3-table th,.b3-table td { padding:9px 8px; border-bottom:1px solid var(--line); text-align:right; }
.b3-table th:first-child,.b3-table td:first-child { text-align:left; }
.b3-table th { color:var(--ink-soft); font-size:.72rem; }
.b3-policy-list { display:grid; gap:10px; margin-top:14px; }
.b3-policy { padding:15px; border:1.5px solid var(--line); border-radius:13px; background:var(--card); }
.b3-policy h3 { margin:0 0 5px; font-size:.96rem; }
.b3-policy p { margin:0 0 8px; color:var(--ink-soft); font-size:.78rem; line-height:1.5; }
.b3-policy a { color:var(--primary); font-size:.78rem; font-weight:800; }
.b3-source { margin-top:12px; padding:11px 13px; border-radius:11px; background:#FFF8EC; color:#7A6335; font-size:.74rem; line-height:1.55; }
.b3-source a { color:inherit; font-weight:800; }
.b3-canvas { width:100%; height:230px; border:1.5px solid var(--line); border-radius:13px; background:var(--card); }
.b3-sensitive { padding:14px 16px; border-left:4px solid var(--danger); border-radius:0 12px 12px 0; background:#FFF5F5; color:#7A3E3E; font-size:.8rem; line-height:1.6; }
.b3-empty { padding:18px; border:1.5px dashed var(--line); border-radius:12px; color:var(--ink-soft); text-align:center; font-size:.84rem; }

@media (max-width:620px) {
  .b3-grid { grid-template-columns:1fr; }
  .b3-field.wide,.b3-guide { grid-column:auto; }
  .b3-kpis { grid-template-columns:1fr; }
  .b3-funnel { grid-template-columns:1fr 1fr; }
  .b3-mix-row { grid-template-columns:76px 1fr 54px; }
}