.game-brand>span:last-child{font-family:var(--serif);font-weight:800}.game-brand small{font-family:var(--sans);font-weight:400}
.on-title #screen{margin:0;max-width:none;padding:0;width:100%}.time-gate{--px:0px;--py:0px;position:relative;isolation:isolate;display:grid;place-items:center;min-height:100svh;padding:110px 24px 30px;overflow:hidden;background:#07191e;text-align:center;box-sizing:border-box}.time-gate:after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 46%,transparent 18%,#07191e88 67%,#06151bdd);pointer-events:none}.gate-depth{position:absolute;inset:0;z-index:-2;pointer-events:none;transform:translate3d(var(--px),var(--py),0);transition:transform .7s ease-out}.gate-aura{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,#bd89332b,transparent 58%)}.gate-drum{position:absolute;left:50%;top:49%;width:min(87vh,850px);aspect-ratio:1;transform:translate(-50%,-50%);transition:transform .85s ease-in,filter .85s,opacity .85s;opacity:.64}.gate-drum img{width:100%;height:100%;animation:drum-turn 180s linear infinite;filter:drop-shadow(0 0 7px #e5b45888)}.time-gate .title-content{position:relative;width:min(100%,1000px);z-index:2;margin:auto}.time-gate .title-content h1{font-size:clamp(62px,7.8vw,112px);line-height:1.12;margin:20px 0;color:#ffedbe;text-shadow:0 3px 2px #000,0 0 40px #d3974455;animation:gate-breathe 6s ease-in-out infinite}.time-gate .title-content h1 em{color:#e5b969}.time-gate .title-content h2{font-size:clamp(17px,2vw,26px);margin:15px 0;color:#eeddb9}.time-gate .title-content>p:not(.eyebrow){font-size:clamp(14px,1.1vw,18px);color:#c3cfc9;line-height:1.8;margin:12px 0 26px}.time-gate .eyebrow{font-size:12px;letter-spacing:4px;color:#e4c789}.time-gate .title-rule{margin:0 auto;width:220px}.gate-start{position:relative;display:inline-flex;flex-direction:column;align-items:center;gap:8px;padding:22px 40px;border:1px solid #e7c17e;outline:4px double #9d733d;background:linear-gradient(135deg,#78392a,#a54b2c 45%,#66291f);color:#ffe8b0;box-shadow:0 0 30px #e39b3933,inset 0 0 20px #efb94933;clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px);font:800 18px var(--serif);transition:filter .2s,transform .2s;cursor:pointer}.gate-start span{animation:start-glow 2.8s ease-in-out infinite}.gate-start small{font:10px var(--sans);letter-spacing:3px;color:#e1ba86}.gate-start:hover,.gate-start:focus-visible{filter:brightness(1.3);transform:translateY(-3px);outline:3px solid #ffe7a1}.time-gate .title-secondary{justify-content:center;margin:25px 0 18px;font-size:13px}.time-gate .title-version{font-size:10px;letter-spacing:2px}.gate-caption{position:absolute;bottom:24px;right:25px;color:#bba66a88;font-size:9px;letter-spacing:2px}.gate-mist{position:absolute;left:-25%;width:150%;height:40%;border-radius:50%;background:radial-gradient(ellipse,#9bbcb922,transparent 65%);animation:mist-drift 24s ease-in-out infinite alternate;transform:translate3d(0,0,0)}.mist-one{bottom:-10%}.mist-two{top:15%;opacity:.5;animation-delay:-12s;animation-direction:alternate-reverse}.gate-particles{position:absolute;inset:0}.gate-particles i{position:absolute;left:var(--x);top:-5%;height:3px;width:3px;border-radius:50%;background:#f6d48e;box-shadow:0 0 8px #f7c36c;animation:time-dust var(--speed) var(--delay) linear infinite}.gate-opening .gate-drum{transform:translate(-50%,-50%) scale(4);filter:brightness(5);opacity:0}.gate-opening:before{content:"";position:absolute;inset:0;background:#fff3cb;z-index:5;animation:gate-flash .85s forwards;pointer-events:none}.gate-opening .gate-start{pointer-events:none}
@keyframes drum-turn{to{transform:rotate(360deg)}}@keyframes gate-breathe{50%{text-shadow:0 3px 2px #000,0 0 55px #e0ae6877;transform:scale(1.015)}}@keyframes start-glow{50%{text-shadow:0 0 14px #ffe09c;color:#fff7da}}@keyframes mist-drift{to{transform:translate3d(12%,15%,0)}}@keyframes time-dust{0%{transform:translate3d(0,0,0);opacity:0}15%,75%{opacity:.7}100%{transform:translate3d(var(--drift),100vh,0);opacity:0}}@keyframes gate-flash{0%{opacity:0}70%{opacity:.9}100%{opacity:1}}
@media(pointer:fine){.time-gate,.time-gate a,.time-gate button{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M3 2l8 17 4-5z' fill='%23efd28b' stroke='%23725636'/%3E%3Cpath d='M9 19l9-9M13 17l6 7' stroke='%23bb8a49' stroke-width='3'/%3E%3C/svg%3E") 3 2,pointer}}
@media(max-width:600px){.time-gate{padding:105px 20px 35px}.gate-drum{width:130vw;top:45%}.time-gate .title-content h1{font-size:clamp(59px,16vw,90px)}.time-gate .eyebrow{font-size:9px;letter-spacing:2px}.gate-start{font-size:14px;padding:20px 24px}.time-gate .title-content h2{font-size:17px}.time-gate .title-content>p:not(.eyebrow){font-size:13px}.gate-caption{display:none}.gate-particles i:nth-child(n+17){display:none}.time-gate .title-secondary{font-size:12px}}
@media(max-height:740px) and (min-width:601px){.time-gate{padding-top:90px}.time-gate .title-content h1{font-size:70px;margin:10px 0}.time-gate .title-content>p:not(.eyebrow){margin:8px 0 18px}.gate-start{padding:15px 32px}.time-gate .title-secondary{margin:18px 0 12px}}
@media(prefers-reduced-motion:reduce){.time-gate *{animation:none!important;transition:none!important}.gate-depth{transform:none}.gate-opening:before{opacity:1}}
/* The stage lives below the fixed HUD. Size artwork against both axes. */
#shell.on-title{padding-top:var(--hud-height)}
.on-title #screen{min-height:0}
.time-gate{height:calc(100svh - var(--hud-height));min-height:0;container-type:size;padding:28px 24px 54px;--fog-x:0px;--fog-y:0px}
.gate-depth{inset:18px 18px 28px}
.gate-drum{top:50%;width:min(86vw,calc(100svh - var(--hud-height) - 78px),790px);opacity:.52;mix-blend-mode:screen}
.gate-drum img{display:block;object-fit:contain;clip-path:circle(48% at 50% 50%);filter:sepia(1) saturate(1.6) brightness(.8);animation-duration:240s}
.time-gate:after{background:radial-gradient(ellipse at 50% 43%,#07191e88 0%,#07191e77 24%,transparent 55%,#07191e99 100%)}
.time-gate .title-content{display:flex;flex-direction:column;align-items:center;width:min(100%,1100px);gap:clamp(10px,2cqh,18px);margin:auto}
.time-gate .title-content h1{font-size:clamp(52px,10.5cqh,96px);line-height:1.12;margin:0;letter-spacing:-1px}
.time-gate .title-content .eyebrow{font-size:clamp(10px,1.5cqh,13px);letter-spacing:3px;margin:0;line-height:1.6}
.time-gate .title-content h2{font-size:clamp(17px,2.7cqh,25px);line-height:1.5;margin:0;max-width:90%;text-wrap:balance}
.time-gate .title-content>p:not(.eyebrow){font-size:clamp(14px,2cqh,17px);line-height:1.7;margin:0;text-wrap:balance;max-width:90%;color:#d1d9d2}
.time-gate .title-rule{width:160px;height:14px;margin:0}
.gate-start{max-width:100%;margin:4px 0 0;padding:clamp(15px,2.5cqh,22px) 32px;font-size:clamp(14px,2cqh,18px);min-height:64px;flex-shrink:0}
.time-gate .title-secondary{margin:0;gap:20px;font-size:13px;min-height:28px;align-items:center;flex-wrap:wrap}
.time-gate .title-version{font-size:10px;letter-spacing:1.5px;line-height:1.5}
.gate-caption{bottom:max(14px,env(safe-area-inset-bottom));right:0;width:100%;font-size:9px;letter-spacing:1px;text-align:center;color:#c1b48e;min-height:24px;display:flex;align-items:center;justify-content:center;text-decoration:none}
.gate-audio{position:absolute;right:22px;bottom:18px;width:42px;height:42px;border:1px solid #a68d4c80;border-radius:50%;background:#102c30aa;color:#e3c079;font-size:24px;z-index:3;cursor:pointer}
.gate-audio:hover,.gate-audio:focus-visible{background:#375044;outline:2px solid #efd498}
.gate-mist{translate:var(--fog-x) var(--fog-y);transition:translate .9s ease-out}
body[data-screen=title] #hud .game-brand>span:last-child{font-family:var(--serif);font-weight:800}
@media(max-width:600px){.time-gate{padding:20px 18px 62px}.gate-depth{inset:14px 6px 34px}.gate-drum{width:min(94vw,calc(100svh - var(--hud-height) - 80px));top:50%;opacity:.44}.time-gate .title-content{gap:clamp(11px,2.3cqh,19px)}.time-gate .title-content h1{font-size:clamp(49px,min(15vw,11cqh),76px)}.time-gate .title-content h2{font-size:17px;max-width:100%}.time-gate .title-content>p:not(.eyebrow){font-size:14px;max-width:100%}.time-gate .title-content .eyebrow{font-size:10px;letter-spacing:1.6px}.gate-start{padding:18px 22px;font-size:14px}.gate-caption{font-size:8px;padding:0 55px;box-sizing:border-box}.gate-audio{right:12px;bottom:12px}.time-gate .title-secondary{font-size:12px}.time-gate .title-version{font-size:9px}}
@media(max-height:600px) and (min-width:601px){.time-gate{padding:14px 65px 36px}.time-gate .title-content{display:grid;grid-template-columns:1.1fr 1fr;gap:12px 35px;max-width:1050px}.time-gate .title-content .eyebrow{grid-column:1;grid-row:1;font-size:10px}.time-gate .title-content h1{grid-column:1;grid-row:2 / 6;font-size:clamp(45px,15cqh,74px)}.time-gate .title-content h2{grid-column:2;grid-row:1 / 3;font-size:18px;max-width:none}.time-gate .title-content>p:not(.eyebrow){grid-column:2;grid-row:3;font-size:14px;max-width:none}.time-gate .gate-start{grid-column:2;grid-row:4;padding:14px 15px;font-size:14px;min-height:58px}.time-gate .title-secondary{grid-column:2;grid-row:5;font-size:12px;justify-content:center;gap:12px}.time-gate .title-version{grid-column:1/-1;grid-row:6}.time-gate .title-rule{display:none}.gate-drum{width:min(70vw,calc(100svh - var(--hud-height) - 55px))}}
@media(max-width:600px) and (max-height:660px){.time-gate .title-content{gap:9px}.time-gate .title-content h1{font-size:clamp(42px,10cqh,58px)}.time-gate .title-content h2{font-size:15px}.time-gate .title-content>p:not(.eyebrow){font-size:13px}.gate-start{padding:13px 18px;min-height:58px}.time-gate .title-version{display:none}}
/* At extreme zoom or very small windows, retain reachable controls via scrolling. */
@media(max-height:350px),(max-width:300px){.time-gate{height:auto;min-height:calc(100svh - var(--hud-height));container-type:normal;padding-top:24px;padding-bottom:65px}.time-gate .title-content{display:flex;gap:12px}.time-gate .title-content h1{font-size:44px}.gate-drum{width:min(90vw,280px)}.gate-audio{bottom:10px}}
@media(prefers-reduced-motion:reduce){.gate-mist{translate:none}.time-gate .title-content h1{transform:none}}
.gate-start{animation:seal-ember 4s ease-in-out infinite}
.gate-arrived{animation:gate-land .65s ease-out both}
@keyframes seal-ember{50%{box-shadow:0 0 32px #e6a04166,inset 0 0 24px #efb94955;border-color:#ffe7aa}}
@keyframes gate-land{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.gate-arrived{animation:none}}
/* Supplied full-color PNG: retain its native gold and the complete rim. */
.gate-drum{mix-blend-mode:normal}
.gate-drum img{clip-path:none;filter:brightness(.9);object-fit:contain}
.time-gate .gate-start{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:17px;width:min(100%,410px);min-height:66px;padding:15px 22px;border:1px solid #cfa65b;border-radius:4px;clip-path:none;outline:none;background:linear-gradient(110deg,#182f30f5,#25483fee,#182f30f5);box-shadow:0 5px 20px #0005,inset 0 0 0 3px #0d242a,inset 0 0 0 4px #d7ad5b33;animation:none;color:#ffe3a5;font:750 16px/1.4 var(--serif);letter-spacing:.5px;transition:background .2s,box-shadow .2s,transform .2s}
.gate-start:before,.gate-start:after{content:"";position:absolute;top:-3px;bottom:-3px;width:7px;border-top:2px solid #f2d38f;border-bottom:2px solid #f2d38f;pointer-events:none}.gate-start:before{left:-3px;border-left:2px solid #f2d38f}.gate-start:after{right:-3px;border-right:2px solid #f2d38f}
.time-gate .gate-start span{animation:none;text-shadow:0 1px 2px #000;flex:1}
.gate-start-sigil{font-style:normal;font-size:25px;color:#e3bc73;line-height:1}.gate-start-arrow{font:27px/1 var(--sans);color:#e3bc73;transition:transform .2s}
.time-gate .gate-start:hover{filter:none;background:linear-gradient(110deg,#23443c,#375b48,#23443c);box-shadow:0 0 25px #d6aa4433,inset 0 0 0 3px #16332d;transform:translateY(-2px)}.gate-start:hover .gate-start-arrow{transform:translateX(3px)}.time-gate .gate-start:focus-visible{outline:2px solid #ffe2a1;outline-offset:6px}.time-gate .gate-start:active{transform:translateY(1px)}
.welcome-music-status{font:10px/1.5 var(--sans);letter-spacing:1px;color:#b6c4b6;min-height:15px}
@media(max-width:600px){.time-gate .gate-start{width:min(100%,350px);gap:10px;padding:14px 16px;min-height:62px;font-size:13px}.gate-start-sigil{font-size:22px}.gate-start-arrow{font-size:23px}.welcome-music-status{font-size:9px;letter-spacing:.5px}}
@media(max-height:600px) and (min-width:601px){.time-gate .welcome-music-status{grid-column:1/-1;grid-row:6}.time-gate .gate-start{padding:12px 15px;min-height:58px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.time-gate .gate-start,.gate-start-arrow{transition:none;transform:none!important}}
@font-face{font-family:'Dancing Script';font-style:normal;font-weight:400 700;font-display:swap;src:url('../../assets/experience/fonts/dancing-script-vietnamese.woff2') format('woff2')}
.time-gate .title-content h1,.time-gate .title-content h1 em{font-family:'Dancing Script',var(--serif);font-weight:700;font-style:normal;letter-spacing:0;line-height:1.18}
.time-gate .title-content h1{font-size:clamp(60px,12cqh,110px);text-shadow:0 2px 2px #0009,0 0 35px #dca54e55}
.time-gate .gate-start{width:min(100%,380px);min-height:70px;gap:0;padding:12px 32px;position:relative;border:3px double #a47236;border-radius:0;outline:1px solid #d8bc7c;outline-offset:3px;background:radial-gradient(ellipse at 15% 25%,#fff2cd88,transparent 65%),linear-gradient(100deg,#d0ac68,#f2dfad 15%,#e8cb8b 80%,#c49a54);color:#773121;box-shadow:0 5px 0 #6f502f,0 9px 18px #0005,inset 0 0 18px #88632433;font:700 30px/1.25 'Dancing Script',var(--serif);letter-spacing:0;transition:filter .2s,box-shadow .2s,transform .2s}
.time-gate .gate-start span{font:inherit;text-shadow:0 1px 0 #fff1c6;flex:none}
.time-gate .gate-start:before,.time-gate .gate-start:after{content:'❖';inset:auto;top:50%;translate:0 -50%;width:auto;height:auto;border:0;color:#9b5e30;font:14px/1 Georgia,serif}.time-gate .gate-start:before{left:11px}.time-gate .gate-start:after{right:11px}
.time-gate .gate-start:hover{background:radial-gradient(ellipse at 15% 25%,#fff2cd88,transparent 65%),linear-gradient(100deg,#d0ac68,#f2dfad 15%,#e8cb8b 80%,#c49a54);filter:brightness(1.07);transform:translateY(1px);box-shadow:0 3px 0 #6f502f,0 6px 12px #0005,inset 0 0 18px #88632433}
.time-gate .gate-start:active{transform:translateY(4px);box-shadow:0 1px 0 #6f502f}.time-gate .gate-start:focus-visible{outline:2px solid #ffe8ac;outline-offset:7px}
@media(max-width:600px){.time-gate .title-content h1{font-size:clamp(54px,min(18vw,12cqh),88px)}.time-gate .gate-start{width:min(100%,330px);font-size:27px;padding:11px 26px;min-height:64px}}
@media(max-height:600px) and (min-width:601px){.time-gate .title-content h1{font-size:clamp(48px,16cqh,80px)}.time-gate .gate-start{font-size:26px;min-height:60px;padding:9px 25px}}
@media(max-width:600px) and (max-height:660px){.time-gate .title-content h1{font-size:clamp(46px,11cqh,66px)}.time-gate .gate-start{font-size:25px;min-height:58px}}
@media(max-height:350px),(max-width:300px){.time-gate .title-content h1{font-size:52px}.time-gate .gate-start{font-size:25px;width:100%}}
.time-gate>.welcome-music-status{position:absolute;left:0;right:0;bottom:max(14px,env(safe-area-inset-bottom));width:100%;margin:0;padding:0 65px;box-sizing:border-box;min-height:24px;display:flex;align-items:center;justify-content:center;font:10px/1.6 var(--sans);letter-spacing:1px;color:#b6c4b6;text-align:center}
@media(max-width:600px){.time-gate>.welcome-music-status{font-size:9px;letter-spacing:.4px;padding:0 60px}}
/* Classroom scale: readable supporting copy, broad title, quiet background. */
.time-gate{padding:28px 32px 86px}
.time-gate .title-content{width:min(94%,1440px);gap:clamp(16px,2.8cqh,28px)}
.time-gate .title-content h1{font-size:clamp(90px,17cqh,156px);line-height:1.15}
.time-gate .title-content .eyebrow{font-size:clamp(18px,2.6cqh,24px);letter-spacing:2px;color:#f3ddb1}
.time-gate .title-content h2{font-size:clamp(28px,4.4cqh,40px);line-height:1.4;max-width:100%;color:#fff0cb}
.time-gate .title-content>p:not(.eyebrow){font-size:clamp(22px,3.2cqh,29px);line-height:1.5;color:#e8eee5;max-width:100%}
.time-gate .title-rule{width:230px;height:10px}
.time-gate .gate-start{width:min(100%,460px);min-height:86px;font-size:39px;padding:14px 36px}
.time-gate:after{background:radial-gradient(ellipse at 50% 45%,#07191eb0 0%,#07191e99 27%,transparent 65%,#07191e99 100%)}
.gate-drum{opacity:.43}
.time-gate>.welcome-music-status{font-size:18px;font-weight:500;line-height:1.5;padding:0 230px;bottom:max(23px,env(safe-area-inset-bottom));letter-spacing:0;color:#dde3cf}
.time-gate .gate-audio{bottom:16px;right:24px;width:auto;min-width:180px;height:52px;padding:0 16px;border-radius:3px;display:flex;gap:10px;align-items:center;justify-content:center;font:600 16px/1.3 var(--sans);background:#142f31;border-color:#b6995d;color:#f2d491}
.gate-audio>span:first-child{font:25px/1 var(--sans)}
@media(min-width:1100px) and (min-height:601px){.time-gate .title-content h1 br{display:none}.time-gate .title-content h1 em{display:inline-block;margin-left:.16em}}
@media(min-width:601px) and (max-width:1099px) and (min-height:601px){.time-gate .title-content{gap:16px}.time-gate .title-content h1{font-size:clamp(88px,14cqh,125px)}.time-gate .title-content h2{font-size:30px}.time-gate .title-content>p:not(.eyebrow){font-size:23px}.time-gate .gate-start{font-size:34px;min-height:76px}}
@media(max-width:600px){.time-gate{padding:20px 18px 90px}.time-gate .title-content{width:100%;gap:clamp(14px,2.4cqh,23px)}.time-gate .title-content h1{font-size:clamp(60px,min(20vw,13cqh),96px)}.time-gate .title-content .eyebrow{font-size:14px;letter-spacing:1px}.time-gate .title-content h2{font-size:23px;line-height:1.4}.time-gate .title-content>p:not(.eyebrow){font-size:18px}.time-gate .gate-start{font-size:31px;min-height:72px;width:min(100%,355px);padding:12px 25px}.time-gate .gate-audio{right:12px;bottom:15px;min-width:145px;height:48px;padding:0 10px;font-size:13px;gap:7px}.time-gate>.welcome-music-status{right:169px;left:12px;width:auto;padding:0;font-size:13px;line-height:1.4;bottom:18px;min-height:42px;text-align:left;justify-content:flex-start}}
@media(max-height:600px) and (min-width:601px){.time-gate{padding:16px 50px 75px}.time-gate .title-content{gap:14px 36px}.time-gate .title-content .eyebrow{font-size:15px}.time-gate .title-content h1{font-size:clamp(58px,18cqh,94px)}.time-gate .title-content h2{font-size:25px}.time-gate .title-content>p:not(.eyebrow){font-size:19px}.time-gate .gate-start{font-size:30px;min-height:68px}.time-gate .gate-audio{height:44px;min-width:160px;font-size:14px}.time-gate>.welcome-music-status{font-size:15px;padding:0 210px;bottom:20px}}
@media(max-width:600px) and (max-height:700px){.time-gate .title-content{gap:12px}.time-gate .title-content h1{font-size:clamp(56px,11cqh,75px)}.time-gate .title-content h2{font-size:20px}.time-gate .title-content>p:not(.eyebrow){font-size:17px}.time-gate .gate-start{font-size:29px;min-height:64px}}
@media(max-height:350px),(max-width:300px){.time-gate{height:auto;padding-bottom:105px}.time-gate .title-content h1{font-size:60px}.time-gate .title-content h2{font-size:22px}.time-gate .title-content>p:not(.eyebrow){font-size:18px}.time-gate .gate-start{font-size:27px;min-height:64px}.time-gate>.welcome-music-status{font-size:12px;left:12px;right:160px;padding:0;width:auto}}
@media(min-width:850px) and (max-width:1099px) and (min-height:601px){.time-gate .title-content h1{font-size:clamp(82px,10vw,112px)}.time-gate .title-content h1 br{display:none}.time-gate .title-content h1 em{display:inline-block;margin-left:.16em}}
@media(min-width:601px) and (max-width:849px) and (min-height:601px) and (max-height:750px){.time-gate .title-content{gap:10px}.time-gate .title-content h1{font-size:65px}.time-gate .title-content .eyebrow{font-size:16px}.time-gate .title-content h2{font-size:24px}.time-gate .title-content>p:not(.eyebrow){font-size:20px}.time-gate .gate-start{font-size:29px;min-height:64px}}
@media(max-width:600px) and (max-height:600px){.time-gate{height:auto;min-height:calc(100svh - var(--hud-height));container-type:normal}.time-gate .title-content h1{font-size:58px}}
.time-gate .gate-audio{width:46px;min-width:46px;height:46px;padding:0;border-radius:50%;bottom:max(16px,env(safe-area-inset-bottom));right:20px;background:#102c30cc;box-shadow:none}
.time-gate .gate-audio>span{font-size:25px;line-height:1}
.time-gate .gate-audio[data-playback=playing]{color:#ffde97;border-color:#d7b56d;background:#23403a}
.time-gate>.welcome-music-status{left:0;right:0;width:100%;padding:0 80px;bottom:max(23px,env(safe-area-inset-bottom));min-height:16px;font-size:11px;line-height:1.5;font-weight:400;letter-spacing:.3px;color:#b3bea9;text-align:center;justify-content:center}
.time-gate .gate-start{border-radius:16px;box-shadow:0 3px 5px #49311b88,0 7px 20px #0005,inset 0 0 18px #88632433;transition:transform .22s ease,filter .22s ease,box-shadow .22s ease,color .22s ease,background .22s ease}
.time-gate .gate-start:hover,.time-gate .gate-start:focus-visible{color:#6d2419;filter:brightness(1.14);background:radial-gradient(ellipse at 50% 0%,#fff8d6bb,transparent 70%),linear-gradient(100deg,#dab97b,#ffebbd 30%,#f6dca4 75%,#d5ac68);transform:translateY(-4px) scale(1.025);box-shadow:0 0 0 2px #fce0a166,0 0 30px #e5b75788,0 10px 24px #0006,inset 0 0 18px #ffe8b566}
.time-gate .gate-start:hover span,.time-gate .gate-start:focus-visible span{text-shadow:0 1px 0 #fff4d9,0 0 12px #fff0b4}
.time-gate .gate-start:active{filter:brightness(1.04);transform:translateY(2px) scale(.99);box-shadow:0 1px 3px #49311b99,inset 0 2px 10px #88632444}
@media(max-width:600px){.time-gate .gate-audio{right:12px;width:44px;min-width:44px;height:44px}.time-gate>.welcome-music-status{font-size:10px;padding:0 65px;bottom:max(24px,env(safe-area-inset-bottom))}.time-gate .gate-start{border-radius:13px}}
@media(prefers-reduced-motion:reduce){.time-gate .gate-start{transition:none}.time-gate .gate-start:hover,.time-gate .gate-start:focus-visible,.time-gate .gate-start:active{transform:none}}