@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;background:#060620;overflow:hidden;font-family:JetBrains Mono,monospace}#root{width:100%;height:100%}.bottom-bar{position:absolute;bottom:32px;left:50%;transform:translate(-50%);width:520px;height:52px;z-index:10}.input-wrap{position:absolute;inset:0;display:flex;align-items:center;gap:10px;transition:transform .55s cubic-bezier(.34,1.56,.64,1),opacity .4s cubic-bezier(.25,.1,.25,1);transform:translateY(0);opacity:1}.input-wrap.hidden{transform:translateY(28px);opacity:0;pointer-events:none}#text-input{flex:1;padding:14px 18px;background:#060f28d9;border:1px solid rgba(0,170,255,.25);border-radius:14px;color:#8df;font-family:JetBrains Mono,monospace;font-size:13px;outline:none;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:border-color .3s,box-shadow .3s}#text-input::placeholder{color:#64b4ff4d}#text-input:focus{border-color:#00c8ff80;box-shadow:0 0 20px #0096ff26}#go-btn{padding:14px 28px;background:linear-gradient(135deg,#0078ff4d,#00c8ff26);border:1px solid rgba(0,200,255,.4);border-radius:14px;color:#6df;font-family:JetBrains Mono,monospace;font-size:13px;font-weight:500;cursor:pointer;letter-spacing:2px;text-transform:uppercase;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:all .3s;white-space:nowrap}#go-btn:hover{background:linear-gradient(135deg,#008cff73,#00dcff40);border-color:#00dcff99;box-shadow:0 0 25px #00b4ff40;color:#aef}#go-btn:active{transform:scale(.97)}.speak-wrap{position:absolute;inset:0;display:flex;align-items:center;padding:0 20px;background:#060f28d9;border:1px solid rgba(0,200,255,.3);border-radius:14px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform .55s cubic-bezier(.34,1.56,.64,1),opacity .4s cubic-bezier(.25,.1,.25,1);transform:translateY(-28px);opacity:0;pointer-events:none;overflow:hidden}.speak-wrap.active{transform:translateY(0);opacity:1;pointer-events:auto}.speak-wave{display:flex;gap:3px;margin-right:14px;flex-shrink:0}.speak-wave span{display:block;width:2.5px;height:14px;background:#00dcff99;border-radius:2px;animation:wave .7s ease-in-out infinite}.speak-wave span:nth-child(2){animation-delay:.08s}.speak-wave span:nth-child(3){animation-delay:.16s}.speak-wave span:nth-child(4){animation-delay:.24s}.speak-wave span:nth-child(5){animation-delay:.32s}@keyframes wave{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1.4)}}#speak-text{font-size:13px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#64aadc59;font-family:JetBrains Mono,monospace}#speak-text .spoken{color:#6ef;text-shadow:0 0 8px rgba(0,200,255,.3);transition:color .12s,text-shadow .12s}#speak-text .current{color:#aaf4ff;text-shadow:0 0 12px rgba(0,220,255,.5)}.controls-panel{position:absolute;bottom:32px;left:24px;display:flex;gap:8px;z-index:10}.control-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#060f28d9;border:1px solid rgba(0,170,255,.25);border-radius:10px;color:#64b4ff80;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:all .25s ease}.control-btn:hover{border-color:#00c8ff80;color:#64dcffcc;box-shadow:0 0 15px #0096ff26}.control-btn.active{border-color:#00c8ff99;color:#6df;background:#0064b440}.scale-control{position:relative}.scale-popover{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);width:140px;padding:12px;background:#060f28f2;border:1px solid rgba(0,170,255,.3);border-radius:12px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:popoverIn .2s ease}@keyframes popoverIn{0%{opacity:0;transform:translate(-50%) translateY(5px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.popover-header{font-size:11px;color:#64b4ff99;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}.scale-popover input[type=range]{width:100%;height:4px;-webkit-appearance:none;appearance:none;background:#0064b44d;border-radius:2px;outline:none}.scale-popover input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;background:#0af;border-radius:50%;cursor:pointer;box-shadow:0 0 10px #00aaff80}.scale-popover input[type=range]::-moz-range-thumb{width:14px;height:14px;background:#0af;border:none;border-radius:50%;cursor:pointer;box-shadow:0 0 10px #00aaff80}.scale-value{text-align:center;font-size:13px;color:#6df;margin:8px 0}.scale-presets{display:flex;gap:4px}.preset-btn{flex:1;padding:6px 0;font-size:10px;background:#00509633;border:1px solid rgba(0,150,255,.2);border-radius:6px;color:#64b4ff99;cursor:pointer;transition:all .2s ease;font-family:JetBrains Mono,monospace}.preset-btn:hover{background:#0064b44d;border-color:#00b4ff66;color:#8df}.preset-btn.active{background:#0078c866;border-color:#00c8ff80;color:#6df}.app{width:100vw;height:100vh;position:relative;overflow:hidden}