/* ====== bố cục công cụ ====== */
.tool{display:grid;grid-template-columns:380px minmax(0,1fr);gap:28px;padding:28px 0 56px;align-items:start}
.panel{position:sticky;top:88px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;max-height:calc(100vh - 104px);overflow:auto}
.panel h2{font-size:1rem;font-family:var(--sans);font-weight:700;color:var(--navy);margin:20px 0 10px;max-width:none}
.panel h2:first-child{margin-top:0}
.fld{display:block;margin:0 0 12px;border:0;padding:0;min-width:0}
.fld>span,.fld>legend{display:block;font-size:.8rem;font-weight:600;color:var(--mute);margin-bottom:5px;padding:0}
.fld input[type=text],.fld select{width:100%;font:inherit;font-size:1rem;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);min-height:44px}
.fld input:focus,.fld select:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(25,82,147,.18)}
.fld input[type=range]{width:100%;accent-color:var(--blue);height:44px}
.row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.row2 .fld-s{grid-column:auto}
.row2:has(.fld-s){grid-template-columns:118px minmax(0,1fr)}
.presets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.presets button{font:inherit;font-size:.86rem;padding:8px 12px;border-radius:999px;border:1.5px solid var(--blue);background:#fff;color:var(--blue);cursor:pointer;font-weight:600}
.presets button:hover{background:var(--blue);color:#fff}
.fonts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-bottom:14px}
.fonts label{position:relative;cursor:pointer;min-width:0;display:block}
.fonts input{position:absolute;opacity:0;inset:0}
.fonts span{display:flex;align-items:center;justify-content:center;height:52px;border:1.5px solid var(--line);border-radius:10px;color:var(--navy);white-space:nowrap;overflow:hidden;padding:0 8px;line-height:1.2;justify-content:flex-start}
.fonts input:checked+span{border-color:var(--blue);background:var(--tint);box-shadow:0 0 0 2px var(--blue) inset}
.fonts input:focus-visible+span{outline:3px solid var(--gold);outline-offset:2px}
.colors{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.colors legend{width:100%}
.colors label{position:relative;cursor:pointer}
.colors input{position:absolute;opacity:0}
.colors i{display:block;width:34px;height:34px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1.5px var(--line)}
.colors input:checked+i{box-shadow:0 0 0 2.5px var(--navy)}
.adv{border:1px solid var(--line);border-radius:10px;padding:0 14px;margin:6px 0 4px}
.adv summary{cursor:pointer;font-weight:600;font-size:.92rem;padding:12px 0;color:var(--navy)}
.hint{font-size:.8rem;color:var(--mute);margin:0 0 12px}
.wide{width:100%}
.out{margin-top:14px;background:var(--tint);border-radius:12px;padding:14px}
.out-name{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:.9rem;line-height:1.35;flex-wrap:wrap}
.out-name span{flex:none;background:#c0392b;color:#fff;font-size:.68rem;font-weight:700;padding:5px 6px;border-radius:5px;letter-spacing:.04em}
.out-name b{flex:1;min-width:0;word-break:break-word}
.out-name small{color:var(--mute);width:100%}
.out-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.out-btns .btn{padding:12px 10px;font-size:.92rem}
.btn-zalo{background:#0068ff;color:#fff}
.btn-zalo:hover{background:#0055d4}
.out-link{display:block;text-align:center;margin-top:10px;font-size:.88rem}
.status{font-size:.88rem;color:var(--blue-d);min-height:1.3em;margin:10px 0 0}
.status.err{color:#a11}
.minor{display:flex;gap:16px;justify-content:center;margin-top:6px}
.minor button{background:none;border:0;font:inherit;font-size:.88rem;color:var(--mute);text-decoration:underline;cursor:pointer;padding:8px 4px}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.how ol{padding-left:22px;display:grid;gap:8px}
.how{padding-top:0}

.stage{display:grid;gap:26px;justify-items:center;min-width:0}
.sheet{position:relative;box-shadow:0 18px 50px -18px rgba(11,42,82,.45),0 0 0 1px var(--line);background:#fff;overflow:hidden}
.sheet .a4{transform-origin:0 0;position:absolute;left:0;top:0}

@media (max-width:1020px){
  .tool{grid-template-columns:1fr;gap:20px;padding-top:20px}
  .panel{position:static;max-height:none}
}

/* ====== trang A4 (794 x 1123 px ở 96dpi) ====== */
.a4{--fs:16px;--name-font:"Dancing Script";--name-w:700;--name-size:40px;--name-color:#195293;--lb:#195293;--lg:#c4962f;
  width:794px;height:1123px;background:#fff;position:relative;overflow:hidden;color:#141414;
  font-family:"Tinos","Times New Roman",Times,serif;font-size:var(--fs);line-height:1.42;text-align:left}
.a4 *{box-sizing:border-box}
.a4::before{content:"";position:absolute;left:24px;top:24px;right:24px;bottom:24px;border:2.5px solid var(--lb)}
.a4::after{content:"";position:absolute;left:31px;top:31px;right:31px;bottom:31px;border:1px solid var(--lg)}
.a4-c{position:absolute;width:26px;height:26px;border:2.5px solid var(--lg);z-index:2;background:#fff}
.a4-c1{left:17px;top:17px;border-right:0;border-bottom:0}
.a4-c2{right:17px;top:17px;border-left:0;border-bottom:0}
.a4-c3{left:17px;bottom:17px;border-right:0;border-top:0}
.a4-c4{right:17px;bottom:17px;border-left:0;border-top:0}
.a4-wm{position:absolute;left:147px;top:330px;width:500px;height:500px;opacity:.045;z-index:0}
.a4-in{position:absolute;left:64px;right:64px;top:48px;bottom:58px;z-index:1;display:flex;flex-direction:column}
.a4-run{position:absolute;left:64px;right:64px;bottom:38px;z-index:1;display:flex;justify-content:space-between;font-size:10.5px;color:#6b7686;font-style:italic;letter-spacing:.01em}

.lt-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding-bottom:9px;border-bottom:1px solid var(--lg)}
.lt-org{display:flex;align-items:center;gap:11px}
.lt-org img{width:74px;height:74px;flex:none}
.lt-org b{display:block;font-size:14px;line-height:1.3;color:var(--lb);letter-spacing:.01em}
.lt-no{display:block;font-size:13.5px;margin-top:5px}
.lt-nat{text-align:center;flex:none}
.lt-nat b{display:block;font-size:13.5px;letter-spacing:.005em}
.lt-motto{display:inline-block;font-weight:700;font-size:14.5px;padding-bottom:3px;border-bottom:1px solid #141414;margin-bottom:9px}
.lt-nat i{display:block;font-size:14px}

.lt-title{text-align:center;margin:calc(var(--fs)*.95) 0 calc(var(--fs)*.75)}
.lt-title h2{font-family:"Tinos",serif;font-size:calc(var(--fs)*1.9);letter-spacing:.14em;color:var(--lb);margin:0 0 8px;font-weight:700;max-width:none;line-height:1.3}
.lt-title p{margin:0;font-size:calc(var(--fs)*1.02);line-height:1.38}
.lt-title b{font-size:calc(var(--fs)*1.08)}
.lt-orn{display:block;width:150px;height:9px;margin:10px auto 0;border-top:1px solid var(--lg);border-bottom:1px solid var(--lg);position:relative}
.lt-orn::after{content:"";position:absolute;left:69px;top:-2px;width:11px;height:11px;background:var(--lg);transform:rotate(45deg)}
.lt-title-inv h2{font-size:calc(var(--fs)*2.1);letter-spacing:.2em;margin-bottom:4px;line-height:1.15}
.lt-title-inv p{font-size:calc(var(--fs)*1.05);font-weight:700;color:#1d2c44}

.lt-to{display:flex;gap:10px;align-items:baseline;margin-bottom:calc(var(--fs)*.75)}
.lt-to-k{font-weight:700;flex:none}
.lt-to-v{flex:1;min-width:0}
.lt-generic{font-weight:700}
.lt-generic span{display:block}
.lt-name{font-family:var(--name-font),"Dancing Script",cursive;font-weight:var(--name-w);font-size:var(--name-size);color:var(--name-color);line-height:1.5;padding:0 0 6px;word-break:break-word}
.lt-name.is-org{font-size:calc(var(--name-size)*.74)}
.lt-to-inv .lt-name.is-org{font-size:calc(var(--name-size)*.9)}
.lt-sub{font-weight:700;font-style:italic;font-size:calc(var(--fs)*1.04)}
.lt-to-inv{display:block;text-align:center;margin:calc(var(--fs)*.2) 0 calc(var(--fs)*.8)}
.lt-to-inv .lt-to-k{display:block;font-weight:400;font-style:italic;font-size:calc(var(--fs)*1.08);letter-spacing:.04em}
.lt-to-inv .lt-name{font-size:calc(var(--name-size)*.92);padding:2px 20px 8px;border-bottom:1px dotted #8b96a8;display:inline-block;min-width:380px;max-width:100%}
.lt-to-inv .lt-sub{margin-top:8px;font-size:calc(var(--fs)*1.1)}

.lt-body p{margin:0 0 calc(var(--fs)*.62);text-align:justify;text-indent:2em}
.lt-body h3{font-family:"Tinos",serif;font-size:calc(var(--fs)*1.02);text-transform:uppercase;color:var(--lb);margin:calc(var(--fs)*.75) 0 calc(var(--fs)*.55);letter-spacing:.02em;font-weight:700;line-height:1.5}
.lt-body>h3:first-child{margin-top:0}
.lt-ul,.lt-ol{margin:0 0 calc(var(--fs)*.5);padding:0;list-style:none;counter-reset:n}
.lt-ul li,.lt-ol li{position:relative;padding-left:1.5em;counter-increment:n}
.lt-ul li::before{content:"";position:absolute;left:.5em;top:.68em;width:5px;height:5px;background:var(--lb);border-radius:50%}
.lt-ol li::before{content:counter(n) ".";position:absolute;left:.2em;top:0;font-weight:700;color:var(--lb)}
.lt-ul li,.lt-ol li{margin-bottom:calc(var(--fs)*.34);text-align:justify}
.lt-thanks{font-weight:700;font-style:italic;text-indent:2em}
.lt-info{width:100%;border-collapse:collapse;margin:calc(var(--fs)*.5) 0 calc(var(--fs)*.9);border:1px solid var(--lb)}
.lt-info th{width:128px;white-space:nowrap;background:#eaf1fa;color:var(--lb);text-align:left;padding:7px 14px;vertical-align:top;border-bottom:1px solid #c5d3e6;font-size:calc(var(--fs)*.95);text-transform:uppercase;letter-spacing:.03em}
.lt-info td{padding:7px 14px;border-bottom:1px solid #c5d3e6;vertical-align:top}
.lt-info tr:last-child>*{border-bottom:0}
.lt-info td b{font-size:calc(var(--fs)*1.08)}
.lt-info td span{font-size:calc(var(--fs)*.95)}
.lt-tbl{width:100%;border-collapse:collapse;margin:0 0 calc(var(--fs)*.6);font-size:calc(var(--fs)*.95)}
.lt-tbl th,.lt-tbl td{border:1px solid #6f87a8;padding:8px 10px;vertical-align:middle;text-align:left}
.lt-tbl thead th{background:var(--lb);color:#fff;text-align:center;border-color:var(--lb)}
.lt-tbl tbody th{width:176px;color:var(--lb)}
.lt-tbl .c{text-align:center;white-space:nowrap;width:140px}
.lt-steps tbody th{width:78px;background:#eaf1fa;text-align:center;white-space:nowrap}
.lt-bank{border-left:3px solid var(--lg);background:#fbf7ec;padding:10px 14px 4px;margin-bottom:calc(var(--fs)*.7)}
.lt-bank p{text-indent:0;text-align:left;margin-bottom:6px}

.lt-foot{display:flex;justify-content:space-between;gap:20px;margin-top:auto;padding-top:calc(var(--fs)*.8)}
.lt-recv{font-size:12.5px;line-height:1.45;width:250px}
.lt-recv span{display:block}
.lt-sign{text-align:center;width:390px;display:flex;flex-direction:column;align-items:center}
.lt-sign b{display:block;font-size:15px;white-space:nowrap}
.lt-sign-hint{font-size:13px}
.lt-sign-gap{display:block;height:84px}
.lt-sign-name{min-height:1.4em}

[hidden]{display:none!important}

/* ====== in trực tiếp ====== */
@media print{
  @page{size:A4;margin:0}
  html,body{background:#fff!important;margin:0}
  .tool{display:block;padding:0;width:auto;margin:0}
  .stage{display:block}
  .sheet{box-shadow:none;width:210mm!important;height:297mm!important;page-break-after:always;break-after:page;overflow:hidden}
  .sheet .a4{transform:scale(1)!important;position:static;zoom:1}
  .a4{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ===== khối ký: con dấu + chữ ký theo kích thước thực (dấu tròn Ø40 mm = 151 px) ===== */
.lt-sign-gap{position:relative;display:block;width:100%;height:168px}
.lt-seal{position:absolute;top:-8px;display:block;max-width:none;width:297px;height:173px;pointer-events:none}
.lt-sign-hint{position:absolute;left:0;right:0;top:56px;font-size:13px;color:#555}
.lt-sign-name{font-size:16.5px!important;letter-spacing:.01em}
.lt-sign b:nth-child(2){margin-top:1px}
.lt-lead{text-indent:0!important;margin-bottom:calc(var(--fs)*.7)!important}
.lt-note{font-size:calc(var(--fs)*.9);color:#333;text-indent:0!important;font-style:italic}
.lt-pk tbody th{width:104px;font-size:calc(var(--fs)*.98)}
.lt-pk .c{width:128px;font-size:calc(var(--fs)*.92)}
.lt-pk td:last-child{font-size:calc(var(--fs)*.93);line-height:1.4}
.lt-pk th,.lt-pk td{padding-top:10px;padding-bottom:10px}
.lt-pk tbody tr:nth-child(even)>*{background:#f4f8fd}

/* hộp mở khóa trong bảng điều khiển */
.seal-box{background:#fbf7ec;border:1px solid #e6d6a6;border-radius:12px;padding:14px;margin:0 0 18px;font-size:.9rem}
.seal-box label{display:block;margin-bottom:8px}
.seal-box label span{display:block;color:var(--mute);font-size:.82rem;margin-top:2px}
.seal-box small{display:block;color:var(--mute);margin-top:8px;font-size:.78rem}
.seal-box p{margin:0}
.seal-box.ok{background:#eef7ef;border-color:#b9dcbf}
.seal-row{display:flex;gap:8px}
.seal-row input{flex:1;min-width:0;font:inherit;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;min-height:44px}
.seal-row .btn{padding:10px 16px;white-space:nowrap}
.linkbtn{background:none;border:0;color:var(--blue);text-decoration:underline;cursor:pointer;font:inherit;padding:0 0 0 6px}

.lt-bnote{font-size:calc(var(--fs)*.88);color:#444;font-style:italic}

.lt-bank{display:flex;gap:16px;align-items:center}
.lt-bank-main{flex:1;min-width:0}
.lt-qr{margin:0 0 6px;text-align:center;flex:none;width:128px}
.lt-qr img{display:block;width:112px;height:112px;margin:0 auto;padding:5px;background:#fff;border:1px solid #cdb97a;box-sizing:content-box}
.lt-qr figcaption{font-size:calc(var(--fs)*.78);line-height:1.25;margin-top:4px;color:#333}

/* khối đăng ký tham dự (QR + liên kết) trong thân thư mời */
.lt-rsvp{display:flex;gap:14px;align-items:center;border:1px solid #cdb97a;background:#fbf7ec;border-left:4px solid var(--lg);padding:9px 14px 9px 10px;margin:calc(var(--fs)*.35) 0 calc(var(--fs)*.55)}
.lt-rsvp img{flex:none;display:block;width:92px;height:92px;padding:3px;background:#fff;border:1px solid #cdb97a;box-sizing:content-box}
.lt-rsvp-t{min-width:0;font-size:calc(var(--fs)*.94);line-height:1.38}
.lt-rsvp-t>b{display:block;color:var(--lb);font-size:calc(var(--fs)*1.02);margin-bottom:2px;text-transform:uppercase;letter-spacing:.03em}
.lt-rsvp-t p{margin:0 0 4px!important;text-indent:0!important;text-align:left!important}
.lt-rsvp-t>span{display:block;font-size:calc(var(--fs)*.88);color:#222}
.lt-rsvp-t u{text-decoration:none;font-weight:700;color:var(--lb);word-break:break-all}

.lt-lh{font-weight:700;text-indent:0!important;margin:calc(var(--fs)*.3) 0 calc(var(--fs)*.2)!important;color:var(--lb)}
.lt-inv-hv .lt-ul li,.lt-inv-dn .lt-ul li,.lt-inv-cq .lt-ol li{margin-bottom:calc(var(--fs)*.22)}

.lt-when{display:grid;grid-template-columns:1.25fr 1fr;border:1px solid var(--lb);margin:calc(var(--fs)*.4) 0 calc(var(--fs)*.6);background:#f3f7fc}
.lt-when>div{padding:7px 12px}
.lt-when>div+div{border-left:1px solid #c5d3e6}
.lt-when span{display:block;font-size:calc(var(--fs)*.78);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--lb)}
.lt-when b{display:block;font-size:calc(var(--fs)*1.02);line-height:1.3}
.lt-when small{display:block;font-size:calc(var(--fs)*.88);color:#333;line-height:1.3}
.lt-sign-gap{height:154px!important}
.lt-seal{top:-14px!important}
.lt-to-inv .lt-name{font-size:calc(var(--name-size)*.86)!important}
.lt-inv-hv .lt-ul,.lt-inv-dn .lt-ul,.lt-inv-cq .lt-ol{margin-bottom:calc(var(--fs)*.8)!important}

.lt-pk .lt-ul-s{margin:0!important}
.lt-pk .lt-ul-s li{margin:0 0 2px!important;text-align:left;padding-left:1.1em;line-height:1.32}
.lt-pk .lt-ul-s li::before{left:.1em;top:.62em;width:4px;height:4px}
.lt-pk td:last-child{padding-top:8px;padding-bottom:8px}
