:root{--wa-bg:#0b141a;--wa-panel:#111b21;--wa-panel-2:#202c33;--wa-header:#202c33;--wa-border:#222d34;--wa-text:#e9edef;--wa-text-secondary:#8696a0;--wa-accent:#00a884;--wa-accent-strong:#25d366;--wa-outgoing:#005c4b;--wa-incoming:#202c33;--wa-danger:#ea4335;--wa-sidebar-w:30%;--wa-sidebar-min:320px;--wa-sidebar-max:420px;--wa-font:"Segoe UI", "Helvetica Neue", Helvetica, "Noto Sans", Arial, sans-serif}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--wa-font);color:var(--wa-text);-webkit-font-smoothing:antialiased;background:#0a1014}button,input,textarea{font:inherit;color:inherit}.app-shell{background:linear-gradient(#0b141a 0 127px,#0000 127px),linear-gradient(#00a884 0 127px,#0b141a 127px);justify-content:center;align-items:stretch;height:100%;padding:20px 24px;display:flex}.wa-frame{background:var(--wa-bg);border-radius:4px;width:min(1600px,100%);height:100%;max-height:calc(100vh - 40px);display:flex;overflow:hidden;box-shadow:0 2px 10px #00000073}.login-screen{background:#111b21;place-items:center;min-height:100%;display:grid}.login-card{text-align:center;width:min(420px,92vw);padding:40px 28px}.login-logo{background:var(--wa-accent);color:#111b21;border-radius:50%;place-items:center;width:72px;height:72px;margin:0 auto 20px;font-size:34px;font-weight:700;display:grid}.login-card h1{letter-spacing:.2px;margin:0 0 8px;font-size:28px;font-weight:300}.login-card p{color:var(--wa-text-secondary);margin:0 0 28px;font-size:14px;line-height:1.5}.login-card form{flex-direction:column;gap:12px;display:flex}.login-card input{background:var(--wa-panel-2);border:none;border-radius:8px;outline:none;padding:14px 16px}.login-card input:focus{box-shadow:0 0 0 1px var(--wa-accent)}.login-card button{background:var(--wa-accent);color:#111b21;cursor:pointer;border:none;border-radius:24px;padding:12px 20px;font-weight:600}.login-card button:disabled{opacity:.5;cursor:default}.login-error{color:var(--wa-danger);margin:0;font-size:13px}.modal-backdrop{z-index:200;background:#0b141ab8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-card{background:var(--wa-panel);text-align:center;border-radius:12px;width:min(400px,100%);padding:28px 24px 22px;box-shadow:0 12px 40px #00000073}.modal-logo{background:var(--wa-accent);color:#111b21;border-radius:50%;place-items:center;width:56px;height:56px;margin:0 auto 14px;font-size:26px;font-weight:700;display:grid}.modal-card h2{margin:0 0 8px;font-size:22px;font-weight:400}.modal-card p{color:var(--wa-text-secondary);margin:0 0 18px;font-size:14px;line-height:1.45}.modal-card form{flex-direction:column;gap:10px;display:flex}.modal-card input{background:var(--wa-panel-2);border:none;border-radius:8px;outline:none;padding:14px 16px}.modal-card input:focus{box-shadow:0 0 0 1px var(--wa-accent)}.modal-actions{gap:10px;margin-top:4px;display:flex}.modal-btn{cursor:pointer;border:none;border-radius:24px;flex:1;padding:12px 16px;font-weight:600}.modal-btn.primary{background:var(--wa-accent);color:#111b21}.modal-btn.ghost{background:var(--wa-panel-2);color:var(--wa-text)}.modal-btn:disabled{opacity:.5;cursor:default}.sidebar{width:clamp(var(--wa-sidebar-min), var(--wa-sidebar-w), var(--wa-sidebar-max));min-width:var(--wa-sidebar-min);background:var(--wa-panel);border-right:1px solid var(--wa-border);flex-direction:column;display:flex;position:relative}.sidebar-header{background:var(--wa-header);align-items:center;gap:12px;height:60px;padding:10px 16px;display:flex}.avatar{color:#fff;-webkit-user-select:none;user-select:none;background:#2a3942;border-radius:50%;flex-shrink:0;place-items:center;width:40px;height:40px;font-size:15px;font-weight:600;display:grid;overflow:hidden}.avatar.has-photo{background:#2a3942}.avatar img{object-fit:cover;width:100%;height:100%;display:block}.avatar.sm{width:28px;height:28px;font-size:11px}.avatar.lg{width:49px;height:49px;font-size:18px}.sidebar-header .meta{flex:1;min-width:0}.sidebar-header .meta strong{font-size:16px;font-weight:500;display:block}.sidebar-header .meta span{color:var(--wa-text-secondary);font-size:12px}.icon-btn{width:40px;height:40px;color:var(--wa-text-secondary);cursor:pointer;background:0 0;border:none;border-radius:50%;place-items:center;display:grid}.icon-btn:hover{background:#ffffff0d}.search-wrap{background:var(--wa-panel);padding:8px 12px}.search-box{background:var(--wa-panel-2);color:var(--wa-text-secondary);border-radius:8px;align-items:center;gap:12px;padding:8px 14px;display:flex}.search-box input{background:0 0;border:none;outline:none;flex:1;font-size:14px}.chat-list{flex:1;min-height:0;overflow-y:auto}.bottom-nav{background:var(--wa-header);border-top:1px solid var(--wa-border);flex-shrink:0;grid-template-columns:repeat(4,1fr);height:64px;padding:4px 2px 6px;display:grid}.bottom-nav__item{color:var(--wa-text-secondary);cursor:pointer;background:0 0;border:none;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:0;padding:4px 2px;display:flex}.bottom-nav__item:hover{background:#ffffff0a}.bottom-nav__item.active{color:var(--wa-accent-strong)}.bottom-nav__icon{place-items:center;line-height:0;display:grid}.bottom-nav__label{letter-spacing:.01em;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:11px;font-weight:500;overflow:hidden}.tab-placeholder{text-align:center;min-height:0;color:var(--wa-text-secondary);flex-direction:column;flex:1;justify-content:center;align-items:center;padding:32px 28px;display:flex}.tab-placeholder h3{color:var(--wa-text);margin:0 0 8px;font-size:20px;font-weight:400}.tab-placeholder p{max-width:260px;margin:0;font-size:14px;line-height:1.45}.chat-item{cursor:pointer;text-align:left;background:0 0;border:none;border-bottom:1px solid #8696a026;gap:14px;width:100%;padding:12px 16px;display:flex}.chat-item:hover{background:#202c33}.chat-item.active{background:#2a3942}.chat-item-body{flex:1;min-width:0}.chat-item-top{justify-content:space-between;gap:8px;margin-bottom:4px;display:flex}.chat-item-top .name{white-space:nowrap;text-overflow:ellipsis;font-size:17px;font-weight:400;overflow:hidden}.chat-item-top .time{color:var(--wa-text-secondary);flex-shrink:0;font-size:12px}.chat-item-top .time.unread{color:var(--wa-accent-strong)}.chat-item-bottom{justify-content:space-between;align-items:center;gap:8px;display:flex}.chat-item-bottom .preview{color:var(--wa-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:14px;overflow:hidden}.badge{background:var(--wa-accent-strong);color:#111b21;border-radius:10px;flex-shrink:0;place-items:center;min-width:20px;height:20px;padding:0 6px;font-size:12px;font-weight:600;display:grid}.pin-dot{color:var(--wa-text-secondary);font-size:12px}.chat{background:var(--wa-bg);flex-direction:column;flex:1;min-width:0;display:flex}.chat-empty{color:var(--wa-text-secondary);text-align:center;background:#222e35;flex:1;place-items:center;padding:40px;display:grid}.chat-empty h2{color:#e9edef;margin:0 0 10px;font-size:32px;font-weight:300}.chat-empty p{max-width:420px;margin:0;font-size:14px;line-height:1.5}.chat-header{background:var(--wa-header);border-bottom:1px solid #0000001a;align-items:center;gap:14px;height:60px;padding:10px 16px;display:flex}.chat-header .info{flex:1;min-width:0}.chat-header .info strong{font-size:16px;font-weight:500;display:block}.chat-header .info span{color:var(--wa-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;display:block;overflow:hidden}.author-pin{border-bottom:1px solid var(--wa-border);background:#1d282f;align-items:flex-start;gap:12px;padding:10px 16px 12px;display:flex}.author-pin .pin-icon{color:var(--wa-accent);flex-shrink:0;margin-top:2px}.author-pin .pin-content{flex:1;min-width:0}.author-pin .bio{color:var(--wa-text);margin:0 0 8px;font-size:13.5px;line-height:1.4}.book-chips{flex-wrap:wrap;gap:6px;max-height:88px;display:flex;overflow-y:auto}.book-chip{background:var(--wa-panel-2);color:var(--wa-text);border:1px solid #8696a040;border-radius:8px;align-items:center;gap:6px;padding:5px 10px;font-size:12.5px;text-decoration:none;display:inline-flex}.book-chip:hover{border-color:var(--wa-accent)}.book-chip .year{color:var(--wa-text-secondary)}.messages{background-color:#0b141a;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.025'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");flex:1;padding:12px 7% 20px;overflow-y:auto}.day-sep{justify-content:center;margin:12px 0;display:flex}.day-sep span{color:var(--wa-text-secondary);background:#182229;border-radius:8px;padding:6px 12px;font-size:12.5px;box-shadow:0 1px 1px #00000026}.msg-row{margin-bottom:3px;display:flex}.msg-row.mine{justify-content:flex-end}.bubble{border-radius:8px;max-width:min(65%,560px);padding:6px 8px 8px 10px;position:relative;box-shadow:0 1px .5px #00000021}.msg-row.theirs .bubble{background:var(--wa-incoming);border-top-left-radius:0}.msg-row.mine .bubble{background:var(--wa-outgoing);border-top-right-radius:0}.bubble .sender{cursor:pointer;margin-bottom:2px;font-size:12.8px;font-weight:600}.bubble .text{white-space:pre-wrap;word-break:break-word;padding-right:48px;font-size:14.2px;line-height:1.35}.bubble .meta{float:right;color:#e9edef8c;align-items:center;gap:3px;margin:-2px 0 -4px 10px;font-size:11px;display:flex}.bubble-menu{opacity:0;position:absolute;top:4px;right:4px}.bubble:hover .bubble-menu{opacity:1}.bubble-menu button{color:var(--wa-text-secondary);cursor:pointer;background:0 0;border:none;padding:2px 4px;font-size:14px}.context-menu{z-index:50;background:#233138;border-radius:8px;min-width:180px;padding:6px 0;position:fixed;overflow:hidden;box-shadow:0 4px 16px #0006}.context-menu button{text-align:left;width:100%;color:var(--wa-text);cursor:pointer;background:0 0;border:none;padding:10px 16px;font-size:14px;display:block}.context-menu button:hover{background:#182229}.composer{background:var(--wa-header);align-items:flex-end;gap:10px;min-height:62px;padding:8px 16px;display:flex}.composer textarea{resize:none;background:var(--wa-panel-2);border:none;border-radius:8px;outline:none;flex:1;max-height:120px;padding:12px 14px;font-size:15px;line-height:1.4}.composer .send{width:48px;height:48px;color:var(--wa-accent);cursor:pointer;background:0 0;border:none;border-radius:50%;flex-shrink:0;place-items:center;display:grid}.composer .send:disabled{opacity:.35;cursor:default}.toast{color:var(--wa-text);z-index:100;background:#233138;border-radius:8px;padding:10px 18px;font-size:14px;position:fixed;bottom:28px;left:50%;transform:translate(-50%);box-shadow:0 4px 12px #00000059}@media (width<=900px){.app-shell{background:var(--wa-bg);padding:0}.wa-frame{border-radius:0;width:100%;max-height:100vh}.sidebar{width:100%;min-width:0;max-width:none}.wa-frame.chat-open .sidebar,.wa-frame:not(.chat-open) .chat{display:none}}