:root{color:#17291f;background:#fafbf7}
body{background:#fafbf7;color:#17291f}
.nav{background:#fffffff0;border-bottom:1px solid #e5ebe3;backdrop-filter:blur(14px);position:sticky;top:0;z-index:5}
.brand{color:#17291f}.mark,.mini-mark{background:#297d58;color:white}.dot{color:#4bad79}
.nav nav{color:#566a5c}.nav nav a:hover,.nav-account:hover{color:#14784d}.nav-account{color:#263c2e}
.lang{border-color:#d2dfd3;color:#346b4d;background:#f5faf5}.lang:hover{background:#e6f3e8}
.eyebrow{color:#277d53}
.hero{background:radial-gradient(circle at 83% 20%,#e5f4e7 0,transparent 35%),radial-gradient(circle at 4% 90%,#f8eedc 0,transparent 33%),#fafbf7;min-height:700px}
.hero h1,.account-art h1{color:#16291e}.hero h1 em,.account-art h1 em{color:#19815c}
.hero-copy>p{color:#546759}.hero .hero-note{color:#637969}
.button.primary{background:#1b7852;color:white;box-shadow:0 10px 22px #1b785225}.button.primary:hover{background:#135e40}
.button.ghost{color:#23523a;border-color:#c8d9cb;background:#ffffffba}.button.ghost:hover{background:#e9f3e9}
.preview{border-color:#dce8dc;box-shadow:0 24px 70px #1e4f3030}
.preview .mini-mark{background:#91dfb8;color:#10251a}
.strip{background:#eef5ee;color:#1b2b20;border-top:1px solid #e6eee6;border-bottom:1px solid #e2eae1}
.strip .eyebrow{color:#3a8057}.steps article{border-top-color:#b8d0bc}.steps p{color:#617265}.number{color:#3f9561}
.features{background:#fff;color:#17291f}
.feature-grid article{background:#f7faf5;border:1px solid #e2eee3;box-shadow:0 8px 24px #466b4210}
.feature-icon{color:#298357}.feature-grid p{color:#607466}
.status{background:linear-gradient(110deg,#e9f5ea,#f6f3e8);color:#172d20;border-top:1px solid #d9e8da;border-bottom:1px solid #d9e8da}
.status .eyebrow{color:#2b8057}.status p{color:#536b58}.status .button.ghost{background:#fff}
footer{background:#fafbf7;color:#718272}footer .brand{color:#192d21}
.account-main{background:radial-gradient(circle at 24% 73%,#e9f4ea 0,transparent 31%),#fafbf7}
.account-art p{color:#5c7060}.account-panel{background:white;border:1px solid #dce8dd;box-shadow:0 20px 70px #2c553a19}
.tabs{border-bottom-color:#e3ebe3}.tabs button{color:#758678}.tabs button.selected{color:#1b7952;border-bottom-color:#1b7952}
.account-panel h2{color:#1d3224}.account-panel label{color:#425849}
.account-panel input{background:#f8faf7;border:1px solid #c9d9ca;color:#1d3022}.account-panel input:focus{border-color:#479970;box-shadow:0 0 0 3px #88d5a734}
.hint,.panel-note{color:#718473}.form-message{color:#a2392b}
.profile-card{border-color:#d8e8d9;background:#f6faf5}.profile-card small{color:#728474}
.orb{background:radial-gradient(circle at 30% 30%,#d3f5d4,#8acc9b 49%,#3d8e63 85%);box-shadow:0 0 100px #78bf8a4a;opacity:.55}
@media(max-width:640px){.hero{padding-top:66px;padding-bottom:78px}.hero h1{font-size:clamp(47px,13vw,61px)}.section-intro{display:block}.section-intro h2{margin-top:24px}.feature-grid article{min-height:175px}.status{padding-top:64px;padding-bottom:64px}.account-main{padding-top:48px}.account-panel{box-shadow:0 10px 35px #2c553a12}}
.preview{color:#e7efea}.preview .subtitle{color:#e9f5ec}.preview .subtitle small{color:#bbd3c1}
.hero{min-height:650px;grid-template-columns:minmax(0,1fr) minmax(360px,520px);gap:clamp(30px,4vw,70px)}
.hero h1{font-size:clamp(50px,5.9vw,88px)}
.preview{background:#fff;color:#213b2b;border:1px solid #dce8de;border-radius:20px;transform:none;box-shadow:0 24px 70px #1e4f3022}
.preview-top{height:40px;padding:0 15px;background:#f7faf7;border-bottom:1px solid #e3ece4;gap:13px}
.demo-browser-dots{display:flex;gap:5px}.demo-browser-dots i{width:7px;height:7px;border-radius:50%;background:#cad9cd}.demo-browser-dots i:first-child{background:#e7afa2}.demo-browser-dots i:nth-child(2){background:#ead09b}
.preview .url{color:#819485;font-size:11px}.demo-browser-lock{color:#9db1a0;font-size:19px}
.demo-page{padding:17px 20px 16px;background:#fff}.demo-page-heading{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;color:#3b6849;letter-spacing:.02em}.demo-site-mark{font-size:17px;color:#41a36d}.demo-page-tag{margin-left:auto;color:#829788;font-size:10px;font-weight:600;border:1px solid #e4eee5;border-radius:20px;padding:4px 9px}
.demo-cover{height:139px;margin-top:14px;position:relative;overflow:hidden;border-radius:12px;background:radial-gradient(circle at 78% 30%,#c4d7ad 0,transparent 23%),radial-gradient(circle at 14% 84%,#4b9770 0,transparent 44%),linear-gradient(125deg,#113d34,#396f58 58%,#a4bb93)}
.demo-cover-orbit{position:absolute;width:210px;height:210px;border:1px solid #e6f8d666;border-radius:50%;right:15%;top:-70px;transform:rotate(22deg)}.demo-cover-orbit.b{width:340px;height:340px;right:-10%;top:-138px;border-color:#e6f8d633}.demo-cover-word{position:absolute;left:24px;bottom:20px;color:#f5f8ed;font-weight:800;font-size:23px;letter-spacing:.1em;line-height:1.15}
.demo-player{display:flex;align-items:center;gap:12px;padding:17px 2px 14px}.demo-toggle{width:37px;height:37px;flex:0 0 37px;border:0;border-radius:50%;background:#1c8055;color:white;font-size:16px;font-weight:700;box-shadow:0 4px 12px #23875d30}.demo-toggle:hover{background:#126943}.demo-toggle:focus-visible{outline:3px solid #a8ddbd;outline-offset:3px}.demo-track{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.demo-track strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-track span{font-size:10px;color:#8a9d8e}.demo-bars{height:26px;display:flex;align-items:center;gap:3px}.demo-bars i{width:3px;height:12px;border-radius:3px;background:#36ad74;animation:demo-wave .85s ease-in-out infinite alternate}.demo-bars i:nth-child(2){animation-delay:.18s}.demo-bars i:nth-child(3){animation-delay:.37s}.demo-bars i:nth-child(4){animation-delay:.12s}.demo-bars i:nth-child(5){animation-delay:.48s}@keyframes demo-wave{from{height:5px;opacity:.6}to{height:23px;opacity:1}}
.demo-detected{display:flex;align-items:center;gap:7px;padding:9px 11px;border-radius:9px;background:#ecf7ef;color:#287747;font-size:11px;font-weight:700}.demo-live-dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#43b977;box-shadow:0 0 0 3px #bfe8ca}.demo-live-badge{margin-left:auto;padding:3px 7px;border-radius:5px;background:#d6efdd;color:#27754b;font-size:10px}
.demo-captions{margin-top:11px;padding:16px 17px 14px;border-radius:11px;background:#153629;color:#f4f9f5;min-height:135px;position:relative}.demo-caption-heading{display:flex;gap:10px;justify-content:space-between;color:#a8cbb3;font-size:10px;font-weight:700}.demo-original{color:#bbd9c5;font-size:14px;line-height:1.5;margin-top:15px;min-height:21px}.demo-translation{color:#fff;font-size:17px;line-height:1.5;font-weight:750;margin-top:4px;min-height:26px}.demo-caret{position:absolute;bottom:17px;right:17px;width:2px;height:15px;background:#9be3b8;animation:demo-blink 1s steps(1) infinite}@keyframes demo-blink{50%{opacity:0}}
.demo-progress{height:4px;margin-top:17px;background:#e8f0e8;border-radius:4px;overflow:hidden}.demo-progress span{display:block;width:0;height:100%;background:#44a976;border-radius:4px;transition:width .1s linear}.demo-bottom{display:flex;justify-content:space-between;align-items:center;gap:5px;margin-top:8px;color:#90a395;font-size:10px}.demo-bottom span:nth-child(2){color:#769481}
.preview[data-paused="true"] .demo-bars i,.preview[data-paused="true"] .demo-caret{animation-play-state:paused}
@media(max-width:1000px){.hero{grid-template-columns:1fr}.preview{max-width:520px}}
@media(max-width:640px){.hero{padding-top:58px;padding-bottom:72px}.hero h1{font-size:clamp(45px,12vw,61px)}.preview{width:100%}.demo-page{padding:14px}.demo-cover{height:118px}.demo-cover-word{font-size:19px}.demo-captions{min-height:132px}.demo-translation{font-size:16px}}
@media(prefers-reduced-motion:reduce){.demo-bars i,.demo-caret{animation:none}.demo-progress span{transition:none}}
.demo-toggle:disabled{cursor:default;opacity:.8}
