@font-face{font-family:'TsuLiberte';src:url(f/liberte.woff) format('woff');font-weight:400;font-display:swap}
@font-face{font-family:'TsuOldEnglish';src:url(f/oldenglish.woff) format('woff');font-weight:400;font-display:swap}
@font-face{font-family:'TsuSerifSC';src:url(f/serifsc-400.woff) format('woff');font-weight:400;font-display:swap}
@font-face{font-family:'TsuSerifSC';src:url(f/serifsc-600.woff) format('woff');font-weight:600;font-display:swap}
:root{--W:min(100vw,520px);--u:calc(var(--W)/440);--ts:1;--ink:#000;--panel:#e7e7e8;
--gro:'TsuLiberte','IBM Plex Sans Thai','Helvetica Neue',Helvetica,Arial,sans-serif;--gw:400;--ole:'TsuOldEnglish',Georgia,serif;
--th:'IBM Plex Sans Thai','Noto Sans Thai',system-ui,sans-serif;--nth:'Noto Sans Thai','IBM Plex Sans Thai',system-ui,sans-serif;
--geo:Georgia,'Gelasio','Times New Roman',serif;--scr:'Monsieur La Doulaise',cursive;--cjk:'TsuSerifSC','Noto Serif SC','Noto Serif JP',serif;--thon:Thonburi,'Noto Sans Thai','Helvetica Neue',Arial,sans-serif}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%}
body{background:#e4e4e6;color:var(--ink);font-family:var(--th);overflow-x:hidden;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer}
img{display:block;max-width:none;-webkit-user-drag:none;user-select:none}
[hidden]{display:none!important}
.void{position:fixed;inset:0;z-index:0;background:#e4e4e6}
@keyframes nebula{to{transform:translate3d(4%,-1.5%,0) scale(1.06)}}
.flyer{position:fixed;left:0;top:0;z-index:35;width:22px;height:14px;pointer-events:none;filter:drop-shadow(0 2px 3px #0003);will-change:transform}
.flyer svg{width:100%;height:100%;overflow:visible;display:block}
.flyer .w1,.flyer .w2{fill:#111;transform-origin:8px 6px;animation:flapL .22s ease-in-out infinite alternate}
#sky{position:fixed;inset:0;z-index:30;pointer-events:none;width:100vw;height:100vh}
.page{position:relative;z-index:1;width:var(--W);margin:0 auto;min-height:100vh;overflow:hidden;background:var(--panel) url(a/bg.webp) top center/100% auto no-repeat;box-shadow:0 0 36px #0000001f}
.page::after{content:'';position:absolute;left:0;right:0;top:calc(956*var(--u));bottom:0;background:#e7e7e8;z-index:-1}
.hero{position:relative;height:calc(345*var(--u));pointer-events:none}
.cl-low{position:absolute;left:calc(-685*var(--u));top:calc(1188*var(--u));width:calc(1966*var(--u));height:calc(809*var(--u));pointer-events:none;opacity:.95}
.hero .cl-name{left:calc(88*var(--u));top:calc(80*var(--u));width:calc(264*var(--u));height:calc(106*var(--u))}
.hero .cl-top{left:calc(-365*var(--u));top:calc(-123*var(--u));width:calc(1070*var(--u));height:calc(450*var(--u))}
.anim .hero .cl-top{animation:drift 14s ease-in-out infinite alternate}
.anim .hero .cl-name{animation:cloudFloat 6s ease-in-out infinite}
@keyframes cloudFloat{0%,100%{transform:translate(0,0)}25%{transform:translate(calc(9*var(--u)),calc(-4*var(--u)))}50%{transform:translate(calc(2*var(--u)),calc(-8*var(--u)))}75%{transform:translate(calc(-8*var(--u)),calc(-3*var(--u)))}}
.anim .cl-low{animation:drift 34s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate3d(calc(22*var(--u)),calc(-6*var(--u)),0)}}
.hero>*{position:absolute}
.ring{left:calc(-16*var(--u));top:calc(-37*var(--u));width:calc(474*var(--u));height:calc(474*var(--u));background:url(a/ring.webp) center/contain no-repeat;opacity:.95}
.anim .ring,.anim .ring2,.anim .ring3{animation:ringFade 1.4s cubic-bezier(.2,.8,.2,1) both}
@keyframes ringFade{from{opacity:0;scale:.86}}
.ring2{left:calc(51*var(--u));top:calc(30*var(--u));width:calc(340*var(--u));height:calc(340*var(--u));opacity:.9}
.ring2 svg{width:100%;height:100%;display:block}
.ring3{left:calc(91*var(--u));top:calc(70*var(--u));width:calc(260*var(--u));height:calc(260*var(--u))}
.ring3 svg{width:100%;height:100%;display:block}
.ring2 svg,.ring3 svg{filter:drop-shadow(0 0 calc(3*var(--u)) #ffffffd0)}
.anim .ring3 svg{animation:runeGlow 4s ease-in-out infinite}
@keyframes runeGlow{50%{filter:drop-shadow(0 0 calc(6*var(--u)) #fff) drop-shadow(0 0 calc(2*var(--u)) #ffffffc0)}}
@keyframes spinr{to{transform:rotate(-360deg)}}
@keyframes spin{to{transform:rotate(360deg)}}
.brand{left:calc(88*var(--u));top:calc(80*var(--u));width:calc(264*var(--u));height:calc(106*var(--u))}
.brand .nm{position:absolute;left:calc(78*var(--u));top:0;font:400 calc(48*var(--u)*var(--ts))/calc(75*var(--u)) var(--scr);white-space:nowrap;text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.brand .tg{position:absolute;left:calc(119*var(--u));top:calc(57*var(--u));font:400 calc(7*var(--u)*var(--ts))/calc(8*var(--u)) var(--thon);white-space:nowrap}
.brand .tg+.tg{top:calc(65*var(--u))}
.brand img.logo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.heart{left:calc(64*var(--u));top:calc(106*var(--u));width:calc(276*var(--u));height:calc(226*var(--u))}
.heart>*{position:absolute}
.heart .under{inset:0;width:100%;height:100%}
.heart .photo{left:calc(68*var(--u));top:calc(68*var(--u));width:calc(167*var(--u));height:calc(139*var(--u));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 167 139'%3E%3Cpath d='M83.5 24C73 8 62 0 43 0 18 0 0 18 0 43c0 32 44 65 83.5 96C123 108 167 75 167 43 167 18 149 0 124 0 105 0 94 8 83.5 24Z'/%3E%3C/svg%3E") center/100% 100%;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 167 139'%3E%3Cpath d='M83.5 24C73 8 62 0 43 0 18 0 0 18 0 43c0 32 44 65 83.5 96C123 108 167 75 167 43 167 18 149 0 124 0 105 0 94 8 83.5 24Z'/%3E%3C/svg%3E") center/100% 100%;overflow:hidden;background:#ddd}
.heart .photo img{width:100%;height:100%;object-fit:cover}
@keyframes sheen{0%{transform:translateX(-120%)}35%,100%{transform:translateX(120%)}}
.heart .lace{left:calc(55*var(--u));top:calc(47*var(--u));width:calc(194*var(--u));height:calc(181*var(--u))}
.anim .heart{animation:heartIn 1.4s cubic-bezier(.2,.9,.25,1.1) both,float 7s ease-in-out 1.4s infinite,hbeat 3.2s ease-in-out 1.4s infinite}
@keyframes hbeat{0%,46%,100%{scale:1}8%{scale:1.045}16%{scale:.995}24%{scale:1.03}34%{scale:1}}
.heart::before{content:'';position:absolute;left:calc(30*var(--u));top:calc(40*var(--u));width:calc(216*var(--u));height:calc(180*var(--u));border-radius:50%;background:radial-gradient(closest-side,#ffffffe0,#ffffff60 45%,#fff0);opacity:0;pointer-events:none}
.anim .heart::before{animation:glowBeat 3.2s ease-in-out 1.4s infinite}
@keyframes glowBeat{0%,46%,100%{opacity:.25;transform:scale(.9)}10%{opacity:.9;transform:scale(1.06)}26%{opacity:.7;transform:scale(1.02)}}
.anim .heart .photo img{animation:shade 9s ease-in-out 1.4s infinite}
@keyframes shade{0%,100%{filter:brightness(1) contrast(1)}30%{filter:brightness(1.12) contrast(.92)}65%{filter:brightness(.86) contrast(1.15)}}
@keyframes heartIn{from{opacity:0;transform:translateY(calc(24*var(--u))) scale(.9);filter:blur(6px)}}
@keyframes float{50%{transform:translateY(calc(-5*var(--u)))}}
.anim .heart .lace{animation:laceGlow 5s ease-in-out infinite}
@keyframes laceGlow{50%{filter:drop-shadow(0 0 calc(6*var(--u)) #fff) drop-shadow(0 0 calc(2*var(--u)) #fff)}}
.anim .brand .nm,.anim .brand .tg,.anim .brand .logo{-webkit-mask:linear-gradient(90deg,#000 45%,transparent 55%) 100% 0/260% 100% no-repeat;mask:linear-gradient(90deg,#000 45%,transparent 55%) 100% 0/260% 100% no-repeat;animation:write 1.4s cubic-bezier(.55,.1,.35,1) both}
@keyframes write{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:0 0;mask-position:0 0}}
.brand .pen{position:absolute;left:calc(78*var(--u));top:calc(30*var(--u));width:calc(6*var(--u));height:calc(6*var(--u));border-radius:50%;background:#fff;box-shadow:0 0 calc(6*var(--u)) calc(2*var(--u)) #fff,0 0 calc(14*var(--u)) calc(4*var(--u)) #ffffffa0;opacity:0;pointer-events:none}
.anim .brand .pen{animation:pen 1.4s cubic-bezier(.55,.1,.35,1) both}
@keyframes pen{0%{opacity:0;transform:translate(0,calc(4*var(--u)))}8%{opacity:1}30%{transform:translate(calc(40*var(--u)),calc(-14*var(--u)))}55%{transform:translate(calc(90*var(--u)),calc(10*var(--u)))}80%{opacity:1;transform:translate(calc(140*var(--u)),calc(-6*var(--u)))}100%{opacity:0;transform:translate(calc(175*var(--u)),calc(6*var(--u)))}}
@keyframes fadeDown{from{opacity:0;transform:translateY(calc(-12*var(--u)));filter:blur(4px)}}
.hero .twinkle{width:calc(12*var(--u));height:calc(12*var(--u));pointer-events:none;background:radial-gradient(circle,#fff 0 18%,transparent 60%);opacity:0}
.hero .twinkle::before,.hero .twinkle::after{content:'';position:absolute;left:50%;top:50%;width:100%;height:calc(1.2*var(--u));background:linear-gradient(90deg,transparent,#fff,transparent);transform:translate(-50%,-50%)}
.hero .twinkle::after{transform:translate(-50%,-50%) rotate(90deg)}
.anim .hero .twinkle{animation:tw 3.2s ease-in-out infinite}
@keyframes tw{0%,100%{opacity:0;transform:scale(.3) rotate(0)}50%{opacity:1;transform:scale(1) rotate(45deg)}}
.stats{position:relative;height:calc(110*var(--u))}
.stats>*{position:absolute}
.kanji{left:calc(51*var(--u));top:calc(-8*var(--u));width:calc(58*var(--u));height:calc(114*var(--u))}
.kanji b{position:absolute;font:600 calc(48*var(--u)*var(--ts))/calc(69*var(--u)) var(--cjk);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.kanji .k1{left:calc(10*var(--u));top:0}.kanji .k2{left:0;top:calc(45*var(--u))}
.kanji .kana{position:absolute;left:0;top:calc(55*var(--u));width:calc(33*var(--u));height:calc(18*var(--u));font:400 calc(11*var(--u)*var(--ts))/calc(18*var(--u)) var(--cjk);white-space:nowrap;transform-origin:0 0;transform:rotate(-90deg);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.anim .kanji b{-webkit-mask:linear-gradient(180deg,#000 42%,transparent 58%) 0 100%/100% 260% no-repeat;mask:linear-gradient(180deg,#000 42%,transparent 58%) 0 100%/100% 260% no-repeat;animation:brush 1.4s cubic-bezier(.6,.05,.3,1) both}.anim .kanji .kana{animation:inkK 1.4s ease both}
@keyframes brush{from{-webkit-mask-position:0 100%;mask-position:0 100%;filter:blur(1.5px)}to{-webkit-mask-position:0 0;mask-position:0 0;filter:none}}
@keyframes inkK{from{opacity:0;filter:blur(6px)}}
@keyframes ink{from{opacity:0;filter:blur(8px);transform:translateY(calc(6*var(--u))) scale(1.15)}60%{opacity:1}}
.tp{left:calc(125*var(--u));top:calc(13*var(--u));width:calc(188*var(--u));height:calc(83*var(--u));border-radius:calc(20*var(--u));box-shadow:0 calc(2*var(--u)) calc(4*var(--u)) #00000040}
.tpi{position:absolute;inset:0;border-radius:calc(20*var(--u));overflow:hidden;isolation:isolate;-webkit-clip-path:inset(0 round calc(20*var(--u)));clip-path:inset(0 round calc(20*var(--u)));-webkit-mask-image:-webkit-radial-gradient(#fff,#000);background:#ececee}
.tpi::after{content:'';position:absolute;inset:0;border-radius:calc(20*var(--u));border:.5px solid #fff;box-shadow:inset calc(3*var(--u)) calc(5*var(--u)) calc(10*var(--u)) #ffffff40;pointer-events:none;z-index:3}
.tp canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;border-radius:calc(20*var(--u))}
.tp .ink-tx{position:absolute;inset:0;z-index:2;color:#fff;mix-blend-mode:difference;text-align:center}
.tp .lb{position:absolute;left:0;right:0;top:calc(4*var(--u));font:300 calc(10*var(--u)*var(--ts))/calc(14*var(--u)) var(--thon);letter-spacing:-.24px}
.tp .val{position:absolute;left:calc(8*var(--u));right:calc(8*var(--u));top:calc(18*var(--u));bottom:calc(5*var(--u));display:flex;flex-direction:column;align-items:center;justify-content:center}
.tp .val b{display:block;width:100%;text-align:center;font:400 calc(32*var(--u)*var(--ts))/calc(34*var(--u)) var(--geo)}
.tp .val b small{font-size:.5em}
.tp .val>span{display:block;width:100%;text-align:center;font:400 calc(9*var(--u)*var(--ts))/calc(13*var(--u)) var(--th);opacity:.9}
.tq{left:calc(334*var(--u));top:calc(7*var(--u));width:calc(54*var(--u));height:calc(89*var(--u));text-align:center}
.tq .l1{position:absolute;left:calc(-10*var(--u));right:calc(-10*var(--u));top:0;font:var(--gw) calc(14*var(--u)*var(--ts))/calc(20*var(--u)) var(--gro);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.tq .n{position:absolute;left:calc(-30*var(--u));right:calc(-30*var(--u));top:calc(20*var(--u));font:400 calc(52*var(--u)*var(--ts))/calc(52*var(--u)) var(--ole);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.tq .l2{position:absolute;left:calc(-10*var(--u));right:calc(-10*var(--u));top:calc(72*var(--u));font:var(--gw) calc(12*var(--u)*var(--ts))/calc(17*var(--u)) var(--gro);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.anim .tp,.anim .tq,.anim .rv-box,.anim .rv-tot{animation:rise 1.4s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(calc(14*var(--u)))}}
.notice{position:relative;margin:calc(15*var(--u)) calc(52*var(--u)) 0 calc(51*var(--u));height:calc(45*var(--u))}
.notice .lb{position:absolute;left:calc(2*var(--u));top:0;font:400 calc(12*var(--u)*var(--ts))/calc(18*var(--u)) var(--nth);letter-spacing:-.24px}
.notice .ln{position:absolute;left:calc(50*var(--u));right:calc(4*var(--u));top:calc(10*var(--u));height:0;border-top:.5px solid #000;transform-origin:left}
.notice .pill{position:absolute;left:0;right:0;top:calc(22*var(--u));height:calc(23*var(--u));border-radius:calc(50*var(--u));background:#ffffff80;border:.5px solid #fff;box-shadow:0 0 calc(4*var(--u)) #00000040;overflow:hidden}
.notice .pill .tx{position:absolute;left:calc(10*var(--u));top:calc(4*var(--u));white-space:nowrap;font:400 calc(10*var(--u)*var(--ts))/calc(15*var(--u)) var(--nth);letter-spacing:-.24px}
.notice .pill.run .tx{animation:marq var(--dur,14s) linear 1.5s infinite}
@keyframes marq{0%,8%{transform:translateX(0)}92%,100%{transform:translateX(var(--shift))}}
.anim .notice .ln{animation:draw 1.4s ease both}
@keyframes draw{from{transform:scaleX(0)}}
.mqfab{position:fixed;z-index:45;top:calc(calc(14*var(--u)) + env(safe-area-inset-top,0px));right:max(calc(12*var(--u)),calc(50vw - var(--W)/2 + calc(12*var(--u))));height:calc(32*var(--u));padding:0 calc(14*var(--u)) 0 calc(10*var(--u));border-radius:calc(20*var(--u));background:#ffffffeb;border:.5px solid #fff;box-shadow:0 calc(4*var(--u)) calc(14*var(--u)) #0000002e,0 0 calc(4*var(--u)) #00000040;display:flex;align-items:center;gap:calc(6*var(--u));font:400 calc(12*var(--u)*var(--ts))/1 var(--gro);color:#000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .2s}
.mqfab img{width:calc(19*var(--u));height:calc(12*var(--u));transform-origin:50% 70%;animation:flapS 2.4s ease-in-out infinite}
.mqfab::after{content:'';position:absolute;inset:calc(-3*var(--u));border-radius:inherit;border:1px solid #00000040;animation:fabRing 2.8s ease-out infinite;pointer-events:none}
@keyframes fabRing{0%{opacity:.9;transform:scale(.96)}100%{opacity:0;transform:scale(1.25)}}
.mqfab:active{transform:scale(.94)}
.anim .mqfab{animation:fabIn 1.4s cubic-bezier(.2,.8,.2,1) both}
@keyframes fabIn{from{opacity:0;transform:translateY(calc(-14*var(--u))) scale(.9)}}
.noanim .mqfab::after{display:none}
.mylist{display:grid;gap:calc(10*var(--u))}
.myq{display:flex;align-items:center;gap:calc(12*var(--u));width:100%;padding:calc(10*var(--u)) calc(14*var(--u));border-radius:calc(18*var(--u));background:#ffffffcc;box-shadow:0 0 calc(4*var(--u)) #00000030;text-align:left}
.myq .hn{position:relative;width:calc(38*var(--u));height:calc(35*var(--u));flex:none}.myq .hn svg{width:100%;height:100%;filter:drop-shadow(0 0 calc(2*var(--u)) #0004)}
.myq .hn b{position:absolute;inset:0;display:grid;place-items:center;font:400 calc(17*var(--u)*var(--ts))/1 var(--gro);padding-bottom:calc(2*var(--u))}
.myq .t{flex:1;min-width:0}.myq .t b{display:block;font:500 calc(12*var(--u)*var(--ts))/1.4 var(--th)}.myq .t small{display:block;font:400 calc(9*var(--u)*var(--ts))/1.4 var(--th);color:#666}
.myq .p{font:400 calc(24*var(--u)*var(--ts))/1 var(--geo)}.myq .p small{font-size:.5em}
.divider{position:relative;margin:calc(26*var(--u)) calc(52*var(--u)) 0 calc(51*var(--u));height:calc(17*var(--u))}
.stats+.divider{margin-top:calc(16*var(--u))}
.divider .ln{position:absolute;top:calc(10*var(--u));width:calc(132*var(--u));border-top:.5px solid #000}
.divider .ln.a{left:0}.divider .ln.b{right:0}
.divider .mo{position:absolute;left:50%;top:0;transform:translateX(-50%);font:var(--gw) calc(12*var(--u)*var(--ts))/calc(17*var(--u)) var(--gro);letter-spacing:-.24px;white-space:nowrap;padding:0 calc(4*var(--u));pointer-events:auto}
.divider .mo.pick{cursor:pointer}
.divider .mo.pick::after{content:'';display:inline-block;width:calc(4*var(--u));height:calc(4*var(--u));margin-left:calc(4*var(--u));border-right:1px solid #000;border-bottom:1px solid #000;transform:translateY(calc(-2*var(--u))) rotate(45deg)}
.chips{display:flex;gap:calc(7*var(--u));margin:calc(3*var(--u)) calc(34*var(--u)) 0 calc(33*var(--u));overflow-x:auto;scrollbar-width:none;padding:calc(3*var(--u)) 0 calc(6*var(--u));justify-content:space-between}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;height:calc(18*var(--u));min-width:calc(37*var(--u));padding:0 calc(8*var(--u));border-radius:calc(50*var(--u));background:#ffffff80;border:.5px solid #fff;box-shadow:0 0 calc(4*var(--u)) #00000040;font:500 calc(9*var(--u)*var(--ts))/calc(17*var(--u)) var(--th);letter-spacing:-.24px;white-space:nowrap;transition:background .35s,color .35s,transform .2s}
.chip.w{min-width:calc(54*var(--u))}
.chip.on{background:#7c7c7c;border-color:#595959;color:#fff}
.chip:active{transform:scale(.94)}
.qlist{position:relative;margin:calc(23*var(--u)) calc(34*var(--u)) 0 calc(33*var(--u));padding-bottom:calc(110*var(--u));min-height:calc(120*var(--u))}
.qc:focus,.rc:focus{outline:none}
.qc{position:relative;height:calc(67*var(--u));margin-bottom:calc(12*var(--u));display:block;width:100%;text-align:left}
.qc .l{position:absolute;left:0;top:0;width:calc(271*var(--u));height:calc(67*var(--u));border-radius:calc(15*var(--u));background:#1c1c1c1a;box-shadow:0 calc(2*var(--u)) calc(4*var(--u)) #00000040;overflow:hidden}
.qc .l::before,.qc .r::before{content:'';position:absolute;inset:0;pointer-events:none;--dc:#fff;background:radial-gradient(circle,var(--dc) calc(1.1*var(--u)),transparent calc(1.3*var(--u))) 0 0/calc(13.2*var(--u)) calc(26.4*var(--u)),radial-gradient(circle,var(--dc) calc(1.1*var(--u)),transparent calc(1.3*var(--u))) calc(6.6*var(--u)) calc(13.2*var(--u))/calc(13.2*var(--u)) calc(26.4*var(--u));opacity:.5}
.qc .r::before{--dc:#000;opacity:.1}
.qc .hn{position:absolute;left:calc(12*var(--u));top:calc(15*var(--u));width:calc(43*var(--u));height:calc(40*var(--u));filter:drop-shadow(0 0 calc(2*var(--u)) #00000040)}
.qc .hn svg{width:100%;height:100%;display:block}
.qc .hn b{position:absolute;inset:0;display:grid;place-items:center;font:var(--gw) calc(24*var(--u)*var(--ts))/1 var(--gro);letter-spacing:-.24px;padding-bottom:calc(3*var(--u))}
.qc .nm{position:absolute;left:calc(67*var(--u));top:calc(14*var(--u));max-width:calc(66*var(--u));font:400 calc(12*var(--u)*var(--ts))/calc(20*var(--u)) var(--th);letter-spacing:-.24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 0 calc(4*var(--u)*var(--ts)) #fff}
.qc .wk{position:absolute;left:calc(67*var(--u));top:calc(31*var(--u));max-width:calc(68*var(--u));font:500 calc(14*var(--u)*var(--ts))/calc(23*var(--u)) var(--th);letter-spacing:-.24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 0 calc(4*var(--u)*var(--ts)) #fff}
.qc .bar{position:absolute;left:calc(135*var(--u));top:calc(30*var(--u));width:calc(114*var(--u));height:calc(15*var(--u));border-radius:calc(20*var(--u));background:#fff;box-shadow:0 0 calc(4*var(--u)) #00000040}
.qc .bar i{position:absolute;left:calc(2*var(--u));top:calc(2*var(--u));height:calc(11*var(--u));width:var(--w,calc(11*var(--u)));border-radius:calc(20*var(--u));background:linear-gradient(90deg,#acacac,#000);transform-origin:left;overflow:hidden}
.qc .bar i::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#ffffff8c,transparent);transform:translateX(-100%)}
.anim .qc.vis .bar i::after{animation:barShine 3.2s ease-in-out infinite}
@keyframes barShine{60%,100%{transform:translateX(100%)}}
.qc .bf{position:absolute;top:calc(-14*var(--u));right:calc(-1*var(--u));width:calc(16*var(--u));height:calc(10*var(--u));filter:drop-shadow(0 0 calc(2*var(--u)) #00000040)}
.qc .bf svg{width:100%;height:100%;display:block;overflow:visible}
.anim .qc .bf .w1{transform-origin:calc(8*var(--u)) calc(6*var(--u));animation:flapL .55s ease-in-out infinite alternate}
.anim .qc .bf .w2{transform-origin:calc(8*var(--u)) calc(6*var(--u));animation:flapR .55s ease-in-out infinite alternate}
@keyframes flapL{to{transform:scaleX(.35)}}
@keyframes flapR{to{transform:scaleX(.35)}}
.anim .qc .bf{animation:hover 2.2s ease-in-out infinite}
.anim .qc.vis .bf{animation:bfRide 1.4s cubic-bezier(.3,.8,.2,1) both,hover 2.2s ease-in-out 1.4s infinite}
@keyframes bfRide{from{transform:translateX(calc(-1*var(--bx,0px))) rotate(-14deg)}60%{transform:translateX(calc(-.15*var(--bx,0px))) translateY(calc(-4*var(--u))) rotate(8deg)}}
@keyframes hover{50%{transform:translate(calc(1*var(--u)),calc(-3*var(--u))) rotate(-6deg)}}
.qc .r{position:absolute;left:calc(280*var(--u));top:0;width:calc(93*var(--u));height:calc(67*var(--u));border-radius:calc(15*var(--u));background:#fffc;box-shadow:0 calc(2*var(--u)) calc(4*var(--u)) #00000040;overflow:hidden;text-align:center}
.qc .r .en{position:absolute;left:0;right:0;top:calc(5*var(--u));font:400 calc(9*var(--u)*var(--ts))/calc(15*var(--u)) var(--th);letter-spacing:-.24px;text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040;white-space:nowrap}
.qc .r .pc{position:absolute;left:0;right:0;top:calc(8*var(--u));font:400 calc(32*var(--u)*var(--ts))/calc(41*var(--u)) var(--geo);letter-spacing:-.24px;text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040;white-space:nowrap}
.qc .r .pc small{font-size:.55em}
.qc .r .th{position:absolute;left:calc(2*var(--u));right:calc(2*var(--u));top:calc(49*var(--u));font:500 calc(8*var(--u)*var(--ts))/calc(13*var(--u)) var(--th);letter-spacing:-.24px;text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.anim .qc{opacity:0;transform:translateY(calc(26*var(--u))) scale(.96);filter:blur(4px)}
.anim .qc.vis{opacity:1;transform:none;filter:none;transition:opacity 1.4s ease,transform 1.4s cubic-bezier(.2,.8,.2,1),filter 1.4s}
.anim .qc.vis .bar i{animation:fill 1.4s cubic-bezier(.3,.8,.2,1) both}
@keyframes fill{from{transform:scaleX(.05)}}
.qc:active .l,.qc:active .r{transform:scale(.98)}
.qc .l,.qc .r{transition:transform .2s,box-shadow .45s,filter .45s}
.qc,.rc{transform-style:preserve-3d}
.anim .qc.tilt,.anim .rc.tilt{transform:perspective(700px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))!important;transition:transform .25s ease-out!important}
.qc.glow .l,.qc.glow .r,.rc.glow .bb,.rc.glow .av{box-shadow:0 0 0 .6px #fff,0 0 calc(12*var(--u)) #fffffff0,0 0 calc(26*var(--u)) #ffffffa0,0 calc(4*var(--u)) calc(12*var(--u)) #0003;filter:brightness(1.05)}
.qc .r::after,.rc .bb::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,#ffffffd9 50%,transparent 65%);transform:translateX(-120%);pointer-events:none}
.qc.glow .r::after,.rc.glow .bb::after{animation:sweep .8s ease-out}
.qc.glow .l::before{opacity:1;transition:opacity .3s}
@keyframes sweep{to{transform:translateX(120%)}}
.qc.hit .l::after{content:'';position:absolute;left:var(--x);top:var(--y);width:calc(10*var(--u));height:calc(10*var(--u));border-radius:50%;background:#fff;transform:translate(-50%,-50%);animation:rip .7s ease-out forwards}
@keyframes rip{to{width:calc(400*var(--u));height:calc(400*var(--u));opacity:0}}
.qc .me{position:absolute;left:calc(12*var(--u));top:calc(-7*var(--u));z-index:3;height:calc(14*var(--u));padding:0 calc(7*var(--u));border-radius:calc(20*var(--u));background:#000;color:#fff;font:500 calc(7*var(--u)*var(--ts))/calc(14*var(--u)) var(--th);box-shadow:0 0 calc(6*var(--u)) #fff,0 0 calc(2*var(--u)) #0006;pointer-events:none}
.qc.mine .l{box-shadow:0 0 0 .8px #fff,0 0 calc(10*var(--u)) #ffffffc0,0 calc(2*var(--u)) calc(4*var(--u)) #00000040}
.anim .qc.mine .me{animation:mePulse 2.4s ease-in-out infinite}
@keyframes mePulse{50%{box-shadow:0 0 calc(12*var(--u)) #fff,0 0 calc(2*var(--u)) #0006}}
.fm.shake{animation:shake .45s ease}
@keyframes shake{20%,60%{transform:translateX(calc(-6*var(--u)))}40%,80%{transform:translateX(calc(6*var(--u)))}}
.empty{padding:calc(40*var(--u)) calc(10*var(--u));text-align:center;font:400 calc(11*var(--u)*var(--ts))/1.6 var(--th);color:#555}
.rv-box{left:calc(51*var(--u));top:calc(10*var(--u));width:calc(246*var(--u));height:calc(87*var(--u));border-radius:calc(20*var(--u));background:linear-gradient(105deg,#fff 0%,#999 100%);border:.5px solid #fff;box-shadow:0 calc(2*var(--u)) calc(4*var(--u)) #00000040,inset calc(3*var(--u)) calc(5*var(--u)) calc(10*var(--u)) #ffffff40;overflow:hidden}
.rv-box::before{content:'';position:absolute;inset:0;background:#ffffffb3}
.rv-box>*{position:absolute;z-index:1}
.rv-box .thx{left:0;right:0;top:0;text-align:center;font:400 calc(6.5*var(--u)*var(--ts))/calc(24*var(--u)) var(--th)}
.rv-box .row{left:calc(13*var(--u));right:calc(13*var(--u));height:calc(11.4*var(--u));display:flex;align-items:center;gap:calc(6*var(--u));font:400 calc(7*var(--u)*var(--ts))/1 var(--geo)}
.rv-box .row .d{width:calc(4*var(--u));text-align:left}
.rv-box .row .tr{flex:1;height:calc(3.2*var(--u));border-radius:calc(3*var(--u));background:#0003;position:relative;overflow:hidden}
.rv-box .row .tr i{position:absolute;left:0;top:0;bottom:0;width:var(--w,0);border-radius:calc(3*var(--u));background:linear-gradient(90deg,#000,#7a7a7a)}
.anim .rv-box .row .tr i{animation:fill 1.4s cubic-bezier(.3,.8,.2,1) both}
.rv-box .row .c{width:calc(18*var(--u));text-align:right}
.rv-tot{left:calc(309*var(--u));top:calc(10*var(--u));width:calc(79*var(--u));height:calc(81*var(--u));text-align:center}
.rv-tot .l1{position:absolute;left:calc(-10*var(--u));right:calc(-10*var(--u));top:0;font:var(--gw) calc(14*var(--u)*var(--ts))/calc(20*var(--u)) var(--gro);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.rv-tot .n{position:absolute;left:calc(-20*var(--u));right:calc(-20*var(--u));top:calc(15*var(--u));font:400 calc(52*var(--u)*var(--ts))/calc(52*var(--u)) var(--ole);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040}
.rv-tot .l2{position:absolute;left:calc(-10*var(--u));right:calc(-10*var(--u));top:calc(67*var(--u));font:var(--gw) calc(10*var(--u)*var(--ts))/calc(14*var(--u)) var(--gro);text-shadow:0 0 calc(4*var(--u)*var(--ts)) #00000040;white-space:nowrap}
.wr{position:relative;margin:calc(9*var(--u)) calc(53*var(--u)) 0 calc(51*var(--u));height:calc(23*var(--u))}
.wr .ln{position:absolute;top:calc(12*var(--u));width:calc(81*var(--u));border-top:.5px solid #000}
.wr .ln.a{left:0}.wr .ln.b{right:0}
.wr button{position:absolute;left:calc(103*var(--u));top:0;width:calc(131*var(--u));height:calc(23*var(--u));border-radius:calc(20*var(--u));background:#7c7c7c;border:.5px solid #686869;box-shadow:0 0 calc(4*var(--u)) #00000040;color:#fff;font:var(--gw) calc(11*var(--u)*var(--ts))/calc(16*var(--u)) var(--gro);display:flex;align-items:center;justify-content:center;gap:calc(6*var(--u));overflow:hidden}
.wr button svg{width:calc(13*var(--u));height:calc(13*var(--u))}
.wr button::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#ffffff59 50%,transparent 65%);transform:translateX(-100%)}
.anim .wr button::after{animation:barShine 4s ease-in-out 2s infinite}
.rlist{position:relative;margin:calc(20*var(--u)) calc(60*var(--u)) 0 calc(49*var(--u));padding-bottom:calc(110*var(--u))}
.rc{position:relative;min-height:calc(82*var(--u));margin-bottom:calc(9*var(--u));display:block;width:100%;text-align:left}
.rc .av{position:absolute;left:calc(6*var(--u));top:0;width:calc(52*var(--u));height:calc(52*var(--u));border-radius:50%;background:#fff;box-shadow:0 0 calc(4*var(--u)) #00000040;overflow:hidden;display:grid;place-items:center}
.rc .av img.p{width:100%;height:100%;object-fit:cover}
.rc .av svg{width:calc(34*var(--u));height:calc(22*var(--u))}
.rc .av img.bfly{filter:drop-shadow(0 0 calc(2*var(--u)) #00000040)}
.anim .rc .av img.bfly{animation:flapS 2.8s ease-in-out infinite}
@keyframes flapS{0%,70%,100%{transform:scaleX(1)}80%{transform:scaleX(.45)}90%{transform:scaleX(1)}}
.rc .who{position:absolute;left:0;top:calc(52*var(--u));width:calc(63*var(--u));text-align:center;font:600 calc(10*var(--u)*var(--ts))/calc(19*var(--u)) var(--th);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc .ch{position:absolute;left:0;top:calc(63*var(--u));width:calc(63*var(--u));text-align:center;font:400 calc(9*var(--u)*var(--ts))/calc(19*var(--u)) var(--th);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc .bb{display:block;margin-left:calc(71*var(--u));width:calc(260*var(--u));min-height:calc(76*var(--u));border-radius:calc(20*var(--u)) calc(20*var(--u)) calc(20*var(--u)) calc(5*var(--u));background:#fff;box-shadow:0 0 calc(4*var(--u)) #00000040;padding:calc(9*var(--u)) calc(15*var(--u)) calc(7*var(--u));font:500 calc(7.5*var(--u)*var(--ts))/calc(12*var(--u)) var(--th);overflow:hidden;position:relative}
.rc .bb .tx{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.rc .bb .pin{position:absolute;right:calc(9*var(--u));top:calc(5*var(--u));font-size:calc(8*var(--u)*var(--ts))}
.rc .bb .rep{margin-top:calc(4*var(--u));padding-top:calc(4*var(--u));border-top:.5px dashed #0004;color:#555;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.anim .rc{opacity:0;transform:translateX(calc(-14*var(--u)))}
.anim .rc.vis{opacity:1;transform:none;transition:opacity 1.4s ease,transform 1.4s cubic-bezier(.2,.8,.2,1)}
.vwin{position:relative;height:calc(330*var(--u));overflow:hidden;margin:0 calc(-10*var(--u));padding:0 calc(10*var(--u));-webkit-mask:linear-gradient(transparent,#000 9%,#000 90%,transparent);mask:linear-gradient(transparent,#000 9%,#000 90%,transparent)}
.vtrack{padding-top:calc(16*var(--u));animation:vmarq var(--dur,30s) linear infinite;will-change:transform}
.vtrack .rc,.vclone .rc{opacity:1!important;transform:none!important}
.vwin.hold .vtrack,.vwin.off .vtrack{animation-play-state:paused}
@keyframes vmarq{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-50%,0)}}
.noanim .vtrack{animation:none!important}.noanim .vclone{display:none}
.vwin+.more{margin-top:calc(10*var(--u))}
.more{display:block;margin:calc(6*var(--u)) auto 0;height:calc(23*var(--u));padding:0 calc(16*var(--u));border-radius:calc(20*var(--u));background:#ffffff80;border:.5px solid #fff;box-shadow:0 0 calc(4*var(--u)) #00000040;font:var(--gw) calc(10*var(--u)*var(--ts))/calc(22*var(--u)) var(--gro)}
.nav{position:fixed;z-index:40;left:50%;bottom:calc(35*var(--u) + env(safe-area-inset-bottom,0px));width:calc(335*var(--u));height:calc(39*var(--u));transform:translateX(-50%);display:flex;gap:calc(10*var(--u))}
.nav button{position:relative;width:calc(105*var(--u));height:calc(38*var(--u));border-radius:calc(50*var(--u));background:#fff;border:.5px solid #f2f2f2;box-shadow:0 0 calc(4*var(--u)) #00000040;font:var(--gw) calc(14*var(--u)*var(--ts))/calc(20*var(--u)) var(--gro);letter-spacing:-.24px;color:#000;transition:background .45s,color .45s,transform .2s;overflow:hidden}
.nav button.on{background:#000;color:#fff;border-color:#545454}
.nav button:active{transform:scale(.95)}
.nav button.on::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 120%,#ffffff40,transparent 60%);animation:navGlow 3s ease-in-out infinite}
@keyframes navGlow{50%{opacity:.3}}
.anim .nav{animation:navIn 1.4s cubic-bezier(.2,.8,.2,1) both}
@keyframes navIn{from{opacity:0;transform:translate(-50%,calc(30*var(--u)))}}
body #amu{top:calc(calc(14*var(--u)) + env(safe-area-inset-top,0px))!important;bottom:auto!important;left:max(calc(12*var(--u)),calc(50vw - var(--W)/2 + calc(12*var(--u))))!important;height:calc(32*var(--u));padding:0 calc(12*var(--u)) 0 calc(4*var(--u));gap:calc(7*var(--u));border-radius:calc(20*var(--u));background:#ffffffeb;border:.5px solid #fff;box-shadow:0 calc(4*var(--u)) calc(14*var(--u)) #0000002e,0 0 calc(4*var(--u)) #00000040;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font:400 calc(12*var(--u)*var(--ts))/1 var(--gro);color:#000;z-index:45;pointer-events:auto}
body #amu::after{content:'';position:absolute;inset:calc(-3*var(--u));border-radius:inherit;border:1px solid #00000040;animation:fabRing 2.8s ease-out infinite;pointer-events:none}
body #amu.on::after{display:none}
body #amu .disc{width:calc(24*var(--u));height:calc(24*var(--u));box-shadow:0 0 0 1.5px #fff,0 1px 4px #0006;background:radial-gradient(circle,#fff 0 13%,#111 15% 30%,#2b2b2e 31% 33%,#111 34% 52%,#2b2b2e 53% 55%,#111 56%)}
body #amu .disc::after{background:conic-gradient(from 30deg,#fff0 0 38%,#ffffff40 44%,#fff0 50% 88%,#ffffff30 94%,#fff0)}
body #amu .note{display:none}
body #amu .pill{background:none;border:0;box-shadow:none;padding:0;font:400 calc(12*var(--u)*var(--ts))/1 var(--gro);color:#000;max-width:40vw}
body #amu.wait .pill{animation:none}
body #amu .eq,body #amu.on .eq{display:none}
body #amu .nx{width:auto;height:auto;border:0;background:none;color:#000;font:400 calc(11*var(--u)*var(--ts))/1 var(--gro);padding:0 0 0 calc(2*var(--u));opacity:.7}
body #amu.on::before{content:'music';font:400 calc(12*var(--u)*var(--ts))/1 var(--gro);order:1}
body #amu .disc{order:0}body #amu .nx{order:3}
.anim body #amu,body.anim #amu{animation:fabIn 1.4s cubic-bezier(.2,.8,.2,1) both}
.hold #amu{animation-play-state:paused!important}
.view{position:relative}
.view.out{animation:viewOut .35s ease both}
.view.in{animation:viewIn .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes viewOut{to{opacity:0;filter:blur(6px);transform:translateY(calc(10*var(--u)))}}
@keyframes viewIn{from{opacity:0;filter:blur(8px);transform:translateY(calc(-8*var(--u)))}}
.mo-bg{position:fixed;inset:0;z-index:60;background:#0b0b0e66;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));opacity:0;transition:opacity .4s}
.mo-bg.on{opacity:1}
.sheet{--gx:50%;--gy:0%;position:relative;width:min(420px,100%);max-height:100%;overflow:auto;border-radius:36px;padding:38px 24px 24px;
background:radial-gradient(130% 130px at var(--gx) 0,#00000052,#40404078 28%,#80808066 56%,#ffffff00 100%),radial-gradient(60% 50% at var(--gx) var(--gy),#ffffff55,#fff0 70%),#f3f3f4;
box-shadow:0 4px 10px #00000040,0 20px 60px #0000004d,inset 0 0 0 .5px #ffffffb0;
transform:translateY(24px) scale(.92);opacity:0;filter:blur(6px);transition:transform .6s cubic-bezier(.2,.9,.25,1.08),opacity .45s,filter .5s;scrollbar-width:none}
.sheet::-webkit-scrollbar{display:none}
.mo-bg.on .sheet{transform:none;opacity:1;filter:none}
.sheet::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle,#000 1px,transparent 1.3px) 0 0/16px 32px,radial-gradient(circle,#000 1px,transparent 1.3px) 8px 16px/16px 32px;opacity:.04}
.sheet .x{position:absolute;right:16px;top:14px;width:32px;height:32px;border-radius:50%;background:#ffffffe6;box-shadow:0 0 4px #00000040;font:400 18px/32px var(--gro);z-index:3;transition:transform .3s}
.sheet .x:hover{transform:rotate(90deg)}
.sheet h3{position:relative;margin:0 0 4px;text-align:center;font:400 26px/1.2 var(--gro);letter-spacing:-.4px;color:#fff;text-shadow:0 0 4px #00000080,0 0 14px #0005}
.sheet .sub{position:relative;text-align:center;font:400 12px/1.5 var(--th);color:#fff;text-shadow:0 0 4px #000000a0,0 0 10px #0006;margin-bottom:22px}
.sheet .fm,.sheet .clist,.sheet .mlist,.sheet .mylist,.sheet .big,.sheet .pv{position:relative}
.dl{display:grid;grid-template-columns:auto 1fr;gap:calc(8*var(--u)) calc(14*var(--u));background:#ffffffb3;border-radius:calc(18*var(--u));padding:calc(14*var(--u)) calc(16*var(--u));box-shadow:0 0 calc(4*var(--u)) #00000030;font:400 calc(11*var(--u)*var(--ts))/1.5 var(--th)}
.dl dt{color:#666;white-space:nowrap}.dl dd{margin:0;font-weight:500;word-break:break-word}
.big{display:flex;align-items:center;justify-content:center;gap:calc(14*var(--u));margin:calc(6*var(--u)) 0 calc(14*var(--u))}
.big .hn{position:relative;width:calc(64*var(--u));height:calc(60*var(--u))}
.big .hn svg{width:100%;height:100%}
.big .hn b{position:absolute;inset:0;display:grid;place-items:center;font:var(--gw) calc(30*var(--u)*var(--ts))/1 var(--gro);padding-bottom:calc(4*var(--u))}
.big .pc{font:400 calc(46*var(--u)*var(--ts))/1 var(--geo)}.big .pc small{font-size:.5em}
.ptrack{height:calc(14*var(--u));border-radius:calc(20*var(--u));background:#fff;box-shadow:0 0 calc(4*var(--u)) #00000040;padding:calc(2*var(--u));margin:calc(4*var(--u)) 0 calc(16*var(--u));position:relative}
.ptrack i{display:block;height:100%;border-radius:calc(20*var(--u));background:linear-gradient(90deg,#acacac,#000);width:var(--w);animation:fill 1.2s cubic-bezier(.3,.8,.2,1) both}
.steps{display:flex;justify-content:space-between;margin:calc(-6*var(--u)) calc(2*var(--u)) calc(14*var(--u));font:400 calc(8*var(--u)*var(--ts))/1.3 var(--th);color:#777}
.steps span{flex:1;text-align:center;position:relative;padding-top:calc(10*var(--u))}
.steps span::before{content:'';position:absolute;left:50%;top:0;width:calc(6*var(--u));height:calc(6*var(--u));border-radius:50%;background:#bbb;transform:translateX(-50%)}
.steps span.ok{color:#000}.steps span.ok::before{background:#000;box-shadow:0 0 calc(6*var(--u)) #0006}
.note{margin-top:calc(12*var(--u));padding:calc(12*var(--u)) calc(14*var(--u));border-radius:calc(18*var(--u)) calc(18*var(--u)) calc(18*var(--u)) calc(5*var(--u));background:#fff;box-shadow:0 0 calc(4*var(--u)) #00000030;font:400 calc(11*var(--u)*var(--ts))/1.6 var(--th);white-space:pre-wrap}
.clist{display:grid;gap:calc(10*var(--u))}
.clink{display:flex;align-items:center;gap:calc(12*var(--u));padding:calc(12*var(--u)) calc(16*var(--u));border-radius:calc(50*var(--u));background:#fff;box-shadow:0 0 calc(4*var(--u)) #00000040;text-decoration:none;color:#000;font:var(--gw) calc(13*var(--u)*var(--ts))/1.3 var(--gro);transition:transform .2s,background .3s}
.clink:active{transform:scale(.97)}
.clink .ic{width:calc(32*var(--u));height:calc(32*var(--u));border-radius:50%;background:#000;color:#fff;display:grid;place-items:center;font:600 calc(11*var(--u)*var(--ts))/1 var(--gro);flex:none}
.clink small{display:block;font:400 calc(10*var(--u)*var(--ts))/1.3 var(--th);color:#666}
.mlist{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(8*var(--u))}
.mlist button{height:calc(40*var(--u));border-radius:calc(50*var(--u));background:#ffffffb3;box-shadow:0 0 calc(4*var(--u)) #00000040;font:var(--gw) calc(12*var(--u)*var(--ts))/1 var(--gro)}
.mlist button.on{background:#000;color:#fff}
.fm label{display:block;margin:0 0 calc(12*var(--u))}
.fm label>span{display:block;font:500 calc(11*var(--u)*var(--ts))/1.4 var(--th);margin:0 0 calc(5*var(--u)) calc(4*var(--u))}
.fm input[type=text],.fm textarea,.fm select{width:100%;border:.5px solid #fff;border-radius:calc(16*var(--u));background:#ffffffcc;box-shadow:0 0 calc(4*var(--u)) #00000030;padding:calc(10*var(--u)) calc(14*var(--u));font:400 calc(12*var(--u)*var(--ts))/1.5 var(--th);color:#000;outline:none;resize:vertical}
.fm textarea{min-height:calc(90*var(--u))}
.fm input:focus,.fm textarea:focus,.fm select:focus{box-shadow:0 0 0 1.5px #000,0 0 calc(10*var(--u)) #0003}
.stars{display:flex;gap:8px;justify-content:center;margin:2px 0 16px}
.stars button{width:46px;height:34px;opacity:.28;transition:opacity .25s,transform .35s cubic-bezier(.2,.9,.25,1.4)}
.stars button.on{opacity:1;transform:translateY(-3px)}
.stars button:active{transform:scale(.8)}
.stars svg{width:100%;height:100%;overflow:visible}
svg.bfr path{fill:#000}
.stars button.on svg.bfr .w1,.stars button.on svg.bfr .w2,.rstars svg.bfr.on .w1,.rstars svg.bfr.on .w2{transform-origin:8px 6px;animation:flapL .45s ease-in-out infinite alternate}
svg.bfr:not(.on) path{fill:#0003}
.phs{display:flex;gap:calc(8*var(--u));flex-wrap:wrap}
.ph{position:relative;width:calc(64*var(--u));height:calc(64*var(--u));border-radius:calc(14*var(--u));background:#ffffffb3;box-shadow:0 0 calc(4*var(--u)) #00000030;display:grid;place-items:center;font:var(--gw) calc(22*var(--u)*var(--ts))/1 var(--gro);overflow:hidden}
.ph img{width:100%;height:100%;object-fit:cover}
.ph input{position:absolute;inset:0;opacity:0;cursor:pointer}
.ph .rm{position:absolute;right:calc(3*var(--u));top:calc(3*var(--u));width:calc(18*var(--u));height:calc(18*var(--u));border-radius:50%;background:#000;color:#fff;font:var(--gw) calc(12*var(--u)*var(--ts))/calc(18*var(--u)) var(--gro)}
.avbtn{width:calc(64*var(--u));height:calc(64*var(--u));border-radius:50%}
.btn{display:block;width:100%;height:calc(44*var(--u));border-radius:calc(50*var(--u));background:#000;color:#fff;box-shadow:0 0 calc(6*var(--u)) #00000060;font:var(--gw) calc(15*var(--u)*var(--ts))/calc(44*var(--u)) var(--gro);margin-top:calc(6*var(--u));position:relative;overflow:hidden}
.btn:disabled{opacity:.5}
.btn::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#ffffff40 50%,transparent 65%);transform:translateX(-100%);animation:barShine 3s ease-in-out infinite}
.err{color:#b00;font:500 calc(11*var(--u)*var(--ts))/1.5 var(--th);text-align:center;margin:calc(6*var(--u)) 0}
.rstars{display:inline-flex;gap:4px;margin-top:4px}
.rstars svg{width:22px;height:14px;overflow:visible}
.sheet.rv{width:min(480px,100%)}
.mhead{position:relative;display:flex;align-items:center;gap:14px;margin:-8px 30px 18px 0}
.rav{flex:none;width:66px;height:66px;border-radius:50%;background:#fff;box-shadow:0 0 6px #00000050;overflow:hidden;display:grid;place-items:center}
.rav img{width:100%;height:100%;object-fit:cover}.rav img.bfly{width:40px;height:26px;object-fit:contain}
.mh-t{min-width:0}.mh-t small{display:block;font:400 12px/1.4 var(--th);color:#fff;text-shadow:0 0 4px #00000080}
.mh-t b{display:block;font:600 20px/1.3 var(--th);color:#fff;text-shadow:0 0 6px #00000080;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mh-t .rstars{filter:drop-shadow(0 0 3px #fff)}
.mbody{position:relative;background:#ffffffcc;border-radius:20px 20px 20px 6px;box-shadow:0 2px 4px #00000040;padding:16px 18px}
.rtext{white-space:pre-wrap;word-break:break-word;font:400 14px/1.75 var(--th)}
.rimgs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.rimgs button{aspect-ratio:1;border-radius:12px;overflow:hidden;box-shadow:0 2px 6px #0004}
.rimgs img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.rimgs button:hover img{transform:scale(1.08)}
.mnote{margin-top:12px;padding:10px 12px;border-radius:12px;background:#0000008a;color:#fff;font:400 12px/1.6 var(--th);white-space:pre-wrap}.mnote b{display:block;font-weight:500}
.sheet.qsm{width:min(569px,100%);padding:0}
.qs{position:relative;height:451px;font-family:var(--th)}
.qs>*{position:absolute}
.qs-no{left:27px;top:29px;width:85px;height:79px;filter:drop-shadow(0 0 4px #00000040)}
.qs-no svg{width:100%;height:100%;display:block}
.qs-no b{position:absolute;inset:0;display:grid;place-items:center;font:400 48px/1 var(--gro);letter-spacing:-.24px;padding-bottom:8px}
.qs-h{left:156px;top:14px;right:60px;font:400 14px/21px var(--th);color:#fff;text-shadow:0 0 4px #00000040;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qs-t{top:38px;height:79px;border-radius:15px;background:#ffffffb3;padding:7px 12px 0;overflow:hidden}
.qs-t.t1{left:156px;width:178px}.qs-t.t2{left:341px;width:205px}
.qs-t small,.qs-t i{display:block;font:400 12px/20px var(--th);color:#696969;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qs-t b{display:flex;align-items:center;gap:6px;font:500 20px/31px var(--th);color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:-3px}
.qs-t .clk{flex:none;width:17px;height:17px;display:block;color:#000}.qs-t .clk svg{width:100%;height:100%;display:block}
.anim .qs-t .clk svg path{transform-origin:10px 10px;animation:spin 6s linear infinite}
.qs-big{left:27px;top:132px;width:519px;height:54px;border-radius:15px;background:#fffc;box-shadow:0 2px 4px #00000040;display:flex;align-items:center;gap:18px;padding:0 18px 0 15px}
.qs-big .bf{flex:none;width:34px;height:22px}.qs-big .bf svg{width:100%;height:100%;overflow:visible;display:block}
.qs-big .bf path{fill:#000;transform-origin:8px 6px}
.anim .qs-big .bf path{animation:flapL .5s ease-in-out infinite alternate}
.qs-big>div{min-width:0}
.qs-big b{display:block;font:400 16px/26px var(--th);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.qs-big b b{display:inline;font-weight:500}
.qs-big small{display:block;font:400 13px/18px var(--th);color:#acacac;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qs-bar{left:27px;top:199px;width:506px;height:60px}
.qs-bar .tr{position:absolute;left:0;right:0;top:25px;height:35px;border-radius:20px;background:#fff;box-shadow:0 0 4px #00000040}
.qs-bar .tr i{position:absolute;left:5px;top:4px;height:27px;width:max(28px,calc((100% - 10px)*var(--p)/100));border-radius:16px;background:linear-gradient(90deg,#000,#000 15%,#d9d9d9);box-shadow:inset 0 0 0 1px #ffffff80}
.qs-bar .pv{position:absolute;top:0;left:max(14px,calc(5px + (100% - 10px)*var(--p)/100 - 14px));display:flex;align-items:flex-end;gap:6px;transform:translateX(-50%)}
.qs-bar .pc{position:absolute;right:calc(100% + 4px);bottom:2px;font:400 15px/21px var(--gro);white-space:nowrap}
.qs-bar .bf{display:block;width:27px;height:17px}.qs-bar .bf svg{width:100%;height:100%;overflow:visible;display:block}.qs-bar .bf path{fill:#000;transform-origin:8px 6px;animation:flapL .4s ease-in-out infinite alternate}
.anim .qs-bar .tr i{animation:qsFill 1.8s cubic-bezier(.3,.8,.2,1) .35s both}
.anim .qs-bar .pv{animation:qsRide 1.8s cubic-bezier(.3,.8,.2,1) .35s both}
@keyframes qsFill{from{width:28px}}
@keyframes qsRide{from{left:14px}}
.qs-foot{left:26px;top:276px;width:521px;border-top:1.2px dashed #0006}
.qs-dl{left:18px;top:299px;width:262px;margin:0}
.qs-dl div{display:flex;justify-content:space-between;align-items:center;height:26px;padding:0 11px;margin-bottom:5px;border-bottom:1px solid #0000004d}
.qs-dl dt{font:400 14px/23px var(--th)}.qs-dl dd{margin:0;font:500 14px/23px var(--th);text-align:right}
.qs-pic{left:318px;top:297px;width:122px;height:122px;border-radius:15px;border:1px dashed #000;background:#ffffff03;box-shadow:0 4px 5px #00000040;display:grid;place-items:center;text-align:center;font:400 10px/17px var(--th);color:#939393;overflow:visible}
.qs-pic.has{border:0;background:none;box-shadow:none}
.qs-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:15px;border:3px solid #fff;box-shadow:0 4px 8px #0005;transform:rotate(calc(var(--k)*-6deg)) translate(calc(var(--k)*-4px),0);transition:transform .45s cubic-bezier(.2,.9,.25,1.3)}
.qs-pic.has:hover img{transform:rotate(calc(var(--k)*-11deg)) translate(calc(var(--k)*-8px),calc(var(--k)*-2px))}
.qs-pic .cnt{position:absolute;right:-6px;top:-8px;z-index:3;padding:1px 9px;border-radius:20px;background:#000;color:#fff;font:500 10px/18px var(--th);box-shadow:0 0 6px #fff}
.qs-more{left:451px;top:297px;width:101px;display:flex;flex-direction:column;gap:3px}
.qs-more .mi{border-radius:7px;background:#00000080;color:#fff;padding:2px 6px 5px;min-height:37px}
.qs-more .mi:first-child{min-height:51px}
.qs-more .mi b{display:block;text-align:center;font:400 9px/15px var(--th)}
.qs-more ul{margin:0;padding-left:12px;font:400 8px/12px var(--th);max-height:62px;overflow:auto}
.qs-more ul.none{list-style:none;padding:0;text-align:center;opacity:.6}
.qs-more .hrts{width:85px;height:18px;margin:6px 0 0 7px;overflow:visible}
.anim .qs-more .hrts path{transform-box:fill-box;transform-origin:center;animation:hbob 2.4s ease-in-out infinite;animation-delay:calc(var(--i)*.2s)}
@keyframes hbob{50%{transform:translateY(-3px) scale(1.15)}}
.qs-cta{display:block;width:calc(100% - 50px);margin:0 25px 22px;padding:16px;border-radius:20px;background:#ffffffd9;box-shadow:0 2px 6px #0003;font:500 14px/1.4 var(--th);position:relative;overflow:hidden}
.qs-cta::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#ffffffc0 50%,transparent 65%);transform:translateX(-100%);animation:barShine 3s ease-in-out infinite}
.anim .mo-bg.on .qs>*{animation:qsIn .7s cubic-bezier(.2,.8,.2,1) both}
.anim .mo-bg.on .qs>:nth-child(2){animation-delay:.05s}.anim .mo-bg.on .qs>:nth-child(3){animation-delay:.12s}.anim .mo-bg.on .qs>:nth-child(4){animation-delay:.18s}
.anim .mo-bg.on .qs>:nth-child(5){animation-delay:.26s}.anim .mo-bg.on .qs>:nth-child(n+7){animation-delay:.38s}
@keyframes qsIn{from{opacity:0;translate:0 12px;filter:blur(4px)}}
.anim .mo-bg.on .qs .qs-bar{animation:none}
@media (max-width:600px){
.qs{height:auto;display:grid;grid-template-columns:72px 1fr 1fr;gap:10px;padding:18px 14px 18px;grid-template-areas:"no h h" "t1 t1 t2" "big big big" "bar bar bar" "foot foot foot" "dl dl dl" "pic more more"}
.qs>*{position:relative;left:auto!important;top:auto!important;width:auto!important}
.qs-no{grid-area:no;width:72px!important;height:67px}.qs-no b{font-size:38px}
.qs-h{grid-area:h;right:auto;align-self:end;white-space:normal;font-size:13px;line-height:1.4;padding:0 30px 4px 0}
.qs-t{height:auto;min-height:72px;padding:7px 10px 6px}.qs-t.t1{grid-area:t1}.qs-t.t2{grid-area:t2}
.qs-t small,.qs-t i{font-size:10.5px;line-height:15px;white-space:normal}.qs-t b{font-size:16px;line-height:26px}.qs-t .clk{width:14px;height:14px}
.qs-big{grid-area:big;height:auto;min-height:54px;padding:8px 14px;gap:12px}.qs-big b{white-space:normal;font-size:14px;line-height:1.5}.qs-big small{white-space:normal;font-size:11.5px;line-height:1.5}
.qs-bar{grid-area:bar;height:60px}
.qs-foot{grid-area:foot;margin:2px 0}
.qs-dl{grid-area:dl}.qs-dl dt,.qs-dl dd{font-size:13px}
.qs-pic{grid-area:pic;width:100%!important;height:auto;aspect-ratio:1;max-width:150px}
.qs-more{grid-area:more}.qs-more .mi b{font-size:10px}.qs-more ul{font-size:9.5px;line-height:14px}
}
.sheet.pvs{width:min(560px,100%)}
.pv img#pvi{display:block;width:100%;max-height:70vh;object-fit:contain;border-radius:calc(16*var(--u));background:#0001}
.pvt{display:flex;gap:calc(6*var(--u));overflow-x:auto;margin-top:calc(10*var(--u));scrollbar-width:none}
.pvt button{flex:none;width:calc(52*var(--u));height:calc(52*var(--u));border-radius:calc(10*var(--u));overflow:hidden;opacity:.5;border:calc(2*var(--u)) solid transparent}
.pvt button.on{opacity:1;border-color:#000}
.pvt img{width:100%;height:100%;object-fit:cover}
#toast{position:fixed;left:50%;top:max(16px,env(safe-area-inset-top));z-index:90;transform:translate(-50%,-160%);opacity:0;background:#000;color:#fff;border-radius:calc(50*var(--u));padding:calc(10*var(--u)) calc(18*var(--u));font:400 calc(12*var(--u)*var(--ts))/1.4 var(--th);box-shadow:0 calc(6*var(--u)) calc(20*var(--u)) #0006;transition:transform .45s cubic-bezier(.2,.9,.25,1.1),opacity .35s;max-width:88vw;text-align:center}
#toast.on{transform:translate(-50%,0);opacity:1}
#loader{position:fixed;inset:0;z-index:100;background:radial-gradient(70% 55% at 50% 45%,#f4f4f5,#e4e4e6 70%,#d9d9dc);overflow:hidden;transition:opacity .9s ease .5s}
#loader .hz{position:absolute;left:50%;top:46%;width:min(76vw,320px);height:min(76vw,320px);transform:translate(-50%,-50%)}
#loader .bf{position:absolute;left:50%;top:50%;width:var(--s);height:calc(var(--s)*.62);margin:calc(var(--s)*-.31) 0 0 calc(var(--s)*-.5);transform:translate(var(--fx),var(--fy)) rotate(var(--fr)) scale(.3);opacity:0;transition:transform 1.5s cubic-bezier(.25,.8,.25,1) var(--d),opacity .8s ease var(--d)}
#loader .bf svg{width:100%;height:100%;overflow:visible;display:block;filter:drop-shadow(0 1px 2px #0003)}
#loader .bf path{fill:#111;transform-origin:8px 6px;animation:flapL var(--f,.3s) ease-in-out infinite alternate}
#loader.in .bf{transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(1);opacity:1}
#loader.in .bf path{animation-duration:calc(var(--f,.3s)*3)}
#loader.out .bf{transform:translate(var(--ox),var(--oy)) rotate(var(--or)) scale(1.4);opacity:0;transition:transform 1.3s cubic-bezier(.4,0,.6,1),opacity 1s ease .3s}
#loader.out .bf path{animation-duration:.12s}
#loader .hz{animation:beat 1.6s ease-in-out 1.8s infinite}
@keyframes beat{0%,100%{transform:translate(-50%,-50%) scale(1)}15%{transform:translate(-50%,-50%) scale(1.06)}30%{transform:translate(-50%,-50%) scale(.99)}45%{transform:translate(-50%,-50%) scale(1.04)}}
#loader.out .hz{animation:none}
#loader .emb{position:absolute;left:50%;top:46%;z-index:3;transform:translate(-50%,-50%);text-align:center;color:#111114;opacity:0;transition:opacity 1s ease 1.2s,transform 1s}
#loader.in .emb{opacity:1}
#loader .emb b{display:block;font:600 clamp(30px,10vw,46px)/1.05 var(--cjk);text-shadow:0 0 14px #fff,0 0 30px #fff}
#loader .emb span{display:block;margin-top:8px;font:400 clamp(10px,3vw,13px)/1 var(--gro);letter-spacing:.35em;opacity:.75}
#loader .emb i{display:block;width:90px;height:1px;margin:12px auto 0;background:#0002;position:relative;overflow:hidden}
#loader .emb i::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#000,transparent);animation:load 1.3s ease-in-out infinite}
@keyframes load{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
#loader.out .emb{opacity:0;transform:translate(-50%,-50%) scale(1.25);transition:opacity .6s,transform 1s}
#loader.gone{opacity:0;pointer-events:none}
.noanim *,.noanim *::before,.noanim *::after{animation:none!important;transition:none!important}
.noanim .qc,.noanim .rc{opacity:1!important;transform:none!important}
.anim .hero .cl-top{translate:0 calc(var(--sy,0)*-.22px)}
.anim .hero .cl-name{translate:0 calc(var(--sy,0)*-.1px)}
.anim .heart{translate:0 calc(var(--sy,0)*.06px)}
.spk{position:absolute;width:var(--sz,8px);height:var(--sz,8px);pointer-events:none;opacity:0;z-index:4;background:radial-gradient(circle,#fff 0 20%,transparent 62%);filter:drop-shadow(0 0 2px #0006)}
.spk::before,.spk::after{content:'';position:absolute;left:50%;top:50%;width:100%;height:1.2px;background:linear-gradient(90deg,transparent,#fff,transparent);transform:translate(-50%,-50%)}
.spk::after{transform:translate(-50%,-50%) rotate(90deg)}
.anim .spk{animation:tw 4.2s ease-in-out infinite}
.shine{background:linear-gradient(100deg,#000 0 42%,#9c9c9c 50%,#000 58% 100%) 0 0/300% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.anim .shine{animation:shineMove 4.5s ease-in-out 1.4s infinite}
@keyframes shineMove{0%{background-position:100% 0}60%,100%{background-position:0 0}}
.hold .page,.hold .page *,.hold .page *::before,.hold .page *::after,.hold .nav,.hold .nav *,.hold .mqfab{animation-play-state:paused!important}
.hold .qc,.hold .rc{transition:none!important}