:root{--ink:#1e3a8a;--ink-deep:#12235b;--muted:#63718b;--sky:#4a90e2;--sky-soft:#dceeff;--sunset:#ff8fb3;--sakura:#ff6f9f;--violet:#a78bfa;--starlight:#ffd977;--cloud:#fff;--line:#e6eef8d1;--glass:#ffffffb8;--glass-strong:#ffffffe0;--shadow:0 22px 70px #4a90e238}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--ink);background:linear-gradient(#ffffff5c,#ffffff14 42%,#fff8f56b),url(/backgrounds/echo-sky-connection.svg) top/cover no-repeat fixed,linear-gradient(154deg,#eef7ff 0%,#bfe2ff 24%,#7bb7f2 47%,#ffb4c8 73%,#fff3dd 100%);margin:0;font-family:Inter,Nunito Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body:before,body:after{z-index:-1;pointer-events:none;content:"";position:fixed;inset:0}body:before{opacity:.66;background-color:#0000;background-image:linear-gradient(90deg,#ffffff29,#0000 28%,#ffffff1a 72%,#0000),radial-gradient(circle at 12% 20%,#fff 0 1px,#0000 2px),radial-gradient(circle at 34% 12%,#ffffffe6 0 1px,#0000 2px),radial-gradient(circle at 72% 16%,#fff 0 1px,#0000 2px),radial-gradient(circle at 90% 36%,#ffffffdb 0 1px,#0000 2px),radial-gradient(circle at 22% 68%,#ffffffbf 0 1px,#0000 2px),linear-gradient(116deg,#0000 0 54%,#ffffffc7 55%,#0000 57%);background-position:0 0,0 0,0 0,0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat,repeat,repeat,repeat;background-size:340px 340px,280px 280px,420px 420px,360px 360px,310px 310px,100% 100%;background-attachment:scroll,scroll,scroll,scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box,border-box,border-box,border-box;animation:5.6s ease-in-out infinite alternate starsTwinkle}body:after{filter:blur(10px);background:linear-gradient(#0000 0 62%,#ffffff70 100%),radial-gradient(at 18% 88%,#ffffffdb 0 20%,#0000 42%),radial-gradient(at 58% 94%,#ffffffc7 0 18%,#0000 40%),radial-gradient(at 86% 84%,#fff3ddb8 0 18%,#0000 38%)}@keyframes starsTwinkle{0%{opacity:.55}to{opacity:.95}}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}.shell{min-height:100vh}.topbar{z-index:20;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#ffffff94;border-bottom:1px solid #ffffff94;justify-content:space-between;align-items:center;gap:24px;padding:16px clamp(18px,5vw,72px);display:flex;position:sticky;top:0;box-shadow:0 10px 34px #4a90e21f}.brand{color:var(--ink-deep);letter-spacing:0;align-items:center;gap:10px;font-size:20px;font-weight:850;display:flex}.brand-mark{color:#fff;background:linear-gradient(145deg, var(--sky), var(--sakura));border:1px solid #ffffffb8;border-radius:14px;place-items:center;width:38px;height:38px;display:grid;box-shadow:0 10px 30px #ff6f9f52}.nav{color:#1e3a8ac2;align-items:center;gap:18px;font-size:14px;font-weight:750;display:flex}.nav a{border-radius:999px;padding:8px 10px}.nav a:hover{color:var(--sakura);background:#ffffff7a}.page{width:min(1120px,100% - 40px);margin:0 auto;padding:50px 0 92px}.hero{grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);align-items:center;gap:42px;min-height:calc(100vh - 88px);display:grid}.hero h1{max-width:760px;color:var(--ink-deep);letter-spacing:0;text-shadow:0 12px 42px #ffffffb8;margin:0 0 22px;font-size:clamp(44px,6.2vw,84px);line-height:1.02}.hero p{color:#12235bc7;max-width:620px;margin:0 0 28px;font-size:19px;line-height:1.65}.hero-visual{min-height:560px;padding:28px;position:relative}.hero-visual:before{background:linear-gradient(90deg, transparent, #fff, #ffffffdb, var(--violet), transparent);content:"";border-radius:999px;width:230px;height:2px;position:absolute;top:28px;right:30px;transform:rotate(-18deg);box-shadow:0 0 26px #fffffff2}.phone{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(#4a90e2d6,#ff8fb38a),radial-gradient(circle at 50% 22%,#ffffffb8,#0000 38%);border:1px solid #ffffffbd;border-radius:34px;width:min(380px,100%);margin:0 auto;position:relative;overflow:hidden;box-shadow:0 32px 90px #1e3a8a47}.phone:before{content:"";background:radial-gradient(circle at 18% 16%,#fff 0 1px,#0000 2px),radial-gradient(circle at 78% 24%,#ffffffe6 0 1px,#0000 2px),radial-gradient(at 60% 96%,#ffffffd1 0 26%,#0000 50%);position:absolute;inset:0}.phone-header,.phone-body{position:relative}.phone-header{color:#fff;padding:24px 24px 18px}.phone-header strong{font-size:18px}.phone-body{padding:22px}.signal-row{gap:8px;margin:18px 0;display:flex}.signal{background:linear-gradient(#fffffff2,#dceeffb8);border-radius:999px;flex:1;height:48px}.signal:nth-child(2){background:linear-gradient(180deg, var(--starlight), #ff8fb3d1);height:78px}.signal:nth-child(3){background:linear-gradient(#a78bfaf2,#ffffffb8);height:58px}.cta-row,.action-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.button{color:#fff;background:linear-gradient(135deg, var(--sunset), var(--sakura));border:1px solid #ffffff9e;border-radius:16px;justify-content:center;align-items:center;gap:9px;min-height:46px;padding:0 19px;font-weight:800;transition:transform .16s,box-shadow .16s,background .16s;display:inline-flex;box-shadow:0 14px 34px #ff6f9f57}.button:hover{background:linear-gradient(135deg,#ffa3c1,#ff5d97);transform:translateY(-1px);box-shadow:0 18px 42px #ff6f9f6b}.button.secondary{color:var(--ink);background:#ffffffbd;border-color:#4a90e23d;box-shadow:0 14px 34px #4a90e224}.button.secondary:hover{color:var(--sakura);background:#ffffffeb}.button.danger{background:linear-gradient(135deg,#a78bfa,#ff8fb3)}.section-title{color:var(--ink-deep);letter-spacing:0;margin:0 0 18px;font-size:32px}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.card,.panel,.side-nav{border:1px solid var(--line);background:linear-gradient(145deg, #ffffffc7, #ffffff8a), var(--glass);box-shadow:inset 0 1px 0 #ffffffb8, var(--shadow);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.card{border-radius:20px;padding:20px}.card h3{color:var(--ink-deep);margin:0 0 8px}.card p,.muted{color:var(--muted);line-height:1.65}.card svg{color:var(--sakura)}.app-layout{grid-template-columns:250px minmax(0,1fr);gap:28px;display:grid}.side-nav{border-radius:22px;align-self:start;position:sticky;top:92px;overflow:hidden}.side-nav a{color:#1e3a8ab8;border-bottom:1px solid #e6eef8ad;align-items:center;gap:10px;padding:15px 17px;font-weight:800;display:flex}.side-nav a:last-child{border-bottom:0}.side-nav a:hover{color:var(--sakura);background:#ffffff7a}.side-nav svg{color:var(--sky)}.panel{border-radius:26px;overflow:hidden}.panel-header{color:#fff;background:radial-gradient(circle at 90% 12%,#ffffffc7 0 4px,#0000 5px),linear-gradient(116deg,#0000 0 70%,#ffffff80 72%,#0000 78%),linear-gradient(135deg,#4a90e2e0,#a78bfa94,#ff8fb370);border-bottom:1px solid #e6eef8b8;padding:22px 24px}.panel-header h1{letter-spacing:0;margin:0 0 7px;font-size:28px}.panel-header .muted{color:#ffffffdb}.panel-header.compact{color:var(--ink-deep);background:0 0;border:0;padding:0}.panel-header.compact h2{margin:4px 0 0}.panel-header.compact .eyebrow{color:var(--sakura)}.panel-body{padding:22px}.chat{flex-direction:column;height:min(440px,100vh - 250px);min-height:320px;max-height:440px;display:flex}.messages{overscroll-behavior:contain;scrollbar-color:#ff6f9f70 transparent;background:radial-gradient(at 30% 95%,#ffffffc7,#0000 42%),linear-gradient(#dceeff47,#ffffff1f);flex-direction:column;flex:1;gap:14px;min-height:0;padding:22px;display:flex;overflow-y:auto}.chat .messages{border-bottom-right-radius:26px;border-bottom-left-radius:26px}.bubble{border:1px solid #ffffffad;border-radius:22px;max-width:78%;padding:13px 15px;line-height:1.55;animation:.26s ease-out bubbleFloat;box-shadow:0 12px 32px #4a90e224}@keyframes bubbleFloat{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.bubble.assistant{color:var(--ink);background:#ffffffdb;align-self:flex-start}.bubble.user{color:#fff;background:linear-gradient(135deg, var(--sky), var(--violet));align-self:flex-end}.composer{background:#ffffff8f;border-top:1px solid #e6eef8b8;grid-template-columns:1fr auto;gap:10px;padding:16px;display:grid}.voice-card{border:1px solid var(--line);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:radial-gradient(circle at 92% 12%,#ffffffd1 0 4px,#0000 5px),linear-gradient(145deg,#fffc,#fff5fa9e);border-radius:24px;gap:14px;margin-top:16px;padding:18px;display:grid;box-shadow:inset 0 1px #ffffffc7,0 20px 58px #4a90e22e}.voice-card h3{color:var(--ink-deep);margin:0 0 6px}.voice-card p{margin:0}.voice-record-button{color:#fff;background:linear-gradient(135deg, var(--sunset), var(--sakura));-webkit-user-select:none;user-select:none;touch-action:none;border:1px solid #ffffffb8;border-radius:20px;justify-content:center;align-items:center;gap:10px;width:100%;min-height:58px;font-weight:900;transition:transform .16s,box-shadow .16s,filter .16s;display:inline-flex;box-shadow:0 16px 38px #ff6f9f57}.voice-record-button:hover{transform:translateY(-1px)}.voice-record-button.recording{filter:saturate(1.12);transform:scale(.99);box-shadow:0 0 0 8px #ff6f9f24,0 18px 44px #ff6f9f7a}.voice-record-button.recording svg{animation:.85s ease-in-out infinite alternate voicePulse}@keyframes voicePulse{0%{opacity:.74;transform:scale(.92)}to{opacity:1;transform:scale(1.08)}}.voice-result{background:#ffffffad;border:1px solid #4a90e224;border-radius:18px;padding:14px}.voice-result.compact{padding:12px}.voice-result.compact .voice-player{margin-top:8px}.voice-result strong{color:var(--ink-deep)}.voice-result p{color:var(--muted);margin:7px 0 0;line-height:1.62}.voice-player{width:100%;margin-top:10px;display:block}.voice-studio{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:radial-gradient(circle at 84% 9%,#ffffffe6 0 4px,#0000 5px),radial-gradient(circle at 15% 76%,#ff8fb33d,#0000 30%),linear-gradient(155deg,#ffffff80,#dceeff59);border:1px solid #e6eef8c7;border-radius:28px;gap:18px;display:grid;overflow:hidden;box-shadow:0 28px 80px #4a90e22e}.voice-studio>.panel-header{background:radial-gradient(at 20% 110%,#ffffffe0,#0000 38%),linear-gradient(135deg,#4a90e2db,#a78bfa8f,#ff8fb370);border-bottom:0;padding:28px 28px 8px}.voice-primary-zone,.voice-result-panel,.voice-match-section{background:#ffffffb3;border:1px solid #ffffffb8;border-radius:24px;gap:16px;margin:0 18px 18px;padding:20px;display:grid;box-shadow:inset 0 1px #ffffffd1,0 18px 58px #4a90e224}.voice-primary-zone{align-content:center;min-height:330px}.voice-record-button.large{border-radius:24px;min-height:72px;font-size:18px}.voice-live-transcript{background:#fff0f6b8;border:1px solid #ff6f9f33;border-radius:18px;padding:14px}.voice-live-transcript p{color:var(--muted);margin:6px 0 0}.voice-result-heading{grid-template-columns:auto 1fr;align-items:start;gap:14px;display:grid}.voice-result-heading h2{color:var(--ink-deep);margin:0 0 6px}.voice-result-heading p{color:var(--muted);margin:0;line-height:1.65}.voice-score-badge{color:#fff;background:linear-gradient(135deg, var(--sakura), var(--violet));text-align:center;border-radius:24px;place-items:center;min-width:76px;min-height:76px;padding:10px;font-size:12px;font-weight:900;display:grid;box-shadow:0 16px 38px #ff6f9f42}.voice-analysis-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.voice-analysis-grid div{background:#ffffffa3;border:1px solid #4a90e21f;border-radius:18px;min-width:0;padding:13px}.voice-analysis-grid span{color:var(--muted);margin-bottom:6px;font-size:12px;font-weight:800;display:block}.voice-analysis-grid strong{color:var(--ink-deep);line-height:1.45;display:block}.voice-actions{grid-template-columns:1fr 1fr;gap:10px;display:grid}.voice-match-section{margin-top:0}.voice-match-grid{gap:12px;display:grid}.voice-match-card{background:radial-gradient(circle at 93% 12%,#ffffffc7 0 3px,#0000 4px),#ffffffb8;border:1px solid #4a90e21f;border-radius:20px;gap:12px;padding:16px;display:grid}.voice-match-card p,.voice-match-card blockquote{color:var(--muted);margin:0;line-height:1.6}.voice-match-card blockquote{border-left:3px solid #ff6f9f99;padding-left:10px}.voice-match-topline{grid-template-columns:1fr auto;gap:12px;display:grid}.voice-match-topline strong{color:var(--ink-deep);font-size:17px}.voice-match-score{color:#fff;background:linear-gradient(135deg, var(--sky), var(--sakura));border-radius:18px;place-items:center;width:54px;height:54px;font-weight:900;display:grid}.voice-empty-state{justify-items:start;gap:12px;display:grid}.voice-empty-state svg{color:var(--sakura)}.voice-empty-state h2{color:var(--ink-deep);margin:0}.voice-empty-state p{color:var(--muted);margin:0;line-height:1.6}.input,.textarea{width:100%;color:var(--ink);background:#ffffffc7;border:1px solid #4a90e238;border-radius:16px;outline:none;padding:12px 14px;transition:border-color .15s,box-shadow .15s,background .15s}.input:focus,.textarea:focus{background:#fffffff2;border-color:#ff6f9fb3;box-shadow:0 0 0 4px #ff6f9f24}.textarea{resize:vertical;min-height:120px}.profile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.pill-row{flex-wrap:wrap;gap:8px;display:flex}.pill{color:var(--ink);background:linear-gradient(135deg,#dceeffdb,#fff0f6e6);border:1px solid #4a90e21f;border-radius:999px;padding:7px 11px;font-size:13px;font-weight:800}.score{width:92px;height:92px;color:var(--ink-deep);background:linear-gradient(var(--glass-strong), var(--glass-strong)) padding-box, conic-gradient(from 160deg, var(--sakura), var(--violet), var(--sky), var(--sakura)) border-box;border:5px solid #ffffffb8;border-radius:50%;place-items:center;font-size:28px;font-weight:900;display:inline-grid;box-shadow:0 16px 42px #ff6f9f42}.settings-heading{align-items:flex-start;gap:14px;display:flex}.settings-heading h3{margin:0 0 4px}.settings-heading p{margin:0}.language-switch{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0;display:grid}.language-option{min-height:88px;color:var(--ink);text-align:left;background:#ffffffa8;border:1px solid #4a90e22e;border-radius:18px;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;display:flex}.language-option:hover,.language-option.selected{background:#fff0f6d1;border-color:#ff6f9fc2}.language-option.selected svg{color:var(--sakura)}.language-option span{gap:4px;display:grid}.language-option small{color:var(--muted)}.bottom-nav{z-index:30;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#ffffffd6;border:1px solid #ffffffb8;border-radius:24px;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:8px;display:none;position:fixed;bottom:14px;left:14px;right:14px;box-shadow:0 18px 50px #1e3a8a38}.bottom-nav a{color:#1e3a8a94;border-radius:18px;place-items:center;gap:3px;min-width:0;min-height:48px;font-size:11px;font-weight:850;display:grid}.bottom-nav a span{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.bottom-nav a.active{color:var(--sakura);background:#fff0f6eb}ul{padding-left:20px}li{margin:8px 0}.paused{display:none!important}@media (max-width:860px){.topbar{padding:14px 18px;position:static}.nav,.side-nav{display:none}.page{width:min(100% - 28px,520px);padding:28px 0 104px}.hero,.app-layout,.grid,.profile-grid,.language-switch{grid-template-columns:1fr}.hero{gap:24px;min-height:auto}.hero h1{font-size:clamp(42px,12vw,58px)}.hero p{font-size:16px}.hero-visual{min-height:auto;padding:4px 0 0}.phone{border-radius:30px}.panel{border-radius:24px}.panel-header,.panel-body,.messages{padding:18px}.voice-studio>.panel-header{padding:22px 18px 4px}.voice-primary-zone,.voice-result-panel,.voice-match-section{border-radius:22px;margin:0 12px 12px;padding:16px}.voice-primary-zone{min-height:300px}.voice-result-heading,.voice-analysis-grid,.voice-actions{grid-template-columns:1fr}.voice-score-badge{width:84px;min-height:58px}.panel-header h1{font-size:25px}.chat{height:min(400px,100vh - 230px);min-height:300px;max-height:400px}.bubble{max-width:92%}.composer{grid-template-columns:1fr 48px;padding:12px}.composer .button{border-radius:16px;min-width:48px;padding:0}.action-row .button{flex:auto}.bottom-nav{display:grid}}@media (max-width:420px){.brand{font-size:18px}.brand-mark{border-radius:13px;width:34px;height:34px}.hero h1{font-size:42px}.button{width:100%}.score{width:82px;height:82px;font-size:26px}}