@font-face{font-family:Inter;src:url(/assets/fonts/Inter-var.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--blue:#01467F;--deep:#012f56;--ink:#13263a;--paper:#fdfdfb;--gold:#e8c56a;--yellow:#ffd54a;--line:rgba(255,255,255,.35)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--blue);color:#fff;font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;line-height:1.55;font-size:18px}
a{color:#fff}
img{max-width:100%}
.lh{display:block;width:100%;height:auto}
.brandbar{display:flex;gap:14px;align-items:center;max-width:960px;margin:0 auto;padding:12px 16px 4px}
.ins{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;text-decoration:none}
.ins img{width:64px;height:auto;display:block}
.ins-sat{font-size:13px;letter-spacing:.08em;color:#fff;opacity:.92;margin-top:1px}
.bt .t1{font-weight:800;font-size:22px;letter-spacing:.06em;line-height:1.1}
.bt .t2{font-size:15px;opacity:.9;line-height:1.3;margin-top:2px}
.bt .t3{font-size:15px;opacity:.8;margin-top:3px}
main{max-width:960px;margin:0 auto;padding:8px 16px 40px}
.narrow{max-width:680px}
h1{font-size:26px;line-height:1.2;margin:14px 0 8px}
h2{font-size:18px;margin:22px 0 8px}
p{margin:0 0 12px}
.lead{font-size:17px;opacity:.95}
.muted{opacity:.9;font-size:16px}
.card{background:rgba(0,0,0,.14);border:1px solid var(--line);border-radius:10px;padding:16px;margin:14px 0}
.note{background:#fff;color:var(--blue);border-radius:8px;padding:12px 14px;font-size:17px;margin:12px 0}
.note b{color:var(--deep)}
.joke{background:var(--yellow);color:var(--deep);border-radius:8px;padding:12px 14px;font-weight:700;margin:12px 0;font-size:18px}
label.f{display:block;font-weight:700;margin:14px 0 4px}
.hint{display:block;font-weight:400;font-size:16px;opacity:.9;margin:2px 0 6px}
input[type=text],input[type=email],select{width:100%;font:inherit;padding:12px;border-radius:8px;border:2px solid transparent;background:#fff;color:var(--ink)}
input[type=text]:focus,input[type=email]:focus{outline:none;border-color:var(--yellow)}
.btn{display:inline-block;font:inherit;font-weight:700;background:#fff;color:var(--blue);border:0;border-radius:8px;padding:13px 18px;cursor:pointer;text-decoration:none;text-align:center;width:100%;margin:8px 0}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.sec{background:transparent;color:#fff;border:2px solid #fff}
.btn.end{background:var(--yellow);color:var(--deep)}
@media(min-width:700px){.btn{width:auto;min-width:240px}}
.tick{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:start;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.2);cursor:pointer}
.tick input{width:22px;height:22px;margin:1px 0 0}
.err{background:#ffe1e1;color:#7a0010;border-radius:8px;padding:10px 12px;margin:10px 0;font-weight:600}
.err:empty{display:none}
.steps{display:flex;gap:6px;flex-wrap:wrap;font-size:15px;margin:10px 0 0;padding:0;list-style:none}
.steps li{padding:3px 9px;border-radius:99px;border:1px solid var(--line);opacity:.75}
.steps li.on{background:#fff;color:var(--blue);opacity:1;font-weight:700}
/* setup */
.choice{display:block;border:2px solid var(--line);border-radius:10px;padding:14px;margin:10px 0;cursor:pointer;background:rgba(0,0,0,.1)}
.choice:has(input:checked){border-color:#fff;background:rgba(255,255,255,.12)}
.choice input{margin-right:8px;transform:scale(1.3)}
.choice b{font-size:16.5px}
.choice .hint{margin-left:28px}
.slider{margin:6px 0 4px}
.slider input[type=range]{width:100%;accent-color:#fff;height:32px}
.slider .scale{display:flex;justify-content:space-between;font-size:15px;opacity:.85}
.val{display:inline-block;background:#fff;color:var(--blue);font-weight:800;border-radius:6px;padding:1px 8px;margin-left:6px}
.guard{border:2px solid var(--yellow);border-radius:10px;padding:14px;margin:16px 0;background:rgba(255,213,74,.08)}
.guard h2{margin-top:0;color:var(--yellow)}
/* payment */
.li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px dashed var(--line)}
.li:last-child{border:0}
.li b{white-space:nowrap}
.insr{display:grid;grid-template-columns:24px 1fr auto;gap:2px 8px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.2);cursor:pointer}
.insr input{width:18px;height:18px;margin:2px 0 0}
.insr .nm{font-weight:700}.insr .pr{font-weight:700;white-space:nowrap}.insr .ex{grid-column:2/4;font-size:16px;opacity:.9}
.tot{position:sticky;bottom:0;background:var(--deep);border-top:2px solid #fff;padding:10px 16px;display:flex;justify-content:space-between;align-items:center;gap:10px;z-index:4}
.tot b{font-size:21px}
.tot .btn{width:auto;min-width:0;margin:0;padding:11px 14px}
/* letters */
.letter{background:var(--paper);color:var(--ink);border-radius:6px;box-shadow:0 6px 24px rgba(0,0,0,.25);margin:16px 0;overflow:hidden}
.letter .lt{background:var(--blue);display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:4px solid var(--gold)}
.letter .lt img{width:42px}
.letter .lt .who{color:#fff;font-size:12px;line-height:1.3}
.letter .lt .who b{font-size:14px;letter-spacing:.05em}
.letter .lt .sat{color:#fff;font-size:10px;opacity:.85;display:block;text-align:center}
.letter .lb{padding:16px 16px 6px}
.letter .ref{font-size:14px;color:#5a6b7b;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.letter h3{font-size:20px;color:var(--blue);margin:8px 0 12px;line-height:1.3}
.letter p{font-size:18px}
.letter .sig{margin:14px 0 8px;font-size:16px}
.letter .sig i{font-family:Georgia,serif;font-size:20px;color:#1a3fbf;display:block}
.reply{background:#eef3f8;border-top:1px solid #d5dfea;padding:10px 16px;font-size:16px;color:var(--ink)}
.reply b{color:var(--blue)}
.tag{display:inline-block;font-size:14px;font-weight:700;border-radius:99px;padding:1px 8px;margin-left:4px}
.tag.up{background:#ffe0e0;color:#8a0018}.tag.down{background:#dff5e6;color:#0b5a2a}
.answer{background:#f3f6fa;border-top:1px solid #d5dfea;padding:14px 16px;color:var(--ink)}
.answer h4{margin:0 0 6px;font-size:18px;color:var(--blue)}
.opt{display:grid;grid-template-columns:24px 1fr;gap:8px;padding:10px;border:2px solid #d5dfea;border-radius:8px;margin:6px 0;cursor:pointer;background:#fff;font-size:18px}
.opt:has(input:checked){border-color:var(--blue);background:#e8f0fa}
.opt input{width:18px;height:18px;margin:1px 0 0}
.opt small{color:#8a0018;font-weight:700}
.tempo{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:6px 0}
.tempo label{border:2px solid #d5dfea;border-radius:8px;padding:10px;cursor:pointer;background:#fff;font-size:16px;text-align:center}
.tempo label b{display:block;font-size:16px}
.tempo label:has(input:checked){border-color:var(--blue);background:#e8f0fa}
.tempo input{position:absolute;opacity:0;pointer-events:none}
.answer .btn{background:var(--blue);color:#fff}
.answer .btn.end{background:var(--yellow);color:var(--deep)}
.endbar{position:sticky;bottom:0;z-index:4;background:var(--deep);border-top:2px solid var(--yellow);padding:8px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:16px}
.endbar .btn{width:auto;min-width:0;margin:0;padding:9px 14px}
.waiting{background:#fff;color:var(--blue);border-radius:8px;padding:14px;text-align:center;font-weight:700;margin:12px 0}
.waiting .dots::after{content:"";animation:d 1.4s steps(4) infinite}
@keyframes d{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}
.stamp{display:inline-block;border:4px double #b3122e;color:#b3122e;font-weight:900;letter-spacing:.08em;padding:6px 14px;transform:rotate(-6deg);border-radius:6px;margin:10px 0;background:rgba(255,255,255,.9);font-size:18px}
canvas.cert{width:100%;height:auto;display:block;border-radius:4px;margin:12px 0;background:#fff}
.progress{font-size:16px;opacity:.95}
.pill{display:inline-block;border:1px solid var(--line);border-radius:99px;padding:2px 10px;font-size:15px;margin:2px 4px 2px 0}
.sendopt{display:block;border:2px solid var(--line);border-radius:8px;padding:10px 12px;margin:6px 0;cursor:pointer}
.sendopt:has(input:checked){border-color:#fff;background:rgba(255,255,255,.12)}
.sendopt input{margin-right:6px}
.sendopt .hint{margin-left:24px}
.copy{display:flex;gap:6px}.copy input{flex:1;font-size:13px}.copy .btn{width:auto;min-width:0;margin:0;padding:8px 12px}
iframe.mail{width:100%;height:1100px;border:0;border-radius:8px;background:#01467F}
footer{max-width:960px;margin:0 auto;padding:18px 16px 46px;font-size:15px;opacity:.9;text-align:center}
footer a{margin:0 6px}
.satire-mark{position:fixed;left:3px;bottom:2px;font-size:7px;line-height:1;color:#2a6aa3;z-index:9;pointer-events:none;user-select:none}
[hidden]{display:none!important}
@media(min-width:760px){.ins img{width:84px}.bt .t1{font-size:28px}.bt .t2{font-size:14px}h1{font-size:30px}}
.cheque{background:linear-gradient(135deg,#f4fbf6,#e2f1e7);color:#14361f;border:2px solid #2f7a4a;border-radius:8px;padding:14px;margin:14px 0;font-family:Georgia,serif;position:relative}
.ch-top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:15px;border-bottom:1px solid #2f7a4a;padding-bottom:6px}
.ch-pay{margin:12px 0 6px;font-size:18px}
.ch-amt{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:17px;font-style:italic}
.ch-amt b{font-style:normal;border:2px solid #2f7a4a;padding:4px 10px;background:#fff;font-size:22px}
.ch-note{font-size:16px;margin-top:10px;font-family:Inter,Arial,sans-serif}
.ch-sig{margin-top:10px;font-style:italic}
.ch-stamp{display:inline-block;margin-left:10px;color:#b3122e;border:3px solid #b3122e;padding:0 8px;transform:rotate(-8deg);font-style:normal;font-weight:900;letter-spacing:.1em}
.coupon{background:#fffbe6;color:#5a3b00;border:3px dashed #c58a00;border-radius:10px;padding:16px;margin:14px 0;text-align:center}
.cp-h{font-weight:900;font-size:24px;letter-spacing:.06em}.cp-b{font-size:19px;margin:6px 0}.cp-s{font-size:17px}.cp-f{font-size:16px;margin-top:8px;opacity:.85}
.tiny-end{font-size:7px;color:#2a6aa3;margin:24px 0 0;text-align:left}
@media print{header,footer,.endbar,.btn,.card,.satire-mark{display:none!important}body{background:#fff;color:#000}canvas.cert{page-break-after:always}.tiny-end{display:block}}
/* Email preview meta: long From/Subject/header values wrap at 390px instead of overflowing */
.mailmeta .li{flex-wrap:wrap}
.mailmeta .li span{flex:0 0 auto}
.mailmeta .li b{white-space:normal;overflow-wrap:anywhere;word-break:break-word;text-align:right;min-width:0;flex:1 1 60%}
.insr .nc{font-weight:600;opacity:.85;white-space:nowrap}
input[readonly]{background:#e6eef6;color:#33475b}
.err a{color:#7a0010;font-weight:700}
@media (max-width:500px){iframe.mail{height:1450px}}
/* Letterhead domain overlay (19 Oct 2026): big neon-blue outline text, transparent fill so the letterhead shows through.
   Font: Liberation Sans Bold (SIL OFL 1.1, static, subset to the domain letters) so the outline has no inner overlap lines. */
@font-face{font-family:"DomainOutline";src:url(/assets/fonts/LiberationSans-Bold-domain.woff2) format("woff2");font-weight:700;font-display:swap}
.lhwrap{position:relative;line-height:0;overflow:hidden}
.lh-domain{position:absolute;left:0;right:0;top:1.2vw;margin:0;text-align:center;line-height:1;font-family:"DomainOutline","Liberation Sans",Arial,sans-serif;font-weight:700;font-size:clamp(36px,10vw,132px);letter-spacing:.01em;white-space:nowrap;color:#fff;-webkit-text-fill-color:#fff;-webkit-text-stroke:0;filter:drop-shadow(0 1px 2px rgba(0,0,0,.45));pointer-events:none;user-select:none}
@supports not (-webkit-text-stroke:1px){.lh-domain{color:#fff}}
@media (max-width:600px){.lh-domain{filter:drop-shadow(0 0 1px rgba(31,214,255,.95)) drop-shadow(0 0 2px rgba(31,214,255,.5))}}
/* ===== Living Veca Symmetry Codex: vesica signature, phi type 18/29/47, rhythm 8/13/21/34 ===== */
body{background:radial-gradient(ellipse 61.8% 38.2% at 50% 0,rgba(232,197,106,.16),transparent 70%),linear-gradient(180deg,#01467F,#012f56 61.8%,#011f3a)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.07;background:url(/assets/vesica.svg) center 40%/min(110vw,1100px) no-repeat}
header,main,footer{position:relative;z-index:1}
.cx-seal{display:block;width:min(61.8%,320px);margin:21px auto 8px}
main{padding:13px 21px 55px}
h1{font-size:29px;line-height:1.236;margin:21px 0 13px;text-align:center}
h2{font-size:21px;margin:34px 0 13px;letter-spacing:.02em}
h2::before{content:"";display:inline-block;width:21px;height:13px;margin-right:8px;vertical-align:-1px;border:1.5px solid var(--gold);border-radius:50%/50%;clip-path:none;
 background:radial-gradient(circle at 30% 50%,transparent 6px,var(--gold) 6.5px,transparent 7.5px),radial-gradient(circle at 70% 50%,transparent 6px,var(--gold) 6.5px,transparent 7.5px);border:0}
.lead{text-align:center;max-width:61.8ch;margin:0 auto 21px}
.card,.joke{border-radius:21px;border:1px solid rgba(232,197,106,.45);padding:21px;margin:21px 0;box-shadow:0 0 0 8px rgba(232,197,106,.05),0 13px 34px rgba(0,0,0,.18)}
.steps{justify-content:center}
.btn,button.btn{border-radius:34px}
footer{text-align:center;border-top:1px solid rgba(232,197,106,.35);margin-top:34px;padding-top:21px}
.cx-rule{height:21px;margin:34px auto;width:61.8%;background:url(/assets/vesica.svg) center/auto 21px no-repeat;border:0}