:root{--bg:#090512;--panel:#17102b;--panel2:#24143c;--gold:#ffd34f;--purple:#762bd1;--line:#44305e;--text:#f8f5ff;--muted:#b8abc9}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% -15%,#321953,transparent 42%),var(--bg);color:var(--text);font:15px Inter,system-ui,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid #ffffff18;gap:20px}.brand{font-weight:900;font-size:22px}.brand span,footer .brand span{color:var(--gold)}nav{display:flex;gap:25px;color:#ded3eb;font-size:13px}.actions{display:flex;align-items:center;gap:14px}.actions a:first-child{background:#24173b;border:1px solid var(--line);padding:8px 12px;border-radius:22px;color:var(--gold)}button,.btn{border:1px solid var(--line);background:#211438;color:white;padding:10px 15px;border-radius:11px;display:inline-block;cursor:pointer;font-weight:750;font-size:12px}button:disabled{opacity:.5;cursor:not-allowed}.gold{background:linear-gradient(135deg,#ffe47a,#efb51b);color:#271800;border:0}main{max-width:1200px;margin:auto;padding:28px 5% 60px}.page{display:none}.page:target{display:block}body:not(:has(.page:target)) #home{display:block}h1{font-size:34px;line-height:1.12;margin:8px 0}h2{font-size:23px;margin:35px 0 16px}p{color:var(--muted)}small{color:var(--muted)}.hero{min-height:310px;padding:42px 5%;border-radius:25px;border:1px solid #8050ae;background:radial-gradient(circle at 80% 45%,#7133a7,#32184f 55%,#21103c);display:flex;align-items:center;justify-content:space-between}.hero h1{font-size:clamp(36px,5vw,58px);letter-spacing:-2px}.hero h1 em{color:var(--gold);font-style:normal}.hero p{max-width:450px}.hero small{color:var(--gold);letter-spacing:2px}.trophy{font-size:115px;margin:0 9%}.banner,.ad,.notice{background:#171126;border:1px dashed #69488b;border-radius:14px;padding:16px;margin:22px 0}.banner small{display:block}.ad{text-align:center;color:#a991c0;font-size:10px;letter-spacing:1.5px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.cards article,.empty,.auth,.profile,.wallet{background:linear-gradient(145deg,#1c1230,#120d20);border:1px solid var(--line);border-radius:17px;padding:18px}.art{height:130px;border-radius:12px;background:radial-gradient(circle,#7040a3,#2a1745);display:grid;place-items:center;font-size:65px}.art.blue{background:radial-gradient(circle,#236b9c,#142847)}.art.orange{background:radial-gradient(circle,#9a5b22,#392044)}.cards h3{margin-bottom:3px}.cards p{font-size:12px;min-height:36px}.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0}.quick>*{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:17px;color:white}.empty{min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center}.wallet{max-width:600px;background:linear-gradient(120deg,#57258d,#261542)}.wallet strong{display:block;color:var(--gold);font-size:38px}.notice{border-style:solid;color:#e7dcef}.profile{max-width:800px;display:grid;grid-template-columns:200px 1fr;gap:20px}.avatar{width:105px;height:105px;border-radius:50%;background:#39224f;display:grid;place-items:center;font-size:50px;margin:auto}.profile label,.form label,.auth label{display:grid;gap:6px;margin:12px 0;font-size:12px}.profile input[type=file]{display:none}.form input,.form textarea,.auth input{width:100%;padding:11px;border-radius:9px;border:1px solid var(--line);background:#0d0816;color:white}.form small{display:block}.form button{margin:4px}.footlinks{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:20px 0}.footlinks div{display:grid;align-content:start;gap:7px}.footlinks b{color:var(--gold)}.footlinks a,footer p{font-size:12px;color:var(--muted)}footer{border-top:1px solid #ffffff18;padding:30px 5% 90px}footer>small{font-size:10px}.bottom{display:none}#drawer{display:none;position:absolute;right:20px;top:65px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:15px;z-index:5}#drawer a{display:block;padding:8px}@media(max-width:700px){header{padding:0 14px;height:65px}header nav{display:none}.actions{gap:7px}.actions a:nth-child(2){display:none}main{padding:20px 14px 45px}.hero{padding:28px 20px;min-height:270px}.hero h1{font-size:37px}.trophy{font-size:65px;margin:0;opacity:.6}.cards{grid-template-columns:1fr 1fr;gap:9px}.cards article{padding:10px}.art{height:95px;font-size:48px}.quick{grid-template-columns:1fr 1fr}.profile{grid-template-columns:1fr}.footlinks{grid-template-columns:1fr 1fr}.bottom{display:flex;position:fixed;bottom:0;left:0;right:0;justify-content:space-around;background:#10091fee;border-top:1px solid var(--line);padding:8px 4px}.bottom a{display:grid;text-align:center;font-size:17px}.bottom small{font-size:9px}footer{padding-bottom:90px}}

/* GetPlayEarn responsive refinement v2 */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:320px;overflow-x:hidden}
img,svg,video,canvas{max-width:100%;height:auto}
button,.btn,a,input,textarea{ -webkit-tap-highlight-color:transparent }
button,.btn{min-height:42px;touch-action:manipulation}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
main{width:100%;padding-bottom:clamp(48px,6vw,76px)}
.page{min-width:0}
.cards article,.profile,.wallet,.auth,.empty,.notice{min-width:0;overflow-wrap:anywhere}
.profile{align-items:start}
.profile .form{min-width:0}
.profile label.btn{display:flex;align-items:center;justify-content:center;min-height:48px}
#avatars{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
#avatars button{min-width:48px;min-height:48px;font-size:20px}
.footlinks{grid-template-columns:repeat(3,minmax(0,1fr))}
.bottom{z-index:50}
#drawer{z-index:60;max-width:calc(100vw - 32px);max-height:70dvh;overflow:auto;box-shadow:0 12px 35px #0008}
@media(max-width:900px){
  header{padding-inline:3%}
  nav{gap:14px}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}
  header{height:65px;padding-inline:14px;position:relative}
  .brand{font-size:clamp(18px,5.2vw,22px);white-space:nowrap}
  .actions a:first-child{white-space:nowrap;padding:8px 10px}
  main{padding:20px 14px calc(34px + env(safe-area-inset-bottom,0px))}
  .hero{gap:12px;min-height:250px;overflow:hidden}
  .hero>div:first-child{min-width:0}
  .hero h1{font-size:clamp(30px,8vw,38px);letter-spacing:-1.2px}
  .trophy{flex:0 0 auto;font-size:clamp(42px,12vw,65px)}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cards article{padding:10px;min-width:0}
  .cards h3{font-size:clamp(14px,4vw,18px);overflow-wrap:anywhere}
  .cards .btn{max-width:100%;white-space:normal;text-align:center;padding:10px 9px}
  .art{height:clamp(82px,25vw,120px)}
  .quick{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile{grid-template-columns:minmax(0,1fr);gap:14px}
  .profile .avatar{grid-column:1;grid-row:auto}
  .profile .form{grid-column:1}
  .footlinks{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}
  footer{padding:28px 14px calc(112px + env(safe-area-inset-bottom,0px))}
  .bottom{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:space-around;align-items:stretch;gap:2px;min-height:64px;padding:7px 4px calc(7px + env(safe-area-inset-bottom,0px));background:rgba(16,9,31,.98);border-top:1px solid var(--line);box-shadow:0 -8px 24px #0004;backdrop-filter:blur(12px);}
  .bottom a{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;font-size:19px;line-height:1.15;padding:3px 0}
  .bottom small{font-size:10px;line-height:1.2;white-space:nowrap}
}
@media(max-width:380px){
  header{gap:7px}
  .brand{font-size:17px}
  .actions{gap:5px}
  .actions a:first-child{font-size:11px;padding:7px 8px}
  .actions button{padding:8px 10px;min-width:40px}
  .cards{grid-template-columns:minmax(0,1fr)}
  .cards article{padding:13px}
  .art{height:125px}
  .footlinks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(orientation:landscape) and (max-height:500px) and (max-width:900px){
  .bottom{min-height:52px;padding-top:4px;padding-bottom:4px}
  .bottom a{font-size:16px}
  .bottom small{font-size:9px}
  body{padding-bottom:58px}
  footer{padding-bottom:70px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}