.support-widget { position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); z-index: 45; color: var(--text); font-size: .875rem; line-height: 1.4; }
.sw-launcher { position: relative; display: grid; place-items: center; margin-left: auto; width: 56px; height: 56px; border: 0; border-radius: 50%; background: var(--accent); color: var(--on-accent); cursor: pointer; box-shadow: 0 5px 20px var(--shadow); }
.sw-launcher:hover { background: var(--accent-hover); }
.sw-badge { position: absolute; top: -3px; right: -3px; border: 2px solid var(--surface); border-radius: 1rem; padding: .1rem .35rem; background: var(--text); color: var(--surface); font-size: .7rem; }
.sw-panel { display: flex; flex-direction: column; width: min(380px, calc(100vw - 2rem)); height: min(540px, calc(100dvh - 100px)); margin-bottom: .65rem; background: var(--surface); border: 1px solid var(--border); border-radius: 1rem; box-shadow: 0 12px 40px var(--shadow); overflow: hidden; }
.sw-heading { display: flex; align-items: center; justify-content: space-between; padding: .55rem 1rem; border-bottom: 1px solid var(--border); }
.sw-heading .icon-button { border: 0; font-size: 1.5rem; }
.sw-toolbar { display: grid; gap: .4rem; padding: .65rem 1rem; border-bottom: 1px solid var(--border); }
.sw-toolbar a { color: var(--accent); font-size: .75rem; }
.support-widget select, .support-widget textarea { min-width: 0; width: 100%; font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: .5rem; padding: .45rem; }
.sw-messages { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: .4rem; padding: .8rem; background: var(--surface-hover); }
.sw-message { align-self: flex-start; flex-shrink: 0; max-width: 88%; }
.sw-message.is-own { align-self: flex-end; }
.sw-bubble { padding: .6rem .75rem; border: 1px solid var(--border); border-radius: .8rem; background: var(--surface); overflow-wrap: anywhere; }
.is-own .sw-bubble { background: var(--surface-hover); }
.sw-bubble p { margin: 0; white-space: pre-wrap; }
.sw-bubble img { display: block; width: auto; height: auto; max-width: min(100%, 240px); max-height: 180px; object-fit: contain; border-radius: .5rem; margin-top: .4rem; }
.sw-message time { display: none; font-size: .65rem; color: var(--text-muted); margin-top: .2rem; }
.sw-message.show-time time { display: block; }
.sw-form { display: grid; grid-template-columns: 1fr 44px; gap: .5rem; padding: .75rem; align-items: center; }
.sw-form textarea { border: 0; resize: none; max-height: 100px; }
.sw-form button { padding: 0; height: 44px; }
.sw-category { grid-column: 1 / -1; display: grid; gap: .3rem; }
.sw-error { color: var(--danger); margin: .5rem .75rem; }
.sw-closed, .sw-welcome { padding: 1rem; margin: 0; }
.sw-empty { margin: auto; padding: 1rem; text-align: center; color: var(--text-muted); }

.sw-embedded { position: static; z-index: auto; min-width: 0; }
.sw-embedded .sw-panel { width: 100%; height: 560px; margin: 0; }

.sw-form { position: relative; grid-template-columns: minmax(0, 1fr) repeat(3, 36px); gap: .35rem; }
.sw-form textarea { grid-column: 1; grid-row: 1; }
.sw-form .sw-attach { grid-column: 2; grid-row: 1; width: 36px; min-width: 36px; padding: 0; border: 0; cursor: pointer; }
.sw-form > button[type=submit] { grid-column: 4; grid-row: 1; min-width: 36px; }
.sw-form .chat-emoji { grid-column: 3; grid-row: 1; }
.sw-form .chat-emoji-toggle { min-width: 36px; width: 36px; }
.sw-previews { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .5rem; max-height: 160px; overflow: auto; }
.sw-previews:empty { display: none; }
.sw-preview { position: relative; flex: 0 0 90px; width: 90px; max-width: 90px; overflow: hidden; }
.support-widget .sw-preview img, .support-widget .sw-preview video { display: block; width: 90px !important; height: 80px !important; max-width: 90px !important; max-height: 80px !important; object-fit: cover; border-radius: .5rem; }
.sw-preview audio { width: 90px; max-width: 100%; }
.sw-preview button { position: absolute; top: 0; right: 0; width: 26px; height: 26px; border: 1px solid var(--border); background: var(--surface); color: var(--text); border-radius: 50%; cursor: pointer; }
.sw-bubble video, .sw-bubble audio { display: block; max-width: 100%; margin-top: .4rem; }
.sw-bubble video { max-height: 220px; }

.support-widget .sw-previews { max-height: 100px; padding: .2rem 0; }

.sw-client-ip { display: block; margin-top: .2rem; color: var(--text-muted); font-size: .75rem; }

.sw-availability { margin: 0; padding: .65rem 1rem; font-size: .8rem; color: var(--accent); border-bottom: 1px solid var(--border); }
.sw-offline { flex-shrink: 0; width: 100%; max-width: 320px; margin: auto; padding: 1.25rem .75rem; text-align: center; }
.sw-offline p { margin: 0 0 .8rem; color: var(--text-muted); }

.sw-preview span, .sw-bubble a { overflow-wrap: anywhere; }

.support-widget[hidden] { display: none !important; }
.live-moderation { margin-bottom: 1rem; padding: 1rem; }
.live-moderation h2 { margin-top: 0; font-size: 1.1rem; }
.live-block-form, .live-block-shortcuts, .live-block-row { display: flex; flex-wrap: wrap; align-items: end; gap: .75rem; margin-top: .75rem; }
.live-block-form label { display: grid; gap: .35rem; flex: 1 1 160px; min-width: 0; }
.live-block-form input, .live-block-form select { width: 100%; min-width: 0; padding: .6rem; border: 1px solid var(--border); border-radius: .5rem; color: var(--text); background: var(--surface); }
.live-block-row { align-items: center; justify-content: space-between; }