:root{
  --bg:#0b111c;--bg2:#121b29;--panel:rgba(16,27,42,.94);--panel2:rgba(23,38,57,.96);
  --line:rgba(119,210,229,.18);--line-gold:rgba(247,201,106,.34);--text:#f8fbff;--muted:#b2c2d0;
  --accent:#f7c96a;--accent2:#ff8b4d;--cyan:#72dce8;--good:#77e0aa;--danger:#ff7382;
  --shadow:0 24px 70px rgba(0,0,0,.38)
}
*{box-sizing:border-box}
html{min-height:100%;scroll-behavior:smooth}
body{margin:0;min-height:100vh;font-family:'Kanit',Tahoma,sans-serif;color:var(--text);background:
  linear-gradient(180deg,rgba(7,13,23,.66),rgba(8,16,27,.88)),
  url('../../images/frenzy/frenzy-page-bg.jpg') center top/cover fixed no-repeat,
  var(--bg);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:
  radial-gradient(circle at 10% 4%,rgba(255,139,77,.24),transparent 29%),
  radial-gradient(circle at 88% 11%,rgba(114,220,232,.18),transparent 31%),
  radial-gradient(circle at 52% 82%,rgba(179,156,255,.08),transparent 34%)}
body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(180deg,rgba(255,255,255,.015),rgba(0,0,0,.08))}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.topbar{width:min(1200px,calc(100% - 30px));margin:18px auto;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:9px 12px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(90deg,rgba(8,16,27,.92),rgba(16,26,40,.90));backdrop-filter:blur(16px);box-shadow:0 10px 32px rgba(0,0,0,.28);position:relative;z-index:5}
.brand-mark{display:flex;align-items:center;gap:11px;min-width:0}
.brand-logo{width:48px;height:48px;object-fit:cover;border-radius:13px;border:1px solid var(--line-gold);box-shadow:0 0 24px rgba(255,198,87,.15)}
.brand-mark strong{display:block;font-size:17px;line-height:1.05;color:#fff}
.brand-mark small{display:block;margin-top:4px;color:var(--accent);font-size:10px;letter-spacing:.08em}
.ghost-link,.ghost-btn,.user-pill{border:1px solid var(--line);border-radius:999px;background:rgba(13,36,58,.88);backdrop-filter:blur(10px);color:#e8f4fb;padding:10px 14px;font-family:inherit;font-size:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.ghost-btn{cursor:pointer}.ghost-btn:hover,.ghost-link:hover{border-color:var(--line-gold);color:var(--accent);transform:translateY(-1px)}
.top-actions{display:flex;align-items:center;gap:9px}.user-pill{color:var(--cyan)}
.login-layout{width:min(1120px,calc(100% - 28px));margin:34px auto 70px;display:grid;grid-template-columns:1.18fr .82fr;gap:22px;position:relative;z-index:2}
.hero-panel,.login-card,.panel,.welcome-card,.wallet-card{border:1px solid var(--line);background:linear-gradient(155deg,rgba(17,42,66,.96),rgba(8,23,38,.95));backdrop-filter:blur(12px);box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.04)}
.hero-panel{min-height:560px;border-radius:28px;padding:38px 46px 44px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;border-color:var(--line-gold);background:
  linear-gradient(90deg,rgba(5,14,24,.94) 4%,rgba(5,14,24,.74) 56%,rgba(5,14,24,.42)),
  url('../../images/frenzy/frenzy-morocc-hero.png') center 43%/cover no-repeat}
.hero-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,10,18,.08),rgba(3,10,18,.82));pointer-events:none}
.hero-panel>*{position:relative;z-index:1}
.hero-logo-wrap{position:absolute;left:30px;top:20px;width:min(310px,48%);height:185px;overflow:hidden;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 14px 26px rgba(0,0,0,.42));opacity:.98}
.server-logo{width:100%;height:100%;object-fit:cover;object-position:center 48%;border-radius:18px;border:1px solid rgba(247,201,106,.16);mask-image:linear-gradient(to bottom,#000 78%,transparent 100%)}
.eyebrow,.card-kicker{font-size:10px;letter-spacing:.18em;font-weight:700;color:var(--accent);text-shadow:0 0 18px rgba(247,201,106,.20)}
.hero-panel h1,.welcome-card h1{font-size:clamp(34px,5vw,58px);line-height:1.04;margin:10px 0 12px;color:#fff;text-shadow:0 4px 30px rgba(0,0,0,.58)}
.hero-panel h1 em,.welcome-card h1 em{font-style:normal;color:var(--accent);text-shadow:0 0 28px rgba(247,201,106,.20)}
.hero-panel>p,.welcome-card p{color:#c9d9e7;line-height:1.75;max-width:720px}
.promo-callout{display:flex;align-items:center;gap:13px;width:min(100%,610px);padding:13px 15px;margin:3px 0 11px;border:1px solid rgba(247,201,106,.54);border-radius:17px;background:linear-gradient(135deg,rgba(247,201,106,.15),rgba(255,139,77,.10),rgba(114,220,232,.08));box-shadow:0 15px 34px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.06)}
.promo-x2{display:grid;place-items:center;min-width:64px;height:54px;padding:0 12px;border-radius:14px;font-size:29px;line-height:1;font-weight:800;color:#241507;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 10px 22px rgba(255,139,77,.22)}
.promo-callout b,.promo-callout small{display:block}.promo-callout b{font-size:15px;color:#fff2cf}.promo-callout small{margin-top:2px;font-size:11px;color:#d5e6f3;line-height:1.45}
.promo-callout.compact{margin:8px 0 10px}.promo-callout.compact .promo-x2{min-width:58px;height:48px;font-size:26px}
.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
.feature-row>div{padding:14px;border:1px solid var(--line);border-radius:16px;background:rgba(11,30,48,.82);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.feature-row i{color:var(--cyan);margin-bottom:9px}.feature-row b,.feature-row span{display:block}.feature-row b{font-size:12px;color:#fff}.feature-row span{font-size:10px;color:var(--muted);margin-top:3px}
.login-card{border-radius:26px;padding:34px;align-self:stretch;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(155deg,rgba(18,40,61,.97),rgba(8,22,36,.96))}
.login-card h2,.panel h2{margin:5px 0 2px;font-size:24px;color:#fff}.muted{color:var(--muted);font-size:12px;margin-bottom:25px}
.login-card label{display:block;font-size:12px;color:#e8f2f9;margin:13px 0 7px}
.field{display:flex;align-items:center;border:1px solid var(--line);border-radius:14px;background:rgba(6,17,29,.78);overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.field:focus-within{border-color:rgba(114,220,232,.48);box-shadow:0 0 0 3px rgba(114,220,232,.06)}
.field i{width:46px;text-align:center;color:var(--cyan)}.field input{height:48px;flex:1;border:0;outline:0;background:transparent;color:#fff;font-family:inherit;padding:0 13px}.field input::placeholder{color:#8197a9}
.primary-btn{width:100%;border:0;border-radius:999px;padding:13px 16px;margin-top:18px;cursor:pointer;font-family:inherit;font-weight:700;color:#201407;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 12px 30px rgba(255,139,77,.24),inset 0 1px 0 rgba(255,255,255,.30)}
.primary-btn:hover{transform:translateY(-1px);filter:brightness(1.04)}.primary-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.secure-note{margin-top:15px;padding:11px 12px;border-radius:12px;background:rgba(119,224,170,.08);border:1px solid rgba(119,224,170,.28);font-size:11px;color:#b8e9cc}
.dashboard{width:min(1200px,calc(100% - 28px));margin:28px auto 70px;position:relative;z-index:2}
.welcome-card{border-radius:26px;padding:24px 28px;display:flex;justify-content:space-between;gap:18px;align-items:center;border-color:var(--line-gold);background:linear-gradient(125deg,rgba(11,30,48,.97),rgba(20,42,63,.94) 55%,rgba(55,37,17,.72))}
.promo-welcome{position:relative;overflow:hidden}.promo-welcome:after{content:"";position:absolute;right:-90px;top:-110px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(247,201,106,.12),transparent 68%);pointer-events:none}
.welcome-brand{flex:0 0 170px;height:125px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:17px;border:1px solid rgba(247,201,106,.20);background:rgba(4,14,24,.38)}
.welcome-logo{width:100%;height:100%;object-fit:cover;object-position:center 48%;filter:drop-shadow(0 10px 18px rgba(0,0,0,.38))}
.welcome-copy{flex:1;min-width:0}.welcome-card h1{font-size:34px;margin:4px 0 4px}.welcome-card p{margin:0;font-size:12px}.security-chip{white-space:nowrap;border:1px solid rgba(119,224,170,.30);background:rgba(119,224,170,.08);color:#c6f0d6;padding:11px 14px;border-radius:999px;font-size:11px;position:relative;z-index:1}
.wallet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:14px 0}.wallet-card{border-radius:20px;padding:20px 22px}.wallet-card span,.wallet-card small{display:block;color:var(--muted);font-size:11px}.wallet-card strong{display:block;font-size:27px;color:var(--accent);margin:3px 0;text-shadow:0 0 18px rgba(247,201,106,.15)}.wallet-card.highlight{border-color:var(--line-gold);background:linear-gradient(145deg,rgba(55,37,17,.58),rgba(11,30,48,.96))}
.content-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);gap:14px}.panel{border-radius:24px;padding:22px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:17px}.panel h2{font-size:20px}.mini-note{font-size:10px;color:var(--accent);border:1px solid var(--line-gold);padding:7px 9px;border-radius:999px;background:rgba(247,201,106,.06)}
.package-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.package-card{font-family:inherit;text-align:left;border:1px solid var(--line);background:linear-gradient(160deg,rgba(11,30,48,.92),rgba(8,23,38,.94));color:var(--text);padding:15px;border-radius:17px;cursor:pointer;transition:.16s ease;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.package-card:hover{transform:translateY(-2px);border-color:var(--line-gold);background:linear-gradient(160deg,rgba(18,43,65,.96),rgba(9,27,44,.96));box-shadow:0 14px 30px rgba(0,0,0,.22),0 0 0 1px rgba(247,201,106,.08)}
.pkg-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.pkg-top b{font-size:18px;color:#fff}.pkg-top span{font-size:9px;border-radius:999px;padding:5px 7px}.pkg-top .x2{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#241507;font-weight:800}.pkg-top .used{background:rgba(114,220,232,.10);border:1px solid rgba(114,220,232,.16);color:#b8dbe3}.pkg-reward{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.pkg-reward span{font-size:11px;color:#d7e5ef}.package-card small{font-size:10px;color:var(--muted)}
.qr-panel{min-height:420px}.qr-empty{min-height:320px;display:grid;place-items:center;text-align:center;color:#8399ab}.qr-empty i{font-size:80px;color:rgba(114,220,232,.42)}.qr-empty p{margin-top:-80px}.qr-area{text-align:center}.selected-amount{font-size:12px;color:var(--muted);margin-bottom:10px}.selected-amount strong{color:var(--accent);font-size:18px}.qr-area img{display:block;width:min(100%,300px);aspect-ratio:1/1;object-fit:contain;margin:0 auto;padding:10px;background:#fff;border-radius:16px;box-shadow:0 16px 34px rgba(0,0,0,.24)}.warning-text{font-size:10px;color:#c7d8e6;line-height:1.6}
.history-panel{margin-top:14px}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px}table{border-collapse:collapse;width:100%;min-width:760px;background:rgba(6,17,29,.84)}th,td{padding:12px 13px;border-bottom:1px solid rgba(119,210,229,.12);font-size:11px;text-align:left}th{color:var(--cyan);background:rgba(114,220,232,.07)}td{color:#d5e2ec}.badge-x2,.badge-normal,.status-ok,.status-wait{display:inline-block;padding:5px 7px;border-radius:999px;font-size:9px}.badge-x2{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#241507;font-weight:700}.badge-normal{background:rgba(114,220,232,.10);color:#bfdce5}.status-ok{background:rgba(119,224,170,.12);color:#a8e3bf}.status-wait{background:rgba(255,115,130,.12);color:#ffb0b9}.empty-row{text-align:center;color:#8399ab;padding:28px}
.page-loader{position:fixed;inset:0;background:rgba(5,14,23,.86);z-index:9999;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center}.spinner{width:42px;height:42px;border:4px solid rgba(255,255,255,.15);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}.page-loader span{font-size:12px;color:#f5e5bd}@keyframes spin{to{transform:rotate(360deg)}}
.item-reward-list span{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.item-reward-list span small,.history-panel td small{opacity:.86;color:#aebfcd}.reward-chip{display:flex;align-items:center;gap:10px;width:100%;padding:8px 9px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}.reward-icon{width:42px;height:42px;object-fit:contain;flex:0 0 42px;border-radius:10px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(232,243,247,.98));padding:4px;box-shadow:0 8px 18px rgba(0,0,0,.12)}.reward-chip span{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.reward-chip b{font-size:11px;line-height:1.25;color:#fff2cf}.reward-chip small{opacity:.82;font-size:.78em;line-height:1.25;color:#aebfcd}
.item-example-panel{margin-top:14px}.item-example-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.item-example-card{margin:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:linear-gradient(160deg,rgba(11,30,48,.92),rgba(8,23,38,.94));box-shadow:inset 0 1px 0 rgba(255,255,255,.04);transition:.16s ease}.item-example-card:hover{transform:translateY(-2px);border-color:var(--line-gold);box-shadow:0 14px 30px rgba(0,0,0,.22)}.item-example-card.icon-only{padding:16px 14px 14px;text-align:center}.item-example-card.icon-only img{display:block;width:88px;height:88px;object-fit:contain;margin:0 auto 10px;border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(232,243,247,.98));padding:8px;box-shadow:0 12px 24px rgba(0,0,0,.14)}.item-example-card figcaption{padding:11px 12px}.item-example-card.icon-only figcaption{padding:0}.item-example-card b{display:block;color:var(--accent);font-size:12px;margin-bottom:4px}.item-example-card span{display:block;color:#b8c9d6;font-size:10px;line-height:1.45}.history-reward-list{display:flex;flex-direction:column;gap:8px}.history-reward-item{display:flex;align-items:flex-start;gap:8px}.history-reward-icon{width:30px;height:30px;object-fit:contain;border-radius:8px;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(232,243,247,.98));padding:3px;flex:0 0 30px}
.inline-icon-list{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 8px}.reward-inline{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:13px;border:1px solid var(--line);background:rgba(255,255,255,.025);min-width:92px}.reward-inline-icon{width:38px;height:38px;object-fit:contain;flex:0 0 38px;border-radius:10px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(232,243,247,.98));padding:4px;box-shadow:0 8px 16px rgba(0,0,0,.12)}.reward-inline-meta{display:flex;flex-direction:column;line-height:1.15}.reward-inline-meta b{font-size:13px;color:#fff2cf}.reward-inline-meta small{font-size:9px;color:#aebfcd}.pkg-reward-desc{display:flex;flex-direction:column;gap:3px;margin-top:4px}.pkg-reward-desc span{font-size:10px;color:#d5e2ec;line-height:1.35}.pkg-reward-desc span small{color:#aebfcd;font-size:10px}.history-reward-inline-list{display:flex;flex-wrap:wrap;gap:6px}.history-reward-inline{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:11px;background:rgba(255,255,255,.025);border:1px solid var(--line)}.history-reward-inline div{display:flex;flex-direction:column;line-height:1.1}.history-reward-inline b{font-size:11px;color:#fff2cf}.history-reward-inline small{font-size:9px;color:#aebfcd}
@media(max-width:1050px){.item-example-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.welcome-brand{flex-basis:140px}}
@media(max-width:900px){.login-layout,.content-grid{grid-template-columns:1fr}.hero-panel{min-height:520px;padding:34px}.wallet-grid{grid-template-columns:1fr 1fr}.wallet-card.highlight{grid-column:1/-1}.qr-panel{min-height:0}.qr-empty{min-height:230px}.promo-welcome{align-items:flex-start;flex-wrap:wrap}.welcome-brand{flex:0 0 145px}.welcome-copy{min-width:calc(100% - 170px)}}
@media(max-width:620px){.topbar{align-items:flex-start}.brand-mark small{display:none}.top-actions{flex-wrap:wrap;justify-content:flex-end}.user-pill{display:none}.brand-logo{width:42px;height:42px}.login-layout{margin-top:20px}.hero-panel,.login-card{border-radius:20px}.hero-panel{padding:24px;min-height:540px}.hero-logo-wrap{left:20px;top:16px;width:64%;height:150px}.hero-panel h1{font-size:34px}.promo-callout{align-items:flex-start}.promo-x2{min-width:54px;height:48px;font-size:25px}.feature-row{grid-template-columns:1fr}.feature-row>div{padding:10px}.login-card{padding:24px}.welcome-card{align-items:flex-start;flex-direction:column}.welcome-brand{width:100%;height:150px;flex:none}.welcome-copy{min-width:0;width:100%}.wallet-grid,.package-grid{grid-template-columns:1fr}.wallet-card.highlight{grid-column:auto}.panel{padding:16px}.panel-head{align-items:flex-start;flex-direction:column}.item-example-grid{grid-template-columns:1fr 1fr}.item-example-card.icon-only img{width:74px;height:74px}.reward-chip{padding:7px}.reward-icon{width:36px;height:36px;flex-basis:36px}.reward-inline{min-width:82px;padding:6px}.reward-inline-icon{width:34px;height:34px;flex-basis:34px}}
