:root{--bg: #0b0f19;--bg-soft: #131a2a;--card: #172033;--card-in: #14233a;--border: #263349;--text: #eef2fb;--muted: #9aa7c2;--accent: #6ea8fe;--accent-2: #a78bfa;--field: #0e1524;--good: #34d399;--warn: #fbbf24;--bad: #f87171;--radius: 14px;--shadow: 0 10px 30px rgba(0, 0, 0, .4)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:radial-gradient(1200px 600px at 50% -10%,#1a2440 0%,var(--bg) 60%);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;min-height:100vh;-webkit-font-smoothing:antialiased}.app{max-width:720px;margin:0 auto;padding:24px 16px 48px;display:flex;flex-direction:column;gap:18px}.app__main{display:flex;flex-direction:column;gap:16px}.app__header{text-align:center}.app__logo{margin:0;font-size:1.7rem;letter-spacing:-.02em;display:inline-flex;align-items:center;gap:10px}.app__logo-text{font-weight:600}.app__logo-accent{color:var(--accent);font-weight:400}.app__tag{color:var(--muted);margin:8px 0 0;font-size:.95rem}.devices,.composer,.feed,.history,.chains{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px}.roombar__status{display:flex;align-items:center;gap:10px;font-weight:600}.dot{width:11px;height:11px;border-radius:50%;background:var(--muted)}.dot--waiting{background:var(--warn);box-shadow:0 0 0 4px #fbbf2426;animation:pulse 1.4s infinite}.dot--connected{background:var(--good);box-shadow:0 0 0 4px #34d39926}.dot--error{background:var(--bad)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.pairing{display:flex;gap:18px;align-items:center;margin-top:16px;flex-wrap:wrap}.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.9rem;letter-spacing:.35em;font-weight:700;padding:8px 4px;color:var(--text)}.composer{transition:border-color .15s,background .15s}.composer--drag{border-color:var(--accent);background:linear-gradient(180deg,#16233f,#1a2748)}.composer--disabled{opacity:.7}.composer__text{width:100%;min-height:96px;resize:vertical;background:var(--field);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-size:1rem;font-family:inherit}.composer__text:focus{outline:none;border-color:var(--accent)}.composer__actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}.composer__tip{color:var(--muted);font-size:.82rem;margin:10px 0 0}.btn{border:1px solid var(--border);background:var(--field);color:var(--text);padding:10px 16px;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;transition:transform .05s,border-color .15s,background .15s}.btn:hover{border-color:var(--accent)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--accent);border:none;color:#0b0f19}.btn--ghost{background:transparent}.btn--small{padding:6px 10px;font-size:.82rem}.feed{display:flex;flex-direction:column;gap:12px}.feed--empty{color:var(--muted);text-align:center}.card{border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:var(--card);display:flex;flex-direction:column;gap:8px;align-items:flex-start}.card--in{background:var(--card-in);border-color:#2b405f}.card__tag{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.card__text{margin:0;white-space:pre-wrap;word-break:break-word}.card__link{color:var(--accent);word-break:break-all}.card__file{font-size:1rem;word-break:break-all}.card__muted{color:var(--muted);font-size:.85rem}.card__image{max-width:100%;max-height:320px;border-radius:10px;border:1px solid var(--border)}.progress{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px 14px}.progress__label{font-size:.85rem;color:var(--muted);margin-bottom:6px;word-break:break-all}.progress__bar{height:8px;background:var(--field);border-radius:999px;overflow:hidden}.progress__fill{height:100%;background:var(--accent);transition:width .15s}.history__head{display:flex;justify-content:space-between;gap:10px;align-items:center}.history__empty{color:var(--muted);margin:12px 0 0}.history .feed{margin-top:12px;box-shadow:none;padding:0;border:none;background:none}.app__footer{text-align:center;color:var(--muted);font-size:.8rem;padding:0 8px}.devices{display:flex;flex-direction:column;gap:12px}.devices__self,.devices__head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.devices__label{color:var(--muted);font-size:.82rem;text-transform:uppercase;letter-spacing:.05em}.devices__name,.devices__rename{display:inline-flex;align-items:center;gap:8px;font-weight:600}.devices__nameinput{background:var(--field);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:6px 10px;font-size:.95rem}.devices__empty{color:var(--muted);font-size:.9rem;margin:0}.devices__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.devices__item{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:var(--field)}.devices__itemname{font-weight:600;flex:1}.devices__itemstatus{color:var(--muted);font-size:.82rem}.pairing{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:6px 0}.pairing__qr{background:#fff;padding:10px;border-radius:12px;line-height:0}.pairing__info{flex:1;min-width:200px}.pairing__hint{color:var(--muted);margin:0 0 10px;font-size:.9rem}.pairing__actions{display:flex;gap:10px;flex-wrap:wrap}.chains__body{margin-top:12px;display:flex;flex-direction:column;gap:12px}.chains__hint{color:var(--muted);font-size:.88rem;margin:0}.chains__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.chains__item{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:var(--field)}.chains__rule{flex:1;font-size:.9rem}.chains__toggle{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;color:var(--muted);cursor:pointer}.chains__add{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}.chains__add label{display:flex;flex-direction:column;gap:4px;font-size:.8rem;color:var(--muted)}.chains__add select{background:var(--field);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:8px 10px;font-size:.9rem}@media (max-width: 480px){.app__logo{font-size:1.45rem}}