:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#162743;--muted:#60708e;--paper:#f5f8ff;--surface:#ffffff57;--surface-strong:#ffffff9e;--glass-border:#ffffffbd;--glass-edge:#709cd633;--accent:#6755e8;--accent-dark:#4636b8;--accent-soft:#eeeaff;--aqua:#63d9dd;--gradient:linear-gradient(115deg, #8158ef 0%, #5f75ed 42%, #4ecbd1 100%);--gradient-soft:linear-gradient(135deg, #e1daffc2 0%, #d1f4f7b8 100%);--line:#7f91bb2e;--shadow:0 22px 65px #454c9b1f, 0 3px 12px #3956880f;--shadow-hover:0 30px 80px #4a49ad2e, 0 8px 26px #3b709b1a;--radius:28px;--font-display:"Noto Serif TC", "Songti TC", "Source Han Serif TC", "PMingLiU", serif;font-family:Noto Sans TC,PingFang TC,Arial,sans-serif;line-height:1.6}*{box-sizing:border-box}html{background:var(--paper);scroll-behavior:smooth}body{min-height:100vh;color:var(--ink);overflow-wrap:anywhere;background:radial-gradient(circle at 14% 12%,#d3deffc7,#0000 30rem),radial-gradient(circle at 88% 8%,#c9f6f1b3,#0000 34rem),linear-gradient(155deg,#f8fbff 0%,#f4f3ff 50%,#f3fbfb 100%);margin:0;position:relative}body:before{content:"";z-index:-1;pointer-events:none;filter:saturate(112%);background:radial-gradient(48vmax 38vmax at -8% 6%,#9c80ff57,#0000 62%),radial-gradient(42vmax 38vmax at 106% 12%,#56e0d64d,#0000 66%),radial-gradient(52vmax 40vmax at 82% 96%,#7ebbff4d,#0000 66%),radial-gradient(38vmax 32vmax at 14% 88%,#daa9ff3d,#0000 68%);position:fixed;inset:0}body:after{content:"";z-index:-1;pointer-events:none;opacity:.22;background-image:radial-gradient(circle,#3e52823d .7px,#0000 .8px);background-size:18px 18px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#0000 5%,#000 34%,#0000 84%);mask-image:linear-gradient(#0000 5%,#000 34%,#0000 84%)}a{color:inherit}h1,h2,h3{margin:0 0 .6em;line-height:1.25}h1{font-family:var(--font-display);letter-spacing:.02em;font-size:clamp(1.9rem,5vw,3.1rem);font-weight:700}h2{font-size:clamp(1.4rem,3.5vw,1.9rem)}h3{font-size:1.15rem}p{margin:0 0 1em}img,video,iframe{max-width:100%}.shell{width:min(1160px,100% - 36px);margin:0 auto}.skip-link{position:absolute;left:-999px}.skip-link:focus{z-index:10;background:#fff;padding:8px 12px;top:16px;left:16px}.site-header,.site-footer,.card,.band,.tutorial-step,.hero-copy,.marketing-video{border:1px solid var(--glass-border);background:linear-gradient(145deg, #ffffff7a, #ffffff29), var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(28px)saturate(155%)}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.site-header,.site-footer,.card,.band,.tutorial-step,.hero-copy,.marketing-video{background:var(--surface-strong)}}.site-header{z-index:20;background:#ffffff61;border-color:#ffffffa8;border-radius:24px;width:min(1160px,100% - 24px);margin:12px auto 0;position:sticky;top:12px;box-shadow:inset 0 1px #ffffffe0,0 12px 40px #32497f1a}.header-inner{flex-wrap:wrap;align-items:center;gap:12px 24px;min-height:64px;padding:8px 16px;display:flex}.brand{font-family:var(--font-display);letter-spacing:.04em;align-items:center;gap:9px;font-size:1.4rem;font-weight:700;text-decoration:none;display:inline-flex}.brand:before{content:"";background:linear-gradient(135deg,#8f68f5,#67dce1);border:1px solid #ffffffe6;border-radius:50%;flex:none;width:12px;height:12px;box-shadow:inset 2px 2px 5px #ffffffb8,0 3px 12px #6567e452}.main-nav{flex-wrap:wrap;flex:1;gap:4px 20px;display:flex}.main-nav a,.footer-nav a{color:var(--muted);border-radius:999px;padding:7px 10px;text-decoration:none}.main-nav a:hover,.footer-nav a:hover{color:var(--accent);background:#ffffff61}.site-footer{box-shadow:none;background:linear-gradient(#ffffff29,#ffffff70);border-width:1px 0 0;margin-top:72px}.footer-inner{flex-wrap:wrap;justify-content:space-between;gap:16px;padding:32px 0;display:flex}.footer-nav{flex-wrap:wrap;gap:8px 18px;display:flex}.section{padding:56px 0 0}.section-head{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.section-head a{color:var(--accent);font-weight:700;text-decoration:none}.band{border-radius:var(--radius);box-shadow:inset 0 1px 0 #ffffffe0, inset 0 -1px 0 var(--glass-edge), var(--shadow);background:radial-gradient(circle at 8% 18%,#b197ff4d,#0000 28%),radial-gradient(circle at 92% 88%,#68e1d947,#0000 30%),linear-gradient(135deg,#ffffff75,#ffffff26);margin-top:56px;padding:36px clamp(16px,4vw,44px);overflow:hidden}.eyebrow{color:var(--accent);letter-spacing:.18em;text-transform:uppercase;margin-bottom:.5em;font-size:.8rem;font-weight:700}.lead{color:var(--muted);font-size:1.1rem}.muted{color:var(--muted)}.stack{gap:20px;display:grid}.card-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px;display:grid}.card{border-radius:var(--radius);flex-direction:column;align-items:flex-start;padding:28px;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;position:relative;overflow:hidden}.card:before,.tutorial-step:before,.marketing-video:before,.hero-copy:before{content:"";z-index:0;pointer-events:none;border-radius:inherit;background:linear-gradient(120deg,#ffffff80,#0000 26%),radial-gradient(circle at 88% 92%,#5bdadb24,#0000 36%);position:absolute;inset:0}.card>*,.tutorial-step>*,.marketing-video>*,.hero-copy>*{z-index:1;position:relative}.card:hover{box-shadow:var(--shadow-hover);border-color:#fffffff5;transform:translateY(-5px)}.badge{color:var(--accent-dark);background:#fff6;border:1px solid #ffffffb3;border-radius:999px;padding:3px 12px;font-size:.8rem;font-weight:700;display:inline-block}.text-link{color:var(--accent);margin-top:auto;font-weight:700}.actions{flex-wrap:wrap;gap:12px;margin-top:8px;display:flex}.button{white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;min-height:46px;padding:0 24px;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s,background-color .2s,border-color .2s;display:inline-flex}.button-primary{background:radial-gradient(circle at 22% 0%, #ffffff6b, transparent 32%), var(--gradient);color:#fff;border:1px solid #ffffff8a;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff75,inset 0 -8px 18px #3b44b529,0 10px 28px #5b4bd63d}.button-primary:hover{transform:translateY(-1px);box-shadow:inset 0 1px #fff9,0 15px 34px #4f63d557}.button-secondary{border:1px solid var(--glass-border);color:var(--accent-dark);box-shadow:var(--shadow);background:#ffffff57}.button-secondary:hover{background:#ffffff9e;border-color:#fffffff5}a:focus-visible,.button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.hero{min-height:620px;padding:80px 0 48px;position:relative;overflow-x:clip}.hero-inner{z-index:1;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));align-items:center;gap:clamp(28px,5vw,64px);display:grid;position:relative}.hero-copy{box-shadow:inset 0 1px 0 #ffffffeb, inset -1px -1px 0 var(--glass-edge), var(--shadow);border-radius:38px 62px 42px 58px;padding:clamp(28px,5vw,54px);position:relative;overflow:hidden}.hero h1{background:linear-gradient(105deg, var(--ink) 0%, #24385c 42%, #6755e8 70%, #3dbcc5 100%);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(2.3rem,5.6vw,4.6rem)}.hero-decor{pointer-events:none;position:absolute;inset:0}.glow{filter:blur(58px);border-radius:50%;position:absolute}.glow-1{background:#a48bff7a;width:420px;height:260px;top:-10%;right:8%;transform:rotate(-18deg)}.glow-2{background:#74e7db70;width:380px;height:220px;bottom:-20%;left:30%}.liquid-shape{-webkit-backdrop-filter:blur(10px)saturate(150%);background:radial-gradient(circle at 28% 22%,#ffffff9e,#0000 23%),linear-gradient(135deg,#9875ff38,#58dfda2e);border:1px solid #ffffff94;position:absolute;box-shadow:inset 18px 22px 38px #ffffff4d,inset -18px -22px 38px #6674e31f,0 30px 80px #4065aa1a}.liquid-shape-1{border-radius:28% 72% 64% 36%/42% 32% 68% 58%;width:48vw;height:340px;top:-20%;left:35%;rotate:-9deg}.liquid-shape-2{border-radius:64% 36% 28% 72%/54% 62% 38% 46%;width:42vw;height:390px;bottom:-28%;right:-13%;rotate:14deg}.bubble{background:radial-gradient(circle at 32% 28%,#fffffff2 0 7%,#fff0 20%),radial-gradient(circle at 72% 76%,#a78bfa8c,#0000 55%),radial-gradient(circle at 22% 78%,#7dd3fc80,#0000 50%),radial-gradient(circle,#f5f3ff59 55%,#c4b5fd8c 100%);border-radius:50%;position:absolute;box-shadow:0 0 0 1px #ffffffb8,inset -10px -12px 28px #7c5cf638,inset 8px 10px 18px #fffc,0 20px 40px #6e5cdc29}.bubble-1{width:112px;height:112px;top:10%;left:44%}.bubble-2{width:56px;height:56px;bottom:6%;left:2%}.bubble-3{width:40px;height:40px;top:4%;right:2%}@media (prefers-reduced-motion:no-preference){.bubble{animation:9s ease-in-out infinite float}.bubble-2{animation-delay:-3s}.bubble-3{animation-delay:-6s}.liquid-shape{animation:14s ease-in-out infinite alternate liquid-drift}.liquid-shape-2{animation-delay:-7s}}@keyframes liquid-drift{0%{translate:-8px -4px;scale:.98}to{translate:12px 10px;scale:1.03}}@keyframes float{0%,to{translate:0}50%{translate:0 -12px}}.marketing-video{box-shadow:inset 0 1px 0 #ffffffe6, var(--shadow-hover);border-radius:36px;margin:0;padding:12px;position:relative;overflow:hidden}.video-frame{aspect-ratio:16/9;border:1px solid var(--glass-border);width:100%;box-shadow:var(--shadow);background:#20282b;border-radius:26px;display:block}.video-placeholder{color:var(--ink);background:radial-gradient(circle at 18% 14%,#ffffffd1,#0000 34%),radial-gradient(circle at 85% 88%,#5ee2d970,#0000 34%),linear-gradient(135deg,#cdc0ffb8 0%,#d6e4ff99 50%,#c1f1f1b3 100%);flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex}.play-icon{border:1px solid var(--glass-border);width:64px;height:64px;color:var(--accent);-webkit-backdrop-filter:blur(18px)saturate(150%);backdrop-filter:blur(18px)saturate(150%);background:#ffffff5c;border-radius:50%;place-items:center;font-size:1.3rem;display:grid;box-shadow:0 10px 30px #5848b42e}.marketing-video figcaption{flex-direction:column;margin-top:12px;display:flex}.store-buttons{flex-wrap:wrap;gap:12px;margin:0 0 16px;padding:0;list-style:none;display:flex}.store-button{color:#fff;min-width:150px;box-shadow:var(--shadow);background:linear-gradient(135deg,#1d2c48,#293b60);border:1px solid #ffffff47;border-radius:16px;flex-direction:column;padding:10px 20px;text-decoration:none;display:inline-flex}.store-button.is-disabled{color:var(--muted);box-shadow:none;cursor:not-allowed;background:#ffffff47;border:1px solid #ffffffb8}.store-label{font-weight:700}.store-status{font-size:.8rem}.download-card{flex-flow:wrap;justify-content:space-between;gap:16px}.tutorial-block{gap:24px;margin-top:32px;display:grid}.tutorial-steps{gap:16px;margin:0;padding:0;list-style:none;display:grid}.tutorial-step{border-radius:var(--radius);grid-template-columns:96px 1fr;align-items:start;gap:16px;padding:18px;display:grid;position:relative;overflow:hidden}.step-image{aspect-ratio:1;background:radial-gradient(circle at 28% 20%, #ffffffb8, transparent 34%), var(--gradient-soft);color:var(--accent-dark);font-family:var(--font-display);border:1px solid #ffffffb3;border-radius:18px;place-items:center;font-size:1.8rem;font-weight:700;display:grid}.start-steps{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:16px;margin:0;padding-left:1.2em;display:grid}.start-steps li{flex-direction:column;display:flex}.start-steps li::marker{color:var(--accent);font-weight:700}.start-steps a{color:var(--accent);font-weight:700}.plan-card.is-highlighted{background:linear-gradient(145deg, #ffffff8f, #fff3) padding-box, var(--gradient) border-box;border:1px solid #0000;box-shadow:inset 0 1px #ffffffe6,0 24px 70px #5d58d429}.plan-price{font-size:1.3rem;font-weight:700}.check-list{margin:0 0 20px;padding-left:1.2em}.check-list li::marker{color:var(--accent)}.plan-card .button{margin-top:auto}@media (max-width:640px){.site-header{border-radius:20px;width:calc(100% - 12px);margin-top:6px;top:6px}.header-inner{padding-inline:12px}.header-cta{margin-left:auto}.main-nav{flex-basis:100%;order:3}.hero{min-height:auto;padding-top:42px}.hero-copy{border-radius:28px 42px 30px 40px;padding:28px 22px}.tutorial-step{grid-template-columns:64px 1fr}.bubble-2{display:none}.bubble-1{width:64px;height:64px;inset:auto 4% 42% auto}.liquid-shape-1{width:90vw;left:20%}.liquid-shape-2{width:100vw;right:-42%}}
