/* ViraBase2 visual family: paper surfaces, compact header, original brand mark. */
:root{--ink:#253329;--muted:#68746b;--line:#dce4de;--green:#26cf50;--purple:#a1edb5;--brand:#159b36;--soft:#edf9ef;--wash:#f3f6f4}
body{background:var(--wash);color:var(--ink);font:14px/1.55 "Segoe UI",Arial,sans-serif}
[hidden]{display:none!important}
button:focus-visible,a:focus-visible,summary:focus-visible{outline-color:#24b747}
input,textarea{border-radius:8px;border-color:var(--line)}
input:focus,textarea:focus{border-color:#20b747;box-shadow:0 0 0 3px #24b74718}
.button{border-radius:8px;font-size:13px;min-height:42px}
.primary{background:linear-gradient(110deg,#39dc61,#20c44a);color:#10381b;border:1px solid #21bf48;font-weight:650}
.primary:not(:disabled):hover{background:#25cb4e;color:#102e18}
.outlined{background:#fff;border-color:#cfddd2;color:#34573c}
.outlined:not(:disabled):hover,.light:hover{background:#e9f8ed}
.light{border:1px solid var(--line);color:#25703a}
.text-button{color:#168a31}.muted,.caption{color:#69776c}.tiny-dot{background:#4ce16b}
.eyebrow{color:#188437;font-size:10px;letter-spacing:1.6px}
#toast{background:#24432c;border-radius:8px}
.messenger{grid-template-rows:64px minmax(0,1fr);background:var(--wash)}
.app-header{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 26px;border-top:3px solid #2ed456;border-bottom:1px solid var(--line);background:linear-gradient(100deg,#fff 70%,#f1fbf3);min-width:0}
.app-brand{display:flex;align-items:center;gap:17px;white-space:nowrap}
.app-brand img{width:107px;height:41px;object-fit:contain}
.app-brand>span{border-left:1px solid #d5e1d8;padding-left:17px;font-size:18px;font-weight:600;letter-spacing:-.4px}
.app-header-note{font-size:12px;color:#78857b;display:flex;align-items:center;gap:8px}
.app-header-note i{width:7px;height:7px;background:#2dcc50;border-radius:50%}
.rail{background:#fff;border-right:1px solid var(--line);color:#7a8a7e;padding-top:23px;gap:14px}
.rail-brand{margin:0 0 20px;display:flex;align-items:center;justify-content:center}
.rail-brand img{display:block;width:42px;height:42px}.rail-brand>span{display:none}
.rail-button{border-radius:9px}.rail-button:hover{background:#f0f8f1}
.rail-button.active{background:#e7f9eb;color:#148e30}
.rail-button.active:before{background:#27cd50}
.my-avatar{background:#ecf5ee;color:#2c713e;border:1px solid #c9dfcf;border-radius:9px}
.sidebar{background:#fff;padding-top:25px;border-color:var(--line)}
.sidebar-title h1{font-size:21px}.sidebar-title h1 span{color:#18b540}
.test-tag{background:#f0faf2;color:#529662;border-color:#c9e9d1}
.sidebar-greeting{font-size:12px;color:#7b867e;margin-bottom:30px}
.section-caption{font-size:10px;color:#8c968e}
.room-item{border-radius:8px}.room-item.selected{background:linear-gradient(90deg,#e5f9e9,#f2fbf4);box-shadow:inset 3px 0 #23c94d}
.room-avatar,.room-avatar.small{border-radius:10px;color:#19963a;background:#e1f5e6}
.room-info strong{font-size:13px}.room-info>span{color:#77927d}.room-marker{background:#2ecc50}
.invite-card{background:#f7fbf7;border:1px solid #dcebdd;border-radius:10px;margin-top:28px;padding:18px 15px;box-shadow:0 2px 7px #123c1905}
.invite-art{color:#2fa64d}.invite-card h3{font-size:14px;color:#345b3e}.invite-card>p{color:#748379}
.invite-card .button{font-size:11px;border-color:#d8e7dc}
.sidebar-footer{color:#63766a}.sidebar-footer .small-logo{width:29px;height:29px;border:0;padding:0;border-radius:0}.sidebar-footer small{color:#8a988e;font-size:9px}
.conversation{background:#fff;min-height:0}
.conversation-header{height:76px;padding-top:18px;padding-bottom:18px;background:#fff;border-color:#e4ebe5}
.conversation-header h2{font-size:16px}.conversation-header div>span{font-size:11px;color:#7e8d82}
.connection.online{color:#318c48}.connection.online i{background:#29ca50}
.chat-stream{background:linear-gradient(180deg,#f9fbfa 0%,#f5f8f6 100%)}
.date-divider{color:#8c9c90;font-size:9px}.date-divider:before,.date-divider:after{background:#e1e9e3}
.welcome-card{border:1px solid #e0e9e2;border-radius:12px;background:#fff;padding:29px 22px;max-width:430px;box-shadow:0 2px 9px #1a4a2405}
.welcome-icon{width:66px;height:66px;background:#e7f9eb;color:#23a844;border-radius:15px;transform:none;margin-bottom:20px}
.welcome-icon:after{background:#3bd760;border-color:#fff}
.welcome-card .eyebrow{color:#6d9d78}.welcome-card h2{font-size:24px;color:#314537;font-weight:600}
.welcome-card p{font-size:13px;color:#7a8b7f}.welcome-tags span{background:#f1faf3;border-color:#dfefe3;color:#6b8e75;font-size:9px}
.welcome-card.compact{margin:22px auto;padding:13px 20px;border-color:#e7eee9;background:#ffffffc9;box-shadow:none;max-width:240px}
.welcome-card.compact .welcome-icon{width:34px;height:34px;border-radius:9px;margin-bottom:8px}
.welcome-card.compact h2{font-size:15px;margin:0}
.message-avatar{background:#e0f0e4;color:#39834d;border-radius:8px}
.message-author{font-size:10px;color:#6d8574}
.message-bubble{background:#fff;border:1px solid #dfe8e1;border-radius:10px 10px 10px 2px;font-size:14px;box-shadow:0 1px 3px #18351e05}
.message.mine .message-bubble{background:#dbf8e2;border-color:#c4edcf;border-radius:10px 10px 2px 10px}
.message-bubble time{color:#70917b;font-size:9px}
.composer-wrap{background:#fff;border-top:1px solid #e3ebe5;padding-top:16px}
.composer{background:#fff;border-radius:9px;border-color:#cedbd2}.composer:focus-within{border-color:#2bb94c}
.send-button{border-radius:8px;background:#32d75a;color:#113f20}.send-button:hover{background:#22c64c}
.composer-caption{font-size:9px;color:#93a097}
.push-panel{background:#f7faf8;border-color:var(--line);padding-top:25px}
.panel-title{font-size:9px;color:#7c9684}.bell-art{border-radius:18px;background:#ddf8e5;color:#17a440;transform:none;margin-top:26px}.bell-art svg{transform:none}.bell-art span{background:#31d358;border-color:#f7faf8}
.push-panel>h2{font-size:27px;font-weight:600;color:#2e4635}.panel-intro{font-size:12px;color:#76887b}
.push-state strong{font-size:11px;color:#496951}.push-state small{font-size:10px;color:#839889}.status-dot{background:#bed4c4}.push-state.ready .status-dot{background:#23c84c}
.push-test{border-color:#dce9e0}.push-test h3{font-size:13px;color:#46624e}.push-test h3 svg{color:#6f9c7b}.push-test p{font-size:11px;color:#7d9183}
.push-test .button{font-size:11px}.test-progress{color:#258f41}
.device-details,.delivery-details{border-color:#dfe9e2}summary{color:#607e68;font-size:12px}summary>span{background:#e5f4e9;color:#428957}summary:after{color:#7cae88}
.device-row{color:#4f775b}.delivery-state{color:#448255}.delivery-state.received,.delivery-state.opened{color:#168e33}
.install-note{background:#edf8f0;border-color:#d8eddf;border-radius:8px;color:#5c8065;font-size:10px}.panel-footer{color:#879d8d}
.auth-layout{max-width:1080px;min-height:650px;margin:7vh auto;grid-template-columns:1fr 1.03fr;border:1px solid #dce5de;border-radius:16px;overflow:hidden;box-shadow:0 8px 40px #1a44230a}
.auth-main{order:0;background:#fff;padding:30px 42px}.auth-story{order:1;background:radial-gradient(ellipse at 25% 20%,#3ae067 0%,#15b644 48%,#087b2d 100%);padding:35px 40px;min-height:650px}
.wordmark{gap:14px;letter-spacing:0}.wordmark-logo{width:112px;height:43px;filter:brightness(0) invert(1);object-fit:contain}
.brand-product{font-size:15px;font-weight:400;color:#e1ffe8;letter-spacing:0;border-left:1px solid #ffffff55;padding-left:13px}
.story-copy{margin-top:58px}.story-copy .eyebrow{color:#c8f9d5}.story-copy h1{font-size:55px;letter-spacing:-2.5px;line-height:1.1;margin-top:18px;font-weight:600}.story-copy p{font-size:14px;color:#dcffe5}
.story-art{min-height:150px;height:190px;margin-top:10px;flex:1}.hero-emblem{display:block;position:relative;width:174px;height:174px;margin:0 auto;filter:brightness(0) invert(1);opacity:.92}
.art-orbit{width:290px;height:290px;left:50%;top:-55px;transform:translateX(-50%);border-color:#bafacf44}.art-orbit:after{border-color:#bafacf33}
.story-footer{color:#d3f9dc;font-size:11px}.auth-card{margin:45px auto 35px}.auth-mini-icon{background:#e7f8eb;color:#21a944;border-radius:11px;margin-bottom:23px}.auth-card h2{font-size:29px}.auth-card>.muted{font-size:14px;line-height:1.7;color:#78857b}.auth-submit{font-size:14px}.auth-note{color:#7e9284;border-color:#e0e9e2}.auth-note svg{color:#26b94b}.auth-bottom{color:#839087}.auth-footer{color:#92a097}.prototype-label{color:#8b9d91}.prototype-label span{background:#eef7f0;color:#66a376}
@media(min-width:1600px){.messenger{grid-template-rows:64px minmax(0,1fr)}}
@media(max-width:1180px){.push-panel{top:64px}.messenger{grid-template-rows:64px minmax(0,1fr)}}
@media(max-width:760px){
  .messenger{grid-template-columns:54px minmax(0,1fr);grid-template-rows:58px minmax(0,1fr)}
  .app-header{padding:0 14px;gap:10px}.app-brand{gap:10px}.app-brand img{width:84px;height:32px}.app-brand>span{font-size:15px;padding-left:10px}.app-header-note{font-size:0;gap:0}.app-header-note i{width:6px;height:6px}
  .rail{padding-top:16px}.rail-brand{margin-bottom:15px}.rail-brand img{width:35px;height:35px}.rail-button.active:before{left:-8px}
  .conversation-header{height:68px;padding:13px 14px;gap:9px}.conversation-header h2{font-size:14px}.conversation-header div>span{font-size:9px}
  .push-panel{top:58px;width:min(340px,calc(100vw - 54px));padding:23px 20px 20px}.push-panel>h2{font-size:26px}.push-test p{font-size:12px}
  .welcome-card{padding:26px 13px;margin:40px auto 25px;border-radius:10px}.welcome-card h2{font-size:20px;letter-spacing:-.5px}.welcome-card p{font-size:12px}.welcome-tags span{font-size:8px;padding:6px}.welcome-card.compact{padding:12px;margin:15px auto}
  .chat-stream{padding:18px 13px}.composer-wrap{padding-top:11px}.composer textarea{font-size:16px}.composer-caption{font-size:8px}.message-bubble{font-size:14px}
  .auth-layout{display:flex;flex-direction:column;max-width:none;min-height:100dvh;margin:0;border:0;border-radius:0;box-shadow:none}
  .auth-story{order:0;padding:20px 25px;min-height:0;max-height:none;border-bottom:1px solid #18aa3d}.wordmark-logo{width:96px;height:36px}.brand-product{font-size:14px}
  .story-copy{margin-top:20px}.story-copy .eyebrow{font-size:8px}.story-copy h1{font-size:33px;line-height:1.14;margin:10px 0 2px;letter-spacing:-1px}.story-copy h1 br{display:none}.story-copy h1 br:after{content:" "}.story-copy p,.story-art,.story-footer{display:none}
  .auth-main{order:1;flex:1;padding:23px 26px 24px}.auth-card{margin:22px auto 28px;max-width:390px}.auth-card h2{font-size:26px}.auth-card>.muted{font-size:13px}.auth-note{font-size:10px}.auth-card input{font-size:16px}.auth-footer{font-size:9px}
}