:root{--ink:#203a52;--muted:#75899b;--line:#d4dfe8;--blue:#246eb1;--soft:#f5f9fc;--panel:#fff;--bg:#e6eef5;--gold:#ab772c}*{box-sizing:border-box}body{margin:0;font:14px/1.5 Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg)}button,input,textarea{font:inherit}button{cursor:pointer;border:1px solid var(--line);border-radius:8px;padding:9px 13px;background:linear-gradient(#fff,#eef3f7);color:var(--ink);font-weight:600;transition:background .15s,transform .15s}button:hover{background:#e1edf7}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:wait}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #69a6db;outline-offset:2px}[hidden]{display:none!important}input,textarea{border:1px solid var(--line);border-radius:9px;padding:11px;color:var(--ink);background:var(--panel);width:100%}header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 27px;border-bottom:1px solid #bccdde;background:linear-gradient(#f8fbfe,#dce8f3);gap:15px}.brand{display:flex;gap:12px;align-items:center;color:var(--ink);text-decoration:none;font-size:21px;letter-spacing:1.7px;font-weight:500}.brand b{font-weight:800}.brand small{display:block;font-size:9px;letter-spacing:2.5px;color:var(--muted);margin-top:2px}.logo{width:43px;height:43px;border-radius:12px;background:linear-gradient(145deg,#347eaf,#173b60);color:#fff;font:bold 29px/43px Georgia;text-align:center;display:inline-block;box-shadow:0 3px 6px #173b6025;position:relative}.logo span{font-size:24px;color:#a2e8e0;position:absolute;right:5px;bottom:-9px}.header-right{display:flex;gap:10px;align-items:center}.coin{background:#fff9ed;border-color:#e8d8b7;color:#896021}.coin b{margin-left:12px}.status{color:#568274;font-size:12px;margin-right:12px}.status:before{content:'●';font-size:9px;margin-right:7px}.app{display:grid;grid-template-columns:210px minmax(300px,1fr) 300px;gap:14px;height:calc(100dvh - 82px);padding:16px}.rail{display:flex;flex-direction:column;min-height:0;padding:12px 8px}.rail-label{font-size:10px;letter-spacing:1.8px;font-weight:bold;color:var(--muted);padding:8px 8px 15px}.room-btn{display:flex;width:100%;text-align:left;background:none;border:1px solid transparent;padding:13px 11px;margin-bottom:5px;gap:11px;align-items:center}.room-btn.active{background:#fff;border-color:var(--line);box-shadow:0 3px 8px #16365308}.room-btn .symbol{font-size:20px;color:#6e91b0}.room-btn small{display:block;font-size:10px;color:var(--muted);font-weight:normal}.rail-note{margin:auto 10px;color:#70899d}.rail-note>span{font-size:36px;color:#91a6b6}.rail-note h3{font:20px/1.4 Georgia;margin:9px 0}.rail-note p{font-size:12px;line-height:1.8}.rail-bottom{display:flex;align-items:center;gap:10px;border-top:1px solid #cedbe5;margin-top:20px;padding:16px 5px 0}.rail-bottom small{display:block;color:var(--muted);font-size:11px;text-transform:capitalize}main{min-height:0;background:var(--panel);border:1px solid #c4d3df;border-radius:13px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 5px 20px #28486306}.room-header{padding:24px 27px 20px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(110deg,#f7fafc,#edf5fb)}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#7e99b0}h1{font:33px/1.2 Georgia;margin:8px 0}p{margin:6px 0}.room-header p{font-size:12px;color:var(--muted)}.room-icon{font-size:35px;background:#fff9;border:1px solid #dae5ed;border-radius:50%;width:65px;height:65px;text-align:center;line-height:65px}.welcome{display:flex;gap:14px;align-items:center;margin:18px 22px;padding:14px 17px;border:1px solid #d8e6e1;border-radius:10px;background:#f4faf7}.welcome>span{font-size:31px;color:#789c90}.welcome b{font-size:12px}.welcome p{font-size:11px;color:#6f8a80}.welcome button{font-size:11px;margin-left:auto;white-space:nowrap;background:white}.conversation-head{display:flex;align-items:center;gap:10px;padding:10px 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:12px}.conversation-head>span{margin-left:auto;color:var(--muted);font-size:10px}#messages{flex:1;min-height:100px;overflow-y:auto;padding:20px 24px;background:linear-gradient(#fff,#fafcfe);scroll-behavior:smooth}.empty{text-align:center;color:var(--muted);padding:65px 10px;font-size:13px}.empty strong{display:block;font:23px Georgia;color:#688096;margin-bottom:10px}.message{display:flex;gap:10px;margin-bottom:20px;animation:arrive .18s ease-out}.avatar{width:39px;height:39px;border-radius:12px;background:#dceaf4;color:#376588;display:inline-flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;border:1px solid #c9dce9}.avatar.small{width:34px;height:34px;font-size:14px}.message:nth-child(3n) .avatar,.person:nth-child(3n) .avatar{background:#ece4f1;color:#806d98}.message:nth-child(3n+1) .avatar,.person:nth-child(3n+1) .avatar{background:#e1eee8;color:#5c8772}.message-content{min-width:0;max-width:85%}.message-meta{font-size:12px;display:flex;align-items:center;gap:7px;margin-bottom:5px}.message-meta button{border:0;padding:0;background:none;font-size:12px}.message-meta time{font-size:10px;color:#99a8b4}.badge{font-size:8px;letter-spacing:.7px;text-transform:uppercase;color:#61869e;background:#edf3f7;padding:2px 5px;border-radius:4px}.badge.vip,.badge.admin{background:#fbefd3;color:#946e21}.bubble{background:#f0f5f9;border:1px solid #e2eaf1;border-radius:0 10px 10px;padding:10px 13px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.65}.message.own .bubble{background:#edf5fb;border-color:#d8e7f3}.bubble img{max-width:100%;max-height:270px;border-radius:7px;display:block}.bubble iframe{width:100%;max-width:400px;aspect-ratio:16/9;border:0;border-radius:8px}.bubble.gift{background:#fff8e9;border:1px solid #eddbaf;color:#886227}.gift-art{font-size:38px;display:block}.composer{padding:12px 20px 10px;border-top:1px solid var(--line)}.tools{display:flex;gap:4px;align-items:center;margin-bottom:10px}.tools button{font-size:15px;border:0;background:transparent;padding:6px 8px}.tools button span{font-size:11px;margin-left:3px}.tools-right{margin-left:auto;font-size:10px;color:#9aabb8}#messageForm{display:flex;gap:10px;align-items:stretch}textarea{resize:none;font-size:13px;min-height:65px;flex:1;background:#fbfdff}.primary{background:linear-gradient(#3c81bb,#28669b);color:white;border-color:#28669b}.primary:hover{background:#215e91}.composer-footer{display:flex;justify-content:space-between;font-size:9px;color:#95a5b3;padding-top:8px}aside{background:#f7fafc;border:1px solid #c4d3df;border-radius:13px;overflow:hidden;display:flex;flex-direction:column;min-height:0}.side-tabs{display:flex;border-bottom:1px solid var(--line);padding:8px 8px 0;gap:3px}.side-tabs button{background:none;border:0;border-radius:0;padding:12px 9px;font-size:12px;color:var(--muted);flex:1}.side-tabs button.active{color:#29699b;border-bottom:2px solid #397eaf}.side-tabs span{border-radius:10px;background:#e1edf4;padding:2px 5px;font-size:10px}.side-search{padding:15px}.side-search input{font-size:12px;padding:9px 11px;background:#fff}#userList{overflow-y:auto;flex:1;padding:0 12px}.person{border:1px solid #d9e3eb;border-radius:10px;padding:12px 10px;background:linear-gradient(#fff,#f0f5f9);display:flex;align-items:center;gap:10px;margin-bottom:9px;cursor:pointer}.person:hover{border-color:#9abbd3}.person-info{min-width:0;flex:1}.person-info b{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis}.person-info small{font-size:10px;color:var(--muted)}.online-dot{width:7px;height:7px;background:#70b99c;border-radius:50%;display:inline-block;margin-right:4px}.person .present{border:0;background:transparent;padding:6px;font-size:17px}.gift-promo{margin:12px;padding:18px;background:linear-gradient(125deg,#ecf3f9,#e4edf5);border:1px solid #d6e2ec;border-radius:10px;position:relative}.gift-promo>div{font-size:9px;letter-spacing:1.6px;color:#7891a5}.gift-promo h3{font:23px/1.15 Georgia;margin:10px 0}.gift-promo>span{display:block;font-size:26px;position:absolute;right:15px;top:51px;max-width:65px;line-height:1.7;transform:rotate(-12deg)}.gift-promo button{margin-top:10px;font-size:11px;background:#fff}.side-footer{text-align:center;font-size:9px;color:#8296a6;padding:8px 6px 15px;letter-spacing:.5px}.side-footer span{margin:0 5px}dialog{border:1px solid #cfdae4;border-radius:17px;padding:28px;color:var(--ink);box-shadow:0 25px 100px #162f4a40;max-height:90dvh;max-width:95vw}dialog::backdrop{background:#152d45a3;backdrop-filter:blur(5px)}#authDialog[open]{padding:0;display:grid;grid-template-columns:1fr 1fr;width:800px}.auth-art{background:linear-gradient(155deg,#eff6fb,#d8e7f2);padding:42px 32px;display:flex;flex-direction:column;justify-content:center}.auth-art .logo{margin-bottom:38px}.auth-art h2{font:35px/1.25 Georgia;margin:14px 0}.auth-art p{color:#788fa1;font-size:12px;line-height:1.9}.auth-bubbles{font-size:28px;margin-top:32px}.auth-form{padding:35px}.auth-form h2{font:24px Georgia}.muted{color:var(--muted);font-size:12px}.auth-form form{margin-top:25px}.auth-form label{display:block;font-size:11px;font-weight:bold;margin-bottom:15px}.auth-form input{margin-top:7px;font-weight:normal}.auth-form button{width:100%;margin:5px 0;font-size:12px}.auth-form small{display:block;text-align:center;font-size:10px;color:var(--muted);margin-top:14px}.divider{text-align:center;font-size:9px;color:var(--muted);margin:16px 0}.error{color:#b14444;font-size:12px}.close{float:right;border:0;background:none;font-size:24px;padding:0 5px}#panelDialog{width:600px}#panelContent h2{font:27px Georgia;margin:0 30px 8px 0}#panelContent h3{font-size:13px;margin-top:23px}.panel-actions{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.panel-actions button{font-size:12px}.gift-grid,.pack-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.gift-grid button{background:#fffaf0;padding:17px 8px;border-color:#ecdfc5}.gift-grid span{display:block;font-size:35px;margin-bottom:5px}.gift-grid small,.pack-grid small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.pack-grid strong{display:block;font-size:24px;color:#916a2b}.wallet-total{font:40px Georgia;color:#a07836;margin-top:16px}.ledger-row,.admin-row{display:flex;gap:10px;justify-content:space-between;border-bottom:1px solid var(--line);padding:12px 0;font-size:12px;align-items:center;flex-wrap:wrap}.admin-row button{padding:5px 8px;font-size:10px}.admin-row .actions{display:flex;gap:4px;flex-wrap:wrap}#emojiPicker{display:flex;flex-wrap:wrap;gap:3px;padding:8px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px}#emojiPicker button{font-size:22px;background:none;border:0;padding:4px}.danger{background:#b84c56;color:white;border-color:#b84c56}#callPanel{position:fixed;bottom:24px;right:25px;width:430px;max-width:calc(100vw - 30px);background:#16334a;border:1px solid #466277;z-index:8;border-radius:15px;padding:15px;color:white;box-shadow:0 15px 65px #19354e55}.call-top{display:flex;justify-content:space-between;padding-bottom:12px;font-size:12px}.call-top span{color:#a4c4d9}.videos{position:relative;min-height:130px;background:#10293b;border-radius:10px;overflow:hidden}#remoteVideo{display:block;width:100%;max-height:280px}#localVideo{position:absolute;right:10px;bottom:10px;width:100px;border-radius:7px;background:#1e415a}.call-actions{display:flex;justify-content:center;gap:6px;margin-top:12px}.call-actions button{font-size:11px;padding:8px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#203d55;color:white;z-index:20;padding:13px 22px;border-radius:10px;max-width:90vw;font-size:12px;box-shadow:0 8px 30px #18384f33}.dark{--panel:#1b3041;--ink:#d5e2ec;--muted:#a3b3c0;--line:#3e5669;--bg:#122637;--soft:#213b4f}.dark header,.dark .room-header,.dark aside,.dark .bubble,.dark .person,.dark .gift-promo,.dark #messages,.dark button,.dark .welcome,.dark .room-btn.active,.dark textarea{background:#213b4f;color:var(--ink)}.dark dialog{background:#1b3041}.dark .auth-art{background:#213b4f}.dark .primary{background:#28669b}.dark .bubble.gift{background:#544629}.dark .auth-form input,.dark .side-search input{background:#122637}.dark .gift-grid button{background:#544629}.dark .room-icon{background:#1b3041}.dark .rail-note{color:#a3b3c0}@keyframes arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1600px){.app{grid-template-columns:230px minmax(300px,1fr) 340px;padding:20px;gap:20px}.room-header{padding:30px}.welcome{margin:22px}.gift-promo{padding:25px}}@media(max-width:1100px){.app{grid-template-columns:160px minmax(280px,1fr) 240px;gap:10px;padding:10px}.brand{font-size:17px}.rail-note{display:none}.tools-right{display:none}.welcome button{display:none}.room-header{padding:20px}.rail-bottom{margin-top:auto}.tools button span{display:none}.side-tabs button{padding:12px 5px}}@media(max-width:760px){header{height:66px;padding:0 12px}.brand{font-size:15px;letter-spacing:1px}.brand small{font-size:7px;letter-spacing:1px}.logo{width:34px;height:34px;line-height:34px;font-size:24px}.header-right{gap:5px}.header-right button{padding:7px;font-size:10px}.status{display:none}#logoutButton{display:none}.app{height:calc(100dvh - 66px);grid-template-columns:minmax(0,1fr) 175px;grid-template-rows:auto minmax(0,1fr);gap:7px;padding:7px}.rail{grid-column:1/-1;flex-direction:row;padding:0;overflow-x:auto}.rail-label,.rail-note,.rail-bottom{display:none}#roomList{display:flex;gap:5px}.room-btn{white-space:nowrap;padding:7px 10px;margin:0;font-size:11px}.room-btn small,.room-btn .symbol{display:none}.rail #adminButton{font-size:10px;white-space:nowrap;margin-left:5px}.room-header{padding:14px}.room-header h1{font-size:25px}.room-header .eyebrow{font-size:8px}.room-header p{font-size:10px}.room-icon{display:none}.welcome{display:none}.conversation-head{padding:10px;font-size:10px}.conversation-head span{display:none}#messages{padding:15px 10px}.message{gap:6px}.message .avatar{width:26px;height:26px;border-radius:8px;font-size:11px}.message-meta{font-size:10px;flex-wrap:wrap;gap:4px}.message-meta time{font-size:8px}.message-content{max-width:calc(100% - 32px)}.bubble{padding:8px;font-size:12px}.composer{padding:8px}.composer-footer{font-size:8px}.composer-footer span:first-child{display:none}#messageForm{gap:5px}#sendButton{font-size:10px;padding:9px}.tools{gap:0}.tools button{padding:4px 8px}textarea{min-height:60px;padding:8px;font-size:12px}.side-tabs{padding:3px 3px 0}.side-tabs button{font-size:9px;padding:12px 3px}.side-tabs span{display:none}.side-search{padding:9px}.side-search input{padding:7px;font-size:10px}#userList{padding:0 7px}.person{padding:8px 6px;gap:6px}.person .avatar{width:27px;height:27px;font-size:11px;border-radius:8px}.person-info b{font-size:10px}.person-info small{font-size:8px}.person .present{display:none}.gift-promo{padding:12px;margin:7px}.gift-promo h3{font-size:19px}.gift-promo>span{display:none}.gift-promo>div{font-size:7px}.gift-promo button{font-size:9px;padding:8px}.side-footer{font-size:7px}.auth-art{display:none}#authDialog[open]{display:block;width:390px}.auth-form{padding:25px}.pack-grid,.gift-grid{grid-template-columns:repeat(2,1fr)}#panelDialog{padding:22px}.bubble iframe{max-width:100%}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}