/**
 * @file        styles.css
 * @description SynthWhat styles: logo palette (navy, cream, orange), connect screen, chat layout, bubbles, switch
 *
 * @author      Thomas Dobler - SYNTHETIXMIND LTD
 * @email       tom@synthetixmind.com
 * @company     SYNTHETIXMIND LTD, Paphos, Cyprus
 * @url         https://synthetixmind.com
 *
 * @uid         d1df98e3-d3fa-4086-9a95-2e6521cfbb10
 * @version     0.5.0.6
 * @created     2026-11-02
 * @updated     2026-11-04
 *
 * @copyright   (c) 2026 by SYNTHETIXMIND LTD
 * @license     Proprietary — All rights reserved
 */:root{color-scheme:light;--navy: #1c2230;--navy-2: #283043;--cream: #f6e7d3;--paper: #fbf8f4;--orange: #e85a26;--orange-dark: #b8401a;--text: #1a1d24;--muted: #5d6472;--border: #e3dcd2;--bubble-in: #ffffff;--bubble-out: #fde3d5;--warn-bg: #fff2db;--warn-text: #7a4a00;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.45}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--paper);color:var(--text);display:flex;flex-direction:column}a{color:var(--orange-dark)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}:focus-visible{outline:3px solid var(--orange);outline-offset:2px}.muted{color:var(--muted)}.small{font-size:.82rem}.center{text-align:center;padding:24px}.warning{background:var(--warn-bg);color:var(--warn-text);padding:8px 12px;border-radius:10px}select,input,textarea,button{font:inherit;color:inherit}select,input[type=search]{width:100%;min-height:36px;border:1px solid var(--border);border-radius:9px;background:#fff;padding:5px 8px}.link-button{background:none;border:none;color:var(--orange-dark);text-decoration:underline;cursor:pointer;padding:2px 4px}.connect{flex:1;display:grid;place-items:center;padding:24px 16px;grid-template-columns:minmax(0,1fr)}.connect[hidden]{display:none}.connect-card{width:min(460px,100%);background:#fff;border:1px solid var(--border);border-radius:20px;padding:28px 24px;text-align:center;box-shadow:0 10px 30px #1c223014}.connect-card h1{margin:8px 0 0}.connect-logo{border-radius:16px}.qr{display:block;margin:16px auto;border:8px solid #ffffff;border-radius:12px;box-shadow:0 0 0 1px var(--border);image-rendering:pixelated}.steps{text-align:left;margin:0 auto 12px;padding-left:22px;max-width:360px}.spinner:before{content:"";display:inline-block;width:14px;height:14px;margin-right:8px;border:2px solid var(--orange);border-right-color:transparent;border-radius:50%;vertical-align:-2px;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.app{flex:1;display:grid;grid-template-columns:340px 1fr;min-height:0}.app[hidden]{display:none}.sidebar{display:flex;flex-direction:column;min-height:0;background:var(--navy);color:#f1ece4}.sidebar select,.sidebar input{background:var(--navy-2);border-color:#3a4459;color:#f1ece4}.sidebar .muted{color:#b9bfcc}.sidebar .link-button{color:var(--cream)}.sidebar-head{display:flex;justify-content:space-between;align-items:center;padding:14px 14px 8px}.brand{display:flex;gap:10px;align-items:center}.brand img{border-radius:9px}.brand div{display:grid}.settings{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;padding:0 14px 10px}.settings label{display:grid;gap:2px;font-size:.75rem;color:#b9bfcc;min-width:0}.search{display:block;padding:0 14px 10px}.chat-list{list-style:none;margin:0;padding:0 6px 12px;overflow-y:auto;flex:1}.chat-item{padding:10px;border-radius:10px;cursor:pointer;display:grid;gap:2px}.chat-item:hover,.chat-item[aria-selected=true]{background:var(--navy-2)}.chat-item-top,.chat-item-bottom{display:flex;gap:6px;align-items:center;min-width:0}.chat-name{font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-preview{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{font-size:.7rem;font-weight:700;border-radius:999px;padding:1px 7px}.badge.unread{background:var(--orange);color:#fff}.badge.translate{background:var(--cream);color:var(--navy)}.empty-list{padding:12px}.chat{display:flex;flex-direction:column;min-height:0;min-width:0}.empty{flex:1;display:grid;place-items:center;color:var(--muted)}.empty[hidden]{display:none}.chat-view{flex:1;display:flex;flex-direction:column;min-height:0}.chat-view[hidden]{display:none}.chat-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px;background:#fff;border-bottom:1px solid var(--border)}.chat-title-wrap{display:flex;align-items:center;gap:8px;min-width:0}.chat-head h2{margin:0;font-size:1.1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.back{display:none;background:none;border:1px solid var(--border);border-radius:8px;width:34px;height:34px;font-size:1.3rem;cursor:pointer}.chat-controls{display:flex;gap:14px;align-items:center}.switch-label,.compact{display:flex;align-items:center;gap:8px;font-size:.9rem}.compact select{width:auto;max-width:190px}.switch{width:46px;height:26px;border-radius:999px;border:none;background:#c9c2b8;position:relative;cursor:pointer;transition:background .15s}.switch .knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .15s}.switch[aria-checked=true]{background:var(--orange)}.switch[aria-checked=true] .knob{transform:translate(20px)}.disclosure{margin:0;padding:8px 16px;background:var(--cream);font-size:.85rem}.disclosure.warning{border-radius:0}.messages{list-style:none;margin:0;padding:16px;flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:8px;background:linear-gradient(180deg,#faf5ee,#f4ede4)}.history-row{align-self:center;text-align:center;padding:4px 0}.bubble{max-width:min(640px,80%);padding:8px 12px 6px;border-radius:14px;box-shadow:0 1px 1px #0000000f;display:grid;gap:3px}.bubble.in{align-self:flex-start;background:var(--bubble-in);border-top-left-radius:4px}.bubble.out{align-self:flex-end;background:var(--bubble-out);border-top-right-radius:4px}.bubble .body{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.bubble .author{font-weight:700;color:var(--orange-dark)}.bubble .original,.bubble .hint{margin:0;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere}.bubble .original summary{cursor:pointer;color:var(--muted)}.bubble .original p{margin:2px 0 0}.bubble .hint{color:var(--warn-text)}.bubble .time{justify-self:end;color:var(--muted)}.ticks{font-weight:700;letter-spacing:-.3em;padding-right:.3em}.ticks.pending{letter-spacing:0;font-weight:400}.ticks.read{color:#1a6fb0}.ticks.failed{color:var(--warn-text);letter-spacing:0}.composer{padding:8px 16px 10px;background:#fff;border-top:1px solid var(--border)}.composer-row{display:flex;gap:8px;align-items:flex-end}.composer textarea{flex:1;resize:none;min-height:42px;max-height:160px;border:1px solid var(--border);border-radius:12px;padding:9px 12px;background:var(--paper)}.send-button{min-height:42px;padding:0 18px;border:none;border-radius:12px;background:var(--orange);color:#fff;font-weight:700;cursor:pointer}.send-button:disabled{opacity:.6;cursor:progress}.send-error{margin:0 0 8px;padding:8px 12px;border-radius:10px;background:#fde4e1;color:#8a1c10;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.send-error[hidden]{display:none}.send-error .link-button{color:#8a1c10}.composer p.muted{margin:4px 2px 0}.head-actions{display:flex;gap:4px}.keys-dialog{width:min(620px,calc(100% - 24px));border:1px solid var(--border);border-radius:16px;padding:18px 20px;color:var(--text);background:#fff}.keys-dialog::backdrop{background:#1c22308c}.keys-head{display:flex;justify-content:space-between;align-items:center}.keys-head h2{margin:0;font-size:1.15rem}.icon-button{background:none;border:1px solid var(--border);border-radius:8px;padding:4px 10px;cursor:pointer}.keys-rows{display:grid;gap:12px;margin:12px 0}.key-row{display:grid;gap:6px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--paper)}.key-row-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.key-row-inputs{display:grid;grid-template-columns:2fr 1fr auto auto;gap:6px;align-items:center}.key-row-inputs input{min-height:36px;border:1px solid var(--border);border-radius:9px;padding:5px 8px;background:#fff;min-width:0}.small-button{min-height:36px;padding:0 14px}.badge.ok{background:#dcf3e3;color:#14532d}@media(max-width:560px){.key-row-inputs{grid-template-columns:1fr}}.foot{text-align:center;padding:6px;border-top:1px solid var(--border)}@media(max-width:760px){.app{grid-template-columns:1fr}.app.chat-open .sidebar{display:none}.app:not(.chat-open) .chat{display:none}.back{display:inline-block}.chat-controls{width:100%;justify-content:space-between;min-width:0}.chat-controls .compact{flex:1 1 auto;min-width:0;justify-content:flex-end}.compact select{min-width:0;max-width:100%;width:100%}.settings{grid-template-columns:1fr 1fr}}@media(prefers-reduced-motion:reduce){.spinner:before{animation:none}.switch,.switch .knob{transition:none}}.login-form{display:grid;gap:12px;text-align:left}.login-form label{display:grid;gap:4px;font-weight:600}.login-form input{min-height:40px;padding:0 10px;font:inherit;width:100%}