/* Shared visual language with Android ChatStyle; loaded after legacy rules. */
:root{color-scheme:dark;--ink:#030c1e;--cyan:#2dd3ff;--muted:#91aee0;--line:#2456a0}
body{background:radial-gradient(ellipse at top left,#0b2b63,transparent 65%),linear-gradient(135deg,#06142e,#030c1e 65%,#041843);background-attachment:fixed;color:#ebf3ff;font:15px/1.45 system-ui,sans-serif}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url("theme-waves.svg") center 80%/100% auto no-repeat;opacity:.4}
main{max-width:1320px;padding:18px 24px;margin:auto}header{gap:16px;min-height:76px}header h1{display:flex;align-items:center;gap:10px;margin:0;font-size:30px;letter-spacing:-.5px;white-space:nowrap}header h1 svg{width:34px;height:34px;color:var(--cyan)}
.web-icon{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.header-account{display:flex;align-items:center;gap:14px;margin-left:auto}.avatar{display:inline-flex;align-items:center;justify-content:center;flex:none;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,#9c52ff,#4e29e8);border:1px solid #b17eff;color:#ebf3ff;font-weight:750;font-size:21px}.header-account button{width:48px;height:48px;padding:11px}.header-account #settings{margin:0}
#toolbar{display:flex;gap:6px;align-items:center}#toolbar button{font-size:12px;padding:8px 10px}#status{min-height:0;margin:4px 0;color:#ffcb70}#status:not(:empty){padding:8px 12px;border-radius:12px;background:#101f39}
button{background:linear-gradient(135deg,#112b55,#071831);border:1px solid var(--line);border-radius:13px;transition:background .15s,border-color .15s}button:hover:not(:disabled){border-color:var(--cyan)}button.primary,button.active{background:linear-gradient(135deg,#008cff,#0045b5);border-color:#2dd3ff}button.danger{background:linear-gradient(135deg,#ff1747,#c60024);border-color:#ff4268}input,select{background:#1c293d;border:1px solid #435570;border-radius:13px;padding:11px}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.panel{background:linear-gradient(145deg,#0b2145dd,#041127ed);border:1px solid #254b7d;border-radius:22px;padding:16px}#layout{max-width:none;grid-template-columns:260px minmax(0,1fr);gap:18px}.sidebar,.chat{height:calc(100dvh - 124px);min-height:440px}.sidebar{background:#061630b8}.sidebar>.heading{padding-bottom:12px}.sidebar h2{font-size:18px}.tabs{gap:7px}.tabs button{background:#091e3f;text-align:left;font-size:14px;padding:12px 14px}.list button{border-radius:14px;background:linear-gradient(135deg,#102b54,#07172f);padding:13px;margin-bottom:8px}.settings{border-top:1px solid #25456b;margin-top:12px;padding-top:12px}.settings p:empty{display:none}#accountName{color:#ebf3ff;font-weight:650}#userCode{color:var(--muted)}
.chat{padding:0;background:transparent;border:0;gap:0}.chat>.heading{min-height:70px;gap:10px;padding:0 4px 12px}.chat>.heading #roomTitle{margin:0 auto 0 0;font-size:22px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat>.heading button{width:46px;height:46px;flex:none;display:flex;align-items:center;justify-content:center;padding:10px}.chat>.heading #voiceCall,.chat>.heading #videoCall{background:linear-gradient(135deg,#1662c8,#008c76);border:1px solid #259bb9;opacity:1;cursor:pointer}.chat>.heading button:disabled{opacity:.4;cursor:not-allowed}#sidebarToggle{display:none}
#messages{background:#030919;border:1px solid #425b81;border-radius:24px;padding:22px 40px 26px;gap:26px;scrollbar-width:thin;scrollbar-color:#2456a0 transparent}.message{max-width:85%;min-width:110px;margin:0;padding:12px 14px 17px;border:1px solid #414b70;border-radius:24px;background:linear-gradient(135deg,#252e49,#1a253c);font-size:15px;box-shadow:none}.message.own{background:linear-gradient(135deg,#0e438f,#062452);border-color:#008cff;border-radius:24px}.message::before,.message::after{display:none}.message small,.message.own small{text-align:left;color:var(--muted);font-size:11px;margin-bottom:8px}.message-body{line-height:1.5}.message img{max-height:400px;margin:8px 0 0;border-radius:8px;object-fit:contain}.message video{max-height:400px;border-radius:10px}.message audio{width:310px;border-radius:20px}.message a{color:var(--cyan)}.message .message-menu{right:-31px;width:28px;height:36px;font-size:23px;color:#ebf3ff}.message.own .message-menu{left:-31px}.message-footer{bottom:-12px;left:14px;right:14px}.message-footer .message-emoji{font-size:22px;width:28px;height:28px;line-height:28px}.message-footer .message-receipt{font-size:16px;line-height:24px}.message-footer .reaction{border-radius:18px;background:#061a38;border-color:#008cff;font-size:13px;padding:2px 8px}.message-footer .reaction.mine{background:#073b7b}
#sendForm{padding:8px;margin-top:8px;gap:8px;border-radius:24px;border:1px solid #2456a0;background:#071c3a;flex-shrink:0}#text{height:48px;border-radius:17px;background:#1e293b;padding:12px 14px;font-size:16px}#attachButton,#emojiCompose,#sendButton,#recordButton{height:48px;min-width:48px;display:flex;align-items:center;justify-content:center;padding:10px;border-radius:16px}#attachButton{font-size:30px}#sendButton{border-radius:50%;width:48px;min-width:48px;font-size:0}#sendButton::after{content:"";display:block;width:24px;height:24px;background:currentColor;clip-path:polygon(4% 4%,96% 50%,4% 96%,21% 56%,66% 50%,21% 44%)}#sendButton.recording::after{clip-path:inset(12% round 3px)}#sendButton:has(.web-icon)::after{display:none}#emojiCompose{font-size:23px}.share-options{padding:7px 10px;color:var(--muted);gap:8px}.share-options label,.share-options small{font-size:10px}.share-options select{padding:3px 6px}.share-options progress{accent-color:var(--cyan)}
dialog{background:linear-gradient(145deg,#102b55,#041127);color:#ebf3ff;border:1px solid #2456a0;border-radius:24px;padding:22px;box-shadow:0 24px 80px #0008}dialog::backdrop{background:#010716b8;backdrop-filter:blur(5px)}dialog h2{font-size:21px}.message-popover{border-radius:18px;border:1px solid #008cff;background:linear-gradient(135deg,#08275b,#031127);padding:10px;gap:6px;box-shadow:0 10px 35px #0008}.message-popover[aria-label="Mesaja tepki ver"],.message-popover[aria-label="Emoji ekle"]{display:grid;grid-template-columns:repeat(4,1fr);max-width:280px}.message-popover[aria-label="Mesaja tepki ver"] button,.message-popover[aria-label="Emoji ekle"] button{border:1px solid #163d70;border-radius:12px;width:50px;height:48px;font-size:28px;padding:4px;background:#06152f}.message-popover button:hover{background:#0755a1}.link-preview{background:#071c3b;border-color:#2456a0;border-radius:15px}#login{margin:45px auto;max-width:460px;padding:26px}#login h2{font-size:24px}#attachmentTray{border-radius:18px;background:#0b2145}
@media(max-width:900px){main{padding:10px 12px}#layout{grid-template-columns:215px minmax(0,1fr);gap:12px}header h1{font-size:25px}#toolbar button{font-size:10px;padding:7px}.header-account{gap:9px}#messages{padding-left:34px;padding-right:34px}.message{max-width:92%}}
@media(max-width:650px){main{padding:8px 5px;height:100dvh;display:flex;flex-direction:column;padding-bottom:max(5px,env(safe-area-inset-bottom))}header{flex-wrap:wrap;min-height:64px;gap:8px;padding:0 7px}header h1{font-size:26px;gap:7px}header h1 svg{width:29px;height:29px}.header-account{order:1;margin-left:auto}.header-account .avatar{width:40px;height:40px;font-size:19px}.header-account button{width:44px;height:44px}#toolbar{order:2;width:100%;justify-content:flex-end}#toolbar button{font-size:10px;padding:4px 8px}#app{flex:1;min-height:0;display:flex;flex-direction:column}#layout{display:flex;position:relative;flex:1;min-height:0;width:100%;gap:0}.sidebar{display:none;position:absolute;inset:68px 0 0;z-index:20;width:min(310px,calc(100% - 35px));height:auto;min-height:0;box-shadow:20px 0 40px #0009;background:linear-gradient(135deg,#0b2858,#041127);border-radius:20px}.sidebar-open .sidebar{display:flex}.chat{width:100%;height:100%;min-height:0}.chat>.heading{min-height:68px;padding:5px 7px 9px;gap:9px}.chat>.heading #roomTitle{font-size:20px}.chat>.heading .avatar{width:40px;height:40px;font-size:20px}.chat>.heading button{width:43px;height:43px}#sidebarToggle{display:flex}#messages{padding:20px 33px 25px 30px;border-radius:22px;gap:25px}.message{max-width:100%;margin:0;min-width:65px;padding:11px 12px 16px;font-size:15px;border-radius:22px}.message.own{border-radius:22px}.message img,.message video{max-height:55dvh}.message small{font-size:10px}.message audio{width:240px}#sendForm{margin-top:4px;gap:5px;padding:5px;border-radius:22px}#text{font-size:16px;height:46px;min-width:0;width:0}#attachButton,#emojiCompose,#sendButton,#recordButton{height:44px;min-width:40px;padding:8px}#sendButton{width:44px;min-width:44px}.share-options{padding:4px 8px;gap:5px}#shareLimits{font-size:9px}#login{width:calc(100% - 16px);margin:24px auto}dialog{padding:16px}.sidebar .list{min-height:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Mavi Sohbet supplied branding; layout and handlers remain intact. */
.mavi-brand-icon{width:44px;height:44px;object-fit:contain;flex:none;border-radius:50%}main>header h1{display:flex;align-items:center;gap:10px}
