:root{--bg:#090d18;--panel:#111a2b;--line:#24324a;--text:#edf3ff;--muted:#91a0ba;--a:#8b5cf6;--b:#22d3ee}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 0,#1c1b48 0,transparent 38%),var(--bg);color:var(--text);font:15px/1.6 Inter,system-ui,Segoe UI,sans-serif}a{color:#9ee9ff;text-decoration:none}h1{font-size:clamp(2rem,5vw,3.5rem);line-height:1.08;margin:.5rem 0}h2{margin:2rem 0 1rem}.wrap{width:min(1120px,92%);margin:42px auto}.nav{height:76px;padding:0 max(4%,calc((100% - 1120px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;background:#090d18d9;gap:16px}.nav div{display:flex;align-items:center;gap:18px}.brand{font-weight:900;letter-spacing:1.5px;color:white}.btn{display:inline-flex;justify-content:center;align-items:center;gap:12px;border:0;border-radius:12px;padding:13px 20px;color:white;background:linear-gradient(110deg,var(--a),#536dff,var(--b));font-weight:800;cursor:pointer;box-shadow:0 8px 28px #6555ff33}.btn.small{padding:9px 14px}.btn.secondary{background:#27364f;margin-top:10px}.hero{min-height:540px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:40px}.eyebrow{font-size:12px;letter-spacing:3px;color:#67e8f9;font-weight:800}.gradient{background:linear-gradient(90deg,#a78bfa,#67e8f9);color:transparent;background-clip:text}.muted,small{color:var(--muted)}.hero-art{min-height:360px;display:grid;place-items:center;position:relative}.orb{width:270px;height:270px;border-radius:50%;display:grid;place-items:center;font-size:120px;background:radial-gradient(circle at 35% 25%,#4c4b91,#171c38 65%);box-shadow:0 0 100px #7654ff55,inset 0 0 35px #a5f3fc33}.float-card{position:absolute;top:15%;right:0;background:#1c2942;border:1px solid #6577a0;border-radius:14px;padding:14px 18px;transform:rotate(5deg)}.float-card b{color:#67e8f9}.float-card.second{top:auto;bottom:15%;left:0;transform:rotate(-5deg)}.stats{display:flex;gap:35px;margin-top:40px}.stats div{display:grid}.stats b{font-size:25px}.stats small{font-size:12px}.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.game-card,.panel{background:linear-gradient(145deg,#151f33,#101727);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 12px 35px #0002}.game-card{display:flex;flex-direction:column;gap:7px;min-height:140px;color:var(--text);transition:.2s}.game-card:hover{transform:translateY(-4px);border-color:#8170ff}.game-emoji{font-size:34px}.play{color:#67e8f9;font-size:13px;margin-top:8px}.center{min-height:100vh;display:grid;place-items:center;padding:24px}.panel{width:min(100%,480px)}.install{width:min(100%,600px)}.panel h1{font-size:2rem;margin-top:20px}label{display:grid;gap:7px;margin:15px 0;color:#c8d4e9;font-size:13px}input{width:100%;padding:13px 14px;border-radius:10px;border:1px solid #34435e;background:#0b1322;color:white;outline:none}input:focus{border-color:#8b5cf6}form>.btn{width:100%;margin-top:12px}.alert,.notice{padding:13px 15px;border-radius:12px;background:#332239;border:1px solid #a855f7;margin:15px 0}.notice{background:#12313a;border-color:#0e7490}.balance{padding:22px;border-radius:18px;background:linear-gradient(120deg,#30235e,#12435a);display:grid;gap:5px;min-width:220px}.balance small{letter-spacing:1px}.balance strong{font-size:28px}.dash-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:55px 0}.coin{background:#222b43;padding:9px 12px;border-radius:12px}.section-title{display:flex;justify-content:space-between;align-items:center}.tx{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);gap:12px}.tx span{display:grid}.tx small{font-size:11px}.game-panel{text-align:center}.game-panel>a{display:block;text-align:left}.big{font-size:65px;margin-top:24px}.reels{font-size:38px;padding:35px 10px;margin:20px 0;border-radius:16px;background:#080e1b;border:1px solid #34435e}.chat-wrap{max-width:760px}.chat-list{width:100%;max-height:65vh;overflow:auto}.chat-msg{padding:12px;border-bottom:1px solid var(--line)}.chat-msg p{margin:4px 0}.chat-msg small{font-size:11px}.chat-form{display:flex;gap:10px;margin-top:15px}.chat-form .btn{width:auto;margin:0}table{width:100%;border-collapse:collapse;text-align:left}td,th{padding:12px;border-bottom:1px solid var(--line)}.table-scroll{overflow:auto}.admin-stats{background:#111a2b;padding:20px;border-radius:16px}footer{text-align:center;color:var(--muted);padding:45px 10px}@media(max-width:700px){.hero{grid-template-columns:1fr;padding-top:55px}.hero-art{min-height:270px}.orb{width:210px;height:210px;font-size:90px}.game-grid{grid-template-columns:repeat(2,1fr)}.dash-head{align-items:flex-start;flex-direction:column}.nav{height:auto;min-height:70px;flex-wrap:wrap;padding:14px 4%}.nav div{gap:10px;flex-wrap:wrap}.stats{gap:20px}.game-card{padding:15px}.chat-form{flex-direction:column}.chat-form .btn{width:100%}}@media(max-width:420px){.game-grid{grid-template-columns:1fr}.stats{justify-content:space-between}.stats b{font-size:21px}}

select{width:100%;padding:13px 14px;border-radius:10px;border:1px solid #34435e;background:#0b1322;color:white;outline:none}.wallet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.status{display:inline-block;padding:4px 9px;border-radius:20px;background:#28364d;font-size:12px}.status.pending{background:#59431a;color:#ffe2a1}.status.approved{background:#123f36;color:#8cf0c8}.status.rejected{background:#4a202c;color:#ffb4c4}.review-form{display:flex;gap:6px;min-width:170px}.review-form .btn{width:auto;margin:0}.btn.danger{background:linear-gradient(110deg,#a52c50,#6f2945)}.slot-machine{display:flex;justify-content:center;gap:10px;margin:25px auto;padding:20px;background:linear-gradient(145deg,#171e38,#090e1b);border:1px solid #59628b;border-radius:18px;max-width:390px;box-shadow:0 0 40px #7654ff22}.reel{display:grid;place-items:center;width:88px;height:100px;border-radius:12px;background:linear-gradient(180deg,#f7f8ff,#b7c5e8);color:#10172a;font-size:43px;box-shadow:inset 0 0 15px #38466b}.reel.spinning{animation:reelshake .12s infinite alternate}@keyframes reelshake{from{transform:translateY(-3px);filter:blur(1px)}to{transform:translateY(3px);filter:blur(2px)}}@media(max-width:700px){.wallet-grid{grid-template-columns:1fr}.review-form{flex-wrap:wrap}.reel{width:26%;height:82px;font-size:34px}}

/* ===== Neon Arcade landing page refresh ===== */
.landing-page{--ink:#f7f5ff;--muted2:#a6a2bd;position:relative;isolation:isolate;overflow:hidden;background:#080914;color:var(--ink);font-family:'DM Sans',Inter,system-ui,sans-serif}
.landing-page:before{content:"";position:absolute;inset:0;z-index:-3;pointer-events:none;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,#000 0%,transparent 65%)}
.ambient{position:absolute;z-index:-2;width:520px;height:520px;border-radius:50%;filter:blur(110px);opacity:.19;pointer-events:none}.ambient-one{background:#783bff;top:80px;left:-260px}.ambient-two{background:#00d9e8;top:300px;right:-330px}
.landing-nav{position:relative;z-index:5;height:86px;width:100%;padding:0 max(4%,calc((100% - 1180px)/2));border-bottom:1px solid #ffffff12;background:#080914c9;backdrop-filter:blur(18px)}
.brand{display:inline-flex;align-items:center;gap:9px;color:#fff;font:800 17px 'Space Grotesk',sans-serif;letter-spacing:1.2px}.brand>span:last-child{color:#a79bff}.brand-mark{display:grid;place-items:center;width:31px;height:31px;border-radius:10px;color:#fff;background:linear-gradient(135deg,#9b5cff,#4c5cff);box-shadow:0 0 22px #8b5cf677;font-size:18px}
.nav-links{display:flex;gap:32px;margin-left:auto;margin-right:34px}.nav-links a,.nav-login{color:#c3bfd6;font-size:13px;font-weight:700;transition:.2s}.nav-links a:hover,.nav-login:hover{color:#fff}.nav-actions{display:flex;align-items:center;gap:22px}.landing-nav .btn{border-radius:10px;padding:11px 17px;font-size:12px}
.landing-page .btn{display:inline-flex;align-items:center;justify-content:center;gap:17px;color:white;background:linear-gradient(110deg,#8855f6,#5d65f6 55%,#18b8d4);border:1px solid #ffffff25;border-radius:12px;font-weight:800;box-shadow:0 10px 35px #694bdb44;transition:transform .2s,box-shadow .2s}.landing-page .btn:hover{transform:translateY(-3px);box-shadow:0 15px 40px #694bdb66}.landing-page .btn span{font-size:17px}
.landing-hero{width:min(1180px,92%);min-height:690px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:35px;padding-top:55px;padding-bottom:65px}.hero-copy{position:relative;z-index:2;padding:20px 0}.hero-kicker,.section-kicker{display:inline-flex;align-items:center;gap:10px;color:#9e91ff;font-size:10px;font-weight:800;letter-spacing:2.5px}.live-dot{width:7px;height:7px;border-radius:50%;background:#4cf0c2;box-shadow:0 0 12px #4cf0c2}.landing-hero h1{font:700 clamp(54px,6.4vw,82px)/.99 'Space Grotesk',sans-serif;letter-spacing:-4px;margin:27px 0 24px}.hero-gradient{background:linear-gradient(95deg,#c5a4ff 0%,#8b8cff 48%,#4ce4ed 100%);color:transparent;background-clip:text;-webkit-background-clip:text}.hero-description{max-width:480px;color:#aaa7bf;font-size:15px;line-height:1.85;margin:0}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:32px}.btn-hero{padding:16px 21px;font-size:13px}.text-link{color:#e2def3;font-size:12px;font-weight:800}.text-link span,.text-link b{color:#8c8bff;margin-left:8px}.hero-proof{display:flex;align-items:center;gap:13px;margin-top:53px}.proof-avatars{display:flex;padding-left:3px}.proof-avatars i{display:grid;place-items:center;width:34px;height:34px;margin-left:-4px;border:2px solid #111022;border-radius:50%;background:#25213e;font-style:normal;font-size:15px}.hero-proof strong,.hero-proof small{display:block}.hero-proof strong{font-size:11px}.hero-proof small{font-size:10px;color:#77758f;margin-top:3px}
.hero-visual{height:530px;position:relative;display:grid;place-items:center;isolation:isolate}.visual-ring{position:absolute;border:1px solid #8e75ff30;border-radius:50%;transform:rotate(-20deg)}.ring-a{width:440px;height:440px}.ring-b{width:530px;height:300px;border-color:#4be4ed26;transform:rotate(35deg)}.arcade-glow{position:absolute;width:290px;height:330px;border-radius:50%;background:#7952ff;filter:blur(100px);opacity:.25}.arcade-machine{position:relative;z-index:1;width:270px;padding:17px 17px 13px;border:1px solid #ffffff48;border-radius:23px 23px 32px 32px;background:linear-gradient(145deg,#37305f,#17172e 55%,#10101f);box-shadow:inset 0 2px 2px #ffffff33,0 30px 80px #0009,0 0 65px #8260ff35;transform:perspective(900px) rotateY(-9deg) rotateX(3deg)}.machine-top{display:flex;justify-content:space-between;align-items:center;padding:2px 5px 13px;font:700 10px 'Space Grotesk';letter-spacing:1.5px;color:#c9c1ff}.machine-top b{color:#ffdc78;letter-spacing:3px}.machine-screen{padding:20px 13px 17px;text-align:center;border:2px solid #7772b2;border-radius:13px;background:radial-gradient(ellipse at 50% 0,#383a78,#0a1023 72%);box-shadow:inset 0 0 25px #4d8cff38,0 0 22px #8174ff22}.screen-label{font:700 9px 'Space Grotesk';letter-spacing:3px;color:#7df3f4}.screen-icons{display:flex;justify-content:center;gap:8px;margin:17px 0}.screen-icons span{display:grid;place-items:center;width:62px;height:69px;border:1px solid #ffffff35;border-radius:9px;background:linear-gradient(145deg,#ffffff1c,#ffffff05);font-size:34px;box-shadow:inset 0 0 15px #ffffff0c}.screen-line{height:2px;width:55%;margin:0 auto 12px;background:linear-gradient(90deg,transparent,#8c80ff,transparent)}.machine-screen small{font:700 8px 'Space Grotesk';letter-spacing:2px;color:#a8a2d6}.machine-controls{height:78px;display:flex;justify-content:center;align-items:center;gap:23px}.control-stick{position:relative;width:12px;height:36px;border-radius:8px;background:linear-gradient(90deg,#5b587e,#e1dcff,#5b587e);transform:rotate(13deg)}.control-stick i{position:absolute;width:27px;height:27px;left:-7px;top:-12px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff9ee8,#e343b6 70%);box-shadow:0 4px 10px #0008}.control-button{width:22px;height:22px;border-radius:50%;background:linear-gradient(145deg,#75f9ed,#12aebc);box-shadow:0 4px 0 #08727c,0 0 15px #1dd5d5aa}.control-button.pink{background:linear-gradient(145deg,#ff9de6,#e447a9);box-shadow:0 4px 0 #8e286a,0 0 15px #e447a988}.machine-base{text-align:center;padding:9px;border-top:1px solid #ffffff1b;color:#9b96bb;font:700 8px 'Space Grotesk';letter-spacing:3px}.machine-base b{color:#9d8bff;margin-left:6px}.orbit-tag{position:absolute;z-index:2;padding:12px 15px;border:1px solid #ffffff25;border-radius:12px;background:#19182de8;box-shadow:0 12px 35px #0005;color:#d9d4f2;font-size:9px;font-weight:800;letter-spacing:1px;backdrop-filter:blur(12px)}.orbit-tag span{margin-right:7px;color:#b6a0ff}.tag-top{top:82px;right:-4px;transform:rotate(5deg)}.tag-bottom{bottom:83px;left:-5px;transform:rotate(-5deg)}.spark{position:absolute;color:#a99aff;text-shadow:0 0 20px #a99aff;font-size:28px}.spark-one{top:75px;left:75px}.spark-two{right:45px;bottom:90px;color:#4ce4ed}.spark-three{left:55px;bottom:130px;font-size:16px}
.ticker{overflow:hidden;border-top:1px solid #ffffff12;border-bottom:1px solid #ffffff12;background:#ffffff05}.ticker-track{display:flex;justify-content:space-around;gap:55px;min-width:850px;padding:17px 20px;color:#a7a0ca;font:700 10px 'Space Grotesk';letter-spacing:2px}.ticker-track span:nth-child(even){color:#56dfe6}
.games-section{width:min(1180px,92%);margin:125px auto 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:36px}.section-heading h2,.about-card h2{font:700 clamp(34px,4vw,48px)/1.1 'Space Grotesk';letter-spacing:-1.8px;margin:13px 0 0}.section-heading>p{max-width:330px;margin:0 0 5px;color:#9692ac;font-size:13px;line-height:1.8}.landing-game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.landing-game-card{position:relative;min-height:190px;overflow:hidden;padding:22px;border:1px solid #ffffff14;border-radius:17px;background:linear-gradient(145deg,#1b1a34,#10111f 75%);box-shadow:0 15px 35px #0002;transition:.25s}.landing-game-card:before{content:"";position:absolute;width:150px;height:150px;right:-45px;top:-50px;border-radius:50%;background:var(--card-glow,#8057ed);filter:blur(65px);opacity:.23;transition:.25s}.landing-game-card:hover{transform:translateY(-6px);border-color:#a493ff66;box-shadow:0 18px 45px #0005}.landing-game-card:hover:before{opacity:.48}.game-tone-0{--card-glow:#8c5dff}.game-tone-1{--card-glow:#ff6a9c}.game-tone-2{--card-glow:#ffb84d}.game-tone-3{--card-glow:#6a9bff}.game-tone-4{--card-glow:#55e5df}.game-tone-5{--card-glow:#bc77ff}.game-card-number{position:absolute;top:18px;right:20px;color:#696582;font:700 10px 'Space Grotesk';letter-spacing:1px}.game-art-icon{position:relative;display:grid;place-items:center;width:65px;height:65px;border:1px solid #ffffff19;border-radius:17px;background:linear-gradient(145deg,#ffffff17,#ffffff04);font-size:34px;box-shadow:inset 0 1px #ffffff18}.game-card-info{position:relative;display:flex;flex-direction:column;gap:6px;margin-top:25px}.game-card-info strong{font:700 16px 'Space Grotesk';color:#f4f1ff}.game-card-info small{display:flex;justify-content:space-between;color:#88849f;font-size:10px}.game-card-info small span{color:#9e91ff}.games-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:24px;padding-top:18px;border-top:1px solid #ffffff12}.games-bottom>span{font-size:9px;font-weight:800;letter-spacing:2px;color:#77738f}
.about-section{width:min(1180px,92%);margin:110px auto 80px}.about-card{display:flex;align-items:center;gap:27px;padding:38px 42px;border:1px solid #ffffff1a;border-radius:22px;background:radial-gradient(ellipse at 0 0,#39306b66,transparent 60%),linear-gradient(120deg,#17172c,#111321);box-shadow:0 25px 60px #0003}.about-symbol{flex:0 0 64px;display:grid;place-items:center;width:64px;height:64px;border-radius:19px;background:linear-gradient(145deg,#a06aff,#555ff2);box-shadow:0 0 35px #8665ff55;font-size:30px}.about-card>div:nth-child(2){flex:1}.about-card h2{font-size:29px;margin:8px 0}.about-card p{max-width:650px;margin:0;color:#a29db8;font-size:12px;line-height:1.8}.about-card>.btn{white-space:nowrap;padding:14px 17px;font-size:11px}.landing-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:27px max(4%,calc((100% - 1180px)/2));border-top:1px solid #ffffff12}.landing-footer .brand{font-size:13px}.landing-footer .brand-mark{width:25px;height:25px;font-size:14px}.landing-footer p{margin:0;color:#77738e;font-size:10px}.landing-footer>a:last-child{color:#aaa5c1;font-size:10px;font-weight:700}
@media(max-width:850px){.landing-hero{min-height:0;grid-template-columns:1fr;gap:0;padding-top:75px}.hero-copy{text-align:center}.hero-description{margin:auto}.hero-actions,.hero-proof{justify-content:center}.hero-visual{height:480px;margin-top:10px}.section-heading{align-items:start;flex-direction:column}.section-heading>p{max-width:520px}.about-card{flex-wrap:wrap}.about-card>.btn{margin-left:90px}}
@media(max-width:600px){.landing-nav{height:auto;min-height:72px;padding:13px 4%;gap:12px}.landing-nav .brand{font-size:14px}.nav-links{display:none}.nav-actions{gap:13px;margin-left:auto}.nav-login{font-size:11px}.landing-nav .btn{padding:9px 11px;font-size:10px}.landing-hero{padding-top:57px;padding-bottom:35px}.landing-hero h1{font-size:clamp(48px,13vw,66px);letter-spacing:-2.8px}.hero-description{font-size:13px}.hero-actions{gap:18px;flex-wrap:wrap}.hero-proof{margin-top:37px}.hero-visual{height:405px;transform:scale(.9);margin:-4px -20px}.ring-a{width:350px;height:350px}.ring-b{width:420px;height:250px}.arcade-machine{transform:scale(.88) perspective(900px) rotateY(-9deg) rotateX(3deg)}.tag-top{right:-2px;top:53px}.tag-bottom{left:-4px;bottom:48px}.ticker-track{gap:30px}.games-section{margin-top:78px}.landing-game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.landing-game-card{min-height:160px;padding:15px}.game-art-icon{width:54px;height:54px;font-size:28px}.game-card-info{margin-top:20px}.game-card-info strong{font-size:13px}.games-bottom>span{font-size:8px}.about-section{margin:75px auto 55px}.about-card{padding:25px 22px;gap:17px}.about-symbol{width:48px;height:48px;flex-basis:48px;border-radius:14px;font-size:23px}.about-card h2{font-size:24px}.about-card p{font-size:11px}.about-card>.btn{margin:5px 0 0;width:100%}.landing-footer{flex-wrap:wrap;justify-content:center;text-align:center;padding:24px 5%}.landing-footer p{order:3;width:100%}}
@media(max-width:380px){.landing-game-grid{grid-template-columns:1fr}.hero-visual{transform:scale(.8);margin:-25px -35px}.landing-nav .brand{font-size:12px}.nav-actions{gap:9px}}


/* =========================================================
   NEON ARCADE — CLEAN LANDING PAGE OVERRIDES
   Tempelkan sebagai bagian akhir assets/style.css
   ========================================================= */
.landing-page{
  min-height:100vh;
  overflow-x:hidden;
  overflow-y:visible;
  background:#080914;
  color:#f7f5ff;
}
.landing-page *{box-sizing:border-box}
.landing-page .landing-nav{
  position:sticky;top:0;z-index:50;
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;gap:24px;
  width:100%;height:78px;min-height:78px;
  padding:0 max(5%,calc((100% - 1160px)/2));
  background:rgba(8,9,20,.88);
  border-bottom:1px solid rgba(255,255,255,.09);
  backdrop-filter:blur(18px);
}
.landing-page .landing-nav > .brand{justify-self:start;white-space:nowrap}
.landing-page .landing-nav .nav-links{
  display:flex;align-items:center;justify-content:center;
  gap:30px;margin:0;
}
.landing-page .landing-nav .nav-actions{
  display:flex;align-items:center;justify-content:flex-end;
  gap:18px;margin:0;
}
.landing-page .landing-nav a{white-space:nowrap}
.landing-page .landing-hero{
  width:min(1160px,90%);
  min-height:650px;margin:0 auto;
  padding:70px 0 65px;
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  align-items:center;gap:36px;
}
.landing-page .hero-copy{min-width:0;padding:0}
.landing-page .landing-hero h1{
  max-width:650px;margin:25px 0 22px;
  font-size:clamp(48px,5.5vw,76px);
  line-height:1.02;letter-spacing:-3.5px;
  overflow-wrap:normal;
}
.landing-page .hero-description{max-width:490px}
.landing-page .hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.landing-page .hero-visual{
  width:100%;height:500px;min-width:0;
  display:grid;place-items:center;position:relative;
}
.landing-page .arcade-machine{width:min(270px,70%);max-width:270px}
.landing-page .ticker{width:100%;margin:0}
.landing-page .ticker-track{
  width:max-content;min-width:100%;
  justify-content:flex-start;gap:58px;
}
.landing-page .games-section,
.landing-page .about-section{
  width:min(1160px,90%);
}
.landing-page .games-section{margin:105px auto 0}
.landing-page .section-heading{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:32px;margin-bottom:32px;
}
.landing-page .section-heading h2{
  font-size:clamp(34px,4vw,48px);
  line-height:1.12;letter-spacing:-1.7px;
}
.landing-page .section-heading > p{max-width:350px}
.landing-page .landing-game-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.landing-page .landing-game-card{
  display:flex;flex-direction:column;align-items:flex-start;
  min-width:0;min-height:185px;padding:22px;
  text-decoration:none;
}
.landing-page .game-card-info{width:100%;min-width:0}
.landing-page .game-card-info strong{
  display:block;max-width:100%;overflow-wrap:anywhere;
}
.landing-page .about-section{margin:100px auto 75px}
.landing-page .about-card{
  display:grid;grid-template-columns:64px minmax(0,1fr) auto;
  align-items:center;gap:26px;padding:36px;
}
.landing-page .about-card > div:nth-child(2){min-width:0}
.landing-page .about-card > .btn{margin:0;white-space:nowrap}
.landing-page .landing-footer{
  display:flex;align-items:center;justify-content:space-between;
  gap:22px;flex-wrap:wrap;
  padding:25px max(5%,calc((100% - 1160px)/2));
}
.landing-page .landing-footer p{flex:1;text-align:center}
.landing-page .landing-footer > a:last-child{white-space:nowrap}

/* Tablet */
@media(max-width:900px){
  .landing-page .landing-nav{grid-template-columns:1fr auto;padding:0 5%}
  .landing-page .landing-nav .nav-links{display:none}
  .landing-page .landing-hero{
    min-height:0;grid-template-columns:1fr;
    gap:8px;padding:65px 0 40px;
  }
  .landing-page .hero-copy{text-align:center}
  .landing-page .hero-description{margin:0 auto}
  .landing-page .hero-actions,.landing-page .hero-proof{justify-content:center}
  .landing-page .hero-visual{height:440px}
  .landing-page .section-heading{align-items:flex-start;flex-direction:column}
  .landing-page .section-heading > p{max-width:600px}
  .landing-page .about-card{grid-template-columns:56px minmax(0,1fr)}
  .landing-page .about-card > .btn{grid-column:2;justify-self:start}
}
@media(max-width:620px){
  .landing-page .landing-nav{
    height:auto;min-height:70px;padding:12px 5%;
    gap:12px;
  }
  .landing-page .landing-nav .brand{font-size:13px}
  .landing-page .landing-nav .nav-actions{gap:12px}
  .landing-page .landing-nav .nav-login{font-size:11px}
  .landing-page .landing-nav .btn{padding:9px 12px;font-size:10px}
  .landing-page .landing-hero{width:90%;padding-top:52px}
  .landing-page .landing-hero h1{
    font-size:clamp(43px,12vw,62px);
    letter-spacing:-2.5px;
  }
  .landing-page .hero-description{font-size:13px}
  .landing-page .hero-actions{gap:16px}
  .landing-page .hero-visual{
    height:370px;margin:0 -18px;width:calc(100% + 36px);
  }
  .landing-page .ring-a{width:310px;height:310px}
  .landing-page .ring-b{width:360px;height:220px}
  .landing-page .arcade-machine{transform:scale(.86) perspective(900px) rotateY(-7deg) rotateX(2deg)}
  .landing-page .tag-top{top:35px;right:0}
  .landing-page .tag-bottom{bottom:35px;left:0}
  .landing-page .ticker-track{gap:30px;padding:14px 16px}
  .landing-page .games-section{margin-top:72px}
  .landing-page .landing-game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
  .landing-page .landing-game-card{min-height:155px;padding:15px}
  .landing-page .game-art-icon{width:52px;height:52px;font-size:27px}
  .landing-page .game-card-info{margin-top:18px}
  .landing-page .game-card-info strong{font-size:13px}
  .landing-page .games-bottom{gap:12px;flex-wrap:wrap}
  .landing-page .games-bottom > span{font-size:8px}
  .landing-page .about-section{margin:70px auto 50px}
  .landing-page .about-card{
    grid-template-columns:46px minmax(0,1fr);
    gap:15px;padding:23px 19px;
  }
  .landing-page .about-symbol{
    width:46px;height:46px;flex-basis:46px;
    border-radius:13px;font-size:22px;
  }
  .landing-page .about-card h2{font-size:23px}
  .landing-page .about-card p{font-size:11px}
  .landing-page .about-card > .btn{
    grid-column:1/-1;width:100%;justify-self:stretch;
  }
  .landing-page .landing-footer{
    justify-content:center;text-align:center;padding:23px 5%;
  }
  .landing-page .landing-footer p{order:3;flex-basis:100%}
}
@media(max-width:390px){
  .landing-page .landing-nav .brand{font-size:11px;gap:6px}
  .landing-page .landing-nav .brand-mark{width:26px;height:26px}
  .landing-page .landing-nav .nav-actions{gap:8px}
  .landing-page .landing-nav .btn{padding:8px 9px}
  .landing-page .landing-game-grid{grid-template-columns:1fr}
  .landing-page .landing-game-card{min-height:140px}
  .landing-page .hero-visual{transform:scale(.88);margin:-15px -25px;width:calc(100% + 50px)}
}


/* =========================================================
   NEON ARCADE — DASHBOARD THEME
   Tambahkan di BAGIAN PALING AKHIR assets/style.css
   ========================================================= */
.arcade-dashboard{
  --dash-text:#f7f5ff;--dash-muted:#9d9ab5;
  position:relative;isolation:isolate;min-height:100vh;
  overflow-x:hidden;background:#080914;color:var(--dash-text);
  font-family:'DM Sans',Inter,system-ui,sans-serif;
}
.arcade-dashboard:before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background-image:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px);
  background-size:56px 56px;mask-image:linear-gradient(#000,transparent 75%);
}
.dash-ambient{position:absolute;z-index:-2;width:430px;height:430px;border-radius:50%;filter:blur(110px);opacity:.17;pointer-events:none}
.dash-ambient-one{top:60px;left:-240px;background:#814dff}
.dash-ambient-two{top:400px;right:-270px;background:#00d8e8}
.arcade-dashboard .dash-nav{
  position:sticky;top:0;z-index:50;width:100%;height:76px;min-height:76px;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:22px;
  padding:0 max(5%,calc((100% - 1160px)/2));
  background:rgba(8,9,20,.88);border-bottom:1px solid #ffffff12;
  backdrop-filter:blur(18px);
}
.arcade-dashboard .brand{display:inline-flex;align-items:center;gap:9px;color:#fff;font:800 16px 'Space Grotesk',sans-serif;letter-spacing:1px;white-space:nowrap}
.arcade-dashboard .brand>span:last-child{color:#a79bff}
.arcade-dashboard .brand-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#9b5cff,#4c5cff);box-shadow:0 0 20px #8b5cf677}
.dash-nav-links{display:flex;align-items:center;gap:25px}
.dash-nav-links a{color:#9996b0;font-size:12px;font-weight:700;transition:.2s}
.dash-nav-links a:hover,.dash-nav-links a.active{color:#fff}
.dash-nav-links a.active{position:relative}
.dash-nav-links a.active:after{content:"";position:absolute;left:0;right:0;bottom:-29px;height:2px;background:#9b85ff;box-shadow:0 0 12px #9b85ff}
.dash-nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:17px}
.nav-coin{padding:9px 13px;border:1px solid #ffffff19;border-radius:10px;background:#ffffff08;color:#f4e9a8;font-size:12px;font-weight:800;white-space:nowrap}
.dash-logout{color:#aaa6c0;font-size:12px;font-weight:700;white-space:nowrap}
.dash-logout:hover{color:#fff}
.dash-wrap{width:min(1160px,90%);margin:0 auto}
.dash-notice{margin:22px 0 0;padding:13px 16px;border:1px solid #2b9f8c66;border-radius:12px;background:#12352f;color:#a5f4d5;font-size:13px}
.welcome-panel{
  position:relative;isolation:isolate;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  align-items:center;gap:35px;margin:42px 0 76px;padding:45px 48px;
  border:1px solid #ffffff1a;border-radius:25px;
  background:radial-gradient(ellipse at 5% 0,#573b9a66,transparent 52%),radial-gradient(ellipse at 100% 100%,#126b7a55,transparent 48%),linear-gradient(120deg,#17172d,#101322);
  box-shadow:0 25px 75px #0004;
}
.welcome-copy,.welcome-side{position:relative;z-index:2;min-width:0}
.dash-kicker{display:inline-flex;align-items:center;gap:9px;color:#a99aff;font-size:9px;font-weight:800;letter-spacing:2px}
.dash-kicker i{width:7px;height:7px;border-radius:50%;background:#4cf0c2;box-shadow:0 0 12px #4cf0c2}
.welcome-copy h1{margin:18px 0 12px;font:700 clamp(35px,4vw,53px)/1.08 'Space Grotesk',sans-serif;letter-spacing:-2px}
.welcome-copy h1 span,.dash-section-heading h2 span{background:linear-gradient(95deg,#c5a4ff,#4ce4ed);color:transparent;background-clip:text;-webkit-background-clip:text}
.welcome-copy>p{max-width:490px;margin:0;color:#aaa7bf;font-size:13px;line-height:1.8}
.dash-primary-btn{display:inline-flex;align-items:center;gap:22px;margin-top:25px;padding:13px 18px;border:1px solid #ffffff24;border-radius:11px;background:linear-gradient(110deg,#8855f6,#5d65f6 55%,#18b8d4);box-shadow:0 10px 30px #694bdb44;color:white;font-size:12px;font-weight:800;transition:.2s}
.dash-primary-btn:hover{transform:translateY(-3px);box-shadow:0 15px 35px #694bdb66}
.welcome-side{display:grid;gap:13px}
.coin-card{padding:22px 23px;border:1px solid #ffffff25;border-radius:17px;background:linear-gradient(145deg,#29244bdf,#111d31ed);box-shadow:0 15px 35px #0003}
.coin-card-top{display:flex;align-items:center;justify-content:space-between;color:#aaa5c4;font-size:9px;font-weight:800;letter-spacing:1.5px}
.coin-symbol{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#a78bfa22;color:#c4b5fd;font-size:15px}
.coin-card>strong{display:block;margin:13px 0 3px;font:700 clamp(27px,3vw,36px) 'Space Grotesk',sans-serif;color:#fff}
.coin-card>small{display:block;color:#9692ad;font-size:10px}
.coin-card>a{display:inline-flex;gap:12px;margin-top:16px;color:#a99aff;font-size:11px;font-weight:800}
.welcome-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.welcome-mini-stats>div{display:grid;gap:3px;padding:12px 10px;border:1px solid #ffffff12;border-radius:12px;background:#ffffff08}
.welcome-mini-stats strong{font:700 18px 'Space Grotesk';color:#e8e3ff}
.welcome-mini-stats span{color:#89859f;font-size:9px}
.welcome-decoration{position:absolute;z-index:1;color:#b4a2ff66;text-shadow:0 0 24px #9d7bff;font-size:38px}
.decoration-one{right:43%;top:25px}
.decoration-two{right:25px;bottom:20px;color:#4ce4ed66}
.dash-games-section{margin:0 0 85px}
.dash-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:27px}
.dash-section-heading h2{margin:9px 0 6px;font:700 clamp(29px,3.5vw,41px)/1.12 'Space Grotesk';letter-spacing:-1.5px}
.dash-section-heading p{margin:0;color:#9692ac;font-size:12px;line-height:1.7}
.game-count-pill{padding:8px 11px;border:1px solid #ffffff17;border-radius:9px;background:#ffffff08;color:#aaa5c4;font-size:9px;font-weight:800;letter-spacing:1px;white-space:nowrap}
.dash-game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.dash-game-card{
  --game-glow:#8c5dff;position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;align-items:flex-start;min-width:0;min-height:175px;
  padding:20px;border:1px solid #ffffff15;border-radius:17px;
  background:linear-gradient(145deg,#1b1a34,#10111f 78%);
  box-shadow:0 12px 32px #0002;text-decoration:none;color:#f4f1ff;transition:.23s;
}
.dash-game-card:before{content:"";position:absolute;z-index:-1;width:140px;height:140px;right:-48px;top:-55px;border-radius:50%;background:var(--game-glow);filter:blur(60px);opacity:.24;transition:.23s}
.dash-game-card:hover{transform:translateY(-5px);border-color:#a493ff77;box-shadow:0 18px 42px #0005}
.dash-game-card:hover:before{opacity:.5}
.dash-tone-0{--game-glow:#8c5dff}.dash-tone-1{--game-glow:#ff6a9c}.dash-tone-2{--game-glow:#ffb84d}.dash-tone-3{--game-glow:#6a9bff}.dash-tone-4{--game-glow:#55e5df}.dash-tone-5{--game-glow:#bc77ff}
.dash-game-number{position:absolute;top:17px;right:18px;color:#706b89;font:700 10px 'Space Grotesk';letter-spacing:1px}
.dash-game-icon{display:grid;place-items:center;width:59px;height:59px;border:1px solid #ffffff1a;border-radius:15px;background:linear-gradient(145deg,#ffffff19,#ffffff05);font-size:31px}
.dash-game-content{display:flex;flex-direction:column;gap:5px;margin-top:19px}
.dash-game-content strong{font:700 14px 'Space Grotesk';overflow-wrap:anywhere}
.dash-game-content small{color:#89859f;font-size:10px}
.dash-game-content small b{margin-left:7px;color:#a99aff}
.dash-game-arrow{position:absolute;right:19px;bottom:19px;color:#9c8cff;font-size:16px;opacity:0;transform:translateX(-5px);transition:.2s}
.dash-game-card:hover .dash-game-arrow{opacity:1;transform:translateX(0)}
.dash-empty{display:grid;justify-items:center;gap:7px;padding:38px 18px;border:1px dashed #ffffff24;border-radius:16px;background:#ffffff05;text-align:center}
.dash-empty>span{font-size:31px}
.dash-empty strong{font:700 14px 'Space Grotesk'}
.dash-empty p{margin:0;color:#9692ac;font-size:11px}
.dash-activity-section{margin-bottom:85px}
.activity-heading{margin-bottom:22px}
.dash-subtle-link{color:#aaa3d2;font-size:11px;font-weight:800;white-space:nowrap}
.activity-panel{padding:5px 22px;border:1px solid #ffffff15;border-radius:18px;background:linear-gradient(145deg,#151629,#10111e);box-shadow:0 15px 40px #0002}
.activity-row{display:flex;align-items:center;gap:14px;padding:16px 2px;border-bottom:1px solid #ffffff0d}
.activity-row:last-child{border-bottom:0}
.activity-icon{display:grid;place-items:center;flex:0 0 37px;width:37px;height:37px;border:1px solid #ffffff13;border-radius:12px;background:#ffffff08;color:#9e91ff;font-size:17px}
.activity-description{display:grid;flex:1;min-width:0;gap:4px}
.activity-description strong{overflow:hidden;color:#e9e5f7;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.activity-description small{color:#77738e;font-size:10px}
.activity-amount{display:grid;justify-items:end;font:700 13px 'Space Grotesk';white-space:nowrap}
.activity-amount small{font:500 9px 'DM Sans';color:#85819b}
.activity-amount.positive{color:#68e6bb}.activity-amount.negative{color:#ff8ca8}
.activity-empty{border:0;background:transparent}
.dash-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px max(5%,calc((100% - 1160px)/2));border-top:1px solid #ffffff12}
.dash-footer .brand{font-size:13px}
.dash-footer .brand-mark{width:25px;height:25px;font-size:14px}
.dash-footer p{margin:0;color:#77738e;font-size:10px;text-align:center}
.dash-footer>a:last-child{color:#aaa5c1;font-size:10px;font-weight:700;white-space:nowrap}
@media(max-width:900px){
  .arcade-dashboard .dash-nav{grid-template-columns:1fr auto;padding:0 5%}
  .dash-nav-links{display:none}
  .welcome-panel{grid-template-columns:1fr;gap:27px;padding:35px}
  .welcome-copy{text-align:center}
  .welcome-copy>p{margin:auto}
  .dash-primary-btn{margin-top:20px}
  .welcome-side{width:min(100%,520px);margin:auto}
  .dash-game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .arcade-dashboard .dash-nav{height:auto;min-height:68px;padding:11px 5%;gap:8px}
  .arcade-dashboard .brand{font-size:12px;gap:6px}
  .arcade-dashboard .brand-mark{width:26px;height:26px}
  .dash-nav-actions{gap:8px}
  .nav-coin{padding:8px 9px;font-size:10px}
  .dash-logout{font-size:10px}
  .dash-wrap{width:90%}
  .welcome-panel{margin:25px 0 58px;padding:27px 19px;border-radius:19px}
  .welcome-copy h1{font-size:36px;letter-spacing:-1.5px}
  .welcome-copy>p{font-size:12px}
  .coin-card{padding:18px}
  .welcome-mini-stats{gap:6px}
  .welcome-mini-stats>div{padding:10px 7px}
  .welcome-mini-stats strong{font-size:16px}
  .welcome-mini-stats span{font-size:8px}
  .dash-games-section{margin-bottom:65px}
  .dash-section-heading{align-items:flex-start;flex-direction:column;gap:12px}
  .dash-section-heading h2{font-size:30px}
  .dash-game-grid{gap:10px}
  .dash-game-card{min-height:155px;padding:14px}
  .dash-game-icon{width:51px;height:51px;font-size:27px}
  .dash-game-content{margin-top:17px}
  .dash-game-content strong{font-size:12px}
  .dash-game-arrow{right:13px;bottom:13px}
  .dash-activity-section{margin-bottom:60px}
  .activity-panel{padding:4px 13px}
  .activity-row{gap:10px;padding:13px 0}
  .activity-icon{flex-basis:33px;width:33px;height:33px}
  .activity-description strong{font-size:11px}
  .activity-description small{font-size:9px}
  .activity-amount{font-size:11px}
  .dash-footer{justify-content:center;flex-wrap:wrap;text-align:center;padding:22px 5%}
  .dash-footer p{flex-basis:100%;order:3}
}
@media(max-width:380px){
  .dash-game-grid{grid-template-columns:1fr}
  .dash-game-card{min-height:135px}
  .welcome-copy h1{font-size:32px}
}

/* ===== NEON ARCADE COMMUNITY CHAT ===== */
.chat-page {
    min-height: 100vh;
    background:
        radial-gradient(ellipse at 12% 8%, rgba(112, 67, 255, .16), transparent 34%),
        radial-gradient(ellipse at 90% 28%, rgba(0, 224, 255, .10), transparent 32%),
        #090b16;
    color: #f4f5ff;
}
.chat-page .chat-nav {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px max(22px, calc((100% - 1180px) / 2));
    background: rgba(9, 11, 22, .82);
    border-bottom: 1px solid rgba(151, 137, 255, .16);
    backdrop-filter: blur(18px);
}
.chat-page .brand {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #fff;
    font-weight: 900;
    letter-spacing: .08em;
    text-decoration: none;
}
.chat-page .brand-mark { color: #9d83ff; font-size: 22px; }
.chat-nav-links { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.chat-nav-links a {
    padding: 9px 13px;
    border-radius: 10px;
    color: #aeb2ca;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition: .2s ease;
}
.chat-nav-links a:hover, .chat-nav-links a.active {
    color: #fff;
    background: rgba(139, 108, 255, .16);
}
.chat-shell { max-width: 1040px; padding-top: 48px; padding-bottom: 42px; }
.chat-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 25px;
}
.chat-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #9b8aff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .18em;
}
.online-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: #45edb0;
    box-shadow: 0 0 12px rgba(69, 237, 176, .8);
}
.chat-heading h1 { margin: 10px 0 7px; font-size: clamp(32px, 5vw, 48px); line-height: 1.05; letter-spacing: -.04em; }
.chat-heading h1 span {
    color: #9d83ff;
    text-shadow: 0 0 28px rgba(157, 131, 255, .3);
}
.chat-heading p { margin: 0; color: #969bb5; font-size: 14px; }
.chat-back-link { color: #b9b2ff; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.chat-back-link:hover { color: #fff; }
.chat-panel {
    overflow: hidden;
    border: 1px solid rgba(153, 139, 255, .2);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(24, 27, 49, .96), rgba(13, 16, 31, .98));
    box-shadow: 0 24px 80px rgba(0, 0, 0, .28), 0 0 50px rgba(100, 72, 220, .08);
}
.chat-panel-head {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 19px 23px;
    border-bottom: 1px solid rgba(153, 139, 255, .13);
    background: rgba(255, 255, 255, .018);
}
.chat-room-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(157, 131, 255, .3);
    border-radius: 13px;
    background: rgba(133, 105, 255, .13);
    color: #b6a5ff;
    font-size: 21px;
}
.chat-panel-head h2 { margin: 0 0 4px; font-size: 15px; }
.chat-panel-head p { margin: 0; color: #858ba8; font-size: 12px; }
.chat-live-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    padding: 7px 10px;
    border: 1px solid rgba(69, 237, 176, .18);
    border-radius: 999px;
    background: rgba(69, 237, 176, .06);
    color: #78e9bf;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em;
}
.chat-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
    height: min(56vh, 570px);
    min-height: 320px;
    overflow-y: auto;
    padding: 25px clamp(16px, 4vw, 34px);
    scrollbar-width: thin;
    scrollbar-color: rgba(150, 128, 255, .45) transparent;
}
.chat-msg { display: flex; align-items: flex-start; gap: 11px; max-width: 82%; }
.chat-msg.mine { align-self: flex-end; flex-direction: row-reverse; }
.chat-avatar {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 1px solid rgba(157, 131, 255, .3);
    border-radius: 11px;
    background: linear-gradient(135deg, rgba(133, 105, 255, .28), rgba(0, 216, 255, .12));
    color: #d9d0ff;
    font-size: 13px;
    font-weight: 900;
}
.chat-msg-content { min-width: 0; }
.chat-msg-meta { display: flex; align-items: center; gap: 10px; margin: 1px 2px 7px; }
.chat-msg-meta b { color: #d9d5ff; font-size: 12px; }
.chat-msg-meta time { color: #707793; font-size: 10px; }
.chat-bubble {
    padding: 11px 14px;
    border: 1px solid rgba(143, 130, 255, .15);
    border-radius: 4px 15px 15px 15px;
    background: rgba(255, 255, 255, .045);
    color: #e5e7f5;
    font-size: 13px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}
.chat-msg.mine .chat-bubble {
    border-color: rgba(0, 215, 255, .2);
    border-radius: 15px 4px 15px 15px;
    background: linear-gradient(135deg, rgba(105, 79, 220, .23), rgba(0, 190, 220, .10));
}
.chat-msg.mine .chat-msg-meta { justify-content: flex-end; }
.chat-msg.mine .chat-avatar { border-color: rgba(0, 215, 255, .25); }
.chat-empty { display: grid; place-content: center; justify-items: center; flex: 1; text-align: center; }
.chat-empty-icon { color: #9c84ff; font-size: 38px; text-shadow: 0 0 25px rgba(156, 132, 255, .55); }
.chat-empty h3 { margin: 12px 0 5px; font-size: 17px; }
.chat-empty p { margin: 0; color: #858ba8; font-size: 13px; }
.chat-error {
    margin: 0 22px 14px;
    padding: 10px 13px;
    border: 1px solid rgba(255, 100, 130, .25);
    border-radius: 10px;
    background: rgba(255, 80, 110, .08);
    color: #ff9eaf;
    font-size: 12px;
}
.chat-form {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 17px 20px;
    border-top: 1px solid rgba(153, 139, 255, .13);
    background: rgba(5, 7, 17, .35);
}
.chat-form input[name="message"] {
    min-width: 0;
    flex: 1;
    height: 48px;
    padding: 0 16px;
    border: 1px solid rgba(153, 139, 255, .2);
    border-radius: 13px;
    outline: none;
    background: rgba(255, 255, 255, .045);
    color: #fff;
    font: inherit;
    font-size: 13px;
    transition: .2s ease;
}
.chat-form input[name="message"]::placeholder { color: #737a98; }
.chat-form input[name="message"]:focus {
    border-color: rgba(157, 131, 255, .7);
    box-shadow: 0 0 0 3px rgba(157, 131, 255, .1);
}
.chat-char-count { color: #737a98; font-size: 10px; white-space: nowrap; }
.chat-send-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 104px;
    height: 46px;
    border: 0;
    border-radius: 12px;
    background: linear-gradient(110deg, #7959ed, #4c9dff);
    color: #fff;
    font-weight: 800;
    box-shadow: 0 8px 25px rgba(105, 91, 230, .22);
    cursor: pointer;
}
.chat-send-btn:hover { filter: brightness(1.12); transform: translateY(-1px); }
.chat-footnote { margin: 15px 3px 0; color: #737a98; font-size: 11px; text-align: center; }
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
@media (max-width: 680px) {
    .chat-page .chat-nav { align-items: flex-start; flex-direction: column; padding: 13px 18px; }
    .chat-nav-links { width: 100%; gap: 3px; }
    .chat-nav-links a { padding: 8px 10px; font-size: 12px; }
    .chat-shell { padding: 30px 15px; }
    .chat-heading { align-items: flex-start; flex-direction: column; }
    .chat-heading h1 { font-size: 36px; }
    .chat-panel { border-radius: 17px; }
    .chat-panel-head { padding: 15px; }
    .chat-list { height: 55vh; min-height: 280px; padding: 20px 13px; }
    .chat-msg { max-width: 94%; }
    .chat-form { flex-wrap: wrap; gap: 9px; padding: 13px; }
    .chat-form input[name="message"] { flex-basis: 100%; }
    .chat-char-count { margin-right: auto; }
    .chat-send-btn { min-width: 88px; }
}