:root {
  --bg: #07111f;
  --panel: rgba(13, 29, 48, .78);
  --panel-solid: #0d1d30;
  --panel-light: #112943;
  --line: rgba(159, 202, 233, .14);
  --text: #f5fbff;
  --muted: #9eb3c7;
  --primary: #5ee6d2;
  --primary-2: #64a7ff;
  --accent: #c8ff6a;
  --danger: #ff7188;
  --shadow: 0 30px 80px rgba(0, 0, 0, .35);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { background: var(--bg); color: var(--text); }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 10% 10%, #102b42 0, transparent 40%), linear-gradient(145deg, #06101d, #091a2d 70%, #06101d); color: var(--text); }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.ambient { position: fixed; border-radius: 50%; filter: blur(100px); opacity: .18; pointer-events: none; }
.ambient-one { width: 420px; height: 420px; background: var(--primary); top: -120px; right: -120px; }
.ambient-two { width: 500px; height: 500px; background: #386eff; bottom: -250px; left: -200px; }
.topbar { height: 88px; padding: 0 clamp(22px, 4vw, 64px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); position: relative; z-index: 5; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; color: #04151a; font-weight: 900; font-size: 24px; background: linear-gradient(135deg, var(--primary), var(--primary-2)); box-shadow: 0 10px 34px rgba(94, 230, 210, .22); }
.brand strong, .brand small { display: block; }
.brand strong { letter-spacing: .22em; font-size: 17px; }
.brand small { color: var(--muted); margin-top: 2px; font-size: 11px; letter-spacing: .08em; }
.top-actions { display: flex; align-items: center; gap: 10px; }
.ghost-btn, .language-select { border: 1px solid var(--line); background: rgba(255,255,255,.035); color: var(--text); border-radius: 12px; padding: 10px 14px; }
.kiosk-grid { min-height: 650px; display: grid; grid-template-columns: minmax(340px, .92fr) minmax(430px, 1.08fr); gap: clamp(22px, 3vw, 48px); padding: clamp(25px, 4vw, 64px); max-width: 1500px; margin: auto; }
.avatar-panel, .conversation-panel { border: 1px solid var(--line); border-radius: 34px; background: linear-gradient(160deg, rgba(17, 42, 67, .84), rgba(7, 18, 32, .75)); backdrop-filter: blur(22px); box-shadow: var(--shadow); }
.avatar-panel { min-height: 610px; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; overflow: hidden; padding: 34px; text-align: center; }
.avatar-panel::after { content: ""; width: 430px; height: 430px; border: 1px solid rgba(94,230,210,.12); border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-56%); box-shadow: 0 0 0 60px rgba(94,230,210,.025), 0 0 0 120px rgba(94,230,210,.018); }
.status-pill { position: absolute; top: 24px; left: 24px; display: flex; align-items: center; gap: 8px; background: rgba(5,16,27,.72); border: 1px solid var(--line); padding: 9px 13px; border-radius: 50px; color: var(--muted); font-size: 13px; z-index: 2; }
.status-pill span:first-child { width: 8px; height: 8px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 16px var(--primary); }
.avatar { width: 260px; height: 310px; position: relative; z-index: 1; margin-top: 20px; }
.avatar-halo { position: absolute; inset: 0 10px 46px; border-radius: 50%; background: radial-gradient(circle, rgba(94,230,210,.34), rgba(79,116,255,.06) 54%, transparent 68%); animation: breathe 4s ease-in-out infinite; }
.avatar-head { width: 180px; height: 205px; position: absolute; left: 40px; top: 18px; border-radius: 48% 48% 45% 45%; background: linear-gradient(145deg, rgba(146,244,232,.94), rgba(91,136,244,.9)); box-shadow: inset 14px 8px 30px rgba(255,255,255,.25), inset -12px -12px 35px rgba(6,23,56,.38), 0 26px 65px rgba(61,137,225,.35); overflow: hidden; }
.avatar-glow { position: absolute; width: 95px; height: 95px; border-radius: 50%; background: rgba(255,255,255,.25); filter: blur(26px); top: 5px; left: 15px; }
.eyes { position: absolute; top: 86px; left: 0; width: 100%; display: flex; justify-content: center; gap: 42px; }
.eyes span { width: 18px; height: 10px; background: #061727; border-radius: 50%; box-shadow: 0 0 12px rgba(255,255,255,.5); animation: blink 5s infinite; }
.mouth { position: absolute; width: 48px; height: 26px; border-radius: 50%; left: 66px; top: 135px; display: grid; place-items: center; }
.mouth i { display: block; width: 28px; height: 4px; background: #061727; border-radius: 99px; transition: .2s; }
.avatar.speaking .mouth i { animation: talk .32s infinite alternate; }
.avatar.listening .avatar-head { box-shadow: inset 14px 8px 30px rgba(255,255,255,.25), inset -12px -12px 35px rgba(6,23,56,.38), 0 0 0 8px rgba(200,255,106,.08), 0 26px 75px rgba(200,255,106,.42); }
.avatar-body { position: absolute; width: 230px; height: 120px; bottom: 8px; left: 15px; border-radius: 50% 50% 25px 25px; background: linear-gradient(150deg, #173b5e, #0b1d32); border: 1px solid rgba(130,215,255,.2); box-shadow: inset 0 20px 30px rgba(255,255,255,.04); }
.avatar-copy { position: relative; z-index: 2; max-width: 480px; }
.eyebrow { color: var(--primary); font-weight: 800; font-size: 11px; letter-spacing: .2em; margin: 0 0 9px; }
.avatar-copy h1 { font-size: clamp(30px, 4vw, 52px); margin: 0; letter-spacing: -.045em; }
.avatar-copy h1 span { color: var(--primary); }
.avatar-copy > p:last-child { color: var(--muted); line-height: 1.65; max-width: 420px; margin: 15px auto 0; }
.waveform { height: 35px; display: flex; align-items: center; gap: 5px; margin-top: 20px; opacity: .45; position: relative; z-index: 2; }
.waveform span { width: 4px; height: 8px; background: var(--primary); border-radius: 10px; }
.waveform.active span { animation: wave .7s ease-in-out infinite alternate; }
.waveform span:nth-child(2), .waveform span:nth-child(6) { animation-delay: .1s; }.waveform span:nth-child(3), .waveform span:nth-child(5){animation-delay:.2s}.waveform span:nth-child(4){animation-delay:.3s}
.conversation-panel { padding: clamp(22px, 3vw, 38px); display: flex; flex-direction: column; min-height: 610px; }
.conversation-heading, .section-title, .admin-toolbar, .card-header, .dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
h2 { margin: 0; font-size: clamp(22px, 2.7vw, 32px); letter-spacing: -.035em; }
.icon-button { width: 43px; height: 43px; border-radius: 12px; border: 1px solid var(--line); background: rgba(255,255,255,.04); color: var(--text); font-size: 22px; }
.chat { flex: 1; margin: 25px 0 18px; overflow-y: auto; min-height: 250px; max-height: 330px; padding-right: 8px; }
.message { max-width: 88%; padding: 15px 18px; margin-bottom: 13px; border-radius: 18px; line-height: 1.55; animation: messageIn .35s ease; }
.message p { margin: 5px 0 0; }
.message-author { font-size: 10px; letter-spacing: .16em; font-weight: 900; color: var(--primary); }
.assistant-message { background: rgba(94,230,210,.08); border: 1px solid rgba(94,230,210,.15); border-bottom-left-radius: 5px; }
.user-message { background: linear-gradient(135deg, rgba(89,130,240,.34), rgba(58,85,156,.32)); margin-left: auto; border-bottom-right-radius: 5px; }
.user-message .message-author { color: #bcd5ff; }
.loading-message p::after { content: ""; animation: dots 1.2s infinite; }
.suggestions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.suggestion { color: #cde4f8; border: 1px solid var(--line); background: rgba(255,255,255,.035); border-radius: 99px; padding: 8px 12px; font-size: 12px; }
.composer { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; background: rgba(4,15,26,.72); border: 1px solid var(--line); border-radius: 20px; padding: 8px; }
.input-wrap input { width: 100%; height: 54px; background: transparent; border: none; outline: none; color: var(--text); font-size: 16px; }
.input-wrap input::placeholder { color: #70869a; }
.mic-button, .send-button { border: none; border-radius: 14px; min-width: 62px; color: #04151a; font-weight: 800; background: linear-gradient(135deg, var(--primary), #93f8ca); }
.mic-button { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 16px; }
.mic-icon { font-size: 10px; }
.mic-button.listening { background: linear-gradient(135deg, var(--accent), #f7ff9f); box-shadow: 0 0 24px rgba(200,255,106,.25); }
.send-button { font-size: 23px; min-width: 54px; }
.browser-notice { min-height: 16px; color: var(--muted); font-size: 11px; margin: 8px 4px 0; }
.topics-section { max-width: 1500px; margin: 0 auto; padding: 0 clamp(25px, 4vw, 64px) 54px; }
.section-title { margin-bottom: 20px; }
.section-title a { color: var(--primary); font-size: 13px; }
.topics-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.topic-card { text-align: left; min-height: 145px; padding: 20px; border: 1px solid var(--line); border-radius: 22px; background: rgba(12,28,47,.65); color: var(--text); transition: transform .2s, border .2s, background .2s; }
.topic-card:hover { transform: translateY(-4px); border-color: rgba(94,230,210,.42); background: rgba(16,42,66,.92); }
.topic-icon { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: rgba(94,230,210,.1); color: var(--primary); margin-bottom: 20px; font-weight: 900; }
.topic-card strong { display: block; margin-bottom: 5px; }.topic-card small { color: var(--muted); line-height: 1.4; }
.footer { min-height: 65px; border-top: 1px solid var(--line); color: var(--muted); display: flex; justify-content: space-between; align-items: center; padding: 0 clamp(25px, 4vw, 64px); font-size: 12px; }
.high-contrast { --bg:#000; --panel:#000; --panel-solid:#000; --text:#fff; --muted:#fff; --line:rgba(255,255,255,.55); --primary:#00ffd5; }

/* Admin */
.admin-body { display: grid; grid-template-columns: 270px 1fr; min-height: 100vh; background: #07111f; }
.admin-sidebar { position: sticky; top: 0; height: 100vh; padding: 28px 20px; border-right: 1px solid var(--line); background: rgba(6,16,29,.94); display: flex; flex-direction: column; }
.admin-sidebar nav { display: grid; gap: 7px; margin-top: 50px; }
.nav-item { width: 100%; text-align: left; border: none; color: var(--muted); background: transparent; padding: 13px 15px; border-radius: 12px; font-size: 14px; }
.nav-item:hover, .nav-item.active { color: var(--text); background: rgba(94,230,210,.09); }
.sidebar-card { margin-top: auto; border: 1px solid var(--line); border-radius: 15px; padding: 15px; background: rgba(255,255,255,.03); }
.sidebar-card span, .sidebar-card small { display: block; color: var(--muted); font-size: 11px; }.sidebar-card code { display:block; margin:8px 0;color:var(--primary); }
.admin-main { padding: 38px clamp(25px, 4vw, 60px); min-width: 0; }
.admin-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 35px; }
.admin-header h1 { font-size: 37px; letter-spacing: -.04em; margin: 0; }
.admin-key-box { border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.03); padding: 8px 12px; }
.admin-key-box label { color: var(--muted); font-size: 10px; display: block; }.admin-key-box input { background:transparent;border:0;outline:0;color:var(--primary);padding-top:4px;width:140px; }
.admin-view { display: none; }.admin-view.active { display: block; animation: messageIn .3s ease; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 18px; }
.stat-card, .admin-card { border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(160deg, rgba(17,42,67,.76), rgba(8,20,35,.8)); box-shadow: 0 20px 50px rgba(0,0,0,.18); }
.stat-card { padding: 22px; min-height: 145px; }.stat-label{color:var(--muted);font-size:12px}.stat-value{font-size:37px;font-weight:850;margin:18px 0 4px}.stat-detail{color:var(--primary);font-size:11px}
.admin-two-columns { display: grid; grid-template-columns: 1.35fr .65fr; gap: 18px; }
.admin-card { padding: 24px; min-height: 350px; }
.bar-chart { display: grid; gap: 15px; margin-top: 30px; }.bar-row{display:grid;grid-template-columns:120px 1fr 40px;gap:12px;align-items:center;font-size:12px}.bar-track{height:10px;background:rgba(255,255,255,.06);border-radius:99px;overflow:hidden}.bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--primary),var(--primary-2));min-width:3px}.bar-row strong{text-align:right}
.system-list { margin-top: 25px; }.system-list div { display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:15px 0;font-size:13px}.system-list span{color:var(--muted)}.system-list .ok{color:var(--primary)}
.admin-toolbar { margin-bottom: 22px; }.primary-button,.secondary-button,.danger-button { border-radius: 12px; padding: 11px 16px; font-weight: 800; border: 1px solid transparent; }.primary-button{background:var(--primary);color:#04151a}.secondary-button{background:rgba(255,255,255,.04);color:var(--text);border-color:var(--line)}.danger-button{background:rgba(255,113,136,.12);color:#ff9bad;border-color:rgba(255,113,136,.25)}
.faq-admin-list { display: grid; gap: 11px; }.faq-admin-item{display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;border:1px solid var(--line);border-radius:16px;background:rgba(14,31,51,.7);padding:18px 20px}.faq-admin-item h3{margin:0 0 6px;font-size:15px}.faq-admin-item p{margin:0;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:900px}.faq-meta{display:flex;gap:8px;margin-top:10px}.badge{font-size:10px;color:var(--primary);background:rgba(94,230,210,.08);padding:5px 8px;border-radius:99px}.badge.inactive{color:#ff9bad;background:rgba(255,113,136,.08)}
.table-wrap { overflow:auto;border:1px solid var(--line);border-radius:17px;background:rgba(14,31,51,.72) }table{width:100%;border-collapse:collapse;min-width:800px}th,td{text-align:left;padding:15px 17px;border-bottom:1px solid var(--line);font-size:12px}th{color:var(--muted);font-size:10px;letter-spacing:.09em}td{color:#dce9f4}.success-text{color:var(--primary)}.warning-text{color:#ffd47c}
.faq-dialog { width:min(720px, calc(100vw - 30px)); border:1px solid var(--line);border-radius:22px;background:#0b1b2d;color:var(--text);padding:0;box-shadow:var(--shadow)}.faq-dialog::backdrop{background:rgba(0,7,14,.76);backdrop-filter:blur(8px)}.faq-dialog form{padding:25px}.faq-dialog label{display:grid;gap:7px;color:var(--muted);font-size:12px;margin-top:15px}.faq-dialog input,.faq-dialog textarea{width:100%;color:var(--text);background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:11px;padding:12px;outline:none}.faq-dialog textarea{resize:vertical}.faq-dialog input:focus,.faq-dialog textarea:focus{border-color:rgba(94,230,210,.5)}.switch-row{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center}.switch-row input{width:auto}.dialog-actions{display:grid;grid-template-columns:auto 1fr auto auto;gap:10px;margin-top:24px}.hidden{display:none!important}.form-error{color:#ff9bad;font-size:12px}.toast{position:fixed;right:25px;bottom:25px;background:#102b42;border:1px solid var(--line);border-radius:12px;padding:13px 17px;box-shadow:var(--shadow);transform:translateY(120px);opacity:0;transition:.25s}.toast.show{transform:translateY(0);opacity:1}
@keyframes blink { 0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.08)} }
@keyframes talk { from{height:4px;width:28px}to{height:18px;width:21px;border-radius:50%} }
@keyframes breathe { 50%{transform:scale(1.08);opacity:.7} }
@keyframes wave { from{height:6px}to{height:28px} }
@keyframes messageIn { from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none} }
@keyframes dots { 0%{content:""}33%{content:"."}66%{content:".."}100%{content:"..."} }
@media (max-width:1100px){.topics-grid{grid-template-columns:repeat(3,1fr)}.stats-grid{grid-template-columns:repeat(2,1fr)}.admin-two-columns{grid-template-columns:1fr}.kiosk-grid{grid-template-columns:1fr}.avatar-panel{min-height:560px}}
@media (max-width:760px){.topbar{height:auto;padding:16px 18px;align-items:flex-start}.top-actions{flex-wrap:wrap;justify-content:flex-end}.ghost-btn{font-size:11px;padding:8px}.kiosk-grid{padding:18px;gap:18px}.avatar-panel,.conversation-panel{border-radius:24px}.avatar-panel{min-height:510px;padding:25px}.avatar{transform:scale(.82);margin:-10px 0}.conversation-panel{min-height:590px}.topics-section{padding:10px 18px 35px}.topics-grid{grid-template-columns:repeat(2,1fr)}.topic-card{min-height:128px}.footer{padding:15px 18px;gap:10px;flex-direction:column;align-items:flex-start}.mic-label{display:none}.mic-button{min-width:54px;padding:0}.admin-body{display:block}.admin-sidebar{height:auto;position:relative;border-right:0;border-bottom:1px solid var(--line)}.admin-sidebar nav{margin-top:20px;grid-template-columns:repeat(2,1fr)}.sidebar-card{display:none}.admin-main{padding:25px 18px}.admin-header{align-items:flex-start;gap:20px}.stats-grid{grid-template-columns:1fr 1fr}.faq-admin-item{grid-template-columns:1fr}.admin-key-box{display:none}}