body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  background-image: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom,black,transparent 72%);
}
body {
  background:
    radial-gradient(900px 520px at 18% -12%,rgba(255,255,255,.075),transparent 64%),
    radial-gradient(760px 500px at 88% 15%,rgba(244,197,101,.045),transparent 68%),
    #050609!important;
}
body::after {
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.28;
  background-image:
    radial-gradient(circle at 12% 22%,rgba(255,255,255,.55) 0 1px,transparent 1.5px),
    radial-gradient(circle at 74% 16%,rgba(255,255,255,.4) 0 1px,transparent 1.5px),
    radial-gradient(circle at 88% 62%,rgba(244,197,101,.38) 0 1px,transparent 1.5px),
    radial-gradient(circle at 36% 78%,rgba(255,255,255,.34) 0 1px,transparent 1.5px);
  background-size:310px 270px,370px 330px,420px 380px,460px 410px;
  animation:starDrift 28s linear infinite;
}
.delivery-shell>header {
  height:68px;
  margin-top:16px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:rgba(13,15,20,.72);
  box-shadow:0 18px 50px rgba(0,0,0,.26);
  backdrop-filter:blur(20px);
  animation:riseIn .48s cubic-bezier(.2,.8,.2,1) both;
}
.glow-one{background:var(--gold)!important;opacity:.075!important}
.glow-two{background:#fff!important;opacity:.045!important}
.redeem-card{background:linear-gradient(145deg,rgba(20,22,28,.92),rgba(7,8,12,.88))!important}
.how>div{background:rgba(255,255,255,.018)!important}
.brand-logo {
  width: 44px!important;
  height: 44px!important;
  padding: 0!important;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.15);
  background: #050608!important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.025),0 12px 30px rgba(0,0,0,.35)!important;
}
.brand-logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.glow-one { animation: driftOne 11s ease-in-out infinite alternate; }
.glow-two { animation: driftTwo 13s ease-in-out infinite alternate; }
.intro { animation: riseIn .65s cubic-bezier(.2,.8,.2,1) both; }
.redeem-card { animation: riseIn .72s .08s cubic-bezier(.2,.8,.2,1) both; }
.how>div { animation: riseIn .6s cubic-bezier(.2,.8,.2,1) both; transition: transform .25s,border-color .25s,background .25s; }
.how>div:nth-child(2){animation-delay:.08s}.how>div:nth-child(3){animation-delay:.16s}
.how>div:hover { transform: translateY(-4px); border-color: rgba(244,197,101,.27); background: rgba(244,197,101,.035); }
.redeem-card form button { position: relative; overflow: hidden; }
.redeem-card form button::after { content:""; position:absolute; inset:-40% auto -40% -45%; width:35%; transform:rotate(18deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent); animation:buttonShine 4.8s ease-in-out infinite; }
.profile-preview { display:grid; grid-template-columns:50px 1fr auto; gap:12px; align-items:center; margin-top:-5px; padding:10px; border:1px solid var(--line); border-radius:15px; background:rgba(255,255,255,.035); animation:profileIn .25s ease both; }
.profile-preview.loading { opacity:.72; }
.profile-preview.ok { border-color:rgba(83,212,154,.25); background:rgba(83,212,154,.055); }
.profile-preview.error { border-color:rgba(255,113,126,.25); background:rgba(255,113,126,.045); }
.profile-avatar { width:50px; height:50px; display:grid; place-items:center; overflow:hidden; border-radius:15px; border:1px solid var(--line); background:radial-gradient(circle at 40% 20%,rgba(244,197,101,.28),rgba(6,8,12,.92)); font-weight:900; }
.profile-avatar img { width:100%; height:100%; object-fit:cover; }
.profile-preview>div:nth-child(2) { min-width:0; display:grid; gap:4px; }
.profile-preview b,.profile-preview small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.profile-preview small { color:var(--muted); font-size:11px; }
.profile-preview>strong { width:27px; height:27px; display:grid; place-items:center; border-radius:9px; color:var(--gold); background:rgba(244,197,101,.09); }
.profile-preview.ok>strong { color:var(--green); background:rgba(83,212,154,.1); }
.profile-preview.error>strong { color:var(--red); background:rgba(255,113,126,.1); }
.join-panel{display:grid;gap:12px;margin-top:20px;padding:16px;border:1px solid rgba(244,197,101,.22);border-radius:18px;background:linear-gradient(145deg,rgba(244,197,101,.06),rgba(255,255,255,.018));animation:profileIn .3s ease both}
.join-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.join-head .eyebrow{margin-bottom:5px}.join-head h3{margin:0;font-size:16px}.join-head>span{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;color:var(--gold);background:rgba(244,197,101,.1);font-size:11px;font-weight:900}
.join-server{display:flex;align-items:center;justify-content:space-between;padding:13px 14px;border-radius:13px;text-decoration:none;color:#171006;background:linear-gradient(135deg,var(--gold),var(--orange));font-size:13px;font-weight:900;box-shadow:0 10px 24px rgba(233,154,44,.14);transition:transform .2s,filter .2s}.join-server:hover{transform:translateY(-2px);filter:brightness(1.06)}
.friend-panel{overflow:hidden;border:1px solid var(--line);border-radius:15px;background:rgba(0,0,0,.22);transition:border-color .2s,background .2s}.friend-panel.accepted{border-color:rgba(83,212,154,.3);background:rgba(83,212,154,.045)}
.friend-toggle{width:100%;display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:11px;align-items:center;padding:12px;border:0;color:var(--text);background:transparent;text-align:left;cursor:pointer}.friend-toggle:hover{background:rgba(255,255,255,.025)}
.friend-badge{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(244,197,101,.2);border-radius:12px;background:rgba(244,197,101,.09);font-size:17px}.friend-summary{min-width:0;display:grid;gap:3px}.friend-summary b{font-size:12px}.friend-summary small{overflow:hidden;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.friend-action{display:flex;align-items:center;gap:7px;color:var(--gold)}.friend-action b{font-size:10px;white-space:nowrap}.friend-action i{font-size:17px;font-style:normal;transition:transform .2s}.friend-toggle[aria-expanded="true"] .friend-action i{transform:rotate(180deg)}
.friend-body{padding:0 12px 12px;border-top:1px solid var(--line);animation:friendOpen .22s ease both}.friend-lead{margin:11px 0;color:var(--muted);font-size:11px;line-height:1.55}.friend-account{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:7px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}.friend-account>span{min-width:0;display:grid;gap:2px}.friend-account small{color:var(--muted);font-size:8px;font-weight:850;letter-spacing:.12em}.friend-account b{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.friend-account button,.friend-account a{padding:8px 9px;border:1px solid var(--line);border-radius:9px;color:var(--text);background:rgba(255,255,255,.04);font:inherit;font-size:9px;font-weight:850;text-decoration:none;cursor:pointer}.friend-account a{color:var(--gold)}
.friend-steps{display:grid;gap:7px;margin:11px 0;padding:0;list-style:none}.friend-steps li{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px}.friend-steps span{flex:0 0 22px;height:22px;display:grid;place-items:center;border-radius:7px;color:var(--gold);background:rgba(244,197,101,.08);font-size:9px;font-weight:900}.friend-state{margin:0;padding:9px 10px;border-radius:10px;color:var(--muted);background:rgba(255,255,255,.025);font-size:10px;line-height:1.45}.friend-panel.accepted .friend-state{color:var(--green);background:rgba(83,212,154,.06)}
body.light .profile-preview { background:rgba(255,255,255,.64); }
@keyframes riseIn { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
@keyframes floatCard { 0%,100% { translate:0 0; } 50% { translate:0 -5px; } }
@keyframes driftOne { to { transform:translate(90px,55px) scale(1.1); } }
@keyframes driftTwo { to { transform:translate(-80px,-45px) scale(.92); } }
@keyframes buttonShine { 0%,68% { left:-45%; } 88%,100% { left:125%; } }
@keyframes profileIn { from { opacity:0; transform:translateY(-5px); } to { opacity:1; transform:none; } }
@keyframes starDrift{to{background-position:40px 80px,-60px 45px,75px -55px,-35px -70px}}
body.light{background:radial-gradient(900px 520px at 18% -12%,rgba(255,255,255,.9),transparent 64%),#eef1f6!important}body.light::after{opacity:.08}.light .delivery-shell>header{background:rgba(255,255,255,.72)}
body.light .redeem-card{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(244,246,250,.88))!important;border-color:rgba(20,28,44,.12);box-shadow:0 25px 70px rgba(40,50,75,.16)}
body.light .redeem-card h2,body.light .redeem-card label,body.light .delivery-detail b{color:var(--text)}
body.light .redeem-card input{color:var(--text)}
body.light .redeem-card .secondary{background:rgba(20,28,44,.04)}
body.light .friend-panel{background:rgba(255,255,255,.62)}body.light .friend-toggle:hover{background:rgba(20,28,44,.035)}body.light .friend-account,body.light .friend-state{background:rgba(20,28,44,.025)}body.light .friend-account button{background:rgba(20,28,44,.04)}
@keyframes friendOpen{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@media(max-width:520px){.delivery-shell>header{margin-top:10px}.friend-toggle{grid-template-columns:36px minmax(0,1fr)}.friend-action{grid-column:2}.friend-account{grid-template-columns:1fr auto}.friend-account a{grid-column:1/-1;text-align:center}}
@media(prefers-reduced-motion:reduce){body::after,.glow-one,.glow-two,.intro,.redeem-card,.how>div,.redeem-card form button::after,.profile-preview,.friend-body{animation:none!important}}

/* Delivery steps and trade guidance */
.form-roadmap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.form-roadmap span{display:flex;align-items:center;gap:7px;min-width:0;padding:8px;border:1px solid var(--line);border-radius:11px;color:var(--muted);background:rgba(255,255,255,.025);font-size:9px;font-weight:800;line-height:1.25}
.form-roadmap i{flex:0 0 21px;height:21px;display:grid;place-items:center;border-radius:7px;color:var(--gold);background:rgba(244,197,101,.1);font-style:normal;font-size:9px}
.trade-guide{display:grid;gap:12px;padding:13px;border:1px solid var(--line);border-radius:15px;background:rgba(0,0,0,.2)}
.trade-guide-head{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center}
.trade-guide-head>span{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;color:var(--gold);background:rgba(244,197,101,.1);font-size:10px;font-weight:900}
.trade-guide-head>div{min-width:0;display:grid;gap:3px}.trade-guide-head small{color:var(--muted);font-size:8px;font-weight:900;letter-spacing:.11em}.trade-guide-head b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.trade-guide-head button{padding:8px 10px;border:1px solid var(--line);border-radius:9px;color:var(--text);background:rgba(255,255,255,.04);font-size:9px;font-weight:850;cursor:pointer}
.trade-guide ol{display:grid;gap:8px;margin:0;padding:0;list-style:none}.trade-guide li{display:flex;align-items:flex-start;gap:9px;color:var(--muted);font-size:10px;line-height:1.45}.trade-guide li>span{flex:0 0 22px;height:22px;display:grid;place-items:center;border-radius:7px;color:var(--gold);background:rgba(244,197,101,.08);font-size:9px;font-weight:900}.trade-guide li b{color:var(--text)}
.trade-guide>p{margin:0;padding:9px 10px;border-radius:10px;color:var(--muted);background:rgba(244,197,101,.055);font-size:10px;line-height:1.5}

/* Final confirmation: previewing a key never consumes it. */
body.modal-open{overflow:hidden}
.confirm-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:22px;background:rgba(1,2,5,.74);backdrop-filter:blur(14px)}
.confirm-sheet{width:min(500px,100%);max-height:calc(100dvh - 44px);overflow:auto;padding:25px;border:1px solid rgba(244,197,101,.22);border-radius:25px;background:linear-gradient(145deg,rgba(24,26,33,.98),rgba(8,9,13,.98));box-shadow:0 35px 110px rgba(0,0,0,.64);animation:confirmIn .28s cubic-bezier(.2,.8,.2,1) both}
.confirm-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.confirm-top h2{margin:0;font-size:24px}.confirm-close{flex:0 0 38px;height:38px;border:1px solid var(--line);border-radius:12px;color:var(--text);background:rgba(255,255,255,.04);font-size:22px;cursor:pointer}
.confirm-account{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;margin-top:18px;padding:12px;border:1px solid rgba(83,212,154,.2);border-radius:16px;background:rgba(83,212,154,.045)}
.confirm-avatar{width:52px;height:52px;display:grid;place-items:center;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:radial-gradient(circle at 40% 20%,rgba(244,197,101,.25),rgba(6,8,12,.92));font-size:18px;font-weight:900}.confirm-avatar img{width:100%;height:100%;object-fit:cover}.confirm-account>div:nth-child(2){min-width:0;display:grid;gap:2px}.confirm-account small,.confirm-section>small{color:var(--muted);font-size:8px;font-weight:900;letter-spacing:.12em}.confirm-account b,.confirm-account span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.confirm-account b{font-size:14px}.confirm-account span{color:var(--muted);font-size:11px}.confirm-account>strong{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;color:var(--green);background:rgba(83,212,154,.1)}
.confirm-section{display:grid;gap:8px;margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.025)}.confirm-contents{font-size:13px;font-weight:800;line-height:1.5}
.confirm-bot{display:grid;gap:4px;margin-top:10px;padding:12px 14px;border:1px solid rgba(244,197,101,.2);border-radius:14px;background:rgba(244,197,101,.055)}.confirm-bot>span{color:var(--muted);font-size:8px;font-weight:900;letter-spacing:.12em}.confirm-bot>b{font-size:14px}.confirm-bot>p{margin:0;color:var(--muted);font-size:10px;line-height:1.45}.confirm-bot.waiting{border-color:var(--line);background:rgba(255,255,255,.025)}
.confirm-warning{margin-top:10px;padding:10px 12px;border:1px solid rgba(255,113,126,.16);border-radius:12px;color:#d6a6ab;background:rgba(255,113,126,.045);font-size:10px;line-height:1.5}
.confirm-actions{display:grid;grid-template-columns:140px 1fr;gap:9px;margin-top:15px}.confirm-actions button{min-height:46px;border:0;border-radius:13px;font-weight:900;cursor:pointer}.confirm-actions .secondary{border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text)}.confirm-actions #confirmStart{color:#1b1205;background:linear-gradient(135deg,var(--gold),var(--orange));box-shadow:0 12px 28px rgba(233,154,44,.18)}
body.light .form-roadmap span,body.light .trade-guide,body.light .confirm-section{background:rgba(20,28,44,.025)}body.light .trade-guide-head button{background:rgba(20,28,44,.04)}body.light .confirm-sheet{background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(243,245,249,.99));box-shadow:0 35px 90px rgba(35,44,66,.24)}body.light .confirm-warning{color:#9a4e58}
@keyframes confirmIn{from{opacity:0;transform:translateY(18px) scale(.975)}to{opacity:1;transform:none}}

/* Mobile layout: the form appears quickly and controls remain thumb-friendly. */
@media(max-width:700px){
  .delivery-shell{width:calc(100% - 20px)}
  .delivery-shell>header{height:60px;margin-top:8px;padding:0 10px;border-radius:17px}
  .brand{gap:9px}.brand-logo{width:38px!important;height:38px!important;border-radius:12px!important}.brand b{font-size:14px}.brand small{font-size:9px}.theme{width:38px;height:38px;border-radius:12px}
  .hero{display:flex;flex-direction:column;gap:18px;min-height:0;padding:22px 0 28px}
  .intro{width:100%}.intro .eyebrow{margin-bottom:9px;font-size:9px}.intro h1{font-size:clamp(31px,10.5vw,42px);line-height:1.03;letter-spacing:-.045em}.intro h1 br{display:none}.intro>p:not(.eyebrow){margin:13px 0 15px;font-size:13px;line-height:1.55}
  .signals{display:flex;flex-wrap:nowrap;gap:7px;overflow-x:auto;padding:1px 0 5px;scrollbar-width:none}.signals::-webkit-scrollbar{display:none}.signals span{flex:0 0 auto;padding:7px 9px;font-size:9px}
  .redeem-card{width:100%;min-height:0;padding:18px;border-radius:22px;animation:riseIn .5s .06s cubic-bezier(.2,.8,.2,1) both}
  .redeem-card h2{font-size:21px}.redeem-card .muted{font-size:12px}.redeem-card form{gap:13px;margin-top:19px}label{gap:7px;font-size:11px}input{min-height:48px;padding:12px;font-size:13px}.input-wrap{min-height:48px;padding-left:12px}.input-wrap input{min-height:46px}.redeem-card form>button{min-height:50px;padding:13px}
  .form-roadmap{grid-template-columns:1fr;gap:6px}.form-roadmap span{padding:7px 9px;font-size:9px}.form-roadmap i{flex-basis:20px;height:20px}
  .profile-preview{grid-template-columns:44px minmax(0,1fr) 25px;gap:10px;padding:8px}.profile-avatar{width:44px;height:44px;border-radius:13px}.profile-preview small{font-size:9px}
  .status-icon{margin-bottom:17px}.delivery-detail{padding:12px 0;font-size:12px}.join-panel{margin-top:16px;padding:12px;border-radius:16px}.join-server{min-height:48px}
  .trade-guide-head{grid-template-columns:32px minmax(0,1fr) auto}.trade-guide-head>span{width:32px;height:32px}.trade-guide li{font-size:10px}
  .how{display:flex;gap:10px;margin:0 -10px 38px;padding:0 10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.how::-webkit-scrollbar{display:none}.how>div{flex:0 0 min(82vw,320px);min-height:150px;padding:20px;scroll-snap-align:start;animation:none}.how h3{font-size:16px}.how p{font-size:12px}
  footer{padding:18px 0 24px;font-size:10px}
  .confirm-modal{align-items:end;padding:0}
  .confirm-sheet{width:100%;max-height:92dvh;padding:20px 16px calc(16px + env(safe-area-inset-bottom));border-width:1px 0 0;border-radius:25px 25px 0 0;animation:sheetIn .28s cubic-bezier(.2,.8,.2,1) both}
  .confirm-top h2{font-size:21px}.confirm-close{width:36px;height:36px}.confirm-account{grid-template-columns:46px minmax(0,1fr) 27px;margin-top:14px;padding:10px}.confirm-avatar{width:46px;height:46px;border-radius:13px}.confirm-section{padding:12px}.confirm-actions{grid-template-columns:1fr;gap:8px}.confirm-actions #confirmStart{grid-row:1}.confirm-actions .secondary{grid-row:2}
}
@media(max-width:380px){.delivery-shell{width:calc(100% - 14px)}.brand small{display:none}.intro h1{font-size:30px}.redeem-card{padding:15px}.friend-toggle{padding:10px}.friend-summary small{white-space:normal}.trade-guide{padding:10px}}
@keyframes sheetIn{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.confirm-sheet{animation:none!important}}

/* Multi-key input */
.key-section{display:grid;gap:8px}
.key-label{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#cbd0da;font-size:12px;font-weight:750}.key-label small{padding:4px 7px;border-radius:999px;color:var(--gold);background:rgba(244,197,101,.08);font-size:9px;font-weight:900}
.key-list{display:grid;gap:8px}.key-row{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;animation:keyRowIn .22s ease both}.key-row.can-remove{grid-template-columns:minmax(0,1fr) 68px}.delivery-key{text-transform:uppercase!important;letter-spacing:.05em}
.redeem-card form .remove-key{width:68px;min-height:48px;padding:0 8px;border:1px solid rgba(255,113,126,.18);border-radius:13px;color:#ff9aa4;background:rgba(255,113,126,.055);box-shadow:none;font-size:11px}.redeem-card form .remove-key:hover{transform:none;background:rgba(255,113,126,.1)}
.redeem-card form .add-key{min-height:38px;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;border:1px dashed rgba(244,197,101,.3);border-radius:12px;color:var(--gold);background:rgba(244,197,101,.035);box-shadow:none;font-size:11px;font-weight:850}.redeem-card form .add-key b{width:21px;height:21px;display:grid;place-items:center;border-radius:7px;background:rgba(244,197,101,.11);font-size:16px}.redeem-card form .add-key:hover{transform:none;background:rgba(244,197,101,.075)}
.redeem-card form .add-key::after,.redeem-card form .remove-key::after{display:none}
body.light .key-label{color:var(--text)}body.light .redeem-card form .add-key{background:rgba(166,105,16,.045)}
@keyframes keyRowIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}

/* Delivery continues in the same focused small-screen flow after confirmation. */
.status-overlay{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:17px;background:rgba(1,2,5,.78);overscroll-behavior:contain}
.delivery-status-modal{position:relative;width:min(520px,100%);max-height:calc(100dvh - 34px);display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:contain;border:1px solid rgba(244,197,101,.22);border-radius:25px;background:linear-gradient(145deg,rgba(24,26,33,.99),rgba(8,9,13,.99));box-shadow:0 35px 110px rgba(0,0,0,.66);animation:confirmIn .28s cubic-bezier(.2,.8,.2,1) both;contain:layout paint}
.status-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding:26px 26px 8px}.delivery-status-modal h2{margin:0 0 7px;font-size:26px}.status-scroll>.muted{font-size:14px}.delivery-status-modal .status-icon{margin-bottom:18px}.delivery-status-modal .progress{margin:20px 0 8px}
.status-actions{position:relative;z-index:5;flex:0 0 auto;display:grid;gap:9px;padding:12px 26px 26px;border-top:1px solid var(--line);background:rgba(15,17,23,.98);box-shadow:0 -14px 32px rgba(0,0,0,.18)}.cancel-delivery{width:100%;border:1px solid rgba(255,113,126,.26);border-radius:13px;padding:12px;background:rgba(255,113,126,.08);color:#ff9aa4;font-weight:800;cursor:pointer}.cancel-delivery:hover{background:rgba(255,113,126,.14)}
body.light .status-overlay{background:rgba(215,220,230,.78)}
body.light .delivery-status-modal{background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(243,245,249,.99));box-shadow:0 35px 90px rgba(35,44,66,.24)}
body.light .status-actions{background:rgba(249,250,252,.98);box-shadow:0 -14px 32px rgba(35,44,66,.08)}

/* MM2-style attention and hand wave for the collapsed solution card. */
.friend-toggle{animation:none}
.friend-badge{animation:friendWave 2.8s ease-in-out infinite;transform-origin:70% 70%}
.friend-summary b{font-size:14px}.friend-summary small{font-size:11px}.friend-action b{font-size:11px}.friend-lead{font-size:12px}.friend-account small{font-size:9px}.friend-account b{font-size:14px}.friend-account button,.friend-account a{font-size:10px}.friend-steps li{font-size:11px}.friend-state{font-size:11px}.trade-guide{margin-top:11px}.trade-guide-head small{font-size:9px}.trade-guide-head b{font-size:14px}.trade-guide li,.trade-guide>p{font-size:11px}
@keyframes friendWave{0%,72%,100%{transform:rotate(0)}78%{transform:rotate(12deg)}84%{transform:rotate(-8deg)}90%{transform:rotate(5deg)}}
body.modal-open::after,body.modal-open .glow{animation-play-state:paused}

@media(max-width:700px){
  .key-label{font-size:11px}.redeem-card form .add-key{min-height:40px}
  .status-overlay{align-items:end;padding:0}
  .delivery-status-modal{width:100%;max-height:92dvh;border-width:1px 0 0;border-radius:25px 25px 0 0;animation:sheetIn .28s cubic-bezier(.2,.8,.2,1) both}
  .status-scroll{padding:20px 16px 8px}.status-actions{padding:10px 16px calc(16px + env(safe-area-inset-bottom))}
  .delivery-status-modal h2{font-size:22px}.status-scroll>.muted{font-size:12px}
  .friend-summary b{font-size:12px}.friend-summary small{font-size:10px}.friend-action b{font-size:10px}.friend-lead{font-size:11px}.friend-account b{font-size:12px}.friend-steps li,.trade-guide li,.trade-guide>p{font-size:10px}
}
@media(min-width:701px){
  .form-roadmap span{font-size:10.5px}.form-roadmap i{font-size:10px}
  .confirm-account small,.confirm-section>small,.confirm-bot>span{font-size:10px}.confirm-account span{font-size:12px}.confirm-contents,.confirm-bot>b{font-size:15px}.confirm-bot>p,.confirm-warning{font-size:11.5px}
  .friend-lead{font-size:12.5px}.friend-account small{font-size:10px}.friend-account button,.friend-account a{font-size:11px}.friend-steps li{font-size:12px}.friend-state{font-size:11.5px}.trade-guide-head small{font-size:10px}.trade-guide li,.trade-guide>p{font-size:11.5px}
}
@media(prefers-reduced-motion:reduce){.friend-toggle,.friend-badge,.delivery-status-modal,.key-row{animation:none!important}}

/* hCaptcha is optional locally and mandatory only when public credentials are configured. */
.captcha-box{display:grid;justify-items:center;gap:6px;padding:10px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.02);overflow:hidden}.captcha-box small{color:var(--muted);font-size:9px}.captcha-box iframe{max-width:100%}
body.light .captcha-box{background:rgba(20,28,44,.025)}