/* invite.ciel.my — the card page and its looks. Each look sets the same handful of variables; the layout is shared. */
.inv{--paper:#fff;--ink:#222;--muted:color-mix(in srgb,var(--ink) 62%,var(--paper));--line:color-mix(in srgb,var(--ink) 16%,var(--paper));--accent:#555;--on-accent:#fff;--bg:color-mix(in srgb,var(--paper) 86%,var(--ink));
  --fh:Georgia,serif;--fb:Georgia,serif;--r:12px;--btn-r:999px;
  container-type:inline-size;position:relative;background:var(--bg);color:var(--ink);font-family:var(--fb);font-size:17px;line-height:1.6;min-height:100%;-webkit-font-smoothing:antialiased}
.inv *,.inv *::before,.inv *::after{box-sizing:border-box}
.inv .sheet{max-width:520px;margin:0 auto;background:var(--paper);min-height:100svh;padding-bottom:84px;position:relative;overflow:hidden;container-type:inline-size}
@media (min-width:600px){.inv:not(.mini) .sheet{margin:32px auto 0;min-height:calc(100svh - 32px);box-shadow:0 30px 80px color-mix(in srgb,var(--ink) 18%,transparent);border-radius:6px 6px 0 0}}
.inv h1,.inv h2{font-family:var(--fh);font-weight:500;margin:0;text-wrap:balance}
.inv p{margin:0 0 .6em}
.inv a{color:inherit}
.inv :focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* cover */
.inv .cv{position:relative;min-height:calc(100svh - 64px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:12cqi 9cqi 14cqi;isolation:isolate}
.inv.mini{width:300px}
.inv.mini .cv{min-height:0;aspect-ratio:3/4.4;padding:10cqi 8cqi}
.inv .cv-in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:3.2cqi;max-width:100%}
.inv .intro{font-size:max(13px,3.6cqi);letter-spacing:.06em;color:var(--muted);margin:0}
.inv .names{font-size:clamp(30px,12.5cqi,72px);line-height:1.02;letter-spacing:-.01em;overflow-wrap:anywhere}
.inv .title{font-size:max(14px,4.1cqi);max-width:30ch;margin:0;color:var(--muted)}
.inv .cv-date{margin:2cqi 0 0;display:flex;flex-direction:column;align-items:center;font-size:max(13px,3.8cqi)}
.inv .cv-ph{position:relative;z-index:2;width:62%;aspect-ratio:4/5;margin:0 auto 6cqi;overflow:hidden;border-radius:999px 999px 8px 8px}
.inv .cv-ph img{width:100%;height:100%;object-fit:cover;display:block}
.inv .logo{max-height:56px;max-width:60%;object-fit:contain;margin-bottom:4cqi}

/* sections */
.inv .sec{padding:44px 9cqi;text-align:center;border-top:1px solid var(--line)}
.inv .sec h2{font-size:max(22px,6.6cqi);margin-bottom:14px}
.inv .big{font-family:var(--fh);font-size:max(20px,5.4cqi);line-height:1.25;margin-bottom:.35em}
.inv .small{font-size:14px;color:var(--muted)}
.inv .msg p{font-size:max(17px,4.4cqi);font-style:italic;max-width:32ch;margin:0 auto}
.inv .dress span{display:block;font-size:13px;color:var(--muted)}
.inv .ended p{font-family:var(--fh);font-size:20px}
.inv .btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:18px}
.inv .b{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border-radius:var(--btn-r);border:1.5px solid var(--accent);color:var(--ink);background:transparent;font:inherit;font-size:15px;text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.inv .b:hover{background:color-mix(in srgb,var(--accent) 14%,transparent)}
.inv .b.pri{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.inv .b.pri:hover{filter:brightness(1.07)}
.inv .b.sm{min-height:36px;padding:6px 14px;font-size:14px}
.inv .b.ghost{border-color:var(--line)}
.inv .b[disabled]{opacity:.55;cursor:wait}

.inv .cd{display:flex;justify-content:center;gap:10px;margin:22px 0 4px}
.inv .cd div{min-width:64px;padding:10px 6px;border:1px solid var(--line);border-radius:var(--r)}
.inv .cd b{display:block;font-family:var(--fh);font-size:28px;font-weight:500;line-height:1.1;font-variant-numeric:tabular-nums}
.inv .cd span{font-size:12px;color:var(--muted)}
.inv .cd p{font-family:var(--fh);font-size:24px}

.inv .prog ol{list-style:none;margin:0 auto;padding:0;max-width:380px;text-align:left}
.inv .prog li{display:grid;grid-template-columns:7.5em 1fr;gap:14px;padding:12px 0;border-bottom:1px dashed var(--line)}
.inv .prog li:last-child{border-bottom:0}
.inv .prog time{color:var(--accent);font-variant-numeric:tabular-nums;font-size:15px}

.inv .gal-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.inv .gal-row img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:calc(var(--r) / 2);display:block}
.inv .gal-row img:first-child:nth-last-child(odd){grid-column:span 2;aspect-ratio:3/2}

/* forms */
.inv form{max-width:380px;margin:18px auto 0;text-align:left;display:grid;gap:14px}
.inv .f{display:grid;gap:6px}
.inv .f span{font-size:14px;color:var(--muted)}
.inv input,.inv select,.inv textarea{font:inherit;font-size:16px;color:var(--ink);background:color-mix(in srgb,var(--paper) 92%,var(--ink));border:1px solid var(--line);border-radius:calc(var(--r) * .7);padding:11px 13px;width:100%}
.inv input:focus,.inv select:focus,.inv textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
.inv .seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.inv .seg label{position:relative;cursor:pointer}
.inv .seg input{position:absolute;opacity:0;inset:0;cursor:pointer}
.inv .seg span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:56px;padding:8px 10px;border:1.5px solid var(--line);border-radius:var(--r);font-size:15px;line-height:1.25;transition:background .15s,border-color .15s}
.inv .seg input:checked+span{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,var(--paper))}
.inv .seg input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.inv form[data-ans="no"] .only-yes{display:none}
.inv .hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.inv .fine{margin:0}
.inv .rmsg,.inv .wmsg{margin:0;font-family:var(--fh);font-size:18px;min-height:0}
.inv .rmsg.err,.inv .wmsg.err{font-family:var(--fb);font-size:15px;color:#B42318}
.inv form.done .f,.inv form.done .seg,.inv form.done .fine{display:none}

.inv .gift .qr{width:200px;max-width:70%;background:#fff;padding:10px;border-radius:var(--r);margin:10px auto}
.inv .acct{display:inline-grid;gap:6px;margin-top:10px}
.inv .accno{display:flex;align-items:center;gap:10px;justify-content:center;font-size:20px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.inv .note-host{margin-top:12px;padding:10px 12px;border:1px dashed var(--accent);border-radius:var(--r)}

.inv .wl{list-style:none;padding:0;margin:26px auto 0;max-width:400px;display:grid;gap:12px;text-align:left}
.inv .wl li{padding:16px 18px;border:1px solid var(--line);border-radius:var(--r)}
.inv .wl p{margin:0 0 8px;font-style:italic}
.inv .wl b{font-size:14px;font-weight:500;color:var(--muted)}

.inv .contact ul{list-style:none;padding:0;margin:0 auto;max-width:400px;display:grid;gap:10px}
.inv .contact li{display:flex;align-items:center;gap:8px;text-align:left;padding:10px 0;border-bottom:1px solid var(--line)}
.inv .contact li div{flex:1;min-width:0}
.inv .contact li span{display:block;font-size:13px;color:var(--muted)}

.inv .ft{padding:36px 20px 20px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center;font-family:system-ui,-apple-system,'Segoe UI',sans-serif}
.inv .made{font-size:12px;color:var(--muted);text-decoration:none;padding:6px 12px;border:1px solid var(--line);border-radius:99px}
.inv .made:hover{color:var(--ink)}
.inv .rep{background:none;border:0;color:var(--muted);font-size:12px;text-decoration:underline;cursor:pointer;padding:6px}

.inv .bar{position:fixed;left:50%;transform:translateX(-50%);bottom:max(10px,env(safe-area-inset-bottom));z-index:20;display:flex;gap:2px;padding:5px;max-width:calc(100% - 20px);background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:999px;overflow-x:auto;scrollbar-width:none;box-shadow:0 10px 30px color-mix(in srgb,var(--ink) 16%,transparent);font-family:system-ui,-apple-system,'Segoe UI',sans-serif}
.inv .bar a,.inv .bar button{font:inherit;font-size:14px;color:var(--ink);text-decoration:none;background:none;border:0;padding:9px 14px;flex:none;border-radius:999px;white-space:nowrap;cursor:pointer}
.inv .bar .go{background:var(--accent);color:var(--on-accent)}
.inv.mini .bar,.inv.mini .ft{display:none}
.inv.preview .bar{position:sticky;transform:none;left:auto;margin:-74px auto 10px;width:max-content}

/* ---------------- Classic: engraved stationery ---------------- */
.t-classic{--paper:#FBF7EE;--ink:#3A2E22;--accent:#A07F3C;--fh:'Cormorant Garamond',Georgia,serif;--fb:'Cormorant Garamond',Georgia,serif;font-size:19px;--r:2px}
.t-classic.tone-navy{--paper:#FFFFFF;--ink:#1D2945;--accent:#1D2945}
.t-classic.tone-rose{--paper:#FBF0EC;--ink:#5A2C33;--accent:#B26B76}
.t-classic .cv::before{content:"";position:absolute;inset:5cqi;border:1px solid var(--accent);outline:1px solid var(--accent);outline-offset:-2.2cqi;opacity:.7;pointer-events:none}
.t-classic .names{font-weight:500;font-size:clamp(34px,13.5cqi,78px)}
.t-classic .intro{font-style:italic;letter-spacing:.02em;font-size:max(15px,4.4cqi)}
.t-classic .title{font-style:italic}
.t-classic .cv-date .d-w,.t-classic .cv-date .d-m{letter-spacing:.16em;font-size:max(12px,3.3cqi)}
.t-classic .cv-date .d-n{font-size:clamp(40px,15cqi,84px);line-height:1;padding:1.2cqi 7cqi;margin:1.4cqi 0;border-top:1px solid var(--accent);border-bottom:1px solid var(--accent);font-weight:500}
.t-classic .sec{border-top:0;background:linear-gradient(var(--accent),var(--accent)) top center/48px 1px no-repeat}
.t-classic .sec h2{font-style:italic;font-weight:500}

/* ---------------- Minimal: big type, left-aligned, nothing extra ---------------- */
.t-minimal{--paper:#FFFFFF;--ink:#1A1A1A;--accent:#1A1A1A;--fh:'Archivo',system-ui,sans-serif;--fb:'Archivo',system-ui,sans-serif;--r:4px;--btn-r:4px;font-size:16px}
.t-minimal.tone-sky{--paper:#E9F1FF;--ink:#0C2A5C;--accent:#0C2A5C}
.t-minimal.tone-olive{--paper:#EDEFE2;--ink:#2B371C;--accent:#2B371C}
.t-minimal .cv{align-items:flex-start;text-align:left;justify-content:flex-end}
.t-minimal .cv-in{align-items:flex-start;gap:2.6cqi}
.t-minimal .names{font-stretch:68%;font-weight:750;font-size:clamp(40px,17cqi,104px);line-height:.88;letter-spacing:-.02em}
.t-minimal .intro{letter-spacing:0;font-size:max(14px,3.8cqi);color:var(--ink)}
.t-minimal .title{font-size:max(15px,4.2cqi)}
.t-minimal .cv-date{align-items:flex-start;margin-top:6cqi}
.t-minimal .cv-date .d-n{font-stretch:125%;font-weight:300;font-size:clamp(30px,12cqi,70px);line-height:1;letter-spacing:-.02em}
.t-minimal .cv-ph{width:100%;aspect-ratio:4/3;border-radius:0;margin:0 0 8cqi}
.t-minimal .sec{text-align:left;display:grid;grid-template-columns:28% 1fr;gap:0 5cqi;padding:30px 7cqi}
.t-minimal .sec>*{grid-column:2}
.t-minimal .sec h2{grid-column:1;grid-row:1 / span 6;font-size:14px;font-weight:600;margin:4px 0 0;font-stretch:100%}
.t-minimal .big{font-weight:600;font-stretch:85%}
.t-minimal .msg p{font-style:normal;font-size:max(17px,4.6cqi);margin:0}
.t-minimal .btns,.t-minimal .cd{justify-content:flex-start}
.t-minimal .cd div{min-width:54px}
.t-minimal form,.t-minimal .prog ol,.t-minimal .wl,.t-minimal .contact ul{margin-left:0}
.t-minimal .gift,.t-minimal .acct{text-align:left}.t-minimal .accno{justify-content:flex-start}
.t-minimal .seg span{justify-content:flex-start;text-align:left}

/* ---------------- Festive: arch window over a festival pattern ---------------- */
.t-festive{--fh:'Marcellus',Georgia,serif;--fb:'Lora',Georgia,serif;--paper:#12406B;--ink:#FDF6E7;--accent:#E8B04B;--on-accent:#1B1406;--r:10px;
  --pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M24 4 L44 24 L24 44 L4 24 Z' fill='none' stroke='%23E8B04B' stroke-opacity='.22'/%3E%3C/svg%3E")}
.t-festive.fest-raya{--paper:#0F563B;--ink:#F7F0DA;--accent:#D8B25A;
  --pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cg fill='none' stroke='%23D8B25A' stroke-opacity='.26'%3E%3Cpath d='M22 6 L38 22 L22 38 L6 22 Z'/%3E%3Cpath d='M14 14 L30 30 M30 14 L14 30'/%3E%3C/g%3E%3C/svg%3E")}
.t-festive.fest-cny{--paper:#A3141C;--ink:#FFF2D2;--accent:#F2C14E;
  --pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52'%3E%3Cg fill='none' stroke='%23F2C14E' stroke-opacity='.25'%3E%3Ccircle cx='26' cy='26' r='12'/%3E%3Crect x='21' y='21' width='10' height='10'/%3E%3Ccircle cx='0' cy='0' r='12'/%3E%3Ccircle cx='52' cy='52' r='12'/%3E%3Ccircle cx='52' cy='0' r='12'/%3E%3Ccircle cx='0' cy='52' r='12'/%3E%3C/g%3E%3C/svg%3E")}
.t-festive.fest-deepavali{--paper:#3A1959;--ink:#FFF0DA;--accent:#F4A73B;
  --pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cg fill='%23F4A73B' fill-opacity='.28'%3E%3Ccircle cx='20' cy='20' r='2.4'/%3E%3Ccircle cx='0' cy='0' r='2.4'/%3E%3Ccircle cx='40' cy='0' r='2.4'/%3E%3Ccircle cx='0' cy='40' r='2.4'/%3E%3Ccircle cx='40' cy='40' r='2.4'/%3E%3C/g%3E%3Cpath d='M20 8 C26 14 26 26 20 32 C14 26 14 14 20 8 Z' fill='none' stroke='%23F4A73B' stroke-opacity='.22'/%3E%3C/svg%3E")}
.t-festive.fest-christmas{--paper:#1D4A38;--ink:#FFF8EC;--accent:#D9B243;
  --pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46'%3E%3Cg stroke='%23FFF8EC' stroke-opacity='.18' stroke-linecap='round'%3E%3Cpath d='M23 15 v16 M15 23 h16 M17.5 17.5 l11 11 M28.5 17.5 l-11 11'/%3E%3C/g%3E%3C/svg%3E")}
.t-festive .cv{background:var(--pat) center/auto}
.t-festive .cv-in{background:var(--paper);padding:16cqi 8cqi 10cqi;border:1.5px solid var(--accent);outline:1px solid var(--accent);outline-offset:6px;border-radius:999px 999px 10px 10px;width:100%;max-width:440px}
.t-festive.has-cover .cv-in{padding-top:10cqi}
.t-festive .names{font-size:clamp(30px,11cqi,64px);color:var(--accent)}
.t-festive .intro{color:var(--ink);opacity:.85}
.t-festive .title{color:var(--ink);opacity:.85;font-style:italic}
.t-festive .cv-ph{width:70%;border-radius:999px 999px 8px 8px;border:1.5px solid var(--accent);margin-bottom:5cqi}
.t-festive .sec{border-top:0;background:radial-gradient(circle,var(--accent) 2px,transparent 2.5px) top center/12px 6px repeat-x}
.t-festive .sec h2{color:var(--accent)}
.t-festive .cd div{border-color:color-mix(in srgb,var(--accent) 50%,transparent)}
.t-festive input,.t-festive select,.t-festive textarea{background:color-mix(in srgb,var(--paper) 80%,#000)}

/* ---------------- Floral: script names, painted sprigs ---------------- */
.t-floral{--paper:#F6F7F1;--ink:#3E4A3B;--accent:#6F8A62;--leaf:#8EA27F;--bloom:#E3B2A3;--fh:'EB Garamond',Georgia,serif;--fb:'EB Garamond',Georgia,serif;font-size:18px;--r:16px}
.t-floral.tone-blush{--paper:#FDF4F1;--ink:#5A3838;--accent:#B66F6F;--leaf:#A5B497;--bloom:#E8A3A3}
.t-floral.tone-dusk{--paper:#F2F0F7;--ink:#3A3450;--accent:#6E5E9A;--leaf:#96A396;--bloom:#B9A6DA}
.t-floral .orn{position:absolute;width:44cqi;height:44cqi;z-index:1;pointer-events:none}
.t-floral .orn-tl{top:-2cqi;left:-4cqi}
.t-floral .orn-br{bottom:-2cqi;right:-4cqi;transform:rotate(180deg)}
.t-floral .names{font-family:'Pinyon Script',cursive;font-weight:400;font-size:clamp(40px,15cqi,88px);line-height:1.1;color:var(--accent)}
.t-floral .intro{font-style:italic;letter-spacing:.02em}
.t-floral .cv-ph{width:58%;border-radius:50%;aspect-ratio:4/5;outline:1px solid var(--leaf);outline-offset:6px}
.t-floral .cv-date .d-w,.t-floral .cv-date .d-m{font-style:italic}
.t-floral .cv-date .d-n{font-size:clamp(34px,12cqi,70px);line-height:1.05;color:var(--accent)}
.t-floral .sec h2{font-family:'Pinyon Script',cursive;font-weight:400;font-size:max(32px,9cqi);color:var(--accent)}
.t-floral .sec{border-top:0}

/* ---------------- Songket: woven gold bands on deep colour ---------------- */
.t-songket{--paper:#5A1424;--ink:#F8EBD2;--accent:#D6B160;--gold:#D6B160;--on-accent:#2A0A11;--fh:'Cinzel',Georgia,serif;--fb:'Lora',Georgia,serif;--r:4px;--btn-r:4px}
.t-songket.tone-royal{--paper:#14285A;--on-accent:#0A1430}
.t-songket.tone-emerald{--paper:#0D493A;--on-accent:#06261E}
.t-songket .band{position:absolute;left:0;width:100%;height:9cqi;z-index:1}
.t-songket .band-t{top:0}.t-songket .band-b{bottom:0}
.t-songket .cv::after{content:"";position:absolute;inset:12cqi 5cqi;border:1px solid color-mix(in srgb,var(--gold) 55%,transparent);pointer-events:none}
.t-songket .names{font-weight:400;font-size:clamp(28px,10cqi,60px);line-height:1.15;letter-spacing:.04em;color:var(--gold)}
.t-songket .intro{font-family:var(--fh);letter-spacing:.12em;color:var(--ink);font-size:max(12px,3.4cqi)}
.t-songket .title{font-style:italic;color:color-mix(in srgb,var(--ink) 85%,var(--paper))}
.t-songket .cv-ph{width:56%;border:1.5px solid var(--gold);padding:5px;background:var(--paper)}
.t-songket .cv-ph img{border-radius:999px 999px 4px 4px}
.t-songket .cv-date .d-w,.t-songket .cv-date .d-m{font-family:var(--fh);letter-spacing:.14em;font-size:max(12px,3.3cqi)}
.t-songket .cv-date .d-n{font-family:var(--fh);font-size:clamp(36px,13cqi,74px);color:var(--gold);line-height:1.1}
.t-songket .sec{border-top:0}
.t-songket .sec h2{color:var(--gold);letter-spacing:.06em;display:flex;align-items:center;justify-content:center;gap:12px}
.t-songket .sec h2::before,.t-songket .sec h2::after{content:"";width:8px;height:8px;background:var(--gold);transform:rotate(45deg);flex:none}
.t-songket input,.t-songket select,.t-songket textarea{background:color-mix(in srgb,var(--paper) 78%,#000)}

/* ---------------- Executive: corporate, left-aligned, brass rule ---------------- */
.t-executive{--paper:#1E2832;--ink:#F1EEE7;--accent:#C7A86A;--on-accent:#1E2832;--fh:'Sora',system-ui,sans-serif;--fb:'Sora',system-ui,sans-serif;font-size:16px;--r:6px;--btn-r:6px}
.t-executive.tone-white{--paper:#FFFFFF;--ink:#18222E;--accent:#2457D6;--on-accent:#fff}
.t-executive.tone-wine{--paper:#3A1420;--ink:#F6ECE6;--accent:#DDA98E;--on-accent:#3A1420}
.t-executive .cv{align-items:flex-start;text-align:left;justify-content:space-between;padding:12cqi 9cqi}
.t-executive .cv::before{content:"";position:absolute;left:5cqi;top:12cqi;bottom:12cqi;width:2px;background:var(--accent)}
.t-executive .cv-in{align-items:flex-start;gap:3.4cqi;margin-top:auto}
.t-executive .names{font-weight:600;font-size:clamp(30px,10.5cqi,62px);line-height:1.04;letter-spacing:-.03em}
.t-executive .intro{letter-spacing:0;color:var(--accent);font-size:max(13px,3.6cqi)}
.t-executive .title{font-weight:300}
.t-executive .cv-date{align-items:flex-start;margin-top:5cqi}
.t-executive .cv-date .d-n{font-weight:300;font-size:clamp(26px,9cqi,52px);letter-spacing:.02em;color:var(--accent)}
.t-executive .cv-ph{width:100%;aspect-ratio:16/10;border-radius:var(--r);margin:0 0 6cqi}
.t-executive .sec{text-align:left;padding:36px 9cqi}
.t-executive .sec h2{font-size:15px;font-weight:600;color:var(--accent);letter-spacing:.02em}
.t-executive .big{font-weight:600}
.t-executive .msg p{font-style:normal;font-weight:300}
.t-executive .btns,.t-executive .cd{justify-content:flex-start}
.t-executive form,.t-executive .prog ol,.t-executive .wl,.t-executive .contact ul{margin-left:0}
.t-executive .prog li{grid-template-columns:6em 1fr;border-bottom:0;border-left:2px solid var(--line);padding:10px 0 10px 16px;position:relative}
.t-executive .prog li::before{content:"";position:absolute;left:-5px;top:17px;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.t-executive .gift,.t-executive .acct{text-align:left}.t-executive .accno{justify-content:flex-start}
.t-executive input,.t-executive select,.t-executive textarea{background:color-mix(in srgb,var(--paper) 88%,var(--ink))}

/* ---------------- Party: sticker type and confetti ---------------- */
.t-party{--paper:#FFF3F7;--ink:#3A1C4A;--accent:#FF4F98;--on-accent:#fff;--c1:#FF4F98;--c2:#FFC23C;--c3:#33C3BE;--fh:'Fredoka',system-ui,sans-serif;--fb:'Fredoka',system-ui,sans-serif;--r:18px;font-size:17px}
.t-party.tone-lagoon{--paper:#E8FAF9;--ink:#0D3A42;--accent:#00A3A3;--c1:#00A3A3;--c2:#FF8A5B;--c3:#FFCF4A}
.t-party.tone-sunny{--paper:#FFF7DD;--ink:#3B2A00;--accent:#FF7300;--c1:#FF7300;--c2:#3D97FF;--c3:#FF4F79}
.t-party .confetti{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.9}
.t-party .names{font-weight:600;font-size:clamp(38px,15cqi,90px);line-height:.95;color:var(--accent);transform:rotate(-3deg);text-shadow:.04em .05em 0 var(--c2)}
.t-party .intro{font-weight:500;letter-spacing:0;background:var(--ink);color:var(--paper);padding:.3em .9em;border-radius:99px;transform:rotate(2deg)}
.t-party .title{font-weight:500;color:var(--ink)}
.t-party .cv-date{font-weight:500;background:var(--paper);border:2px solid var(--ink);border-radius:14px;padding:.5em 1em;box-shadow:4px 4px 0 var(--ink)}
.t-party .cv-ph{border-radius:22px;border:3px solid var(--paper);box-shadow:5px 5px 0 var(--c3);transform:rotate(-2deg);width:66%}
.t-party .sec{border-top:2px dashed color-mix(in srgb,var(--accent) 45%,transparent)}
.t-party .sec h2{font-weight:600;color:var(--accent)}
.t-party .b{border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:500}
.t-party .b:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.t-party .msg p{font-style:normal}

/* ---------------- envelope opening (premium) ---------------- */
.inv .env{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:var(--bg);transition:opacity .6s .9s,visibility 0s 1.5s;perspective:1000px}
.inv .env.open{opacity:0;visibility:hidden}
.inv .env>div,.inv .env-seal,.inv .env-tap{position:absolute;left:50%;top:50%}
.inv .env-back,.inv .env-front,.inv .env-flap{width:min(82vw,360px);aspect-ratio:3/2;translate:-50% -50%}
.inv .env-back{background:color-mix(in srgb,var(--paper) 80%,var(--ink));border-radius:6px}
.inv .env-card{width:min(74vw,324px);aspect-ratio:3/2;translate:-50% -50%;background:var(--paper);border-radius:4px;display:grid;place-items:center;padding:16px;text-align:center;font-family:var(--fh);font-size:22px;color:var(--accent);transition:transform .9s .35s cubic-bezier(.3,.9,.3,1)}
.inv .env-front{background:color-mix(in srgb,var(--paper) 70%,var(--ink));clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%);border-radius:6px}
.inv .env-flap{background:color-mix(in srgb,var(--paper) 62%,var(--ink));clip-path:polygon(0 0,100% 0,50% 58%);transform-origin:top;transition:transform .5s ease-in,z-index 0s .25s;z-index:3}
.inv .env-seal{width:64px;height:64px;translate:-50% -30%;border-radius:50%;border:0;background:var(--accent);color:var(--on-accent);font-family:var(--fh);font-size:26px;cursor:pointer;z-index:4;box-shadow:0 4px 14px rgba(0,0,0,.25);transition:opacity .25s,transform .25s}
.inv .env-seal:hover{transform:scale(1.06)}
.inv .env-tap{translate:-50% calc(min(82vw,360px) / 3 + 26px);font-family:system-ui,sans-serif;font-size:14px;color:var(--muted);margin:0;white-space:nowrap}
.inv .env.open .env-flap{transform:rotateX(180deg);z-index:0}
.inv .env.open .env-seal,.inv .env.open .env-tap{opacity:0}
.inv .env.open .env-card{transform:translateY(-55%)}
.inv .env-back,.inv .env-card,.inv .env-front{z-index:auto}
.inv .env-card{z-index:1}.inv .env-front{z-index:2}

@media (prefers-reduced-motion:reduce){.inv *,.inv *::before,.inv *::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* report dialog (sits outside the card) */
.inv-dlg{border:0;border-radius:16px;padding:0;max-width:min(440px,calc(100vw - 32px));font-family:system-ui,-apple-system,'Segoe UI',sans-serif;color:#1d1d1f;box-shadow:0 30px 80px rgba(0,0,0,.3)}
.inv-dlg::backdrop{background:rgba(20,20,30,.5)}
.inv-dlg form{padding:22px;display:grid;gap:12px}
.inv-dlg h3{margin:0;font-size:19px}.inv-dlg p{margin:0;color:#555;font-size:14px;line-height:1.5}
.inv-dlg label{display:grid;gap:5px;font-size:14px}.inv-dlg label span{color:#555}
.inv-dlg select,.inv-dlg textarea,.inv-dlg input{font:inherit;font-size:16px;padding:10px 12px;border:1px solid #d6d6db;border-radius:10px;width:100%;box-sizing:border-box}
.inv-dlg .row{display:flex;gap:8px;justify-content:flex-end}
.inv-dlg .b{font:inherit;font-size:14px;padding:10px 16px;border-radius:99px;border:1px solid #d6d6db;background:#fff;cursor:pointer}
.inv-dlg .b.pri{background:#1d1d1f;color:#fff;border-color:#1d1d1f}
.inv-dlg .dmsg{color:#B42318}
.inv-dlg .hp{position:absolute;left:-9999px;opacity:0}
