/* ===== Fonts (self-hosted subsets; system fallbacks cover chars outside the subset) ===== */
@font-face{font-family:"Ma Shan Zheng";src:url(mashanzheng-sub.woff) format("woff");font-display:swap}
@font-face{font-family:"BZ Serif";src:url(notoserifsc-bold-sub.woff) format("woff");font-weight:600 800;font-display:swap}
@font-face{font-family:"BZ Black";src:url(notoserifsc-black-sub.woff) format("woff");font-weight:900;font-display:swap}
@font-face{font-family:"Archivo Black";src:url(archivoblack-latin.woff) format("woff");font-display:swap;unicode-range:U+0000-00FF,U+2013-2026,U+2192}

:root{
  --white:#FAF8F6; --sheet:#FFFFFF; --ink:#111111; --ink-soft:#5E5A5C; --line:#D9D3D5;
  --cobalt:#1F3FBF; --pink:#E84F8A; --jade:#1E8C6A; --yolk:#F2C230;
  --f-punk:"Archivo Black","Arial Black","BZ Serif","PingFang SC",sans-serif;
  --f-brush:"Ma Shan Zheng","STKaiti","KaiTi","BZ Serif","Songti SC",serif;
  --f-black:"BZ Black","BZ Serif","Songti SC","STSong","Noto Serif CJK SC","Noto Serif SC",serif;
  --f-han:"BZ Serif","Songti SC","STSong","Noto Serif CJK SC","Noto Serif SC","SimSun",serif;
  --f-body:"Songti SC","STSong","Noto Serif CJK SC","Noto Serif SC","SimSun","PingFang SC",serif;
  --tartan:repeating-linear-gradient(90deg,rgba(31,63,191,.85) 0 10px,transparent 10px 22px,rgba(17,17,17,.55) 22px 25px,transparent 25px 40px),
           repeating-linear-gradient(0deg,rgba(31,63,191,.6) 0 10px,transparent 10px 22px,rgba(17,17,17,.45) 22px 25px,transparent 25px 40px),#E84F8A;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.7;overflow-x:hidden;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-top:20px;padding-bottom:max(56px,env(safe-area-inset-bottom,0px))}
body.noscroll{overflow:hidden}
.wrap{max-width:420px;margin:0 auto;display:flex;flex-direction:column;gap:28px}
[hidden]{display:none!important}

/* ransom-note title */
.logo{margin:0;display:flex;gap:6px;align-items:flex-end;justify-content:center;font-weight:400;line-height:1}
.logo span{display:inline-grid;place-items:center;height:60px;min-width:54px;padding:0 6px}
.r1{background:var(--ink);color:var(--white);font-family:var(--f-black);font-weight:900;font-size:42px;transform:rotate(-4deg)}
.r2{color:var(--pink);font-family:var(--f-brush);font-size:60px;transform:rotate(3deg) translateY(4px)}
.r3{color:var(--cobalt);font-family:var(--f-black);font-weight:900;font-size:48px;border:3px solid var(--cobalt);background:var(--sheet);transform:rotate(-2deg)}
.r4{background:var(--tartan);color:var(--sheet);font-family:var(--f-black);font-weight:900;font-size:44px;transform:rotate(5deg);outline:2px dashed var(--sheet);outline-offset:-5px;text-shadow:2px 2px 0 var(--ink)}
.sub{margin:10px 0 0;text-align:center;font-family:var(--f-punk);font-size:12px;letter-spacing:.35em;color:var(--cobalt)}
.tag{margin:10px 0 0;text-align:center;font-size:15px;color:var(--ink-soft)}

/* form */
.form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form .full{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--ink-soft);min-width:0}
input,select{font:inherit;font-size:16px;color:var(--ink);background:var(--sheet);border:1.5px solid var(--ink);border-radius:0;padding:8px 10px;width:100%;min-width:0;height:44px;-webkit-appearance:none;appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 15px) 52%,calc(100% - 10px) 52%;background-size:5px 5px;background-repeat:no-repeat;padding-right:24px;text-overflow:ellipsis}
input:focus,select:focus,.btn:focus-visible,summary:focus-visible,.ov a:focus-visible{outline:3px solid var(--yolk);outline-offset:1px}
.btn{grid-column:1/-1;font-family:var(--f-black);font-weight:900;font-size:17px;letter-spacing:.2em;border:2px solid var(--ink);border-radius:0;padding:11px;cursor:pointer;background:var(--ink);color:var(--white);box-shadow:4px 4px 0 var(--pink);transition:transform .12s,box-shadow .12s;-webkit-tap-highlight-color:transparent}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--pink)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--pink)}
.btn:disabled{opacity:.6;cursor:progress}
.btn.alt{background:var(--sheet);color:var(--ink);box-shadow:4px 4px 0 var(--cobalt);width:100%}
.btn.alt:hover{box-shadow:6px 6px 0 var(--cobalt)}

.result,.pairwrap{display:flex;flex-direction:column;gap:14px;scroll-margin-top:12px}
.gfield{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--ink-soft);min-width:0}
.gbtns{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.gbtns button{all:unset;box-sizing:border-box;height:44px;display:grid;place-items:center;cursor:pointer;font-family:var(--f-black);font-weight:900;font-size:17px;color:var(--ink);background:var(--sheet);border:1.5px solid var(--ink);-webkit-tap-highlight-color:transparent}
.gbtns button[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:3px 3px 0 var(--pink)}
.gbtns button:focus-visible{outline:3px solid var(--yolk);outline-offset:1px}
.gerr{font-style:normal;font-size:12px;font-weight:700;color:#D11A5C}
.ghost{align-self:center;font:inherit;font-family:var(--f-black);font-weight:900;font-size:13px;color:var(--ink);background:transparent;border:1.5px dashed var(--ink);border-radius:0;padding:6px 14px;cursor:pointer}
.ghost:focus-visible{outline:3px solid var(--yolk)}
.sec{margin:0;font-family:var(--f-black);font-weight:900;font-size:18px}
label small{font-size:11px}
label.check{flex-direction:row;align-items:center;gap:8px;font-size:13px;color:var(--ink);margin-top:-2px}
label.check input{width:20px;height:20px;flex:none;-webkit-appearance:auto;appearance:auto;accent-color:var(--ink);margin:0}
#timeWrap.off input{opacity:.45}
.privacy{margin:0;font-size:12px;color:var(--jade);text-align:center}
.privacy::before{content:"";display:inline-block;width:9px;height:9px;border:2px solid currentColor;border-radius:2px;margin-right:6px;vertical-align:-1px}
.tag{line-height:1.6}
.invite{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.logo-sm span{height:44px!important;min-width:40px!important}
.logo-sm .r1,.logo-sm .r3,.logo-sm .r4{font-size:30px!important}.logo-sm .r2{font-size:42px!important}
.inv-title{margin:0;font-family:var(--f-black);font-weight:900;font-size:19px;line-height:1.45;text-wrap:balance}
.inv-sub{margin:0;font-size:15px;color:var(--ink-soft)}
.copybox{border:2px dashed var(--ink);background:var(--sheet);padding:10px 12px}
.copybox p{margin:0 0 6px;font-size:12px;color:var(--ink-soft)}
.copybox textarea{width:100%;font:inherit;font-size:14px;line-height:1.5;border:1.5px solid var(--ink);border-radius:0;padding:8px;resize:none;background:#fff;color:var(--ink);-webkit-user-select:text;user-select:text}
.toast{position:fixed;left:50%;bottom:max(28px,env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;background:var(--ink);color:#fff;font-family:var(--f-black);font-weight:900;font-size:15px;padding:10px 18px;border:2px solid #fff;box-shadow:4px 4px 0 var(--pink);max-width:calc(100vw - 32px);text-align:center}
/* private section */
.private{border:2px solid var(--ink);background:var(--sheet);padding:12px 14px}
.private summary{cursor:pointer;font-family:var(--f-black);font-weight:900;font-size:16px}
.private summary small{font-family:var(--f-body);font-weight:400;font-size:12px;color:var(--ink-soft);margin-left:6px}
.pv-note{font-size:12px;color:var(--jade);margin:10px 0}
.pv-tab{width:100%;border-collapse:collapse;text-align:center;table-layout:fixed}
.pv-tab th{font-size:12px;font-weight:400;color:var(--ink-soft);padding:2px}
.pv-tab td{font-family:var(--f-black);font-weight:900;font-size:22px;border:1.5px solid var(--ink);padding:6px 0}
.pv-tab td.me{background:var(--ink);color:#fff}
.pv-dl{margin:12px 0 0;font-size:13px}
.pv-dl div{display:flex;gap:10px;padding:3px 0;border-bottom:1px dashed var(--line)}
.pv-dl dt{flex:none;width:3em;color:var(--ink-soft)}
.pv-dl dd{margin:0;min-width:0}
.private h3{margin:16px 0 4px;font-family:var(--f-black);font-weight:900;font-size:15px}
.pv-hit{margin:0;font-size:13px;color:var(--pink);font-weight:700}
.pv-dest{margin:6px 0;padding-left:20px;font-size:14px}
.pv-dest li{margin:4px 0}
.pv-dest b{font-family:var(--f-punk);font-weight:400}
.pv-pill{font-size:12px;color:var(--ink-soft)}
.pv-dest small{display:block;font-size:12px;color:var(--ink-soft)}
.pv-hook{margin:6px 0 0;font-weight:700}
.pv-fine{margin:10px 0 0;font-size:11px;color:var(--ink-soft)}

/* CARD ============================================================
   "人类使用说明书" + 合盘 card. Paired with assets/card.js — swap both
   together when the card is redesigned. Sizes use --u = 1% of the card width
   (works without container queries, e.g. older WeChat/X5).
   ================================================================= */
.mc,.pc{--u:calc((min(100vw,452px) - 32px)/100);position:relative;border:3px solid var(--ink);color:var(--ink);overflow:hidden;font-family:var(--f-han)}
.mc{background:var(--el);padding:calc(5.5*var(--u)) calc(4.5*var(--u)) calc(4.5*var(--u))}
.mc-top{position:relative;z-index:2;color:var(--el-fg)}
.mc-text{width:55%;display:flex;flex-direction:column;align-items:flex-start}
.mc-kicker{margin:0;display:flex;align-items:center;font-family:var(--f-black);font-weight:900;font-size:calc(3.2*var(--u));letter-spacing:.3em;line-height:1.2;white-space:nowrap}
.mc-eg{display:inline-block;margin-left:calc(1*var(--u));background:var(--yolk);color:var(--ink);border:calc(.3*var(--u)) solid var(--ink);font-size:calc(2*var(--u));letter-spacing:0;padding:calc(.2*var(--u)) calc(1.2*var(--u));transform:rotate(-4deg)}
.mc-image{margin:calc(1.2*var(--u)) 0 0;font-weight:700;font-size:calc(3*var(--u));opacity:.92;line-height:1.3}
.mc-name{margin:calc(2.6*var(--u)) 0 0;font-family:var(--f-black);font-weight:900;font-size:calc(var(--ns,12)*var(--u));line-height:1.06;letter-spacing:-.02em;white-space:nowrap;
  text-shadow:calc(.55*var(--u)) calc(.55*var(--u)) 0 var(--shadow,#111)}
.mc[style*="--el-fg:#111"] .mc-name{--shadow:#fff}
.mc-chip{display:inline-block;margin-top:calc(1.6*var(--u));background:#fff;color:var(--ink);border:calc(.4*var(--u)) solid var(--ink);font-family:var(--f-black);font-weight:900;font-size:calc(2.8*var(--u));padding:calc(.8*var(--u)) calc(2*var(--u));transform:rotate(-2deg)}
.mc-gift{position:relative;width:25%;width:calc(25*var(--u));margin:calc(4.6*var(--u)) 0 0 calc(.8*var(--u));background:#fff;border:calc(.8*var(--u)) solid var(--ink);border-radius:calc(1.7*var(--u));
  box-shadow:calc(.85*var(--u)) calc(.85*var(--u)) 0 var(--ink);transform:rotate(-6deg);padding:calc(2.8*var(--u)) calc(1.5*var(--u)) calc(1.4*var(--u))}
.mc-gift img{display:block;width:100%;height:auto}
.mc-gift span{position:absolute;left:50%;top:0;transform:translate(-50%,-55%);background:var(--ink);color:#fff;font-family:var(--f-black);font-weight:900;font-size:calc(2.1*var(--u));line-height:1.6;padding:0 calc(1.2*var(--u));white-space:nowrap}
.mc-fig{position:absolute;left:55%;right:calc(-2.5*var(--u));top:calc(-3*var(--u));bottom:calc(-5*var(--u));display:flex;justify-content:center;align-items:flex-end;pointer-events:none}
.mc-gbox{position:relative;height:100%;max-width:100%}
.mc-gbox>.mc-girl{display:block;height:100%;width:auto;max-width:100%;object-fit:contain;object-position:50% 100%;
  filter:drop-shadow(1px 0 0 #111) drop-shadow(-1px 0 0 #111) drop-shadow(0 1px 0 #111) drop-shadow(0 -1px 0 #111) drop-shadow(calc(.9*var(--u)) calc(.9*var(--u)) 0 rgba(17,17,17,.32))}
.mc-seal{position:absolute;right:8%;top:44%;width:calc(6.3*var(--u));height:calc(6.3*var(--u));display:grid;place-items:center;background:var(--seal-bg);color:var(--seal-fg);
  font-family:var(--f-brush);font-size:calc(2.9*var(--u));line-height:.95;grid-auto-flow:row;align-content:center;border:calc(.4*var(--u)) solid var(--ink);transform:translate(50%,-50%) rotate(6deg)}
.mc-icon{position:absolute;right:8%;top:calc(44% + 5.6*var(--u));width:calc(4.6*var(--u));height:calc(4.6*var(--u));background:#fff;border:calc(.3*var(--u)) solid var(--ink);padding:calc(.4*var(--u));transform:translate(30%,-50%) rotate(-8deg)}
.mc-icon svg{display:block;width:100%;height:100%}
.mc-panel{position:relative;z-index:1;margin-top:calc(3*var(--u));background:#fff;border:calc(.5*var(--u)) solid var(--ink);padding:calc(.6*var(--u)) calc(3*var(--u)) 0}
.mc-row{display:flex;align-items:center;min-height:calc(6.1*var(--u));font-size:calc(2.7*var(--u));line-height:1.4;padding:calc(.9*var(--u)) 0;border-bottom:1px solid var(--ink)}
.mc-row b{font-family:var(--f-black);font-weight:900;flex:none;align-self:flex-start}
.mc-row span{font-weight:700;min-width:0}
.mc-th{display:flex;align-items:center;justify-content:space-between;min-height:calc(4.8*var(--u));font-family:var(--f-black);font-weight:900;font-size:calc(2.2*var(--u));border-bottom:1px solid var(--ink)}
.mc-pr{display:grid;grid-template-columns:auto 1fr auto;gap:calc(1.7*var(--u));align-items:center;min-height:calc(6.1*var(--u));border-bottom:1px solid var(--ink)}
.mc-tag{background:var(--ink);color:#fff;font-family:var(--f-black);font-weight:900;font-size:calc(2.1*var(--u));padding:calc(.4*var(--u)) calc(.9*var(--u));white-space:nowrap}
.mc-pn{font-weight:700;font-size:calc(2.7*var(--u));line-height:1.3;min-width:0}
.mc-pr>b{font-family:var(--f-punk);font-weight:400;font-size:calc(3.1*var(--u))}
.mc-lock{border-bottom:0;margin-bottom:calc(.6*var(--u))}
.mc-lock b{align-self:center}
.mc-lock span{display:inline-flex;align-items:center;gap:calc(.8*var(--u))}
.mc-lock svg{width:calc(3.3*var(--u));height:calc(3.3*var(--u));flex:none}
.mc-warn{display:flex;gap:calc(2.2*var(--u));align-items:flex-start;background:var(--ink);color:#fff;margin:0 calc(-3*var(--u));padding:calc(2.2*var(--u)) calc(3*var(--u))}
.mc-warn svg{width:calc(5*var(--u));height:calc(5*var(--u));flex:none}
.mc-warn b{display:block;font-family:var(--f-black);font-weight:900;font-size:calc(2.9*var(--u));line-height:1.35}
.mc-warn span{display:block;font-weight:700;font-size:calc(2.4*var(--u));line-height:1.45;opacity:.88;margin-top:calc(.4*var(--u))}
.mc-foot{display:flex;justify-content:space-between;align-items:center;gap:calc(2*var(--u));margin-top:calc(4*var(--u));color:var(--el-fg,#111)}
.mc-qr{display:flex;align-items:center;gap:calc(2.2*var(--u));font-family:var(--f-black);font-weight:900;font-size:calc(3*var(--u));line-height:1.35}
.mc-qr img{width:calc(13*var(--u));height:calc(13*var(--u));background:#fff;border:calc(.5*var(--u)) solid var(--ink);padding:calc(.8*var(--u));display:block}
.mc-qr-r{text-align:right}
.mc-qr-r img{width:calc(19*var(--u));height:calc(19*var(--u));padding:calc(1.2*var(--u))}
.mc-qr small{font-family:var(--f-han);font-weight:700;font-size:calc(2.4*var(--u))}
/* pair */
.pc{background:linear-gradient(105deg,var(--a) 0 49.6%,var(--ink) 49.6% 50.4%,var(--b) 50.4%);padding:calc(5*var(--u)) calc(4.5*var(--u)) calc(4.5*var(--u))}
.pc-kicker{margin:0 auto;width:max-content;background:var(--ink);color:#fff;font-family:var(--f-black);font-weight:900;font-size:calc(3*var(--u));letter-spacing:.2em;padding:calc(1*var(--u)) calc(3.5*var(--u));transform:rotate(-2deg)}
.pc-names{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:calc(1*var(--u));margin-top:calc(5*var(--u));text-align:center}
.pc-side{color:var(--el-fg);min-width:0}
.pc-girl{display:block;height:calc(26*var(--u));width:auto;max-width:100%;margin:0 auto calc(1*var(--u));object-fit:contain;filter:drop-shadow(1px 0 0 #111) drop-shadow(-1px 0 0 #111) drop-shadow(0 1px 0 #111) drop-shadow(0 -1px 0 #111) drop-shadow(calc(.7*var(--u)) calc(.7*var(--u)) 0 rgba(17,17,17,.32))}
.pc-side small{display:block;font-weight:700;font-size:calc(2.8*var(--u))}
.pc-side b{display:block;font-family:var(--f-black);font-weight:900;font-size:calc(5.2*var(--u));word-break:keep-all;line-height:1.15;text-shadow:calc(.45*var(--u)) calc(.45*var(--u)) 0 var(--ink);overflow-wrap:anywhere}
.pc-side[style*="--el-fg:#111"] b{text-shadow:calc(.45*var(--u)) calc(.45*var(--u)) 0 #fff}
.pc-side span{display:block;font-weight:700;font-size:calc(3*var(--u));overflow-wrap:anywhere}
.pc-x{width:calc(7.5*var(--u));height:calc(7.5*var(--u));border-radius:50%;background:#fff;border:calc(.5*var(--u)) solid var(--ink);display:grid;place-items:center;font-family:var(--f-punk);font-size:calc(4*var(--u))}
.pc-panel{position:relative;margin-top:calc(8*var(--u));background:#fff;border:calc(.5*var(--u)) solid var(--ink);padding:calc(8*var(--u)) calc(4*var(--u)) 0;text-align:center}
.pc-panel>:last-child:not(.mc-warn){margin-bottom:calc(5*var(--u))}
.pc-mode{position:absolute;left:50%;top:0;transform:translate(-50%,-50%) rotate(-2deg);margin:0;display:flex;align-items:center;gap:calc(1.4*var(--u));background:var(--yolk);border:calc(.4*var(--u)) solid var(--ink);padding:calc(.8*var(--u)) calc(2.4*var(--u));font-family:var(--f-black);font-weight:900;font-size:calc(3.4*var(--u));white-space:nowrap}
.pc-mode svg{width:calc(4.6*var(--u));height:calc(4.6*var(--u))}
.pc-label{margin:0;font-family:var(--f-black);font-weight:900;font-size:calc(11*var(--u));line-height:1.12;text-shadow:calc(.6*var(--u)) calc(.6*var(--u)) 0 #FF2E7E;text-wrap:balance}
.pc-line{margin:calc(3*var(--u)) 0 0;font-weight:700;font-size:calc(3.5*var(--u));line-height:1.5;text-wrap:balance}
.pc-stats{display:flex;justify-content:center;gap:calc(6*var(--u));margin-top:calc(4*var(--u))}
.pc-stats p{margin:0;display:flex;flex-direction:column;align-items:center}
.pc-stats b{font-family:var(--f-punk);font-weight:400;font-size:calc(7.5*var(--u));color:#FF2E7E;line-height:1.1}
.pc-stats small{font-weight:700;font-size:calc(2.5*var(--u));color:var(--ink-soft)}
.pc-extra{margin:calc(2.5*var(--u)) 0 0;font-weight:700;font-size:calc(2.9*var(--u))}
.pc-base{margin-top:calc(3.5*var(--u));padding-top:calc(3*var(--u));border-top:calc(.3*var(--u)) dashed var(--ink)}
.pc-hits{margin:0;font-family:var(--f-black);font-weight:900;font-size:calc(3.4*var(--u))}
.pc-note{margin:calc(1*var(--u)) 0 0;font-weight:700;font-size:calc(2.7*var(--u));color:#0B7A57}
.pc-chong{margin:calc(1*var(--u)) 0 0;font-weight:700;font-size:calc(2.7*var(--u));color:#D11A5C}
.pc .mc-warn{margin:calc(4*var(--u)) calc(-4*var(--u)) 0;text-align:left}
.pc .mc-foot{background:#fff;border:calc(.5*var(--u)) solid var(--ink);padding:calc(2*var(--u));color:var(--ink)}
/* mode chips (outside the card) */
.modebar{width:100%;display:flex;flex-direction:column;gap:6px}
.mode-hint{margin:0;font-size:12px;color:var(--ink-soft);text-align:center}
.modes{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.modes button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-family:var(--f-black);font-weight:900;font-size:13px;line-height:1;padding:7px 10px;border:2px solid var(--ink);background:var(--sheet);color:var(--ink);-webkit-tap-highlight-color:transparent}
.modes button svg{width:18px;height:18px;flex:none}
.modes button[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:3px 3px 0 var(--pink)}
.modes button:focus-visible{outline:3px solid var(--yolk);outline-offset:1px}
.mini{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;background:var(--el);color:var(--el-fg);border:3px solid var(--ink);padding:10px 16px 12px;box-shadow:5px 5px 0 var(--ink);transform:rotate(-2deg)}
.mini small{font-family:var(--f-black);font-weight:900;font-size:11px;letter-spacing:.25em}
.mini b{font-family:var(--f-black);font-weight:900;font-size:28px;line-height:1.15;text-shadow:2px 2px 0 var(--ink)}
.mini span{font-size:12px;font-weight:700}
.pop{animation:pop .5s cubic-bezier(.2,1.5,.4,1)}
@keyframes pop{from{transform:scale(.92);opacity:0}to{transform:none;opacity:1}}

/* author */
.author{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center}
.author p{margin:0;font-size:14px;line-height:1.8}
.author p b{font-family:var(--f-black);font-weight:900;font-size:13px;color:var(--sheet);background:var(--cobalt);padding:1px 6px;white-space:nowrap}
.qr{width:84px;height:84px;mix-blend-mode:multiply;display:block}

/* save overlay */
.ov{position:fixed;inset:0;z-index:50;background:rgba(17,17,17,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:max(16px,env(safe-area-inset-top,0px)) 16px max(16px,env(safe-area-inset-bottom,0px))}
.ov img{max-width:100%;max-height:calc(100vh - 170px);max-height:calc(100dvh - 170px);width:auto;height:auto;border:2px solid var(--white);background:#fff;-webkit-touch-callout:default;user-select:auto}
.ov p{margin:0;color:var(--white);font-family:var(--f-han);font-weight:900;font-size:16px;text-align:center}
.ov .row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.ov a,.ov button{font:inherit;font-family:var(--f-han);font-weight:900;font-size:14px;padding:8px 18px;border:2px solid var(--white);background:transparent;color:var(--white);cursor:pointer;text-decoration:none;border-radius:0}
.ov a{background:var(--pink);border-color:var(--pink)}
.ov .x{position:absolute;top:max(10px,env(safe-area-inset-top,0px));right:10px;width:44px;height:44px;padding:0;font-size:24px;line-height:1;border:none}

@media (max-width:380px){.logo span{height:52px;min-width:46px}.r1{font-size:36px}.r2{font-size:50px}.r3{font-size:40px}.r4{font-size:38px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.mc-seal i{font-style:normal;display:block}

.total{margin:10px auto 0;display:table;background:#111;color:#F5B700;font-weight:700;font-size:13px;padding:3px 12px;transform:rotate(-1.5deg)}
