
:root{--red:#d92738;--gold:#ffdf9e;--ink:#382722;--muted:#9c8273}*{box-sizing:border-box}body{margin:0;background:#faf6ef;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft Yahei",sans-serif}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #a56114;outline-offset:4px}.top{max-width:1120px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:25px 30px}.logo{font-size:16px;font-weight:800;letter-spacing:2px}.logo b{display:inline-grid;place-items:center;background:var(--red);color:var(--gold);width:33px;height:33px;border-radius:11px;margin-right:10px}.badge{font-size:12px;border:1px solid #dccdbd;border-radius:20px;padding:7px 12px;color:#806f62}.layout{max-width:1080px;margin:25px auto 0;display:grid;grid-template-columns:1fr 430px;gap:100px;padding:0 30px}.intro{padding-top:50px}.eyebrow{font-size:12px;letter-spacing:4px;color:#ab6652}h1{font-size:58px;font-weight:900;line-height:1.15;letter-spacing:-2px;margin:20px 0}h1 span{color:var(--red)}.lead{color:#8d786a;line-height:1.9;font-size:15px;max-width:360px}.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.pills span{font-size:12px;background:#efe6d9;border-radius:8px;padding:8px 11px}.controls{margin-top:42px;padding-top:25px;border-top:1px solid #e7dccd;max-width:370px}.controls label{font-size:12px;color:#8d786a;display:block;margin-bottom:10px}select{background:white;border:1px solid #dfd3c3;border-radius:9px;padding:11px 14px;width:100%;color:var(--ink)}.control-buttons{display:flex;gap:10px;margin-top:12px}.smallbtn{border:1px solid #dfd3c3;background:transparent;border-radius:9px;padding:10px 12px;font-size:12px;color:#7e6253;flex:1}.phone{width:100%;background:#fffdfa;border:1px solid #e8ddd0;border-radius:26px;box-shadow:0 18px 65px #6c432515;overflow:hidden}.phonebar{padding:17px 21px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #f1e9df;font-size:13px}.phonebar span{font-size:10px;color:#b68c6f}.stage{padding:26px 24px 22px;background:radial-gradient(ellipse at top,#fff5d9,transparent 70%)}.sender{font-size:12px;text-align:center;color:#ad8b70;margin-bottom:16px}.packet{position:relative;border:0;display:block;color:#ffdfab;text-align:center;width:100%;min-height:335px;border-radius:20px;background:linear-gradient(135deg,#ee4750,#c71f32);box-shadow:0 14px 26px #c32d3525;overflow:hidden;padding:30px 16px}.packet:before{content:"";position:absolute;left:-15%;top:-150px;width:130%;height:340px;border-radius:50%;background:linear-gradient(#f45359,#e73340);border-bottom:1px solid #ffb17f88;box-shadow:0 8px 20px #a6152525}.packet:after{content:"";position:absolute;inset:12px;border:1px solid #ffca9333;border-radius:14px;pointer-events:none}.packet .inner{position:relative;z-index:1}.packet h2{font-size:24px;font-weight:500;letter-spacing:4px;margin:7px 0 12px}.packet .wish{font-size:12px;opacity:.8;letter-spacing:3px}.coin{display:grid;place-items:center;margin:33px auto 22px;width:95px;height:95px;border-radius:50%;background:linear-gradient(145deg,#ffe9ae,#eeb765);color:#933528;border:5px solid #fbd18b;box-shadow:0 0 0 2px #c78d45,0 8px 18px #7c122940;font-size:37px;font-weight:700;transition:transform .2s}.packet:hover .coin{transform:scale(1.06)}.packet .hint{font-size:12px;color:#ffcfb5}.packet.opening .coin{animation:spin .65s ease-in-out infinite}.packet.claimed{background:linear-gradient(135deg,#fbe8bd,#f6d28e);color:#863321;min-height:335px}.packet.claimed:before{background:linear-gradient(#fff0ce,#f8dda3);border-color:#d2994c55}.packet.claimed h2{font-size:17px;letter-spacing:2px}.result-number{font-size:65px;line-height:1.15;font-weight:800;margin:31px 0 3px;font-variant-numeric:tabular-nums;letter-spacing:-3px}.result-unit{font-size:12px;letter-spacing:3px}.packet.claimed .hint{color:#a77849;margin-top:28px}.stats{display:grid;grid-template-columns:1fr 1fr 1fr;margin-top:23px;text-align:center}.stat+ .stat{border-left:1px solid #eadfd1}.stat strong{font-size:20px;font-variant-numeric:tabular-nums}.stat small{display:block;color:#b0957e;font-size:10px;margin-top:6px}.progress{margin-top:19px;height:4px;border-radius:6px;background:#f0e5d6;overflow:hidden}.progress div{height:100%;background:#df3c42;transition:width .4s}.records{padding:0 24px 20px}.record-title{display:flex;justify-content:space-between;align-items:center;padding:17px 0;border-top:1px solid #eee3d5}.record-title h3{font-size:14px;margin:0}.record-title span{font-size:10px;color:#ae8c72}.rows{max-height:230px;overflow:auto}.row{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid #f3ece4}.avatar{width:33px;height:33px;display:grid;place-items:center;border-radius:11px;background:#f4e9d9;color:#a27956;font-size:13px}.who{flex:1;font-size:12px}.who small{display:block;color:#b09b8b;font-size:9px;margin-top:4px}.amount{font-weight:650;font-size:14px;text-align:right}.amount small{display:block;font-weight:400;font-size:9px;color:#b68c55;margin-top:4px}.footnote{font-size:10px;line-height:1.8;text-align:center;color:#b6a391;background:#f7f1e8;padding:13px 22px}.bottom{max-width:1080px;margin:32px auto 24px;padding:0 30px;font-size:11px;color:#b3a18d;display:flex;justify-content:space-between;gap:20px}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#382722;color:white;padding:12px 20px;border-radius:12px;font-size:13px;z-index:10;box-shadow:0 8px 20px #0002}.confetti{position:fixed;top:-20px;pointer-events:none;z-index:20;animation:fall 1.8s ease-in forwards}@keyframes fall{to{transform:translateY(100vh) rotate(580deg);opacity:0}}@keyframes spin{50%{transform:rotateY(180deg) scale(1.12)}100%{transform:rotateY(360deg)}}@media(max-width:800px){.top{padding:18px 20px}.layout{display:flex;flex-direction:column;gap:24px;margin-top:5px;padding:0 18px;max-width:450px}.intro{padding:0}.eyebrow{display:none}h1{font-size:30px;letter-spacing:-1px;line-height:1.25;margin:7px 0 10px}h1 br{display:none}.lead{font-size:12px;margin:0;line-height:1.7}.pills{display:none}.controls{margin-top:18px;padding-top:0;border:0;max-width:none}.controls label{font-size:10px;margin-bottom:6px}.control-buttons{margin-top:8px}.smallbtn{padding:8px}.phone{border-radius:22px}.stage{padding:20px}.packet{min-height:310px}.bottom{font-size:10px;display:block;text-align:center;margin:22px auto}.bottom span{display:block;margin:5px}.logo{font-size:13px}.badge{font-size:10px;padding:6px 9px}.result-number{font-size:59px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
.hidden{display:none!important}.tabs{display:flex;gap:5px;background:#efe5d8;padding:4px;border-radius:10px;margin-bottom:18px}.tabs button{flex:1;border:0;background:transparent;color:#9d8068;border-radius:7px;padding:9px 3px;font-size:12px}.tabs button.active{background:#fffdfa;color:#ae352d;box-shadow:0 2px 5px #6045230b}.chat{min-height:500px;background:#f1ede7;padding:24px}.chat-time{text-align:center;font-size:10px;color:#b1a597;margin-bottom:35px}.chat-name{font-size:12px;color:#8e7c6b;margin-bottom:9px}.group-card{border:0;text-align:left;background:linear-gradient(120deg,#ec5747,#d93b36);color:#fff0d1;width:100%;border-radius:13px;padding:20px 17px 0;display:flex;flex-wrap:wrap;gap:14px}.mini-envelope{font-size:27px;background:#f8d08c;border-radius:8px;width:45px;height:55px;display:grid;place-items:center;color:#ce4435}.group-card strong{font-size:15px}.group-card p{font-size:11px;opacity:.8}.group-card small{border-top:1px solid #ffd3a145;width:100%;padding:12px 0;font-size:10px}.chat-tip{font-size:11px;color:#a19181;line-height:1.9;margin-top:30px}.admin-body{padding:24px}.admin-body h2{font-size:22px;margin:0}.admin-hint{font-size:11px;line-height:1.8;color:#a78b73}.admin-body label{display:block;font-size:12px;color:#95765d;margin:18px 0 0}.admin-body input{display:block;width:100%;padding:12px;margin-top:7px;border:1px solid #e4d6c6;border-radius:8px;color:#573b2c;background:#fffdf9}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.primary{width:100%;background:#d8313e;color:white;border:0;border-radius:10px;padding:13px;margin-top:20px}.admin-summary{background:#f7eedf;padding:15px;border-radius:10px;font-size:12px;line-height:2;color:#946c4e;margin:25px 0 12px}.admin-summary strong{color:#c13b2e}.record-title .smallbtn{flex:none;font-size:10px;padding:5px 8px}@media(max-width:800px){.tabs{margin-bottom:12px}.chat{min-height:400px}} .logo{display:flex;align-items:center}.logo .gas-mark{width:48px;height:36px;border-radius:10px;font-size:14px;letter-spacing:-1px;background:#d92738;color:#ffe3ac;font-weight:900}.brand-sub{display:block;font-size:8px;letter-spacing:1.8px;color:#ae8b75;margin-top:3px}.packet .inner:before{content:"GAS · 盖世";display:block;font-size:10px;letter-spacing:3px;opacity:.7;margin-bottom:12px}@media(max-width:800px){.logo .gas-mark{width:42px;height:32px;font-size:12px}} 
.employee-layout{display:block;max-width:480px;margin:0 auto;padding:0 18px}.employee-layout .phone{margin-top:12px}.employee-layout .packet h2{letter-spacing:1px;overflow-wrap:anywhere}.status{max-width:760px;margin:0 auto 18px;padding:13px 16px;border-radius:12px;background:#f4ead9;font-size:13px;line-height:1.6;color:#8a6245}.status.error{background:#fff0eb;color:#ab3029}.identity{font-size:12px;color:#99775f}.packet:disabled{cursor:default}.admin-layout{max-width:760px;margin:0 auto;padding:0 18px}.admin-layout .phone{margin-bottom:20px}.admin-body textarea{display:block;width:100%;padding:12px;margin-top:7px;border:1px solid #e4d6c6;border-radius:8px;background:#fffdf9;resize:vertical;font:inherit;font-size:13px}.admin-body fieldset{border:0;padding:0;margin:0}.admin-body fieldset:disabled{opacity:.55}.admin-body .link-output{padding:12px;background:#f6efdf;border-radius:8px;overflow-wrap:anywhere}.admin-body .link-output a{color:#b42a38}.row.best .avatar{background:#ffe5af;color:#ad5523}.empty{font-size:12px;color:#a38c77;padding:15px 0}.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.summary-grid div{background:#f7eedf;padding:14px 8px;border-radius:9px;text-align:center;font-size:12px}.summary-grid strong{display:block;font-size:19px;margin-bottom:6px}.action-row{display:flex;gap:10px;margin:16px 0}.action-row button{flex:1}.danger{color:#a5232e;border-color:#db9d9d}.records .rows{max-height:none}.admin-layout .rows{max-height:460px}.top{max-width:850px}.primary:disabled,.smallbtn:disabled{opacity:.5;cursor:default}.intro-mini{text-align:center;font-size:12px;color:#9d7b63;margin:8px 0 18px}.summary-title{font-size:22px;overflow-wrap:anywhere}.state-pill{font-size:12px;color:#9a795f}.retry-row{text-align:center;margin:10px auto 18px}.retry-row button{max-width:180px}.hidden{display:none!important}

.admin-body label select{display:block;margin-top:7px;padding:12px;border:1px solid #e4d6c6;border-radius:8px;color:#573b2c;background:#fffdf9}
.admin-body .member-action{margin-top:8px}
.activity-meta{margin:10px 0;font-size:13px;font-weight:650;color:#704b36}
.activity-notice{margin:10px 0;padding:9px 11px;border-radius:8px;background:#f7eedf;color:#704b36;font-size:12px;line-height:1.6}
.activity-notice[data-kind="test"]{background:#ffede3;color:#862f2c}
.employee-layout .activity-meta,.employee-layout .activity-notice{text-align:center}
.employee-layout .activity-meta{margin-top:0}
.employee-layout .activity-notice{margin-bottom:16px}

.group-layout h1{margin:0;font-size:24px;letter-spacing:0;overflow-wrap:anywhere}
.group-layout .phone{margin-bottom:16px}
.group-activities{margin:0;padding:0;list-style:none}
.group-activity-info{flex:1;min-width:0;overflow-wrap:anywhere}
.group-activity-info small{display:block;margin-top:4px;color:#7e6253;font-size:12px}
.group-claim{flex:none;display:inline-block;text-decoration:none;white-space:nowrap}
.group-activity-actions{display:flex;justify-content:center;align-items:center;gap:8px}
.group-activity-actions .smallbtn{flex:none}

.group-deliver{flex:none;white-space:nowrap;color:#a5232e;border-color:#db9d9d}
.group-deliver-dialog{width:min(390px,calc(100% - 36px));border:1px solid #e4d6c6;border-radius:16px;background:#fffdfa;color:var(--ink);padding:20px}
.group-deliver-dialog::backdrop{background:#38272272}
.group-deliver-dialog h2{margin:0;font-size:20px}
.group-deliver-dialog p{line-height:1.6;overflow-wrap:anywhere}
.group-deliver-dialog .action-row{margin-bottom:0}
.group-deliver-dialog .action-row button{flex:1}

/* Keep recipient styling scoped to the activity page. */
.recipient-page {
  background: #f7f3ee;
}

.recipient-page .top {
  max-width: 480px;
  gap: 12px;
  padding: 16px 18px 10px;
}
.recipient-page .logo {
  flex: none;
  font-size: 15px;
  letter-spacing: 0;
}
.recipient-page .logo .gas-mark {
  background: #942921;
  color: #ffe8bb;
}
.recipient-page .identity {
  color: #6e4d3c;
  text-align: right;
  overflow-wrap: anywhere;
}

.recipient-page .employee-layout {
  padding: 0 14px 24px;
}
.recipient-page .recipient-feedback {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.recipient-page .status {
  flex: 1;
  margin: 0;
  padding: 7px 4px;
  background: transparent;
  color: #6e4d3c;
}
.recipient-page .status.error {
  padding: 9px 11px;
  background: #fff0eb;
  color: #9b2b27;
}
.recipient-page .smallbtn {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  background: #fffaf2;
  color: #6e4d3c;
}
.recipient-page .group-activity-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
}
.recipient-page .phone {
  margin-top: 10px;
  border: 1px solid #e8ded3;
  border-radius: 18px;
  box-shadow: 0 8px 24px #3f261011;
}
.recipient-page .phonebar {
  gap: 8px;
  padding: 10px 16px;
}
.recipient-page .phonebar .activity-meta {
  margin: 0;
  text-align: left;
  overflow-wrap: anywhere;
}
.recipient-page #activityState {
  margin-left: auto;
  color: #76503b;
  font-size: 12px;
  text-align: right;
}
.recipient-page .stage {
  padding: 12px 12px 16px;
  background: #fffdfa;
}
.recipient-page .activity-notice {
  margin: 0 0 10px;
}

.recipient-page .packet {
  min-height: 0;
  padding: 0;
  border: 1px solid #e8ddd1;
  border-radius: 13px;
  background: #f9f3eb;
  color: #382821;
  box-shadow: none;
  touch-action: manipulation;
}
.recipient-page .packet::before,
.recipient-page .packet::after {
  content: none;
}
.recipient-page .packet:focus-visible {
  outline-color: #822a21;
}
.recipient-page .packet .inner {
  display: grid;
  justify-items: center;
  width: 100%;
  min-width: 0;
}
.recipient-page .packet .inner::before {
  content: none;
}
.recipient-page .packet h2,
.recipient-page .recipient-title {
  max-width: 100%;
  margin: 0;
  padding: 12px 13px 11px;
  color: inherit;
  font-size: clamp(17px, 5vw, 23px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.28;
  overflow-wrap: anywhere;
}
.recipient-page .packet .wish {
  display: none;
}
.recipient-page .packet .coin {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #9b2a24;
  color: #f5d599;
  box-shadow: none;
  font-size: clamp(22px, 7vw, 35px);
  font-weight: 800;
  letter-spacing: .04em;
  transform: none;
  transition: filter .18s ease-out;
}
.recipient-page .packet .coin::after {
  position: absolute;
  inset: 0;
  content: "";
  background: url('/static/gas-red-packet-v3.jpg') center / cover no-repeat;
}
.recipient-page .packet:enabled:active .coin {
  filter: brightness(.9);
}
.recipient-page .packet.opening .coin {
  animation: recipient-envelope-open .55s ease-out both;
}
.recipient-page .packet.opening .coin::before {
  position: absolute;
  inset: -35%;
  z-index: 1;
  content: "";
  background: linear-gradient(112deg, transparent 36%, #ffdf8a 48%, #fff5c4 50%, transparent 60%);
  mix-blend-mode: screen;
  animation: recipient-foil-flash .55s ease-out both;
}
.recipient-page .packet:disabled:not(.opening) .coin {
  filter: saturate(.65);
}
.recipient-page .packet .hint {
  width: 100%;
  padding: 9px 12px;
  color: #66362b;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
}
.recipient-page .packet.claimed {
  padding: 10px 12px 13px;
  border-color: #e6d2b7;
  background: #fbf3e6;
  color: #752b23;
}
.recipient-page .packet.claimed .result-number {
  margin: 0;
  max-width: 100%;
  font-size: clamp(36px, 12vw, 57px);
  letter-spacing: -.055em;
  overflow-wrap: anywhere;
}
.recipient-page .packet.claimed .hint {
  margin: 0;
  padding: 8px 0 3px;
  color: #704b38;
}
.recipient-page #replayReward {
  display: flex;
  margin: 8px auto 0;
  padding-inline: 12px;
  border-color: #e8ddd1;
  background: #fffdfa;
  color: #752b23;
}

.recipient-page .stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 15px 0 0;
}
.recipient-page .stat {
  display: flex;
  flex-direction: column-reverse;
  gap: 3px;
  padding: 0 3px;
}
.recipient-page .stat dt {
  color: #745640;
  font-size: 11px;
}
.recipient-page .stat dd {
  margin: 0;
  color: #5c3426;
  font-size: clamp(14px, 4.4vw, 20px);
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  overflow-wrap: anywhere;
}
.recipient-page .progress {
  margin-top: 13px;
}
.recipient-page .progress div {
  background: #b93c2d;
}
.recipient-page .records {
  padding: 0 14px 12px;
}
.recipient-page .record-title {
  gap: 8px;
  padding: 12px 0;
  border-top: 0;
}
.recipient-page .record-title span,
.recipient-page .empty,
.recipient-page .who small {
  color: #745640;
  font-size: 11px;
}
.recipient-page .who {
  min-width: 0;
  overflow-wrap: anywhere;
}
.recipient-page .amount small,
.recipient-page .avatar {
  color: #794832;
}
.recipient-page .footnote {
  padding: 10px 12px;
  color: #745640;
  font-size: 11px;
}

@keyframes recipient-envelope-open {
  0% { transform: scale(.99); }
  38% { filter: brightness(.9); transform: scale(1.025) translateY(-2px); }
  72% { filter: brightness(1.12); transform: scale(1.035) translateY(1px); }
  100% { transform: scale(1); }
}
@keyframes recipient-foil-flash {
  0% { opacity: 0; transform: translateX(-47%); }
  39% { opacity: .68; }
  100% { opacity: 0; transform: translateX(43%); }
}
@media (hover: hover) {
  .recipient-page .packet:enabled:hover .coin {
    filter: brightness(1.04);
  }
}
@media (prefers-reduced-motion: reduce) {
  .recipient-page .packet:enabled .coin {
    transform: none;
  }
  .recipient-page .confetti {
    display: none;
  }
}
