:root{color-scheme:dark;--bg:#050505;--fg:#f6f6f7;--muted:#8f9098;--frost:#292a2c;--blue:#7da8f8;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;background:var(--bg);color:var(--fg)}button{font:inherit;-webkit-tap-highlight-color:transparent;cursor:pointer}button:focus-visible{outline:2px solid #8aa9ff;outline-offset:4px}button:disabled{opacity:.4;cursor:not-allowed}.app{min-height:100svh;min-height:100dvh;position:relative;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#090b11 0%,#050505 48%,#010101 100%)}.grain{pointer-events:none;position:absolute;inset:0;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.3'/%3E%3C/svg%3E")}
.top{width:100%;display:flex;justify-content:space-between;align-items:flex-start;padding:calc(env(safe-area-inset-top) + 23px) clamp(22px,5vw,52px) 0;position:relative;z-index:3}.round{width:54px;height:54px;border-radius:999px;display:grid;place-items:center;border:1px solid #353537;color:white;flex:0 0 auto}.round svg,.small-icon,.mini-arrow{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.round svg{width:27px;height:27px}.dark{background:linear-gradient(150deg,#252525,#151515);box-shadow:inset 0 1px 1px #424242}.wordmark{padding-top:6px;display:flex;flex-direction:column;align-items:center;font-size:14px;font-weight:600;letter-spacing:.16em;gap:2px}.wordmark small{font-size:8px;letter-spacing:.18em;color:#71717a;font-weight:500}.brand-symbol{color:#88aaff;font-size:15px;margin-bottom:0}
.stage{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 24px 8px;position:relative;z-index:1}.status-line{display:flex;gap:8px;align-items:center;color:#969baa;letter-spacing:.13em;font-size:11px;margin:0 0 14px}.status-dot{width:6px;height:6px;background:#89adff;box-shadow:0 0 12px #789ff4;border-radius:50%}
.orb-section{display:grid;place-items:center;width:100%;flex:0 0 auto}.orb-frame{position:relative;display:grid;place-items:center;width:clamp(210px,min(54vw,35vh),340px);height:clamp(210px,min(54vw,35vh),340px);border:0;background:transparent;border-radius:100%;padding:0;isolation:isolate}.orb{position:relative;display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;background:radial-gradient(ellipse at 31% 87%,#f8faff 0%,#e0eaff 23%,#aac7f9 41%,#789cec 64%,#4e72d8 92%);box-shadow:inset 0 0 35px #e6ecff2a,0 0 80px #426de314;animation:breathe 6.5s ease-in-out infinite;transition:filter .6s,background .6s}.orb:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(ellipse at 78% 15%,#678de622,transparent 58%)}.orb-glow{position:absolute;inset:-32px;border-radius:50%;background:#4878ef;filter:blur(60px);opacity:.09;transition:opacity .3s}.orb-cloud{position:absolute;display:block;filter:blur(14px);background:#eaf2ff;opacity:.35}.cloud-a{width:80%;height:27%;left:-10%;bottom:20%;border-radius:50%;transform:rotate(18deg)}.cloud-b{width:50%;height:25%;right:-5%;bottom:6%;border-radius:50%;transform:rotate(-24deg)}.cloud-c{width:37%;height:25%;left:19%;bottom:33%;border-radius:50%;opacity:.22}.orb-ripple{position:absolute;inset:-4%;border-radius:50%;border:1px solid #7fa6ff55;opacity:0;pointer-events:none}.orb-frame.speaking .orb{animation:breathe 2.7s ease-in-out infinite}.orb-frame.speaking .ripple-one,.orb-frame.recording .ripple-one{animation:ripple 2.4s infinite}.orb-frame.speaking .ripple-two,.orb-frame.recording .ripple-two{animation:ripple 2.4s 1.2s infinite}.orb-frame.recording .orb{background:radial-gradient(ellipse at 32% 81%,#fff0e4 0%,#ffc2ad 27%,#e991ad 52%,#b65580 89%);animation:recording 1.6s ease-in-out infinite}.orb-frame.recording .orb-glow{background:#f2749b;opacity:.2}.orb-frame.paused .orb{filter:saturate(.5);animation:none}.orb-frame.saved .orb{background:radial-gradient(ellipse at 31% 87%,#f9f5ff 0%,#d7cffa 32%,#9188ed 65%,#6759b5 92%)}
.copy-block{max-width:520px;text-align:center;margin-top:31px;padding:0 6px}.eyebrow{font-size:10px;color:#83a5ec;letter-spacing:.24em;font-weight:600;margin:0 0 10px}.copy-block h1{font-size:clamp(23px,5.2vw,34px);line-height:1.35;letter-spacing:.015em;font-weight:550;margin:0 0 13px}.question{font-size:14px;line-height:1.75;color:#c3c6cf;max-width:420px;margin:0 auto;letter-spacing:.01em}.helper{color:#797d88;font-size:11px;margin:16px auto 0;line-height:1.6}.clock{font-variant-numeric:tabular-nums;font-size:24px;letter-spacing:.1em;margin:14px 0 0;color:#e4dfff}.hidden{display:none!important}
.dock{width:min(100%,560px);margin:0 auto;display:flex;align-items:center;gap:12px;padding:0 20px;position:relative;z-index:4}.dock-pill{flex:1;min-width:0;height:62px;border:1px solid #343537;box-shadow:inset 0 2px 3px #4444;border-radius:999px;display:flex;align-items:center;gap:12px;padding:0 19px;color:#c8c8ca;background:linear-gradient(#272727,#1a1a1a)}.dock-pill span{font-size:14px;flex:1;text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;letter-spacing:.01em}.small-icon{width:22px;height:22px;flex-shrink:0}.mini-arrow{width:17px;height:17px;color:#6a8fff}.action{width:62px;height:62px;background:#222;border-color:#383838}.action svg{width:28px;height:28px}.action.active{background:#a6476b;border-color:#d87ca0}.close{width:62px;height:62px;background:#f5f6f8;color:#08080a;border:0}.close svg{stroke-width:2.1;width:30px}.tip{font-size:10px;color:#5f6065;text-align:center;padding:15px 14px calc(env(safe-area-inset-bottom) + 14px);letter-spacing:.02em}
.overlay{position:fixed;inset:0;background:#000b;backdrop-filter:blur(12px);z-index:10;display:flex;justify-content:center;align-items:flex-end}.overlay[hidden]{display:none}.sheet{width:min(100%,620px);max-height:85dvh;display:flex;flex-direction:column;border:1px solid #3c3e47;border-bottom:0;border-radius:28px 28px 0 0;background:linear-gradient(145deg,#1c1d22,#0c0c10);padding:22px 22px calc(env(safe-area-inset-bottom) + 20px);box-shadow:0 -15px 75px #0008}.sheet-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;border-bottom:1px solid #32333a}.sheet-head h2{font-size:18px;letter-spacing:.04em;margin:0}.sheet-x{font-size:25px;color:#cfd1dd;background:#2e2f35;border:0;width:36px;height:36px;border-radius:50%}.sheet-body{padding-top:15px;overflow-y:auto;font-size:14px;line-height:1.8;color:#d2d4df}.sheet-body p{margin:8px 0 16px}.sheet-body .muted{color:#9396a5;font-size:12px}.sheet-body .notice{padding:12px 15px;border:1px solid #3a3d4b;border-radius:14px;background:#ffffff09}.sheet-body .primary,.sheet-body .secondary{width:100%;border-radius:16px;border:0;padding:13px 14px;font-size:14px;font-weight:600;margin:8px 0 0}.sheet-body .primary{background:#f0f2fc;color:#171a22}.sheet-body .secondary{color:#e6e9f5;background:#30313b}.sheet-body .danger{color:#ffacba}.entry{border-bottom:1px solid #353641;padding:12px 0}.entry time{display:block;font-size:11px;color:#8f97ab}.entry audio{display:block;width:100%;margin:10px 0}.entry button{background:#30313b;border:0;color:#f2f2f2;padding:9px 14px;border-radius:12px}.toast{position:fixed;z-index:12;bottom:calc(env(safe-area-inset-bottom) + 115px);left:50%;transform:translateX(-50%) translateY(12px);max-width:90%;padding:11px 18px;background:#303440;color:#fff;border:1px solid #494f5b;border-radius:22px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;text-align:center}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@keyframes breathe{0%,100%{transform:scale(.98);filter:saturate(1)}50%{transform:scale(1.02);filter:saturate(1.08)}}@keyframes recording{0%,100%{transform:scale(.98)}50%{transform:scale(1.06)}}@keyframes ripple{0%{opacity:.55;transform:scale(.95)}100%{opacity:0;transform:scale(1.22)}}
@media(max-height:720px){.top{padding-top:calc(env(safe-area-inset-top) + 12px)}.orb-frame{width:min(43vw,30vh);height:min(43vw,30vh)}.copy-block{margin-top:18px}.copy-block h1{font-size:24px}.helper{margin-top:7px}.status-line{margin-bottom:8px}.dock-pill,.action,.close{height:54px}.action,.close{width:54px}.tip{padding-top:9px}}
@media(min-width:768px){.orb-frame{width:min(37vh,330px);height:min(37vh,330px)}.top{padding-left:44px;padding-right:44px}.stage{padding-bottom:0}.copy-block{margin-top:40px}.dock{padding:0 8px}.tip{padding-bottom:22px}}
@media(prefers-reduced-motion:reduce){.orb,.orb-frame.speaking .orb,.orb-frame.recording .orb,.orb-ripple{animation:none!important}.toast{transition:none}}