:root{font:15px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif;color:#17323c;background:#f3f7f6}*{box-sizing:border-box}body{margin:0}header{padding:22px 6%;background:#122b36;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{color:inherit;font-size:14px;font-weight:800;letter-spacing:.2em;text-decoration:none}.language{display:flex;align-items:center;gap:9px;font-size:13px}.language select{max-width:150px;background:#173844;color:white;border:1px solid #607b83;border-radius:7px;padding:7px;font:inherit}main{max-width:1280px;margin:40px auto;padding:0 24px}.eyebrow{color:#087f72;font-size:12px;font-weight:750;letter-spacing:.07em}.intro h1{font-size:clamp(27px,3vw,38px);line-height:1.3;margin:8px 0 14px;letter-spacing:-.03em}.intro>p:last-child{color:#5b6f77;max-width:780px;margin-bottom:28px}.workspace{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(290px,1fr);gap:22px}.screen-panel,.chat-panel{background:#fff;border:1px solid #dce7e4;border-radius:14px;min-width:0;overflow:hidden}.screen-panel{padding:22px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.panel-heading h2{font-size:16px;margin:0}.panel-heading span{font-size:12px;color:#087568;text-align:right}.preview{background:#122b36;border-radius:9px;aspect-ratio:16/9;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.preview video{width:100%;height:100%;object-fit:contain;display:none}.preview.has-stream video{display:block}#empty-preview{position:absolute;color:#bfcecf;text-align:center;font-size:14px;padding:25px}.preview.has-stream #empty-preview{display:none}.setup{margin:18px 0 14px}.setup label{display:block;font-size:13px;margin-bottom:5px}input,textarea{border:1px solid #c6d9d4;border-radius:8px;padding:10px 12px;font:inherit;max-width:100%;width:100%;color:#17323c;background:#fff}input:focus,textarea:focus{outline:2px solid #2d9d8b;outline-offset:1px}.actions{display:flex;gap:10px;flex-wrap:wrap}button,.app-option a{border:1px solid transparent;border-radius:8px;padding:11px 16px;font:inherit;font-size:13px;font-weight:700;background:#087f72;color:#fff;cursor:pointer;text-decoration:none}button:disabled{opacity:.45;cursor:default}.stop{color:#9e3434;background:#fff;border-color:#e6caca}.notice{color:#087568;font-size:14px;margin:14px 0 7px;overflow-wrap:anywhere}.notice.error{color:#a53636}.browser-note{font-size:12px;color:#667c83;margin:10px 0 0}.chat-panel{display:flex;flex-direction:column;padding:22px}.messages{flex:1;max-height:520px;min-height:90px;overflow:auto}.chat{margin:0 0 14px;background:#f0f6f4;border-radius:9px;padding:10px 12px;overflow-wrap:anywhere;white-space:pre-wrap;font-size:14px}.chat.customer{background:#e1f1ec}.chat.system{font-size:12px;color:#60737b;background:transparent;padding:4px 0}.chat strong{display:block;font-size:11px;color:#60737b;margin-bottom:3px}#chat-empty{font-size:13px;color:#74858b;margin:auto 0;padding:35px 0}#chat-form{margin-top:20px;display:flex;flex-direction:column;gap:9px}#chat-text{resize:vertical;min-height:85px}#send{align-self:flex-end;min-width:85px}.app-option{margin:24px 0;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:22px;border:1px solid #dce7e4;border-radius:12px}.app-option strong{font-size:14px}.app-option p{font-size:13px;color:#60737b;margin:4px 0 0;max-width:800px}.app-option a{flex-shrink:0;background:white;color:#087f72;border-color:#b6d2ca;text-align:center}footer{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:#6b8087;padding:18px 0}footer a{color:#087f72}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}@media(max-width:820px){.workspace{grid-template-columns:1fr}.messages{max-height:300px}.app-option{flex-direction:column;align-items:flex-start;gap:14px}.chat-panel{min-height:340px}main{margin:28px auto;padding:0 16px}.screen-panel,.chat-panel{padding:17px}.language>span{display:none}.actions{flex-direction:column}.actions button{width:100%}footer{flex-direction:column;gap:3px}.panel-heading{align-items:flex-start}}
