:root {
  color: #102955;
  background: #f7fbff;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  line-break: strict;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; }
body { min-width: 320px; background: radial-gradient(circle at 86% 5%, rgba(121, 207, 244, .34), transparent 25rem), linear-gradient(145deg, #f8fcff 0%, #eef6ff 46%, #f9fbff 100%); }
a { color: inherit; }

.operator { width: min(880px, calc(100% - 32px)); margin: 0 auto; padding: 24px 0 40px; }
.operator__header { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.operator__brand { display: inline-flex; align-items: center; gap: 9px; color: #0c254b; text-decoration: none; }
.operator__brand-mark { display: grid; width: 33px; height: 33px; place-items: center; border-radius: 10px; background: linear-gradient(145deg, #125ccf, #69c9ec); color: #fff; font-weight: 900; }
.operator__brand b, .operator__brand small { display: block; line-height: 1; }
.operator__brand b { letter-spacing: .08em; font-size: 16px; }
.operator__brand small { margin-top: 4px; color: #4b79a5; font-size: 8px; font-weight: 800; letter-spacing: .13em; }
.operator__contact { padding: 9px 13px; border: 1px solid #b8cdea; border-radius: 999px; background: rgba(255,255,255,.7); color: #214d88; font-size: 12px; font-weight: 700; text-decoration: none; }
.operator__embedded-header { display: none; }
.operator__intro { max-width: 620px; margin: 54px auto 28px; text-align: center; }
.operator__eyebrow { margin: 0 0 12px; color: #236ec6; font-size: 11px; font-weight: 900; letter-spacing: .18em; }
.operator__intro h1 { margin: 0; color: #102955; font-size: clamp(32px, 7.5vw, 58px); letter-spacing: -.055em; line-height: 1.16; }
.operator__intro p:last-child { margin: 18px auto 0; color: #577292; font-size: 15px; font-weight: 600; line-height: 1.9; }
.operator__chat { overflow: hidden; border: 1px solid rgba(144, 186, 229, .7); border-radius: 26px; background: rgba(255,255,255,.84); box-shadow: 0 24px 65px rgba(36, 93, 162, .13); }
.operator__suggestions { display: flex; flex-wrap: wrap; gap: 8px; padding: 18px 18px 8px; }
.operator__suggestions button { min-height: 34px; border: 1px solid #c6daf0; border-radius: 999px; background: #f3f9ff; color: #275e9e; padding: 7px 11px; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.operator__suggestions button:hover, .operator__suggestions button:focus-visible { border-color: #3388df; background: #e2f3ff; outline: none; }
.operator__messages { min-height: 330px; max-height: min(52dvh, 560px); overflow-y: auto; padding: 16px 18px 8px; scroll-behavior: smooth; }
.operator__conversation-tools { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 18px 8px; padding: 9px 11px; border: 1px solid #d7e7f6; border-radius: 12px; background: #f6fbff; color: #587694; font-size: 11px; line-height: 1.45; }
.operator__conversation-tools p { margin: 0; }
.operator__conversation-tools button { flex: 0 0 auto; min-height: 30px; border: 1px solid #b8d1ea; border-radius: 999px; background: #fff; color: #356393; padding: 5px 9px; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.operator__conversation-tools button:hover, .operator__conversation-tools button:focus-visible { border-color: #1c72ce; background: #e8f5ff; outline: 3px solid rgba(63, 145, 222, .16); outline-offset: 2px; }
.operator-message { width: fit-content; max-width: min(88%, 660px); margin: 0 0 14px; padding: 14px 15px; border-radius: 18px; color: #153867; font-size: 14px; font-weight: 540; line-height: 1.8; word-break: keep-all; overflow-wrap: anywhere; }
.operator-message p { margin: 0; white-space: pre-wrap; }
.operator-message a { color: #1269d3; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.operator-message--assistant { border: 1px solid #d9e9f8; background: linear-gradient(140deg, #f8fcff, #eaf5ff); }
.operator-message--user { margin-left: auto; background: linear-gradient(135deg, #1768d3, #62bfe9); color: #fff; box-shadow: 0 8px 18px rgba(37, 119, 214, .2); }
.operator-message--thinking { display: inline-flex; align-items: center; gap: 9px; color: #4f7aa8; }
.operator-message--thinking::after { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: parel-pulse 1s ease-in-out infinite; }
.operator-message--error { border: 1px solid #f1c6c8; background: #fff4f4; color: #93373b; }
.operator-message__feedback { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 12px; padding-top: 11px; border-top: 1px solid rgba(37, 99, 175, .12); color: #55718f; font-size: 11px; line-height: 1.45; }
.operator-message__feedback button { min-height: 30px; padding: 5px 9px; border: 1px solid #bcd3ed; border-radius: 999px; background: #fff; color: #245b9c; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.operator-message__feedback button:hover, .operator-message__feedback button:focus-visible { border-color: #1c72ce; background: #e8f5ff; outline: none; }
.operator-message__feedback button:disabled { opacity: .55; cursor: wait; }
.operator-message__contact { display: inline-flex; align-items: center; min-height: 36px; margin-top: 12px; padding: 6px 11px; border: 1px solid currentColor; border-radius: 10px; font-size: 12px; text-decoration: none !important; }
.operator__form { padding: 14px 18px max(16px, env(safe-area-inset-bottom)); border-top: 1px solid #dceafa; background: rgba(250,253,255,.94); }
.operator__form label { display: block; margin-bottom: 8px; color: #214c80; font-size: 12px; font-weight: 800; }
.operator__input-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; align-items: end; }
.operator__input-row textarea { width: 100%; min-height: 50px; max-height: 150px; resize: vertical; border: 1px solid #b7d0ea; border-radius: 14px; background: #fff; color: #102955; padding: 11px 12px; font: inherit; font-size: 14px; line-height: 1.6; }
.operator__input-row textarea:focus { outline: 3px solid rgba(67, 161, 225, .23); border-color: #3c91df; }
.operator__input-row button { min-height: 50px; border: 0; border-radius: 14px; background: linear-gradient(135deg, #1768d3, #5dc3ea); color: #fff; padding: 0 17px; font: inherit; font-size: 13px; font-weight: 850; cursor: pointer; box-shadow: 0 7px 16px rgba(33, 119, 214, .2); }
.operator__input-row button:hover, .operator__input-row button:focus-visible { filter: brightness(1.04); outline: 3px solid rgba(67, 161, 225, .25); outline-offset: 2px; }
.operator__input-row button:disabled { opacity: .58; cursor: wait; }
.operator__privacy { margin: 8px 0 0; color: #6e85a1; font-size: 10px; line-height: 1.6; }
@keyframes parel-pulse { 0%,100% { opacity:.3; transform:scale(.8) } 50% { opacity:1; transform:scale(1.1) } }
.operator--embedded { overflow: hidden; min-width: 0; background: radial-gradient(circle at 94% 4%, rgba(121, 207, 244, .34), transparent 23rem), linear-gradient(145deg, #f8fcff 0%, #eef6ff 46%, #f9fbff 100%); }
.operator--embedded .operator { display: grid; grid-template-rows: auto minmax(0, 1fr); width: 100%; height: 100dvh; padding: 0; }
.operator--embedded .operator__embedded-header { display: flex; align-items: center; gap: 9px; min-height: 56px; padding: 10px 16px; border-bottom: 1px solid #dceafa; background: rgba(249, 253, 255, .92); color: #12305b; }
.operator--embedded .operator__embedded-header .operator__brand-mark { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 10px; font-size: 13px; }
.operator--embedded .operator__embedded-header b,
.operator--embedded .operator__embedded-header small { display: block; }
.operator--embedded .operator__embedded-header b { font-size: 13px; letter-spacing: .025em; }
.operator--embedded .operator__embedded-header small { margin-top: 2px; color: #5d7897; font-size: 10px; line-height: 1.3; }
.operator--embedded .operator__chat { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; height: 100%; overflow: hidden; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.operator--embedded .operator__suggestions { padding: 12px 16px 7px; }
.operator--embedded .operator__messages { min-height: 0; max-height: none; padding: 14px 16px 8px; }
.operator--embedded .operator__conversation-tools { margin: 0 16px 7px; }
.operator--embedded .operator__form { padding: 12px 16px max(14px, env(safe-area-inset-bottom)); background: rgba(250, 253, 255, .96); }
@media (max-width: 560px) { .operator { width: min(100% - 24px, 880px); padding-top: 16px; } .operator__intro { margin-top: 43px; } .operator__intro p:last-child { font-size: 14px; text-align: left; } .operator__chat { border-radius: 22px; } .operator__suggestions { flex-wrap: nowrap; overflow-x: auto; padding: 14px 13px 7px; } .operator__suggestions button { flex: 0 0 auto; } .operator__messages { min-height: 310px; padding: 14px 13px 7px; } .operator__conversation-tools { align-items: flex-start; margin: 0 13px 7px; font-size: 10px; } .operator-message { max-width: 94%; padding: 12px 13px; font-size: 13px; } .operator__form { padding: 12px 13px max(13px, env(safe-area-inset-bottom)); } .operator__input-row { grid-template-columns: minmax(0, 1fr); } .operator__input-row button { min-height: 45px; } }
@media (max-width: 560px) { .operator--embedded .operator__embedded-header { min-height: 52px; padding: 9px 13px; } .operator--embedded .operator__suggestions { padding: 11px 13px 6px; } .operator--embedded .operator__messages { padding: 12px 13px 7px; } .operator--embedded .operator__conversation-tools { margin: 0 13px 6px; } .operator--embedded .operator__form { padding: 11px 13px max(12px, env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; animation-duration: .001ms !important; } }