:root{
  --bg:#070910;--panel:rgba(16,20,31,.90);--border:rgba(151,166,207,.16);
  --text:#f5f7fb;--muted:#8993a9;--accent:#7587ff;--accent2:#a36cff;
  --success:#78e3b5;--warning:#f3c76d
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;background:radial-gradient(circle at 50% -20%,rgba(91,94,255,.14),transparent 44%),var(--bg);
  color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei","PingFang SC",Arial,sans-serif;
  overflow-x:hidden
}
button,input{font:inherit}
.ambient{position:fixed;width:460px;height:460px;border-radius:999px;filter:blur(100px);opacity:.16;pointer-events:none}
.ambient-a{background:#6375ff;top:-210px;left:-160px}.ambient-b{background:#8b4dff;bottom:-260px;right:-180px}
.grid{position:fixed;inset:0;pointer-events:none;opacity:.15;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(to bottom,black,transparent 78%)}
.shell{position:relative;z-index:1;width:min(760px,calc(100% - 32px));margin:0 auto;padding:68px 0 28px}
.hero{position:relative;overflow:hidden;padding:44px 48px 40px;border:1px solid var(--border);border-radius:26px;background:linear-gradient(145deg,rgba(24,29,44,.92),rgba(10,13,21,.95));box-shadow:0 35px 100px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.045);backdrop-filter:blur(24px)}
.hero:before{content:"";position:absolute;width:430px;height:230px;left:50%;top:-180px;transform:translateX(-50%);background:#7f72ff;filter:blur(90px);opacity:.22;pointer-events:none}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:42px}
.brand-mark{display:grid;place-items:center;width:32px;height:32px;border:1px solid rgba(139,153,255,.48);border-radius:9px;background:linear-gradient(145deg,rgba(112,130,255,.24),rgba(163,108,255,.08));color:#dce1ff;font-size:14px;font-weight:900}
.brand-name{letter-spacing:4px;font-size:12px;font-weight:800;color:#c5cae1}
.badge{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid rgba(118,136,255,.28);border-radius:999px;background:rgba(86,101,214,.08);color:#aeb8ff;font-size:10px;font-weight:800;letter-spacing:1.8px}
.dot{width:6px;height:6px;border-radius:99px;background:#8fa0ff;box-shadow:0 0 16px #7286ff}
h1{margin:22px 0 0;font-size:clamp(38px,7vw,62px);line-height:1.02;letter-spacing:-2.2px;font-weight:850}
h1 span{background:linear-gradient(90deg,#fff 0%,#b8c0ff 48%,#c79cff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{max-width:570px;margin:20px 0 34px;color:var(--muted);line-height:1.85;font-size:14px}
.redeem-form label{display:block;margin:0 0 10px 2px;color:#b9c0d2;font-size:12px;font-weight:700}
input{width:100%;height:60px;border:1px solid rgba(142,157,199,.22);border-radius:13px;outline:none;background:rgba(5,8,14,.74);color:#f8f9ff;padding:0 18px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:16px;letter-spacing:1.4px;text-transform:uppercase;transition:.2s}
input::placeholder{color:#555e72}
input:focus{border-color:rgba(123,140,255,.7);background:rgba(7,10,18,.9);box-shadow:0 0 0 4px rgba(102,120,255,.09)}
.redeem-form>button{width:100%;height:56px;margin-top:14px;border:0;border-radius:12px;cursor:pointer;color:white;background:linear-gradient(95deg,#6478f6,#815fe8);box-shadow:0 16px 35px rgba(90,88,225,.2);font-size:14px;font-weight:800}
.redeem-form>button:disabled{cursor:wait;opacity:.72}
.spinner{display:none;width:18px;height:18px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
.loading .button-text{display:none}.loading .spinner{display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.message{min-height:20px;margin:10px 2px 0;color:#ff949f;font-size:12px;line-height:1.6}
.result{margin-top:24px;padding-top:24px;border-top:1px solid rgba(148,160,191,.12)}
.success-line{display:flex;gap:13px;align-items:flex-start;margin-bottom:17px}
.success-icon{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(120,227,181,.25);border-radius:10px;background:rgba(71,183,137,.08);color:var(--success);font-weight:900}
.success-line strong{display:block;font-size:15px}.success-line p{margin:5px 0 0;color:var(--muted);font-size:12px}
.credentials{overflow:hidden;border:1px solid rgba(140,156,201,.17);border-radius:16px;background:rgba(5,8,14,.62)}
.credential{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:21px 22px}
.kicker{display:block;margin-bottom:7px;color:#6f7a92;font-size:10px;font-weight:800;letter-spacing:1.4px}
.credential strong,.group-panel strong{display:block;color:#f5f7ff;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:18px;letter-spacing:.5px;word-break:break-all}
.divider{height:1px;margin:0 22px;background:rgba(143,157,192,.1)}
.copy-button{border:1px solid rgba(143,157,205,.17);border-radius:9px;background:rgba(255,255,255,.035);color:#aeb6ca;padding:8px 11px;cursor:pointer;font-size:11px;font-weight:700}
.group-panel{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-top:14px;padding:20px 22px;border:1px solid rgba(125,140,255,.18);border-radius:16px;background:linear-gradient(135deg,rgba(72,86,179,.10),rgba(111,70,169,.08))}
.group-panel p{margin:7px 0 0;color:#7f899f;font-size:11px;line-height:1.6}
.group-button{border:0;cursor:pointer;min-width:116px;height:40px;padding:0 15px;border-radius:10px;background:#eef0ff;color:#171a25;font-size:12px;font-weight:850}
.warning{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:14px 16px;border-radius:11px;background:rgba(203,156,63,.07);color:#aa9f86}
.warning span{display:grid;place-items:center;width:18px;height:18px;border:1px solid rgba(243,199,109,.35);border-radius:99px;color:var(--warning);font-size:10px;font-weight:900}
.warning p{margin:0;font-size:11px;line-height:1.7}
.steps{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:38px}
.steps div{text-align:center;min-width:95px}.steps span{color:#6677cc;font-size:10px;font-weight:850;letter-spacing:1px}.steps p{margin:5px 0 0;color:#667087;font-size:10px}.steps i{width:36px;height:1px;background:linear-gradient(90deg,transparent,#343b51,transparent)}
footer{display:flex;justify-content:center;gap:8px;padding:22px 0 0;color:#3f4759;font-size:10px;letter-spacing:1px}
@media(max-width:640px){.shell{padding-top:22px;width:min(100% - 20px,760px)}.hero{padding:30px 20px 28px;border-radius:20px}.brand{margin-bottom:32px}.credential{padding:18px 17px}.group-panel{align-items:stretch;flex-direction:column}.group-button{width:100%}.steps{gap:7px}.steps i{width:16px}.steps div{min-width:76px}}