:root{--design-w:786;--max-w:480px;--ratio:.5779;--card-w:min(var(--max-w), 100vw, 100svh * var(--ratio));--u:calc(var(--card-w) / var(--design-w));--paper:#FDFAF3;--card:#FDFAF3;--ink:#23252A;--lgred:#A50034;--navy:#2E323D;--navy-hover:#3B404D;--btn-text:#FDFAF4;--gray-line:#787775;--grad-brand:linear-gradient(90deg, #8F34FE, #FB2475);--grad-border:linear-gradient(var(--paper), var(--paper)) padding-box, var(--grad-brand) border-box;--fw-regular:327;--fw-medium:450;--fw-semibold:496;--sx:.75;--ink-dy:.1em}*{box-sizing:border-box;margin:0;padding:0;font-weight:var(--fw);font-variation-settings:"wght" var(--fw)}button,input,select,textarea{font-family:inherit}html,body{height:100%}body{background:var(--paper);color:var(--ink);font-family:tt-zhihei-chs-variable,PingFang TC,Noto Sans TC,Hiragino Sans TC,Microsoft JhengHei,system-ui,sans-serif;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;align-items:center;padding:0}.stage{flex:1;position:relative;display:flex;align-items:center;justify-content:center;min-height:0}canvas{width:100%;height:100%;display:block}.phone{width:var(--card-w);height:100vh;height:100svh;background:var(--card);box-shadow:0 24px 60px -28px #282a248c,0 0 0 1px #0000000d;overflow:hidden auto;-webkit-overflow-scrolling:touch;position:relative}.phone.transitioning{overflow-y:hidden}.screen{position:absolute;top:0;right:0;bottom:0;left:0;display:none;flex-direction:column;padding:68px 52px 60px;opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease,visibility .5s}.screen.shown{display:flex}.screen.on{opacity:1;visibility:visible;transform:none}.eyebrow{--eb-l:21;--eb-r:21;position:relative;text-align:center;align-self:center;letter-spacing:.3em;padding:0 calc(var(--eb-r)*var(--u)/var(--sx) - .3em) 0 calc(var(--eb-l)*var(--u)/var(--sx));transform:scaleX(var(--sx))}.eyebrow:before,.eyebrow:after{content:"";position:absolute;top:-.12em;bottom:.12em;width:calc(2*var(--u)/var(--sx));background:var(--gray-line)}.eyebrow:before{left:0}.eyebrow:after{right:0}.btn{position:relative;display:flex;align-items:center;border:0;cursor:pointer;background:var(--navy);color:var(--btn-text);--fw:var(--fw-regular);text-indent:.18em;padding:0;border-radius:calc(20*var(--u));transition:background .25s ease,transform .12s ease}.btn:hover{background:var(--navy-hover)}.btn:active{transform:translateY(2px)}.opt,.tagline{border:max(1px,calc(1*var(--u))) solid transparent;background:var(--grad-border)}.btn:focus-visible,.opt:focus-visible{outline:4px solid var(--lgred);outline-offset:6px}.btn[disabled]{opacity:.28;cursor:default}.btn .arw-img{position:absolute;top:50%;transform:translateY(-50%);height:auto}.btn-text{display:inline-block;flex:none;white-space:nowrap;line-height:1;transform:translateY(var(--ink-dy)) scaleX(var(--sx))}#s-home{--slack:calc((100svh - 1360*var(--u)) / 2);background:var(--paper);align-items:center;padding:calc(132*var(--u) + var(--slack)) 0 calc(100*var(--u) + var(--slack))}#s-home .eyebrow,#s-home .title,#s-home .sub,#s-home .btn{position:relative;z-index:2}#s-home .eyebrow{font-size:calc(43*var(--u));--fw:var(--fw-regular);color:var(--gray-line);line-height:calc(54*var(--u))}#s-home .eyebrow:before,#s-home .eyebrow:after{top:calc(-1*var(--u) - .12em);bottom:calc(-1*var(--u) + .12em)}#s-home .title{font-size:calc(95.5*var(--u));--fw:var(--fw-regular);letter-spacing:.15em;text-indent:.15em;text-align:center;color:#212120;margin-top:calc(23*var(--u));line-height:calc(119*var(--u));white-space:nowrap;transform:scaleX(var(--sx))}#s-home .stage{align-self:stretch;position:static}#s-home canvas{position:absolute;left:50%;top:calc(243*var(--u) + var(--slack));transform:translate(-50%);width:calc(786*var(--u));height:calc(833*var(--u))}#s-home .fade{position:absolute;left:50%;top:calc(593*var(--u) + var(--slack));transform-origin:50% 50%;transform:translate(-50%) scale(.7);width:calc(786*var(--u));height:calc(673*var(--u));pointer-events:none;z-index:1;background:url(../img/home-glow.png) center/100% 100% no-repeat;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 14%);mask-image:linear-gradient(to bottom,transparent,#000 14%)}#s-home .sub{font-size:calc(34*var(--u));--fw:var(--fw-regular);line-height:calc(54*var(--u));letter-spacing:.3em;text-indent:.3em;text-align:center;color:#494847;margin-top:0;white-space:nowrap;transform:scaleX(var(--sx))}#s-home .btn,#s-quiz .btn{width:calc(444*var(--u));font-size:calc(44.5*var(--u));letter-spacing:.5em;text-indent:.5em;height:calc(109*var(--u));line-height:calc(109*var(--u));justify-content:center}#s-home .btn{margin-top:calc(53*var(--u))}#s-home .arw-img,#s-quiz .arw-img{width:calc(47*var(--u));right:calc(46*var(--u))}#s-quiz{background:var(--paper);padding:calc(152*var(--u)) 0 calc(98*var(--u));grid-template-rows:1fr auto 3fr;justify-items:center}#s-quiz.shown{display:grid}.qbody{grid-row:2;grid-column:1;position:relative;z-index:1;width:calc(696*var(--u));display:flex;flex-direction:column}.qbody:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:calc(615*var(--u));height:min(calc(810*var(--u)),100%);background:url(../img/quiz-bg.png) center/contain no-repeat;pointer-events:none;z-index:-1}.qnum{display:flex;align-items:baseline;transform:scaleX(var(--sx));transform-origin:left;font-size:calc(90.5*var(--u));--fw:var(--fw-regular);letter-spacing:.3em;line-height:calc(62*var(--u));color:#212120}.qnum small{font-size:calc(30*var(--u));--fw:var(--fw-regular);line-height:1;letter-spacing:.3em;color:#818181;margin-left:calc(-22.15*var(--u))}.bars{display:flex;gap:calc(7.5*var(--u));margin:calc(24*var(--u)) 0 calc(58*var(--u))}.bars i{flex:1;height:calc(26*var(--u));border-radius:calc(6*var(--u));background:#fe7ab3;opacity:.23;transition:opacity .35s ease}.bars i.fill{opacity:1}.qtext{font-size:calc(55*var(--u));line-height:calc(80*var(--u));letter-spacing:.15em;--fw:var(--fw-regular);color:var(--navy);width:calc(100%/var(--sx));flex:none;transform:scaleX(var(--sx));transform-origin:left;min-height:calc(240*var(--u));transition:opacity .28s ease,transform .28s ease}.qtext.swap{opacity:0;transform:translate(20px) scaleX(var(--sx))}.opts{display:flex;flex-direction:column;justify-content:center;gap:calc(43*var(--u));min-height:calc(470*var(--u));transition:opacity .28s ease}.opts.swap{opacity:0}@keyframes opt-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.opt{display:flex;align-items:center;text-align:left;font-size:calc(35*var(--u));--fw:var(--fw-regular);letter-spacing:.1em;line-height:1.4;color:var(--navy);min-height:calc(101*var(--u));padding:calc(12*var(--u)) calc(29*var(--u));border-radius:calc(20*var(--u));cursor:pointer;transition:background .2s,border-color .2s,color .2s;animation:opt-in .32s ease both}.opt:nth-child(1){animation-delay:0ms}.opt:nth-child(2){animation-delay:60ms}.opt:nth-child(3){animation-delay:.12s}.opt.sel{background:#289ba2;border-color:#fff;color:#fff}.opt-row{display:flex;align-items:flex-start;flex:none;width:calc(100%/var(--sx));transform:translateY(.12em) scaleX(var(--sx));transform-origin:left}.opt-label{flex:none;font-weight:600;color:inherit}.opt-text{flex:1;min-width:0}.opt-text b{font-weight:600;color:inherit}.qfoot{margin-top:calc(139*var(--u));display:flex;justify-content:center}#s-quiz .qfoot{left:calc(5*var(--u))}#s-result{background:var(--paper);align-items:center;justify-content:safe center;padding:calc(171*var(--u)) 0 calc(96*var(--u))}#s-result .eyebrow{font-size:calc(41*var(--u));--fw:var(--fw-medium);color:var(--navy);line-height:calc(52*var(--u))}#s-result .stage{align-self:stretch;overflow:hidden}.r1-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:center/calc(786*var(--u)) auto no-repeat}.r1-name{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;transform:translateY(calc(40.5*var(--u)))}.r1-name span{writing-mode:vertical-rl;font-size:calc(123*var(--u));--fw:300;line-height:calc(124.5*var(--u));letter-spacing:0;color:#fbf9f2;transform:scaleX(var(--sx))}.tagline{width:calc(603*var(--u));height:calc(144*var(--u));display:flex;align-items:center;justify-content:center;border-radius:calc(38.9*var(--u));font-size:calc(36*var(--u));--fw:var(--fw-semibold);line-height:calc(55*var(--u));letter-spacing:.3em;color:var(--navy);margin-bottom:calc(61*var(--u));text-align:center}.tagline span{display:inline-block;flex:none;white-space:nowrap;padding-left:.3em;transform:scaleX(var(--sx))}#s-result .btn{width:calc(443*var(--u));height:calc(109*var(--u));padding:0 0 0 calc(49*var(--u));font-size:calc(44.5*var(--u));letter-spacing:.2em;text-align:left}#s-result .btn-text{transform-origin:left}#s-result .arw-img{width:calc(47*var(--u));right:calc(45*var(--u))}#s-combo{background:var(--paper);padding:0}.c-frame{width:100%;flex-shrink:0;margin-top:auto;display:flex;flex-direction:column;color:var(--navy)}.c-card{position:relative;isolation:isolate;width:100%;height:calc(972*var(--u));display:flex;flex-direction:column;background:var(--paper)}.save-img{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;width:100%;height:100%;opacity:.01;-webkit-touch-callout:default;-webkit-user-select:auto;user-select:auto}.c-foot{position:relative;flex:1 0 auto;margin-top:calc(27*var(--u));width:100%;min-height:calc(340*var(--u));max-height:calc(649*var(--u))}#s-combo .eyebrow{--eb-l:31;--eb-r:29;height:calc(54*var(--u));margin-top:calc(31*var(--u));padding-top:calc(6*var(--u));font-size:calc(41*var(--u));--fw:var(--fw-medium);color:var(--navy);line-height:calc(47*var(--u))}#s-combo .eyebrow:before,#s-combo .eyebrow:after{top:0;bottom:0}.hero{position:absolute;left:calc(245*var(--u));top:calc(249.5*var(--u));width:0;height:0;z-index:0;pointer-events:none}.result-bg{position:absolute;left:0;top:0;width:calc(var(--w,0)*.2155*var(--u));height:auto;max-width:none;transform:translate(-50%,-50%)}.fatename{position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;transform:translate(-50%,calc(-50% - 3*var(--u)))}.fatename span{writing-mode:vertical-rl;font-size:calc(53*var(--u));--fw:300;line-height:calc(53.5*var(--u));letter-spacing:0;color:#fbf9f2;white-space:nowrap;transform:scaleX(var(--sx))}.lines{position:absolute;z-index:1;left:calc(445*var(--u));top:calc(261*var(--u));white-space:nowrap;font-size:calc(25*var(--u));--fw:var(--fw-medium);line-height:calc(40*var(--u));letter-spacing:.3em;text-align:left;color:#7d7d7e;transform-origin:left center;transform:translateY(-50%) scaleX(var(--sx))}.cols,.c-rule{position:relative;z-index:1;margin-inline:calc(57*var(--u)) calc(46*var(--u))}.cols{display:grid;grid-template-columns:repeat(3,1fr);column-gap:calc(11.5*var(--u))}.lucks{margin-top:calc(323*var(--u))}.luck{display:flex;flex-direction:column;align-items:center;min-width:0;transform:translate(calc(-4*var(--u)))}.ico{height:auto;margin-bottom:calc(13*var(--u))}.ico-air{width:calc(38*var(--u))}.ico-water{width:calc(29*var(--u))}.ico-dust{width:calc(38*var(--u))}.luck p{font-size:calc(28.5*var(--u));--fw:var(--fw-medium);line-height:calc(38.5*var(--u));letter-spacing:.8em;text-indent:.8em;width:calc(100%/var(--sx));flex:none;text-align:center;transform:scaleX(var(--sx))}.c-rule{height:calc(2*var(--u));margin-top:calc(6*var(--u));background:var(--grad-brand)}#tiles{margin-top:calc(12*var(--u))}.tile{height:calc(351*var(--u));border-radius:calc(6*var(--u));display:flex;align-items:center;justify-content:center;padding-top:calc(9*var(--u))}.tile:nth-child(1){background:#83dfe1}.tile:nth-child(2){background:#98a1d5}.tile:nth-child(3){background:#e0a5e7}.tile img{width:calc(var(--w,0)*var(--u));height:auto}.pnames{margin-top:calc(14*var(--u))}.pname{width:calc(100%/var(--sx));margin:0 calc((100% - 100%/var(--sx)) / 2);transform:scaleX(var(--sx));min-width:0;text-align:center;font-size:calc(26*var(--u));line-height:calc(38.5*var(--u));--fw:var(--fw-regular)}.pname-cat{white-space:nowrap}.save-hint{display:flex;align-items:flex-start;height:calc(26*var(--u));margin-top:calc(2*var(--u));padding-left:calc(57*var(--u));padding-right:calc(42*var(--u))}.hint-rule{flex:1;height:calc(2*var(--u));margin-top:calc(11*var(--u));background:var(--grad-brand)}.hint-ico{flex:none;margin-top:calc(3*var(--u));width:calc(16*var(--u));height:auto}.hint-ico-l{margin-left:calc(12*var(--u));margin-right:calc(6*var(--u))}.hint-ico-r{margin-left:calc(6*var(--u));margin-right:calc(12*var(--u))}.hint-text{flex:none;width:calc(170*var(--u));margin-top:calc(2*var(--u))}.hint-text span{display:block;width:calc(100%/var(--sx));margin:0 calc((100% - 100%/var(--sx)) / 2);font-size:calc(25*var(--u));--fw:var(--fw-medium);line-height:calc(24*var(--u));letter-spacing:.08em;text-align:center;white-space:nowrap;color:#e163bf;transform:scaleX(var(--sx))}.doc{position:absolute;left:calc(30*var(--u));top:0;width:calc(350*var(--u));height:100%;object-fit:cover;object-position:top;pointer-events:none}#s-combo .btn-3d{position:absolute;left:calc(407*var(--u));width:calc(336*var(--u));padding:0;font-size:calc(36*var(--u));letter-spacing:.08em;text-indent:0;text-align:left;border-radius:calc(20*var(--u))}#s-combo .btn-3d:active{transform:translateY(calc(6*var(--u)))}#s-combo .btn-buy{top:calc(10*var(--u));height:calc(76*var(--u));padding-left:calc(37*var(--u));background:#9f1a36;box-shadow:0 calc(8*var(--u)) 0 #5d1323}#s-combo .btn-buy:hover{background:#9f1a36}#s-combo .btn-share{top:calc(121*var(--u));height:calc(77*var(--u));padding-left:calc(85*var(--u));border:calc(3*var(--u)) solid #C866AD;background:#fffffd;color:#c866ad;box-shadow:0 calc(8*var(--u)) 0 #c866ad}#s-combo .btn-share:hover{background:#fffffd}#s-combo .btn-3d .btn-text{--ink-dy:0;transform-origin:left}#s-combo .arw-img{width:calc(36*var(--u));right:calc(26*var(--u))}.ig-img{position:absolute;left:calc(20*var(--u));top:50%;width:calc(47*var(--u));height:auto;transform:translateY(-50%)}.star{position:absolute;top:calc(-14*var(--u));right:calc(-14*var(--u));font-size:calc(19.5*var(--u));line-height:1;letter-spacing:.08em}#s-combo .btn-share .btn-text{position:relative}.share-note{position:absolute;left:calc(435*var(--u));top:calc(220*var(--u));font-size:calc(19.5*var(--u));--fw:var(--fw-regular);line-height:calc(19*var(--u));letter-spacing:.08em;white-space:nowrap;color:#757470;transform-origin:left center;transform:scaleX(var(--sx))}.again{position:absolute;left:calc(510*var(--u));top:calc(273*var(--u));height:calc(32*var(--u));display:flex;align-items:center;gap:calc(8*var(--u));padding:0;border:0;background:none;cursor:pointer;color:#26a188;font-size:calc(28.5*var(--u));--fw:var(--fw-medium);letter-spacing:.08em}.again img{width:calc(32*var(--u));height:calc(32*var(--u))}.again span{display:inline-block;line-height:calc(32*var(--u));white-space:nowrap;transform-origin:left;transform:translateY(calc(-1*var(--u))) scaleX(var(--sx))}.again:after{content:"";position:absolute;left:calc(41*var(--u));top:calc(32*var(--u));width:calc(87*var(--u));height:calc(2*var(--u));background:#26a188}.again:focus-visible{outline:4px solid var(--lgred);outline-offset:6px}@media(prefers-reduced-motion:reduce){.screen{transition:none}}