@font-face{font-family:Bangla;src:url('assets/NotoSerifBengali-Regular.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Bangla;src:url('assets/NotoSerifBengali-Bold.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:BanglaHeading;src:url('assets/NotoSansBengali-Bold.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}
:root{color-scheme:dark;--layout-width:min(100vw,470px);--u:calc(var(--layout-width) / 727);--v:calc(var(--layout-width) / 1080);--yellow:#fff000;--background:#1e1e1e;--gold:#ebc16c;font-family:Bangla,serif;scroll-behavior:smooth}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#000;color:#fff}
html{scrollbar-width:none}
body{overflow-x:clip}
.home-page,.auth-page,.signed-ui{width:var(--layout-width);margin-inline:auto;min-height:100dvh}
button,input,a{-webkit-tap-highlight-color:transparent}
button,input{font:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer;color:inherit}
a{color:inherit;text-decoration:none}
button{border:0;background:none;padding:0}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #fff48d;outline-offset:4px}
img{display:block;max-width:100%;object-fit:contain}
[hidden]{display:none!important}
.svg-definitions{position:absolute;width:0;height:0;overflow:hidden}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.home-page {
  --header-height:calc(112 * var(--u));
  --bottom-nav-height:calc(106 * var(--u));
  --safe-bottom:env(safe-area-inset-bottom,0px);
  --bottom-clearance:calc(var(--bottom-nav-height) + var(--safe-bottom));
  padding-bottom:var(--bottom-clearance);
  background:var(--background);
}
.site-header{height:var(--header-height);padding:0 calc(22 * var(--u)) 0 calc(32 * var(--u));display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:30;background:#1e1e1e}
.site-header:after{content:"";height:calc(5 * var(--u));background:#000;position:absolute;bottom:calc(-3 * var(--u));left:calc(29 * var(--u));right:0;border-radius:0 0 50% 50%}
.brand{width:calc(250 * var(--u));flex-shrink:0}
.brand img{width:100%;height:auto}
.header-actions{display:flex;gap:calc(10 * var(--u));align-items:center}
.header-button{width:calc(144 * var(--u));height:calc(60 * var(--u));border-radius:calc(21 * var(--u));display:flex;justify-content:center;align-items:center;padding-top:calc(5 * var(--u));line-height:1;font-size:calc(34 * var(--u))}
.silver{border:1px solid #fff;background:linear-gradient(#d1d1d1 0%,#b6b6b6 24%,#696969 55%,#bdbdbd 100%);font-weight:700;text-shadow:0 1px 1px #747474}
.gold{border:1px solid #fffb00;background:linear-gradient(#fffaca 0%,#ece655 30%,#d7c800 57%,#eedb00 100%);color:#000;font-size:calc(38 * var(--u))}
.home-intro{padding-left:calc(15 * var(--u))}
.announcement{height:calc(59 * var(--u));background:#333;border-radius:calc(35 * var(--u));display:flex;align-items:center;overflow:hidden;padding-left:calc(18 * var(--u));margin:0 0 calc(15 * var(--u))}
.speaker{color:#f6e59a;fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;width:calc(43 * var(--u));height:calc(43 * var(--u));flex-shrink:0;margin-right:calc(13 * var(--u))}
.announcement-window {
  overflow:hidden;
  flex:1;
  min-width:0;
  height:100%;
  text-align:left;
  mask-image:linear-gradient(to right,#000 calc(100% - 13 * var(--u)),transparent);
}
.announcement-window:focus-visible{outline-offset:-3px}
.announcement-track {
  display:flex;
  width:max-content;
  align-items:center;
  height:100%;
  padding-top:calc(5 * var(--u));
  animation:announcement-scroll 20s linear infinite;
}
.announcement-copy {
  flex:none;
  min-width:var(--layout-width);
  padding-right:calc(64 * var(--u));
  white-space:nowrap;
  line-height:1.5;
  font-size:calc(28 * var(--u));
  font-weight:700;
}
.announcement-window[data-paused] .announcement-track{animation-play-state:paused}
@keyframes announcement-scroll{to{transform:translateX(-50%)}}
.app-button{flex:0 0 calc(60 * var(--u));height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#333;font-family:Arial,sans-serif;color:#e7e216;line-height:1}
.app-button span{display:block;width:calc(37 * var(--u));height:calc(35 * var(--u));font-size:0;background:linear-gradient(#fffba3,#dddb23);clip-path:polygon(28% 0,72% 0,72% 42%,100% 42%,50% 100%,0 42%,28% 42%)}
.app-button b{font-size:calc(16 * var(--u));margin-top:calc(3 * var(--u))}
.banner{width:100%;position:relative;border-radius:calc(22 * var(--u));aspect-ratio:712/246;container-type:inline-size}
.banner-window{width:100%;height:100%;overflow:hidden;border-radius:inherit;background:#050400}
.banner-track{display:flex;width:100%;height:100%;transform:translateX(calc(-100% * var(--banner-index,1)));transition:transform .45s ease}
.banner-art{flex:0 0 100%;min-width:0;height:100%}
.banner-art:focus-visible{outline-offset:-4px}
.banner-art img{width:100%;height:100%;object-fit:fill}
.banner-dots{--bu:calc(100cqw / 712);position:absolute;bottom:calc(15 * var(--bu));right:5%;display:flex;gap:calc(12 * var(--bu));height:calc(27 * var(--bu));align-items:center}
.banner-dots button{width:calc(18 * var(--bu));height:calc(18 * var(--bu));background:#ffedb3;border-radius:50%;box-shadow:0 1px 1px #b67a35;position:relative}
.banner-dots button:before{content:"";position:absolute;inset:calc(-8 * var(--u)) calc(-3 * var(--u))}
.banner-dots button.selected{background:#fff;width:calc(27 * var(--bu));height:calc(27 * var(--bu));box-shadow:none}
.quick-links{height:calc(121 * var(--u));margin-top:calc(17 * var(--u));display:grid;grid-template-columns:repeat(5,1fr);background:#000;border-radius:calc(26 * var(--u));padding:calc(15 * var(--u)) 0 calc(7 * var(--u))}
.quick-link{min-width:0;display:flex;align-items:center;justify-content:space-between;flex-direction:column;gap:calc(6 * var(--u));line-height:1.3;font-size:calc(28 * var(--u));white-space:nowrap}
.quick-link img{width:calc(60 * var(--u));height:calc(57 * var(--u))}
.quick-link:first-child span{text-shadow:1px 0 #4980d6,-1px 0 #ce5a00}
.floating-language{position:absolute;top:8.5366%;left:-1.264%;width:7.3034%;aspect-ratio:1;z-index:5;display:grid;place-items:center}
.flag-bd{display:inline-block;position:relative;width:calc(52 * var(--u));height:calc(52 * var(--u));border-radius:50%;background:#007b59;flex-shrink:0}
.flag-bd:after{content:"";position:absolute;width:62%;height:62%;left:10%;top:19%;border-radius:50%;background:#f32043}
.floating-language .flag-bd{width:100%;height:100%}
.floating-language .flag-bd:after{left:19%}
.bottom-nav{position:fixed;bottom:0;left:50%;width:var(--layout-width);transform:translateX(-50%);z-index:40;display:grid;grid-template-columns:22% 20% 16% 21% 21%;height:var(--bottom-clearance);padding:calc(9 * var(--u)) 0 var(--safe-bottom);border-radius:calc(40 * var(--u)) calc(40 * var(--u)) 0 0;background:linear-gradient(#858585 0%,#737373 12%,#494949 46%,#111 90%,#000 100%);box-shadow:0 -2px 3px #cfcfcf33}
.bottom-link{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:0;position:relative;font-size:calc(29 * var(--u));line-height:calc(37 * var(--u));white-space:nowrap;padding-bottom:calc(4 * var(--u));min-width:0}
.bottom-link>img{height:calc(55 * var(--u));width:calc(65 * var(--u))}
.bottom-link:nth-child(2)>img{height:calc(62 * var(--u))}
.bottom-link>span:not(.promotion-circle){transform:translateY(calc(-5 * var(--u)))}
.promotion-link{overflow:visible}
.promotion-circle{position:absolute;top:calc(-38 * var(--u));left:50%;transform:translateX(-50%);width:calc(116 * var(--u));height:calc(116 * var(--u));border-radius:50%;background:linear-gradient(#fffbd0 0%,#eee238 36%,#d9c900 65%,#d3c300 100%);border:calc(2 * var(--u)) solid #fff600;box-shadow:0 0 calc(27 * var(--u)) #f9e600ae;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#302b14;line-height:1.1;font-size:calc(26 * var(--u));font-weight:700}
.promotion-circle img{width:calc(70 * var(--u));height:calc(66 * var(--u));margin-bottom:calc(1 * var(--u));transform:translateY(calc(4 * var(--u)))}
.auth-page{background:#0c0c0c url('assets/auth-background.webp') center top / var(--layout-width) auto no-repeat fixed;position:relative;min-height:100dvh;padding-bottom:calc(52 * var(--u));isolation:isolate}
.auth-page:before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(#07070718,#07070700 40%,#0707071a)}
.back-button{position:absolute;top:calc(48 * var(--u));left:calc(43 * var(--u));width:calc(40 * var(--u));height:calc(44 * var(--u));z-index:3;display:grid;place-items:center}
.back-button svg{width:100%;height:100%;fill:none;stroke:#fff;stroke-width:4.5}
.auth-layout{padding-top:calc(126 * var(--u));width:100%}
.auth-brand{display:block;width:calc(287 * var(--u));height:calc(74 * var(--u));margin:0 auto;transform:translateX(calc(-45 * var(--u)))}
.auth-brand img{width:100%;height:100%}
.auth-title{font-family:BanglaHeading,Bangla,sans-serif;font-size:calc(64 * var(--u));font-weight:700;line-height:calc(80 * var(--u));text-align:center;margin:calc(37 * var(--u)) 0 calc(23 * var(--u));padding-top:calc(1 * var(--u));transform:translateX(calc(16 * var(--u))) scale(1.06,.85)}
.auth-form{width:calc(680 * var(--u));margin-left:calc(40 * var(--u))}
.form-fields{display:grid;gap:calc(24 * var(--u))}
.auth-field-group{display:grid;gap:calc(11 * var(--u))}
.auth-field{height:calc(90 * var(--u));border:calc(2 * var(--u)) solid var(--yellow);border-left-width:calc(19 * var(--u));background:#000;border-radius:calc(8 * var(--u));display:flex;align-items:center;position:relative;min-width:0}
.auth-field:focus-within{box-shadow:0 0 calc(15 * var(--u)) #fff00025}
.field-icon{position:absolute;left:calc(17 * var(--u));width:calc(42 * var(--u));height:calc(42 * var(--u));stroke:#e4df2d;fill:none;stroke-width:3.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.auth-field:has(input[type="password"]) .field-icon{width:calc(45 * var(--u));height:calc(45 * var(--u));left:calc(15 * var(--u))}
.auth-field input{width:100%;height:100%;border:0;outline:0!important;color:#fff;font-size:calc(38 * var(--u));line-height:1.5;padding:calc(10 * var(--u)) calc(78 * var(--u)) calc(4 * var(--u)) calc(82 * var(--u));background:transparent;min-width:0;caret-color:var(--yellow);border-radius:0 calc(6 * var(--u)) calc(6 * var(--u)) 0}
.auth-field:not(:has(.password-toggle)) input{padding-right:calc(18 * var(--u))}
.password-toggle{position:absolute;right:calc(17 * var(--u));top:50%;transform:translateY(-50%);width:calc(55 * var(--u));height:calc(55 * var(--u));display:grid;place-items:center;color:#e8d18a;z-index:2}
.password-toggle svg{width:calc(50 * var(--u));height:calc(50 * var(--u));fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.password-toggle:not(.is-visible) svg{width:calc(54 * var(--u));height:calc(54 * var(--u));stroke-width:2.8}
.password-toggle.is-visible svg{filter:brightness(1.2)}
.field-help{margin:0 calc(8 * var(--u));color:#ff315d;font-size:calc(28 * var(--u));line-height:1.35;font-family:Bangla,Arial,sans-serif}
.field-help[hidden]{display:none!important}
.auth-field input::placeholder{color:#666b5f;opacity:1}
.auth-field:has(input[aria-invalid="true"]){border-color:#ff6c61}
.auth-field input:-webkit-autofill{-webkit-text-fill-color:#fff;box-shadow:0 0 0 1000px #000 inset}
.login-options{display:flex;justify-content:space-between;align-items:center;white-space:nowrap;font-size:calc(38 * var(--u));line-height:calc(43 * var(--u));margin-top:calc(59 * var(--u));gap:calc(12 * var(--u))}
.remember{display:flex;align-items:center;gap:calc(15 * var(--u));cursor:pointer;position:relative}
.remember input{position:absolute;left:0;top:0;opacity:0;width:calc(40 * var(--u));height:calc(40 * var(--u))}
.check-mark{width:calc(40 * var(--u));height:calc(40 * var(--u));border-radius:calc(2 * var(--u));background:#fff;position:relative;flex-shrink:0}
.remember input:checked+.check-mark:after{content:"";position:absolute;left:27%;top:17%;width:29%;height:48%;border:solid #1a314b;border-width:0 calc(5 * var(--u)) calc(5 * var(--u)) 0;transform:rotate(43deg)}
.remember input:focus-visible+.check-mark{outline:2px solid var(--yellow);outline-offset:4px}
.text-button{font-size:inherit;line-height:inherit}
.auth-submit{height:calc(101 * var(--u));border:calc(2 * var(--u)) solid #fff600;border-radius:calc(60 * var(--u));background:linear-gradient(#fffde5 0%,#e8df83 20%,#d1bd05 50%,#dac800 100%);color:#292a2e;font-family:BanglaHeading,Bangla,sans-serif;font-size:calc(48 * var(--u));font-weight:700;line-height:1.2;padding-top:calc(5 * var(--u));box-shadow:0 0 calc(24 * var(--u)) #f6e60090;display:block;width:100%;margin-top:calc(28 * var(--u))}
.auth-submit:active,.header-button:active{filter:brightness(.87)}
.signup-prompt{text-align:center;font-size:calc(37 * var(--u));line-height:1.5;margin:calc(40 * var(--u)) 0 calc(23 * var(--u));white-space:nowrap}
.signup-prompt a{color:#e7b95e}
.language-control{text-align:center}
.preview-note{margin:calc(20 * var(--u)) 0 0;color:#c8c8c0;font-size:clamp(12px,calc(18 * var(--u)),16px);line-height:1.5;text-align:center}
.language-button{display:inline-flex;align-items:center;justify-content:center;gap:calc(12 * var(--u));font-size:calc(34 * var(--u));line-height:1.4}
.language-button .flag-bd{width:calc(42 * var(--u));height:calc(42 * var(--u))}
.down-triangle{width:0;height:0;border-left:calc(15 * var(--u)) solid transparent;border-right:calc(15 * var(--u)) solid transparent;border-top:calc(15 * var(--u)) solid #e6b965;margin-left:calc(-3 * var(--u));margin-top:calc(6 * var(--u))}
.register-page .auth-layout{padding-top:calc(45 * var(--u))}
.register-page .auth-title{margin-top:calc(37 * var(--u));margin-bottom:calc(24 * var(--u));transform:translateX(calc(6 * var(--u))) scale(1.04,.85)}
.register-page .auth-form{margin-left:calc(30 * var(--u))}
.required-star{position:absolute;left:calc(-40 * var(--u));font-family:Arial,sans-serif;font-weight:700;color:#ff585d;font-size:calc(25 * var(--u));top:calc(28 * var(--u))}
.register-actions{display:grid;grid-template-columns:410fr 210fr;gap:calc(60 * var(--u));margin-top:calc(94 * var(--u))}
.register-actions .auth-submit{margin:0}
.reset-button{height:calc(99 * var(--u));border:calc(2 * var(--u)) solid #ebc46f;border-radius:calc(60 * var(--u));color:#e9c674;font-size:calc(48 * var(--u));line-height:1.2;padding-top:calc(6 * var(--u));background:#17171738}
.register-page .language-control{margin-top:calc(48 * var(--u))}
.form-error{color:#ffaba2;font-size:max(14px,calc(23 * var(--u)));margin:calc(20 * var(--u)) 0 0;line-height:1.7}
.detail-dialog,.language-dialog{border:1px solid #a89e31;border-radius:22px;background:#171717;color:#fff;box-shadow:0 12px 80px #000a;width:calc(var(--layout-width) * .9);padding:32px 26px;font-size:17px;text-align:center;max-height:85dvh;overflow:auto}
dialog::backdrop{background:#000c;backdrop-filter:blur(5px)}
.dialog-close{position:absolute;right:12px;top:6px;width:36px;height:36px;color:#d8cb54;font:32px Arial,sans-serif}
.detail-dialog h2,.language-dialog h2{font-size:27px;color:#ffee30;margin:16px 0}
.detail-dialog p{line-height:1.9;color:#d0d0c7}
#dialog-art:empty{display:none}
#dialog-art img{border-radius:14px;margin:8px auto 0;width:100%}
#dialog-art img.game-dialog-image{width:160px;height:160px}
.dialog-action{display:block;width:100%;border-radius:30px;background:linear-gradient(#fff9b7,#ddca00);color:#24241e;padding:11px 20px;font-size:23px;font-weight:700;margin-top:20px}
.language-dialog button{display:flex;align-items:center;gap:14px;font-size:21px;width:100%;padding:16px;border-radius:14px}
.language-dialog button:hover{background:#333}
.language-dialog .flag-bd{width:34px;height:34px}
.language-tick{margin-left:auto;color:var(--yellow)}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:100;background:#38351a;border:1px solid #dbca35;color:#fff7a9;padding:14px 22px;border-radius:14px;box-shadow:0 4px 35px #0009;font-size:16px;width:max-content;max-width:calc(var(--layout-width) * .9);text-align:center}
body[data-screen="home"] .toast{bottom:calc(130 * var(--u))}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Continuous bounce-in / bounce-out animation for the home logo and Promotions. Auth-page logo stays still. */
@keyframes public-brand-bounce {
  0%, 100% { transform: scale(1); }
  12% { transform: scale(.92); }
  30% { transform: scale(1.10); }
  46% { transform: scale(.97); }
  62% { transform: scale(1.055); }
  78% { transform: scale(.995); }
}

@keyframes public-promo-bounce {
  0%, 100% { transform: translateX(-50%) scale(1); }
  12% { transform: translateX(-50%) scale(.90); }
  30% { transform: translateX(-50%) scale(1.11); }
  46% { transform: translateX(-50%) scale(.96); }
  62% { transform: translateX(-50%) scale(1.06); }
  78% { transform: translateX(-50%) scale(.995); }
}

.brand img {
  animation: public-brand-bounce 1.75s cubic-bezier(.22,.75,.32,1) infinite;
  transform-origin: center;
  will-change: transform;
}

.promotion-circle {
  animation: public-promo-bounce 1.75s cubic-bezier(.22,.75,.32,1) infinite;
  transform-origin: center;
  will-change: transform;
}

@keyframes public-app-bounce {
  0%, 100% { transform: scale(1); }
  12% { transform: scale(.88); }
  30% { transform: scale(1.13); }
  46% { transform: scale(.95); }
  62% { transform: scale(1.07); }
  78% { transform: scale(.995); }
}

.app-button {
  animation: public-app-bounce 1.75s cubic-bezier(.22,.75,.32,1) infinite;
  transform-origin: center;
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .brand img,
  .promotion-circle,
  .app-button { animation: none; }
}

/* === Professional auth screen transition (login / registration) ===
   Visual-only: no dimensions, layout, colors, or form rules are changed. */
@keyframes authPageFadeIn{
  from{opacity:0}
  to{opacity:1}
}
@keyframes authPanelEnter{
  from{opacity:0;transform:translateY(calc(10 * var(--u))) scale(.994)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes authBackEnter{
  from{opacity:0;transform:translateX(calc(-6 * var(--u)))}
  to{opacity:1;transform:translateX(0)}
}
.auth-page:not([hidden]){
  animation:authPageFadeIn 180ms ease-out both;
}
.auth-page:not([hidden]) .auth-layout{
  animation:authPanelEnter 260ms cubic-bezier(.22,.61,.36,1) both;
  transform-origin:50% 18%;
  will-change:transform,opacity;
}
.auth-page:not([hidden]) .back-button{
  animation:authBackEnter 220ms cubic-bezier(.22,.61,.36,1) 40ms both;
}
.auth-field{
  transition:border-color 160ms ease,box-shadow 160ms ease,background-color 160ms ease;
}
.auth-submit,.reset-button{
  transition:filter 140ms ease,transform 140ms ease,box-shadow 180ms ease;
}
.auth-submit:active,.reset-button:active{
  transform:scale(.985);
}
@media (prefers-reduced-motion:reduce){
  .auth-page:not([hidden]),
  .auth-page:not([hidden]) .auth-layout,
  .auth-page:not([hidden]) .back-button{
    animation:none!important;
  }
  .auth-field,.auth-submit,.reset-button{
    transition:none!important;
  }
}

/* Login/register request feedback: show immediately after valid submit. */
.auth-request-loading[hidden]{display:none!important}
.auth-request-loading{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;background:rgba(0,0,0,.32);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);padding:20px}
.auth-request-loading-card{min-width:190px;max-width:min(82vw,320px);display:flex;align-items:center;justify-content:center;gap:12px;padding:16px 20px;border-radius:14px;background:rgba(20,20,20,.94);border:1px solid rgba(255,230,0,.42);box-shadow:0 12px 40px rgba(0,0,0,.38);color:#fff;text-align:center;font-family:Bangla,Arial,sans-serif;font-size:16px}
.auth-request-loading-card strong{font-weight:700}
.auth-request-spinner{width:24px;height:24px;flex:0 0 24px;border:3px solid rgba(255,255,255,.32);border-top-color:#ffe000;border-radius:50%;animation:auth-request-spin .72s linear infinite}
.auth-request-busy .auth-page{pointer-events:none;user-select:none}
@keyframes auth-request-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.auth-request-spinner{animation-duration:1.4s}}
