:root{--navy:#081b42;--blue:#087bea;--page:#f2f6fc;--text:#163358;--muted:#667d9b;--line:#dde7f5}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,"Segoe UI",Tahoma,Arial,sans-serif;background:var(--page);color:var(--text);line-height:1.7}a{color:#006ce0;text-decoration:none}a:hover{text-decoration:underline}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.6;cursor:not-allowed}.wrap{width:min(1140px,calc(100% - 34px));margin:auto}.topbar{background:#fff;border-bottom:1px solid var(--line);box-shadow:0 4px 24px #17437b0b}.nav{min-height:76px;display:flex;justify-content:space-between;gap:16px;align-items:center}.nav nav{display:flex;flex-wrap:wrap;gap:15px}.nav nav a{font-size:13px;font-weight:700}.brand{display:flex;align-items:center;gap:9px;color:var(--navy);font-size:22px;font-weight:900;white-space:nowrap}.brand small{font-size:11px;color:var(--muted);font-weight:600}.brand-icon{background:#0a74db;color:#fff;border-radius:12px;width:40px;height:40px;display:grid;place-items:center}main.wrap{padding-block:29px 65px;min-height:75vh}.hero{position:relative;overflow:hidden;padding:70px 55px;border-radius:22px;background:radial-gradient(circle at 90% 20%,#2b5ca6 0%,transparent 35%),linear-gradient(110deg,#08183b,#0d3777);color:#fff;box-shadow:0 15px 40px #0a32642b}.hero h1{font-size:clamp(40px,6vw,65px);margin:0}.hero p{max-width:620px;color:#c8e0ff;font-size:18px}.eyebrow{font-weight:800;color:#308dff;font-size:12px;letter-spacing:.3px}.buttons{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}.btn{display:inline-flex;justify-content:center;align-items:center;min-height:42px;padding:9px 20px;border-radius:11px;background:linear-gradient(110deg,#088bff,#0862d8);border:1px solid transparent;color:#fff!important;font-size:14px;font-weight:800;box-shadow:0 6px 19px #085bc52a;text-decoration:none}.btn:hover{text-decoration:none;filter:brightness(1.07)}.btn.secondary{background:#e7f1ff;color:#0a65c8!important;border:1px solid #cde5ff;box-shadow:none}.hero .btn.secondary{background:#ffffff24;color:#fff!important;border-color:#ffffff45}.panel{padding:29px;border:1px solid var(--line);background:#fff;border-radius:18px;box-shadow:0 9px 34px #14487a0a;margin-bottom:20px}.panel h1{font-size:clamp(22px,3vw,30px);margin:0 0 6px}.panel h2{font-size:19px;margin:21px 0 10px}.panel h2:first-child{margin-top:0}.panel.narrow{max-width:550px;margin:0 auto}.muted,.panel p{color:var(--muted)}form label{display:flex;flex-direction:column;font-size:13px;font-weight:750;margin:14px 0 0;gap:5px}input,textarea,select{display:block;width:100%;border:1px solid #d0def0;border-radius:10px;min-height:44px;padding:9px 12px;outline:none;background:#fcfdff;color:var(--text)}input:focus,textarea:focus,select:focus{border-color:#168afd;box-shadow:0 0 0 3px #168afd20}form .btn{margin-top:19px}.installer .gridcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.installer .gridcols .panel{margin:0}.gridcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.stats>div{padding:20px;background:#f0f7ff;border-radius:12px}.stats strong{display:block;font-size:28px;color:#0469cb}.stats small{color:var(--muted)}.notice{padding:14px 17px;border-radius:12px;background:#eaf4ff;border:1px solid #a6d4ff;color:#174e85;margin-bottom:17px}.notice.error{background:#fff1ef;border-color:#ffbfb8;color:#a13a29}.notice.success{background:#edfaf0;border-color:#b5e6bf;color:#147834}.reqs{display:flex;gap:9px;flex-wrap:wrap;margin-block:20px}.reqs>div{padding:7px 12px;border-radius:9px;background:#f0f5fc;font-size:12px}.reqs b{color:#0d9960}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:right;font-size:13px}th,td{padding:12px;border-bottom:1px solid var(--line);white-space:nowrap}th{color:#6b7d94;background:#f7faff}.meter{height:8px;background:#e6f0fb;width:135px;border-radius:10px;overflow:hidden}.meter i{display:block;height:100%;background:#0686fa;border-radius:10px}.result{margin-top:10px;padding:14px;border-radius:10px;background:#f0f7ff}.result code,.uidbox code,.chat-link code,.thread-head code{display:block;overflow-wrap:anywhere;font-size:12px;color:#1366c9}.uidbox{padding:18px;border:1px dashed #5ca5f3;border-radius:14px;background:#f5faff;margin:22px 0}.uidbox code{font-size:17px;font-weight:900;text-align:center}.okmark{font-size:44px;color:#0f9b59}.inline{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.inline input{max-width:640px;flex:1}.inline button{margin:0}.chat-list{display:flex;flex-direction:column;gap:10px}.chat-link{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:15px;background:#f6faff;border:1px solid #e3efff;border-radius:12px}.chat-link:hover{background:#ecf5ff;text-decoration:none}.chat-link b{color:#153b65}.chat-link small{margin-right:auto;color:#8797af}.thread-panel{max-width:850px;margin:auto}.thread-head{display:flex;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:15px}.thread-head h1{font-size:20px}.messages{display:flex;flex-direction:column;gap:10px;min-height:300px;max-height:58vh;overflow-y:auto;scrollbar-width:thin;padding:18px 3px}.bubble{max-width:min(85%,500px);padding:11px 14px;border-radius:16px;background:#eff3f8;align-self:flex-start}.bubble.mine{align-self:flex-end;background:#ddedff}.bubble p{color:var(--text);margin:0;white-space:normal;overflow-wrap:anywhere}.bubble small{display:block;text-align:left;color:#7891ae;font-size:10px;margin-top:6px}.send-row{display:flex;gap:10px;align-items:flex-end;padding-top:12px;border-top:1px solid var(--line)}.send-row textarea{flex:1;resize:vertical}.send-row button{margin:0}.empty-msg{margin:auto;color:#8aa0b8}.footer{text-align:center;color:#8594ad;font-size:12px;padding:20px}.installer .panel h2{margin:0 0 3px}
@media(max-width:760px){.nav{flex-direction:column;padding-block:11px;align-items:stretch}.nav nav{gap:8px 14px}.brand{font-size:18px}.brand small{font-size:10px}.panel{padding:19px}.hero{padding:36px 22px}.gridcols,.installer .gridcols{grid-template-columns:1fr}.stats>div{padding:12px}.stats strong{font-size:22px}.send-row{align-items:stretch}.send-row button{align-self:stretch}.chat-link small{margin-right:0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* v2.1: a calmer, more polished entrance to the messaging application. */
body:has(.panel.narrow){background:radial-gradient(circle at 7% 10%,#d9eaff,transparent 34%),linear-gradient(160deg,#edf4ff,#f8fbff)}
main.wrap:has(>.panel.narrow){display:grid;place-items:center;min-height:calc(100vh - 180px);padding-block:40px}
.panel.narrow{width:min(100%,520px);padding:clamp(24px,5vw,40px);border-radius:22px;box-shadow:0 22px 70px rgba(15,65,123,.13)}
.panel.narrow form{margin-top:25px}
.panel.narrow label{font-size:13px}
.panel.narrow .btn{width:100%;min-height:49px}
