/* Shared Etherion palette; chat layout keeps the existing shader. */
[hidden] { display:none !important; }
.pill.premium { color:#facc15; border-color:#facc154d; background:linear-gradient(120deg,#facc1514,#34d3990a); }
body.chat-mode .site-head { padding:14px 28px; }
body.chat-mode .site-main { max-width:100%; width:auto; margin:0 0 0 280px; padding:26px max(24px, calc((100vw - 1140px) / 2)); }
body.chat-mode .hero, body.chat-mode .examples, body.chat-mode .history, body.chat-mode .site-foot, body.chat-mode #answer-card { display:none !important; }
.chat-sidebar { position:fixed; left:0; top:77px; bottom:0; width:280px; padding:24px 18px; background:rgba(5,12,9,.9); border-right:1px solid var(--eth-border); backdrop-filter:blur(20px); display:flex; flex-direction:column; gap:16px; z-index:15; }
.chat-home { font-size:18px; font-weight:800; color:var(--eth-emerald); text-decoration:none; }
.chat-sidebar-label { color:var(--eth-text-dim); font-size:12px; text-transform:uppercase; letter-spacing:.12em; margin:8px 0 0; }
#chat-list { overflow:auto; flex:1; }
.chat-list-item { display:block; width:100%; text-align:left; padding:12px; margin:4px 0; border:1px solid transparent; border-radius:12px; background:transparent; color:var(--eth-text-secondary); cursor:pointer; font:inherit; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-list-item:hover,.chat-list-item.active { background:rgba(16,185,129,.12); border-color:var(--eth-border); color:var(--eth-emerald); }
.chat-sidebar-note { color:var(--eth-text-dim); font-size:12px; }
.chat-thread { min-height:40vh; }
.chat-thread-head { display:flex; align-items:center; gap:16px; padding:8px 0 28px; border-bottom:1px solid var(--eth-border); }
.chat-thread-head img { width:58px; height:58px; border-radius:18px; }
.chat-thread-head h1 { margin:0; font-size:23px; }
.chat-thread-head p { margin:2px 0; color:var(--eth-text-muted); font-size:13px; }
.chat-message { display:flex; gap:14px; margin:26px 0; align-items:flex-start; }
.chat-avatar { width:40px; height:40px; border-radius:12px; flex-shrink:0; }
.chat-message-content { flex:1; min-width:0; }
.chat-message-name { color:var(--eth-emerald); font-size:12px; margin-bottom:8px; font-weight:700; }
.chat-message-text { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.8; }
.chat-message.user { margin-left:36px; padding:18px 22px; border:1px solid var(--eth-border); border-radius:20px 20px 4px 20px; background:rgba(10,24,17,.7); }
.chat-message.user .chat-message-name { color:var(--eth-yellow); }
body.chat-mode .ask-card { margin-top:24px; }
body.chat-mode #question { min-height:85px; }
.chat-pending { color:var(--eth-text-muted); padding:20px 0; }
.admin-entry { color:var(--eth-text-primary); background:rgba(7,17,12,.98); border:1px solid var(--eth-border-glow); border-radius:22px; width:min(440px,calc(100vw - 32px)); padding:30px; box-shadow:var(--shadow); }
.admin-entry::backdrop { background:rgba(0,0,0,.8); backdrop-filter:blur(8px); }
.admin-entry-close { float:right; }
.admin-entry input { display:block; width:100%; margin-top:10px; padding:14px; background:#050b08; color:var(--eth-text-primary); border:1px solid var(--eth-border); border-radius:12px; font:inherit; }
#admin-entry-error { color:var(--bad); min-height:1.5em; }
@media(max-width:760px) {
 body.chat-mode .site-head { padding:12px; }
 body.chat-mode .brand-sub,body.chat-mode .vk-stat-pill,body.chat-mode .hint { display:none; }
 body.chat-mode .site-main { margin:0; padding:16px; }
 .chat-sidebar { position:relative; inset:auto; width:100%; height:auto; padding:12px; border:1px solid var(--eth-border); border-radius:16px; margin-bottom:20px; }
 #chat-list { max-height:140px; }
 .chat-sidebar-label,.chat-sidebar-note,.chat-home { display:none; }
 .chat-message.user { margin-left:12px; }
}

/* Depth without obscuring the chemistry background. */
body.chat-mode {
 --chat-glass:rgba(8,19,14,.76);
 --chat-edge:rgba(167,243,208,.15);
 --chat-highlight:rgba(236,253,245,.10);
}
body.chat-mode::before {
 content:''; position:fixed; inset:0; pointer-events:none; z-index:1;
 background:radial-gradient(ellipse at 65% 10%,transparent 0%,rgba(2,7,5,.24) 55%,rgba(2,5,4,.64) 100%);
}
body.chat-mode .site-head { background:rgba(5,12,9,.82); border-bottom:1px solid var(--chat-edge); }
body.chat-mode .site-main { padding-top:22px; padding-bottom:42px; }
.chat-sidebar {
 top:96px; bottom:20px; left:16px; width:248px; padding:22px 14px;
 border:1px solid var(--chat-edge); border-radius:24px;
 background:linear-gradient(155deg,rgba(22,43,32,.80),rgba(5,13,9,.90));
 backdrop-filter:blur(24px) saturate(125%); -webkit-backdrop-filter:blur(24px) saturate(125%);
 box-shadow:inset 0 1px 0 var(--chat-highlight),0 18px 60px #0005;
}
.chat-home { padding:0 8px; color:#d1fae5; letter-spacing:-.04em; }
.chat-list-item { transition:background .18s,border-color .18s,color .18s; padding:12px 14px; }
.chat-list-item.active { border-color:#34d39940; background:linear-gradient(110deg,#10b98124,#10b98108); box-shadow:inset 3px 0 #34d399; }
.chat-thread {
 position:relative; border:1px solid var(--chat-edge); border-radius:28px;
 background:linear-gradient(140deg,rgba(17,34,25,.80),rgba(5,13,9,.85));
 box-shadow:0 24px 70px #0005,inset 0 1px 0 var(--chat-highlight);
 backdrop-filter:blur(20px) saturate(120%); -webkit-backdrop-filter:blur(20px) saturate(120%);
 min-height:45vh; padding:0 28px 20px; overflow:hidden;
}
.chat-thread-head { padding:24px 0 20px; gap:14px; border-bottom:1px solid #a7f3d01a; }
.chat-thread-head img { border:1px solid #a7f3d030; box-shadow:0 6px 24px #0005; }
.chat-thread-head h1 { color:#ecfdf5; letter-spacing:-.035em; }
.chat-thread-head p { color:#91b4a0; }
#chat-messages:empty::after {
 content:'Задайте вопрос — разберём его по шагам.'; display:block;
 padding:64px 16px; text-align:center; color:#91b4a0; font-size:16px;
}
.chat-message { margin:0; padding:26px 0; }
.chat-message + .chat-message { border-top:1px solid #a7f3d012; }
.chat-message.assistant .chat-message-content { padding:1px 0 0; }
.chat-message-name { letter-spacing:.02em; color:#a7f3d0; }
.chat-message-text { color:#e0eee5; font-size:15px; line-height:1.85; }
.chat-message.user {
 margin:22px 0 22px 58px; padding:18px 22px;
 border:1px solid #a7f3d01f; border-radius:20px 20px 6px 20px;
 background:linear-gradient(130deg,#34d39914,#ffffff04);
 box-shadow:inset 0 1px 0 #ffffff09,0 8px 24px #0002;
}
.chat-message.user + .chat-message { border-top:0; }
.chat-message.user .chat-message-name { color:#d9d399; }
.chat-message-actions { display:flex; align-items:center; gap:12px; margin-top:14px; }
.chat-copy { background:none; border:1px solid #a7f3d01a; border-radius:8px; color:#8faf9c; padding:5px 9px; cursor:pointer; font:inherit; font-size:11px; }
.chat-copy:hover { color:#d1fae5; border-color:#34d39960; background:#34d3990d; }
.chat-copy:focus-visible,.chat-list-item:focus-visible { outline:2px solid #34d399; outline-offset:3px; }
body.chat-mode .ask-card {
 position:relative; margin-top:18px; border:1px solid #a7f3d033; border-radius:24px;
 background:linear-gradient(145deg,rgba(22,43,32,.90),rgba(7,17,11,.94));
 backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
 box-shadow:0 18px 60px #0005,inset 0 1px 0 #ffffff12;
}
body.chat-mode .ask-card:focus-within { border-color:#34d39970; box-shadow:0 18px 60px #0005,0 0 0 3px #34d39909; }
body.chat-mode #question { background:transparent; border-color:transparent; box-shadow:none; }
body.chat-mode .ask-foot { border-top:1px solid #a7f3d014; }
body.chat-mode .photo-row { border-color:#a7f3d014; }
.chat-pending { display:flex; align-items:center; gap:10px; font-size:13px; padding:24px 0; }
.chat-pending::before { content:''; width:8px; height:8px; border-radius:50%; background:#34d399; box-shadow:0 0 15px #34d39960; }
@supports not (backdrop-filter:blur(1px)) {
 .chat-thread,.chat-sidebar,body.chat-mode .ask-card { background:rgba(8,20,13,.97); }
}
@media(max-width:760px) {
 .chat-sidebar { position:relative; inset:auto; width:100%; padding:12px; border-radius:18px; }
 .chat-thread { padding:0 16px 10px; border-radius:22px; }
 .chat-thread-head { padding:18px 0; }
 .chat-thread-head img { width:46px; height:46px; }
 .chat-thread-head h1 { font-size:20px; }
 .chat-message { gap:10px; padding:20px 0; }
 .chat-avatar { width:32px; height:32px; border-radius:10px; }
 .chat-message.user { margin-left:26px; padding:15px 16px; }
 body.chat-mode .site-main { padding:12px; }
 .chat-message-text { font-size:14px; }
}
@media(prefers-reduced-transparency:reduce) {
 .chat-thread,.chat-sidebar,body.chat-mode .ask-card { backdrop-filter:none; background:#0a1710; }
}

.premium-welcome { width:min(510px,calc(100vw - 30px)); max-height:calc(100dvh - 30px); overflow:auto; color:#eefcf4; border:1px solid #ebd68c66; border-radius:30px; padding:36px; background:linear-gradient(145deg,#18382cf5,#08130ffb 65%); box-shadow:0 35px 120px #000b,inset 0 1px 0 #ffffff24; text-align:center; }
.premium-welcome::backdrop { background:#020806c9; backdrop-filter:blur(12px); }
.premium-close { position:absolute; top:16px; right:16px; background:#ffffff08; border:1px solid #ffffff18; border-radius:50%; width:32px; height:32px; color:#d1fae5; cursor:pointer; }
.premium-emblem { position:relative; margin:0 auto 20px; width:78px; height:78px; display:grid; place-items:center; border:1px solid #facc1566; border-radius:24px; font-size:42px; color:#f5da7f; background:linear-gradient(135deg,#facc1520,#34d39910); box-shadow:0 0 55px #facc151b; animation:premium-glow 3s ease-in-out infinite; }
.premium-eyebrow { position:relative; font:600 10px var(--font-mono); letter-spacing:.22em; color:#eed592; }
.premium-welcome h2 { position:relative; font-size:30px; line-height:1.2; letter-spacing:-.045em; margin:15px 0; }
#premium-welcome-greeting { color:#a4c9b3; font-size:14px; }
.premium-benefits { position:relative; list-style:none; padding:0; margin:26px 0 20px; text-align:left; }
.premium-benefits li { display:flex; gap:16px; align-items:center; padding:16px 0; border-bottom:1px solid #c3f9d815; }
.premium-benefits li>span { width:42px; height:42px; flex-shrink:0; display:grid; place-items:center; border:1px solid #facc1533; border-radius:13px; color:#f0d786; background:#facc1509; font:600 16px var(--font-mono); }
.premium-benefits strong { display:block; font-size:14px; color:#e4f5e9; }
.premium-benefits small { display:block; font-size:12px; color:#9cb5a6; margin-top:3px; }
.premium-expiry { font-size:11px; color:#c9be92; }
#premium-welcome-start { width:100%; margin-top:12px; background:linear-gradient(115deg,#d5b857,#f0d580); color:#15271c; border-color:#f5dc8c; }
.premium-orbit { position:absolute; top:0; left:0; right:0; height:170px; pointer-events:none; background:radial-gradient(ellipse at 50% 0%,#facc1524,transparent 70%); }
@keyframes premium-glow { 0%,100% { transform:translateY(0); box-shadow:0 0 35px #facc1515; } 50% { transform:translateY(-4px); box-shadow:0 0 65px #facc152d; } }
@media(prefers-reduced-motion:reduce) { .premium-emblem { animation:none; } }
@media(max-width:560px) { .premium-welcome { padding:30px 22px; } .premium-welcome h2 { font-size:26px; } }

.premium-name { color:#f3d986 !important; background:linear-gradient(110deg,#b98a32 0%,#f8df96 23%,#fff8d2 40%,#dfb653 55%,#f8df96 72%,#b98a32 100%); background-size:240% 100%; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; filter:drop-shadow(0 0 7px #e7c75f60); animation:premium-gold-shift 5s linear infinite; }
.premium-welcome { background:linear-gradient(125deg,#123526 5%,#1c3021 35%,#51401d 50%,#172c20 65%,#09150f 95%); background-size:260% 260%; animation:premium-card-shift 10s ease-in-out infinite; }
.premium-welcome h2 { background:linear-gradient(110deg,#d4b457,#fff2be,#f7de95,#fff9df,#c69a3b); background-size:240% 100%; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:premium-gold-shift 6s linear infinite; }
.premium-stars { position:absolute; inset:0; pointer-events:none; overflow:hidden; border-radius:30px; }
.premium-star { position:absolute; left:50%; top:90px; font-size:15px; color:#ffe8a0; text-shadow:0 0 9px #ffd15c; opacity:0; animation:premium-star-burst 2.7s ease-out var(--star-delay) both; }
.premium-expiry { position:relative; padding:12px; border:1px solid #eed08a25; border-radius:12px; background:#050d0860; color:#e8d394; }
.head-right { flex-wrap:wrap; justify-content:flex-end; }
@keyframes premium-star-burst { 0% { opacity:0; transform:translate(-50%,-50%) scale(.25) rotate(0); } 16% { opacity:1; } 100% { opacity:0; transform:translate(calc(-50% + var(--star-x)),calc(-50% + var(--star-y))) scale(.3) rotate(160deg); } }
@keyframes premium-gold-shift { 0% { background-position:0% 50%; } 100% { background-position:240% 50%; } }
@keyframes premium-card-shift { 0%,100% { background-position:0% 0%; } 50% { background-position:100% 100%; } }
@media(prefers-reduced-motion:reduce) { .premium-name,.premium-welcome,.premium-welcome h2,.premium-star { animation:none; } .premium-star { display:none; } }

textarea#question,body.chat-mode textarea#question { resize:none; min-height:52px; height:52px; padding:14px 16px; line-height:1.5; transition:border-color .2s,box-shadow .2s; }
body.chat-mode .ask-card { padding:12px; }
body.chat-mode .ask-foot { padding-top:10px; gap:10px; }
body.chat-mode .photo-row { padding-top:8px; margin-top:6px; }
@media(max-width:760px) { body.chat-mode .ask-card { padding:8px; } #question,body.chat-mode #question { font-size:16px; } }