:root{--blue:#1F4E79;--blue-light:#2E86C1;--blue-bg:#EBF3FB;--text:#1a1d23;--muted:#6b7280;--border:#e2e6ea}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;max-width:100%;overflow-x:hidden}
body{font-family:'Segoe UI',system-ui,sans-serif;color:var(--text);line-height:1.75;background:#f5f7fa}
.container{width:min(840px,calc(100% - 24px));max-width:840px;margin:32px auto 60px;background:#fff;border-radius:12px;
  box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden}
.doc-header{background:var(--blue-bg);padding:28px 36px;border-bottom:2px solid #D6E8F5;min-width:0}
.doc-header h1{font-size:22px;color:var(--blue);margin-bottom:6px;font-weight:800}
.meta{color:var(--muted);font-size:13px;margin-bottom:10px}
.warn-top{background:#FFF8E7;border:2px solid #F59E0B;border-radius:10px;
  padding:14px 18px;margin-top:12px;font-size:14px;color:#92400E;max-width:100%;overflow-wrap:anywhere}
.doc-body{padding:32px 36px;min-width:0}
h2{font-size:15px;color:var(--blue);margin:32px 0 10px;padding-bottom:6px;
   border-bottom:2px solid var(--blue-bg);font-weight:700}
h2:first-child{margin-top:0}
h3{font-size:13px;font-weight:700;color:#374151;margin:18px 0 7px;
   text-transform:uppercase;letter-spacing:.4px}
p{margin-bottom:12px;font-size:14px}
ul{margin:8px 0 14px 20px;font-size:14px}
li{margin-bottom:7px}
.box-blue{background:var(--blue-bg);border-left:4px solid var(--blue);padding:14px 18px;
  border-radius:0 8px 8px 0;margin:14px 0;font-size:14px;max-width:100%;overflow-wrap:anywhere}
.box-warn{background:#FFF8E7;border-left:4px solid #F59E0B;padding:14px 18px;
  border-radius:0 8px 8px 0;margin:14px 0;font-size:14px;max-width:100%;overflow-wrap:anywhere}
.box-red{background:#FFF1F1;border-left:4px solid #EF4444;padding:14px 18px;
  border-radius:0 8px 8px 0;margin:14px 0;font-size:14px;max-width:100%;overflow-wrap:anywhere}
.box-green{background:#F0FDF4;border-left:4px solid #22C55E;padding:14px 18px;
  border-radius:0 8px 8px 0;margin:14px 0;font-size:14px;max-width:100%;overflow-wrap:anywhere}
.formula{background:var(--blue);color:#fff;border-radius:10px;padding:16px 20px;
  margin:14px 0;font-size:13px;line-height:2;max-width:100%;overflow-wrap:anywhere}
.formula strong{color:#93C5FD}
table{width:100%;border-collapse:collapse;margin:14px 0;font-size:13px;border-radius:8px;overflow:hidden}
th{background:var(--blue);color:#fff;padding:10px 14px;text-align:left;font-weight:600}
td{padding:10px 14px;border-bottom:1px solid var(--blue-bg)}
tr:last-child td{border:none}
tr:nth-child(even) td{background:#F8FAFC}
.toc{background:#F8FAFC;border:1px solid var(--border);border-radius:10px;
  padding:18px 22px;margin-bottom:24px;max-width:100%;overflow-wrap:anywhere}
.toc-title{font-weight:700;font-size:13px;color:var(--blue);margin-bottom:10px}
.toc ol{margin-left:16px;font-size:13px}
.toc li{margin-bottom:5px}
.toc a{color:var(--blue);text-decoration:none}
.toc a:hover{text-decoration:underline}
.step{display:flex;gap:14px;padding:14px;background:#F8FAFC;border-radius:8px;
  margin-bottom:10px;border:1px solid var(--border);max-width:100%}
.step-nr{width:32px;height:32px;background:var(--blue);color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;
  flex-shrink:0;margin-top:1px}
.step-body{font-size:13px;flex:1;min-width:0;overflow-wrap:anywhere}
.step-body strong{display:block;margin-bottom:3px;font-size:14px}
.ex-tbl{width:100%;border-collapse:collapse;margin-top:10px;font-size:13px}
.ex-tbl th{background:#F59E0B;color:#fff;padding:8px 12px;font-weight:600}
.ex-tbl td{padding:8px 12px;border-bottom:1px solid #FDE68A}
.ex-tbl tr:last-child td{border:none;font-weight:700;background:#FEF9C3}
.footer-doc{background:#F8FAFC;padding:16px 36px;font-size:12px;color:var(--muted);
  border-top:1px solid var(--border);min-width:0;overflow-wrap:anywhere}
.footer-doc a{color:var(--blue);text-decoration:none}
.doc-list-mt-8{margin-top:8px}
.doc-list-mt-10{margin-top:10px}
.doc-link-blue{color:var(--blue)}
.refund-example-box{background:#FFF8E7;border:2px solid #F59E0B;border-radius:10px;padding:18px 22px;margin:20px 0;max-width:100%;overflow-wrap:anywhere}
.refund-example-title{font-weight:700;color:#92400E;margin-bottom:12px;font-size:15px}
.refund-example-note{font-size:12px;color:#92400E;margin-top:10px}
@media(max-width:700px){
  .container{width:100%;margin:0 auto 48px;border-radius:0;box-shadow:none}
  .doc-header,.doc-body,.footer-doc{padding:20px 16px}
  .doc-header h1{font-size:22px;line-height:1.25}
  .meta{font-size:12px;line-height:1.55}
  h2{font-size:14px;line-height:1.35;scroll-margin-top:76px}
  h3{font-size:13px;line-height:1.4;letter-spacing:.2px}
  p,ul,li{font-size:14px}
  .toc{padding:14px 16px}
  .toc ol{margin-left:18px}
  .warn-top,.box-blue,.box-warn,.box-red,.box-green,.formula,.refund-example-box{padding:13px 14px}
  .step{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;padding:12px}
  table,.ex-tbl{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;border-radius:8px}
  th,td,.ex-tbl th,.ex-tbl td{min-width:130px}
  .footer-doc{line-height:1.7}
}
@media(max-width:380px){
  .doc-header,.doc-body,.footer-doc{padding-left:14px;padding-right:14px}
  .doc-header h1{font-size:20px}
}
