:root{font-family:Arial,"Noto Serif TC",Microsoft JhengHei,serif;color:#f5e8e1;background:#242332;font-synthesis:none;font-weight:400;color-scheme:dark}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}button,input{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:1px solid #ffdbb7;outline-offset:4px}button{border:0;background:none}button svg{stroke-width:1.4;flex-shrink:0}button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.experience{position:relative;width:100%;height:100%;height:100dvh;overflow:hidden}.experience>div:first-child{position:absolute!important;inset:0}canvas{display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.interface{position:absolute;inset:0;pointer-events:none;opacity:1;visibility:visible;transition:opacity .55s ease,visibility 0s;z-index:10}.interface.is-hidden{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .55s ease,visibility 0s linear .55s}.interface.is-hidden *{pointer-events:none!important}.brand{position:absolute;top:max(32px,env(safe-area-inset-top));left:38px;text-shadow:0 2px 20px #211b31a0;pointer-events:none;opacity:1;visibility:visible;transition:opacity .5s ease,visibility 0s}.brand-mark{display:flex;align-items:center;gap:13px;font:36px "Noto Serif TC",Songti TC,serif;letter-spacing:8px}.seal{font:10px/17px serif;letter-spacing:0;border:1px solid #edd5b465;width:17px;text-align:center;opacity:.7}.site-credit{position:absolute;right:30px;bottom:max(10px,env(safe-area-inset-bottom));z-index:12;font-size:8px;letter-spacing:2.4px;color:#f2dfd870;text-decoration:none;pointer-events:auto;transition:color .25s ease}.site-credit:hover{color:#ffe6e5}.brand-name{display:block;font-size:8px;letter-spacing:2.8px;margin-top:12px;color:#f7e9e0b0}.brand-poem{margin-top:0;max-height:0;display:grid;gap:9px;font:10px serif;letter-spacing:2px;opacity:0;visibility:hidden;overflow:hidden;transition:opacity .45s ease,visibility .45s,margin-top .45s ease,max-height .45s ease}.text-full .brand-poem{margin-top:25px;max-height:64px;opacity:.8;visibility:visible}.brand-poem em{font:italic 12px Georgia,serif;letter-spacing:.5px}.top-tools{position:absolute;right:30px;top:max(28px,env(safe-area-inset-top));display:flex;gap:9px;pointer-events:auto}.round-button{width:41px;height:41px;display:grid;place-items:center;background:#29263735;border:1px solid #f5e2d129;border-radius:50%;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:background .2s}.round-button:hover,.round-button.active{background:#c9a4bb3b}.glass{background:linear-gradient(140deg,#292432c9,#292a37c4);border:1px solid #f3d8d12c;box-shadow:0 12px 45px #15102132;backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px)}.settings{position:absolute;right:30px;top:82px;width:318px;max-height:calc(100dvh - 112px);overflow:auto;overscroll-behavior:contain;border-radius:15px;padding:21px 22px;pointer-events:auto;animation:appear .25s ease;z-index:11}.panel-heading{display:flex;align-items:center;gap:9px;font-size:11px;letter-spacing:2px}.panel-kicker{margin-left:auto;font-size:6px;letter-spacing:1px;opacity:.4}.settings section{padding-top:18px;margin-top:18px;border-top:1px solid #ecd9e019}.settings h2{font-size:10px;font-weight:400;letter-spacing:2px;margin:0 0 15px;display:flex;align-items:center;gap:8px;color:#f5ded7c5}.period-options{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.period-option{padding:0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px}.swatch{height:39px;width:100%;border:1px solid #ffe9e518;border-radius:5px;position:relative;display:grid;place-items:center;overflow:hidden;opacity:.7;transition:opacity .2s,border-color .2s}.swatch:after{content:"";position:absolute;inset:70% -15% -20%;background:#44465766;transform:rotate(-7deg);border-radius:50%}.period-option:hover .swatch,.period-option.selected .swatch{opacity:1;border-color:#f7d3c4b0}.swatch-sunrise .swatch{background:linear-gradient(#8690b4,#eab0ad 65%,#edc695)}.swatch-day .swatch{background:linear-gradient(#4093c8,#9aceeb 70%,#dfded1)}.swatch-sunset .swatch{background:linear-gradient(#655676,#d78b86 50%,#eab572)}.swatch-night .swatch{background:linear-gradient(#141d3f,#34446c 75%,#61638c)}.swatch svg{position:relative;z-index:1;stroke-width:1.3;color:#fff0d9}.swatch-night .swatch svg{color:#dbe4ff}.selected-check{position:absolute!important;bottom:3px;right:3px}.option-name{font-size:9px;letter-spacing:1px;opacity:.85}.option-time{font-size:8px;font-variant-numeric:tabular-nums;opacity:.45;letter-spacing:.7px}.slider-label{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1px;margin:13px 0 8px;color:#eedfe1b8}.slider-label output{font-size:10px;font-variant-numeric:tabular-nums;color:#f3c2cc}input[type=range]{display:block;appearance:none;width:100%;height:4px;margin:12px 0 22px;border-radius:2px;background:linear-gradient(to right,#d9a1b3 var(--value),#d2bcc328 var(--value));cursor:pointer;touch-action:pan-y}input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#e4a7bc;border:1px solid #f7ccda;box-shadow:0 0 0 4px #d5a1b012}input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#e4a7bc;border:1px solid #f7ccda}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:1px;margin:13px 0}.segmented{display:flex;gap:2px;border:1px solid #efdce51b;border-radius:5px;padding:2px}.segmented button{font-size:9px;padding:7px 10px;border-radius:3px;color:#f0dce196;min-width:32px;min-height:29px}.segmented button[aria-pressed=true]{background:#dfb1c026;color:#ffe6e5}.setting-action{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font-size:10px;letter-spacing:1px;padding:12px 0;border-top:1px solid #eddbe910;color:#f2e3e1bc}.setting-action:hover{color:#ffe5e6}.setting-action kbd{margin-left:auto;border:1px solid #efdce526;border-radius:3px;font:9px Arial;padding:2px 5px;opacity:.6}.panel-help{font-size:8px;line-height:1.9;letter-spacing:.6px;color:#ecdee66b;margin:12px 0 0}.time-dock{position:absolute;right:30px;bottom:max(36px,calc(env(safe-area-inset-bottom) + 26px));pointer-events:auto}.time-control{display:flex;align-items:center;border-radius:30px;height:44px;width:272px;padding:0 6px;background:linear-gradient(110deg,#3e2b3e8c,#51404c69);box-sizing:border-box}.arrow-button{height:38px;width:33px;display:grid;place-items:center;opacity:.75}.arrow-button:hover{opacity:1}.current-period{height:40px;flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:11px;padding:0 10px;transition:padding .45s ease,gap .45s ease}.time-control .ui-text{max-width:7.5em;overflow:hidden;white-space:nowrap;opacity:1;transition:opacity .4s ease,max-width .45s ease,margin .45s ease,transform .45s ease}.period-jp{font:12px "Noto Serif TC",serif;letter-spacing:1.2px}.period-en{font:10px Georgia,serif;color:#f0dedbc2;letter-spacing:.5px}.period-time{font-size:10px;color:#f2dfd8a3;letter-spacing:1px;font-variant-numeric:tabular-nums}.current-period>svg{color:#f4c5af}.time-picker{position:absolute;bottom:57px;right:0;width:304px;border-radius:12px;padding:18px;animation:appear .25s ease;z-index:11}.picker-title{font:11px "Noto Serif TC",serif;letter-spacing:2px;margin-bottom:17px;color:#efdfe2b8}.time-picker .swatch{height:54px}.quiet-caption{position:absolute;left:39px;bottom:38px;display:flex;align-items:center;gap:20px;font:italic 12px Georgia,serif;letter-spacing:.8px;color:#e9dbe1b0;text-shadow:0 1px 10px #17101d;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .5s ease,visibility 0s linear .5s,transform .5s ease}.text-full .quiet-caption{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .5s ease,visibility 0s,transform .5s ease}.quiet-caption span{width:31px;height:1px;background:#e1ccd352}.notice{position:absolute;bottom:100px;left:50%;transform:translate(-50%);background:#282430b0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:12px 20px;border-radius:6px;font-size:11px;max-width:90%;text-align:center}.restore-interface{position:absolute;top:0;right:0;width:82px;height:82px;opacity:0;background:none;border:0;cursor:default}.music-dock{display:flex;align-items:center;gap:2px;height:41px;padding:0 12px 0 5px;border-radius:30px;pointer-events:auto;background:#29263735;border:1px solid #f5e2d129;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:background .2s}.music-dock:hover{background:#c9a4bb3b}.music-toggle{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;color:#f0dce1c8;transition:background .2s,color .2s,opacity .2s}.music-toggle:hover{background:#c9a4bb3b;color:#ffe6e5}.music-toggle.off{opacity:.42}.music-toggle svg{stroke-width:1.45}.music-volume{display:flex;align-items:center;gap:8px;padding-left:2px}.music-volume input[type=range]{appearance:none;-webkit-appearance:none;width:76px;height:3px;margin:0;border-radius:2px;background:linear-gradient(to right,#e4a7bc var(--value),#d2bcc328 var(--value));cursor:pointer;touch-action:manipulation}.music-volume input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:11px;height:11px;border-radius:50%;background:#e4a7bc;border:1px solid #f7ccda;box-shadow:0 0 0 3px #d5a1b016}.music-volume input[type=range]::-moz-range-thumb{width:11px;height:11px;border-radius:50%;background:#e4a7bc;border:1px solid #f7ccda}.music-volume output{font-size:8px;letter-spacing:1.1px;min-width:1.8em;text-align:right;color:#f2dfd8a0;font-variant-numeric:tabular-nums}.textless-icon{display:none}.text-hidden .brand,.text-hidden .quiet-caption{opacity:0;visibility:hidden;transition:opacity .5s ease,visibility 0s linear .5s,transform .5s ease}.text-hidden .time-control .ui-text{opacity:0;max-width:0;margin:0;transform:translate(-4px)}.text-hidden .current-period{gap:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.loading{position:absolute;inset:0;z-index:4;background:linear-gradient(#5c5069,#b77983,#e6aa7c);display:flex;flex-direction:column;gap:25px;justify-content:center;align-items:center;font:11px serif;letter-spacing:5px}.loading svg{animation:breathe 3s ease-in-out infinite}.fallback{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#392e42;z-index:8;gap:14px}.fallback>span{font:40px serif;letter-spacing:12px}.fallback small{padding:0 25px;text-align:center}.fallback button{border:1px solid #fff4;border-radius:24px;padding:12px 24px;margin:20px}@keyframes appear{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes breathe{50%{opacity:.4;transform:rotate(25deg)}}@media(max-width:600px){.brand{left:24px;top:max(25px,env(safe-area-inset-top))}.brand-mark{font-size:29px;letter-spacing:6px;gap:8px}.site-credit{position:absolute;right:30px;bottom:max(10px,env(safe-area-inset-bottom));z-index:12;font-size:8px;letter-spacing:2.4px;color:#f2dfd870;text-decoration:none;pointer-events:auto;transition:color .25s ease}.site-credit:hover{color:#ffe6e5}.brand-name{font-size:6px;letter-spacing:1.9px;margin-top:10px}.site-credit{right:19px;bottom:max(8px,env(safe-area-inset-bottom));font-size:7px;letter-spacing:1.8px}.seal{width:15px;font-size:9px;line-height:15px}.top-tools{right:19px;top:max(24px,env(safe-area-inset-top));gap:7px}.round-button{width:37px;height:37px}.music-dock{height:37px;padding:0 10px 0 3px}.music-toggle{width:28px;height:28px}.music-volume{gap:6px}.music-volume input[type=range]{width:58px}.music-volume output{font-size:7px;letter-spacing:.8px}.settings{right:17px;top:75px;width:min(318px,calc(100vw - 34px));padding:18px 20px;max-height:calc(100dvh - 96px)}.time-dock{right:19px;bottom:max(32px,calc(env(safe-area-inset-bottom) + 22px))}.time-control{height:43px;width:min(272px,calc(100vw - 38px))}.current-period{gap:9px;padding:0 6px}.period-jp{font-size:11px}.period-en,.period-time{font-size:9px}.time-picker{width:min(304px,calc(100vw - 38px))}.quiet-caption{display:none}.panel-kicker{font-size:5px}.brand-poem{font-size:8px}.text-full .brand-poem{margin-top:20px}.brand-poem em{font-size:10px}.settings section{padding-top:14px;margin-top:14px}}.quality-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;padding:3px;border:1px solid #efdce51b;border-radius:6px}.quality-grid button{font-size:9px;min-height:31px;border-radius:4px;color:#f0dce190}.quality-grid button:hover{color:#fff0ef}.quality-grid button[aria-pressed=true]{background:#dfb1c02b;color:#ffe6e5;box-shadow:inset 0 0 0 1px #f0c3cf1f}.quality-detail{font-size:8px;line-height:1.5;letter-spacing:.5px;color:#ecdee66b;margin:8px 2px 0}.toggle{margin-left:auto;width:28px;height:16px;border-radius:10px;background:#b5aab332;position:relative;transition:background .2s}.toggle:after{content:"";position:absolute;width:12px;height:12px;left:2px;top:2px;border-radius:50%;background:#c7bdc2;transition:transform .2s}.toggle.on{background:#d989aa88}.toggle.on:after{transform:translate(12px);background:#ffd4df}.fps-meter{position:absolute;left:30px;bottom:28px;z-index:5;display:grid;grid-template-columns:auto auto;column-gap:5px;align-items:baseline;background:#211f29a8;border:1px solid #eedbe321;border-radius:7px;padding:8px 11px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font:8px Arial;color:#f6e6e6b0;letter-spacing:1px;pointer-events:none}.fps-meter strong{font-size:16px;font-weight:400;color:#f4e3e2}.fps-meter small{grid-column:1/-1;font-size:6px;margin-top:2px;opacity:.58;letter-spacing:.7px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.experience:not(.entered) .interface,.experience:not(.entered) .site-credit,.experience:not(.entered) .fps-meter{opacity:0;visibility:hidden;pointer-events:none}.experience .interface{transition:opacity 1.4s ease .5s,visibility 0s}.splash{position:absolute;inset:0;z-index:20;display:grid;place-items:center;overflow:hidden;color:#fff4ee;cursor:default;transition:opacity 1.5s cubic-bezier(.6,0,.3,1),filter 1.5s ease,transform 1.6s cubic-bezier(.6,0,.3,1)}.splash.is-ready{cursor:pointer}.splash.is-leaving{opacity:0;filter:blur(14px);transform:scale(1.08);pointer-events:none}.splash-veil{position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 38%,#ffd9e2,#e6a9c0 26%,#9c7fb7 55%,#3b2f5c 82%,#1c1731);transition:opacity 1.6s ease}.splash.is-ready .splash-veil{opacity:.58}.splash-motes,.splash-petals{position:absolute;inset:0;z-index:2;pointer-events:none}.splash:before{content:"";position:absolute;inset:0;z-index:1;backdrop-filter:blur(6px) saturate(1.15);-webkit-backdrop-filter:blur(6px) saturate(1.15);pointer-events:none}.splash-content:before{content:"";position:absolute;left:50%;top:50%;width:min(760px,130vw);height:560px;transform:translate(-50%,-50%);z-index:-1;background:radial-gradient(closest-side,#3a2550a8,#4a305e55 55%,transparent);filter:blur(10px);pointer-events:none}.splash-aurora{position:absolute;inset:-30%;z-index:1;background:conic-gradient(from 0deg at 50% 50%,#ffc4d655,#c9b6ff40,#ffe1c455,#f7a8c855,#b9d4ff33,#ffc4d655);filter:blur(80px);opacity:.7;animation:splashSpin 38s linear infinite;mix-blend-mode:screen}.splash-motes i{position:absolute;border-radius:50%;background:#fff6ef;box-shadow:0 0 12px 3px #ffe0ecaa;opacity:0;animation:splashMote ease-in-out infinite}.splash-petals i{position:absolute;top:-6%;border-radius:150% 0;background:linear-gradient(135deg,#fff3f6,hsl(calc(335 + var(--tint)*25),80%,calc(80% + var(--tint)*8%)));box-shadow:0 0 10px #ffd7e499;opacity:.9;animation:splashFall linear infinite}.splash-content{position:relative;z-index:3;text-shadow:0 1px 14px #2a1a3dcc;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 24px}.splash-kicker{margin:0 0 22px;font:10px Georgia,serif;letter-spacing:6px;opacity:0;animation:splashRise 1.4s ease .2s forwards;color:#fff0f4d0}.splash-title{margin:0;display:flex;gap:.22em;font:300 clamp(52px,11vw,112px)/1.05 "Noto Serif JP","Noto Serif TC","Hiragino Mincho ProN","Songti TC",serif;letter-spacing:.08em;text-shadow:0 0 40px #ffd3e2,0 0 90px #c8a6ff99,0 6px 30px #3b2a5a66}.splash-title span{display:inline-block;opacity:0;filter:blur(12px);animation:splashChar 1.8s cubic-bezier(.2,.8,.2,1) forwards}.splash-title span:nth-child(2){animation-delay:.35s}.splash-roman{margin:18px 0 0;font-size:10px;letter-spacing:6px;color:#fff1f4d8;opacity:0;animation:splashRise 1.4s ease .9s forwards}.splash-line{margin:30px 0 0;display:flex;align-items:center;gap:16px;font:13px "Noto Serif TC",serif;letter-spacing:3px;color:#fff3f0d8;opacity:0;animation:splashRise 1.4s ease 1.2s forwards}.splash-line span{width:28px;height:1px;background:#fff1f480}.splash-enter{position:relative;margin-top:54px;height:52px;padding:0 34px;border-radius:40px;border:1px solid #fff2f688;background:#40285a55;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff7f4;font:13px "Noto Serif TC",serif;letter-spacing:4px;opacity:0;animation:splashRise 1.4s ease 1.6s forwards;transition:background .35s,border-color .35s,box-shadow .35s,transform .35s}.splash-enter:disabled{cursor:default;border-color:#fff2f633;color:#fff7f4a0}.splash.is-ready .splash-enter:hover,.splash.is-ready .splash-enter:focus-visible{background:#fff3;border-color:#fff7f9aa;box-shadow:0 0 40px #ffd6e6aa;transform:translateY(-2px);outline:none}.splash-ring{position:absolute;inset:-1px;border-radius:inherit;border:1px solid #ffe3ee;opacity:0;pointer-events:none}.splash.is-ready .splash-ring{animation:splashRing 2.6s ease-out infinite}.splash-enter-label{position:relative}.splash-enter:disabled .splash-enter-label{animation:splashBreath 2.4s ease-in-out infinite}.splash-tip{margin:18px 0 0;font-size:10px;letter-spacing:2px;color:#fff0f4c0;min-height:1em;opacity:0;animation:splashRise 1.4s ease 2s forwards}@keyframes splashSpin{to{transform:rotate(360deg)}}@keyframes splashChar{to{opacity:1;filter:blur(0)}}@keyframes splashRise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes splashRing{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.35,1.7)}}@keyframes splashBreath{50%{opacity:.45}}@keyframes splashMote{0%,to{opacity:0;transform:translateY(0) scale(.6)}50%{opacity:.9;transform:translateY(-24px) scale(1)}}@keyframes splashFall{0%{transform:translate(0) rotate(0);opacity:0}8%{opacity:.95}to{transform:translate(var(--drift),112vh) rotate(var(--spin));opacity:.6}}@media(max-width:600px){.splash-kicker{font-size:8px;letter-spacing:4px}.splash-line{font-size:11px;gap:10px;letter-spacing:2px}.splash-line span{width:16px}.splash-enter{margin-top:44px;height:48px;padding:0 26px;font-size:12px}}@media(prefers-reduced-motion:reduce){.splash-petals,.splash-motes{display:none}.splash-title span,.splash-kicker,.splash-roman,.splash-line,.splash-enter,.splash-tip{opacity:1;filter:none}}
