:root {font-family: -apple-system,BlinkMacSystemFont,'Inter','Segoe UI',sans-serif; color-scheme:dark; --bg:#0d1221; --surface:#141d30; --line:#29344c; --muted:#a2afc5; --text:#f5f7ff; --blue:#4982ff; --mint:#49dab5}
* {box-sizing:border-box} html {background:var(--bg)} body {margin:0; background:radial-gradient(circle at 80% -12%,#1b2b51 0,transparent 38%),var(--bg);color:var(--text);min-height:100dvh;font-size:14px} button,input,select {font:inherit} button {cursor:pointer;-webkit-tap-highlight-color:transparent} button:disabled {cursor:wait;opacity:.55} .hidden {display:none!important}
.shell {max-width:660px;margin:auto;padding:0 20px calc(38px + env(safe-area-inset-bottom))}.topbar{padding:calc(20px + env(safe-area-inset-top)) 0 28px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center}.brand-icon,.login-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:linear-gradient(145deg,#4686ff,#2547b4);font-size:32px;font-weight:900}.brand strong,.brand span{display:block}.brand strong{font-size:16px;letter-spacing:-.3px}.brand span{font-size:10px;font-weight:800;letter-spacing:1.5px;color:#8295b4;margin-top:5px}.icon-btn{border:1px solid var(--line);background:#17243a;color:var(--muted);width:40px;height:40px;border-radius:13px;font-size:24px}.hero{padding:12px 0 24px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.9px;color:#94ade2;display:flex;align-items:center;gap:9px}.live-dot{width:7px;height:7px;background:var(--mint);box-shadow:0 0 10px var(--mint);border-radius:50%}.hero h1{font-size:clamp(33px,7.2vw,47px);line-height:1.12;letter-spacing:-1.5px;margin:13px 0 11px}.hero h1 em{font-style:normal;color:#79a2ff}.hero p,.login-screen p{color:var(--muted);margin:0;font-size:14px;line-height:1.55}.language-pair{background:#172138;border:1px solid #2c3a56;border-radius:18px;padding:14px 16px}.language-pair label{font-size:10px;color:#7f92b5;letter-spacing:1.3px;font-weight:800}.pair-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:9px;font-weight:750;font-size:17px}.pair-row select{border:0;background:transparent;color:var(--text);max-width:47%;min-width:140px;text-align:right;font-size:16px;font-weight:750;padding:4px 1px}.pair-row select option{background:#141d30}.pair-arrow{color:#6686c4;font-size:23px}.status{min-height:49px;padding:16px 4px 11px;color:#a9b8d2;text-align:center;font-size:12px}.status.error{color:#ffb5b5}.status.busy{color:#8ac7ff}.microphones{display:grid;grid-template-columns:1fr 1fr;gap:12px}.speaker-card{min-height:228px;text-align:center;border:1px solid #355897;background:linear-gradient(160deg,#1a3565,#172644 72%);color:var(--text);border-radius:22px;padding:19px 8px 18px;display:flex;align-items:center;flex-direction:column;position:relative;overflow:hidden;transition:transform .12s,box-shadow .2s}.speaker-card:active{transform:scale(.97)}.speaker-card.kyrgyz{border-color:#216c64;background:linear-gradient(160deg,#174946,#142d36 72%)}.speaker-flag{font-size:30px;margin:0 0 9px}.speaker-lang{font-size:11px;color:#acbdde}.speaker-card strong{font-size:19px;margin-top:4px}.mic-symbol{display:grid;place-items:center;width:64px;height:64px;border-radius:100px;background:#477ded;margin:14px 0 11px;font-size:28px;box-shadow:0 8px 20px #0004}.kyrgyz .mic-symbol{background:#178c81}.speaker-action{font-size:11px;font-weight:700;letter-spacing:.1px;color:#d9e6ff}.speaker-card.recording{box-shadow:0 0 0 3px #ff675e77;animation:pulse 1.1s infinite alternate}.speaker-card.recording .mic-symbol{background:#f45056}.speaker-card.recording .speaker-action{color:#ffd4d6}.speaker-card.waiting .mic-symbol{filter:grayscale(1)}@keyframes pulse{to{box-shadow:0 0 0 6px #ff675e22}}.tap-hint{text-align:center;color:#8190ac;font-size:11px;margin:12px 0 24px}.text-compose{border:1px solid var(--line);background:#131c2e;border-radius:18px;padding:15px}.section-label{font-size:10px;font-weight:800;letter-spacing:1px;color:#96a8c4;margin-bottom:12px}.section-label span{font-size:17px;vertical-align:middle;margin-right:4px}.text-compose form{display:flex;align-items:center;gap:8px}.text-compose select,.text-compose input{min-width:0;border:1px solid #33415b;background:#0e172a;color:#eaf1ff;border-radius:11px;padding:12px 9px}.text-compose select{width:109px}.text-compose input{flex:1}.text-compose form button{width:43px;flex-shrink:0;align-self:stretch;border:0;background:#467df8;color:white;border-radius:11px;font-size:20px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:28px 0 13px}.section-heading h2{font-size:17px;margin:0;letter-spacing:-.3px}.text-button{border:0;color:#90aaff;background:transparent;font-weight:600;font-size:12px}.history{display:flex;flex-direction:column;gap:12px}.empty{border:1px dashed #32415b;border-radius:18px;min-height:145px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#cad5e5}.empty-icon{font-size:32px;color:#627aa7;margin-bottom:5px}.empty p{margin:6px 0 0;color:var(--muted);font-size:12px}.turn{background:#172137;border:1px solid #303c56;padding:15px;border-radius:17px}.turn .turn-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px;color:#9cb0d3;font-size:11px}.turn .turn-top strong{font-weight:700;color:#d4deed}.turn .source{font-size:14px;color:#b2c0d5;line-height:1.5;margin:0 0 11px}.turn .result{background:#0e182c;border-radius:11px;padding:12px;display:flex;gap:8px;align-items:start;justify-content:space-between}.turn .result p{font-size:17px;line-height:1.45;color:#f3f7ff;font-weight:650;margin:0;overflow-wrap:anywhere}.play{background:#2b4c8f;border:0;border-radius:10px;min-width:42px;min-height:42px;color:#f4f8ff;font-size:18px}.play:disabled{background:#30394a}.turn .warning{font-size:11px;color:#ffcc91;margin:9px 0 0}.privacy-note{font-size:11px;color:#7586a2;text-align:center;line-height:1.55;margin:25px 12px 0}.login-screen{max-width:430px;margin:0 auto;min-height:100dvh;padding:calc(95px + env(safe-area-inset-top)) 24px 36px;display:flex;flex-direction:column;align-items:start}.login-icon{width:67px;height:67px;border-radius:20px;font-size:46px;margin-bottom:30px}.login-screen .eyebrow{font-size:10px}.login-screen h1{font-size:38px;margin:12px 0 9px;letter-spacing:-1px}.login-form{width:100%;margin-top:44px;display:grid;gap:12px}.login-form label{font-weight:700;font-size:13px;color:#c1ccdf}.login-form input{border:1px solid #455473;border-radius:13px;padding:15px;background:#162036;color:#fff;font-size:16px}.primary{padding:15px 19px;background:#467cff;color:#fff;border:0;border-radius:13px;font-size:16px;font-weight:700;display:flex;justify-content:space-between}.login-screen .error{color:#ffabab;margin-top:14px}.speaker-card:focus-visible,.play:focus-visible{outline:3px solid #bfd0ff;outline-offset:3px}@media(max-width:370px){.shell{padding-inline:12px}.speaker-card{min-height:212px}.speaker-card strong{font-size:16px}.hero h1{font-size:31px}.pair-row{font-size:15px}}@media(min-width:700px){.microphones{gap:20px}.speaker-card{min-height:245px}}

/* Conversation groups and independent, locally stored chats */
.workspace{background:linear-gradient(160deg,#172541,#141e32);border:1px solid #304461;border-radius:18px;padding:15px 15px 5px;margin:0 0 14px}
.workspace-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:14px}
.workspace-head strong{font-size:10px;letter-spacing:1.4px;color:#a4beed}
.workspace-head span{font-size:10px;color:#8499b6;text-align:right}
.workspace label{display:block;margin-bottom:7px;font-weight:700;font-size:11px;color:#b5c7e1}
.workspace-row{display:flex;gap:6px;align-items:stretch;margin-bottom:15px}
.workspace select{min-width:0;flex:1;padding:11px 9px;background:#0c172b;border:1px solid #354966;border-radius:11px;color:#f4f6ff;font-size:14px}
.workspace select option{background:#0c172b}
.workspace-action{border:1px solid #394c6e;border-radius:11px;color:#dce8ff;background:#223454;white-space:nowrap;padding:0 9px;min-height:42px;font-size:12px;font-weight:750}
.workspace-action.primary-small{background:#386ce0;border-color:#497ef4;color:#fff}
.workspace-action.square{width:36px;flex-shrink:0;padding:0;font-size:16px}
.workspace-action.danger{color:#ffb3b3}
.workspace-action:focus-visible,.workspace select:focus-visible{outline:3px solid #bfd0ff;outline-offset:2px}
@media(max-width:385px){.workspace{padding:12px 10px 0}.workspace-row{gap:5px}.workspace-action{padding:0 6px}.workspace-action.square{width:32px}}