@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700&display=swap');
:root{--intro-blue:#45a8ff;--intro-cyan:#74e1ff;--intro-violet:#9996ff;--intro-ink:#eef8ff;--intro-muted:#91abc0}
body.dubdib-intro-open{overflow:hidden;touch-action:none}
.dubdib-intro{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;overflow:hidden;color:var(--intro-ink);font-family:'IBM Plex Sans Thai','Plus Jakarta Sans',Tahoma,Arial,sans-serif;background:radial-gradient(circle at 50% 38%,#071827 0 10%,#04111f 38%,#020914 70%,#00030a 100%);opacity:1;visibility:visible;transition:opacity .78s cubic-bezier(.2,.8,.2,1),visibility .78s}
.dubdib-intro::before,.dubdib-intro::after{content:"";position:absolute;pointer-events:none;border-radius:44% 56% 56% 44%/48% 42% 58% 52%;filter:blur(38px);opacity:.32}
.dubdib-intro::before{width:min(82vw,760px);height:min(70vw,620px);left:-25%;top:-16%;background:radial-gradient(circle at 65% 65%,rgba(62,190,255,.28),rgba(33,101,196,.16) 46%,transparent 72%);animation:harmony-float-a 11s ease-in-out infinite alternate}
.dubdib-intro::after{width:min(78vw,700px);height:min(68vw,600px);right:-27%;bottom:-19%;background:radial-gradient(circle at 35% 35%,rgba(133,111,255,.22),rgba(43,139,225,.13) 48%,transparent 72%);animation:harmony-float-b 13s ease-in-out infinite alternate}
.dubdib-intro.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.dubdib-intro__canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.dubdib-intro__skip{position:absolute;z-index:6;top:max(22px,env(safe-area-inset-top));right:max(22px,env(safe-area-inset-right));display:flex;align-items:center;gap:9px;border:1px solid rgba(126,205,255,.1);background:rgba(8,29,49,.48);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#9bb4c7;font:600 13px/1 'IBM Plex Sans Thai',sans-serif;border-radius:999px;padding:9px 11px 9px 14px;cursor:pointer;box-shadow:0 8px 28px rgba(0,0,0,.16);transition:.25s}
.dubdib-intro__skip kbd{border:1px solid rgba(111,198,255,.2);border-radius:7px;padding:5px 7px;background:rgba(15,49,76,.72);color:#bce8ff;font:600 10px/1 'Plus Jakarta Sans',monospace}.dubdib-intro__skip:hover{color:#eaf9ff;transform:translateY(-1px);background:rgba(16,55,84,.76)}
.dubdib-intro__content{position:relative;z-index:3;width:min(560px,calc(100vw - 44px));height:min(760px,calc(100dvh - 80px));display:grid;grid-template-rows:1fr auto;align-items:center}
.dubdib-intro__brand{align-self:center;display:grid;place-items:center;text-align:center;margin-top:4vh}
.dubdib-intro__core{position:relative;display:grid;place-items:center;width:clamp(215px,34vw,340px);aspect-ratio:1;isolation:isolate}
.dubdib-intro__core::before{content:"";position:absolute;z-index:-3;inset:12%;border-radius:50%;background:radial-gradient(circle,rgba(169,228,255,.2),rgba(60,161,226,.11) 42%,transparent 72%);filter:blur(9px);opacity:.15;transform:scale(.64);transition:opacity 1s,transform 1.35s cubic-bezier(.16,1,.3,1)}
.dubdib-intro.is-forming .dubdib-intro__core::before{opacity:1;transform:scale(1)}
.dubdib-intro__ring{position:absolute;z-index:-1;inset:2%;border:1px solid rgba(61,159,239,.12);border-radius:50%;opacity:0;transform:scale(.72);transition:opacity .8s,transform 1.4s cubic-bezier(.16,1,.3,1)}
.dubdib-intro__ring::before{content:"";position:absolute;width:7px;height:7px;top:13%;left:15%;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(86,187,255,.1),0 0 18px rgba(29,146,245,.45)}
.dubdib-intro__ring--b{inset:13%;border-color:rgba(129,132,244,.1)}.dubdib-intro__ring--c{inset:-8%;border-color:rgba(73,174,242,.07)}
.dubdib-intro.is-forming .dubdib-intro__ring{opacity:1;transform:scale(1);animation:harmony-ring 14s linear infinite}.dubdib-intro.is-forming .dubdib-intro__ring--b{animation-direction:reverse;animation-duration:18s}.dubdib-intro.is-forming .dubdib-intro__ring--c{animation-duration:24s}
.dubdib-intro__flare{position:absolute;z-index:-2;width:80%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 10deg,rgba(68,174,255,.06),rgba(125,128,255,.14),rgba(87,218,255,.12),rgba(68,174,255,.06));filter:blur(13px);opacity:0;transform:scale(.5) rotate(-25deg);transition:opacity 1s,transform 1.5s cubic-bezier(.16,1,.3,1)}
.dubdib-intro.is-forming .dubdib-intro__flare{opacity:.85;transform:scale(1) rotate(0)}
.dubdib-intro__logo-ghost{position:relative;z-index:2;width:82%;height:82%;object-fit:contain;opacity:0;filter:brightness(1.05) saturate(.92) drop-shadow(0 14px 28px rgba(53,146,218,.18));transform:scale(.82);transition:opacity .9s ease,transform 1.25s cubic-bezier(.16,1,.3,1),filter .8s}
.dubdib-intro.is-ready .dubdib-intro__logo-ghost{opacity:1;transform:scale(1);filter:brightness(1.02) saturate(.92) drop-shadow(0 17px 30px rgba(38,137,213,.2))}
.dubdib-intro__loader{align-self:end;padding-bottom:max(20px,env(safe-area-inset-bottom));width:100%}
.dubdib-intro__tagline{margin:0 0 20px;text-align:center;color:#a9bfd0;font-size:clamp(14px,2.6vw,16px);font-weight:400;line-height:1.75;letter-spacing:0}
.dubdib-intro__track{position:relative;height:5px;border-radius:999px;background:rgba(115,190,238,.12);overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.25)}
.dubdib-intro__bar{position:absolute;inset:0 auto 0 0;width:0;border-radius:inherit;background:linear-gradient(90deg,#248ff7,#66d9ff 52%,#9996ff);box-shadow:0 0 14px rgba(67,178,255,.48);transition:width .25s cubic-bezier(.2,.8,.2,1)}
.dubdib-intro__bar::after{content:"";position:absolute;right:-1px;top:0;width:28px;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.9));filter:blur(2px)}
.dubdib-intro__meta{display:flex;justify-content:space-between;align-items:center;margin-top:12px;color:#8fa9bc;font:500 12px/1.4 'IBM Plex Sans Thai',sans-serif}.dubdib-intro__percent{font:600 13px/1 'Plus Jakarta Sans',sans-serif;color:#8edbff;letter-spacing:.04em}
.dubdib-intro__enter{width:min(300px,80vw);height:56px;margin:25px auto 0;display:flex;align-items:center;justify-content:center;border:1px solid rgba(107,199,255,.18);border-radius:999px;background:rgba(14,48,74,.56);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 15px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(186,232,255,.12);color:#dff6ff;font:600 14px/1 'IBM Plex Sans Thai',sans-serif;opacity:0;transform:translateY(10px) scale(.98);pointer-events:none;transition:.6s .18s cubic-bezier(.16,1,.3,1),background .2s,box-shadow .2s;cursor:pointer}.dubdib-intro.is-ready .dubdib-intro__enter{opacity:1;transform:none;pointer-events:auto}.dubdib-intro__enter:hover{background:rgba(24,75,108,.82);box-shadow:0 18px 46px rgba(0,0,0,.3),0 0 28px rgba(60,169,238,.13)}
.dubdib-intro__hint{height:18px;margin:11px 0 0;text-align:center;color:#718b9f;font-size:12px;font-weight:400;opacity:0;transition:opacity .4s .35s}.dubdib-intro.is-ready .dubdib-intro__hint{opacity:1}
@keyframes harmony-float-a{to{transform:translate(16vw,10vh) rotate(18deg) scale(1.12)}}@keyframes harmony-float-b{to{transform:translate(-14vw,-8vh) rotate(-15deg) scale(1.08)}}@keyframes harmony-ring{to{transform:scale(1) rotate(360deg)}}
@media(max-width:600px){.dubdib-intro__content{height:calc(100dvh - 58px);width:calc(100vw - 40px)}.dubdib-intro__brand{margin-top:1vh}.dubdib-intro__core{width:min(66vw,275px)}.dubdib-intro__loader{padding-bottom:max(14px,env(safe-area-inset-bottom))}.dubdib-intro__tagline{margin-bottom:17px}.dubdib-intro__skip{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right))}.dubdib-intro__enter{height:53px;margin-top:22px}}
@media(prefers-reduced-motion:reduce){.dubdib-intro::before,.dubdib-intro::after,.dubdib-intro__ring{animation:none!important}.dubdib-intro__bar,.dubdib-intro__logo-ghost,.dubdib-intro__enter{transition-duration:.01ms!important}.dubdib-intro__canvas{display:none}}

/* Cinematic crystal assembly pass; lightweight enough for mobile Safari. */
.dubdib-intro{background-color:#000207;background-image:
 radial-gradient(circle at 50% 38%,#071827 0 8%,#04111f 38%,#010711 70%,#000207 100%);isolation:isolate}
.dubdib-intro__canvas{mix-blend-mode:screen}
.dubdib-intro__core::after{content:"";position:absolute;z-index:-2;inset:-16%;border-radius:50%;opacity:0;transform:scale(.55) rotate(-18deg);background:repeating-conic-gradient(from 0deg,rgba(87,197,255,0) 0 15deg,rgba(87,197,255,.08) 17deg,rgba(87,197,255,0) 19deg 32deg);mask-image:radial-gradient(circle,transparent 0 31%,#000 51%,transparent 73%);transition:opacity 1s,transform 1.7s cubic-bezier(.16,1,.3,1)}
.dubdib-intro.is-forming .dubdib-intro__core::after{opacity:.72;transform:scale(1) rotate(12deg);animation:crystal-rays 18s linear infinite}
.dubdib-intro__logo-ghost{width:88%;height:88%;filter:brightness(1.08) saturate(1.04) drop-shadow(0 0 14px rgba(94,203,255,.12)) drop-shadow(0 22px 38px rgba(20,111,188,.24))}
.dubdib-intro.is-ready .dubdib-intro__logo-ghost{filter:brightness(1.05) saturate(1.02) drop-shadow(0 0 18px rgba(108,213,255,.2)) drop-shadow(0 24px 42px rgba(20,111,188,.28));animation:crystal-arrive 1.1s cubic-bezier(.16,1,.3,1) both}
.dubdib-intro__track{height:4px;overflow:visible;background:rgba(116,194,244,.1)}
.dubdib-intro__bar{overflow:visible}
.dubdib-intro__bar::before{content:"";position:absolute;right:-3px;top:50%;width:8px;height:8px;border-radius:50%;background:#e8fbff;transform:translateY(-50%);box-shadow:0 0 8px #fff,0 0 22px #50c8ff}
.dubdib-intro__status{transition:opacity .2s ease}
@keyframes crystal-rays{to{transform:scale(1) rotate(372deg)}}
@keyframes crystal-arrive{0%{opacity:.1;transform:scale(.86);filter:blur(7px) brightness(1.8)}55%{opacity:1;transform:scale(1.035);filter:blur(0) brightness(1.18)}100%{opacity:1;transform:scale(1);filter:brightness(1.05) saturate(1.02) drop-shadow(0 0 18px rgba(108,213,255,.2)) drop-shadow(0 24px 42px rgba(20,111,188,.28))}}
@media(max-width:600px){.dubdib-intro__logo-ghost{width:92%;height:92%}.dubdib-intro__core::after{inset:-12%}}