:root{--gold:#cfa456;--gold-dark:#a97b2d;--green:#1d4335;--green-2:#285646;--dark:#17251f;--line:#e4e9e6;--bg:#f3f7f5}
*{box-sizing:border-box}body{margin:0;font-family:Tahoma,Arial,sans-serif;background:var(--bg);color:var(--dark)}
button,input,textarea{font:inherit}.center{max-width:390px;margin:8vh auto;text-align:center}.card{background:#fff;padding:32px;border-radius:20px;box-shadow:0 12px 50px #0001}
.logo{width:150px;height:100px;object-fit:contain}.card input,.card button{width:100%;padding:13px;margin:6px 0;border:1px solid var(--line);border-radius:10px}.card button,#composer button,#newRoom,#settingsBtn,#resetBtn,#adminBtn{background:var(--gold);color:#fff;border:0;cursor:pointer}.error{color:#b3261e;margin-top:10px}
main{display:grid;grid-template-columns:330px 1fr;height:100vh}aside{background:#fff;border-left:1px solid var(--line);padding:15px;overflow:auto}aside header{display:flex;align-items:center;gap:10px;font-size:20px}aside header img{width:54px;height:45px;object-fit:contain}
aside input{width:100%;padding:11px;border:1px solid var(--line);border-radius:12px;margin:14px 0}.room{padding:13px;border-bottom:1px solid var(--line);cursor:pointer}.room:hover,.room.active{background:#f5ead5;border-radius:12px}.room small{display:block;color:#777;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-title{display:flex;justify-content:space-between;align-items:center;margin:13px 5px 7px;color:#777;font-size:12px;font-weight:bold}.side-title small{display:grid;place-items:center;min-width:23px;height:23px;border-radius:20px;background:#f2e7d2;color:#9a6d20}.user-card{display:flex;align-items:center;width:100%;gap:10px;padding:9px 8px;border:0;border-radius:13px;background:transparent;text-align:right;cursor:pointer;transition:.18s}.user-card:hover{background:#f8f2e7;transform:translateX(-2px)}.avatar{position:relative;display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:13px;background:linear-gradient(135deg,#d0ad6b,#a97b29);color:#fff;font-weight:bold}.avatar i{position:absolute;left:-1px;bottom:-1px;width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#aaa}.avatar i.online{background:#22a06b}.avatar.small{flex-basis:34px;height:34px;border-radius:11px}.user-info{min-width:0;flex:1}.user-info b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-info small{display:block;margin-top:4px;color:#888;font-size:11px}.chat-arrow{font-size:23px;color:#b5a58a}
#newRoom,#settingsBtn,#resetBtn,#adminBtn{width:100%;padding:11px;border-radius:10px;margin-top:10px}section{display:grid;grid-template-rows:64px 1fr 24px auto auto;min-width:0}section>header{background:#fff;padding:20px;font-weight:bold;border-bottom:1px solid var(--line)}
#messages{padding:22px;overflow:auto}.msg{max-width:72%;background:#fff;border-radius:16px 16px 4px 16px;padding:10px 14px;margin:8px 0;box-shadow:0 2px 8px #0000000d}.msg.mine{margin-right:auto;background:#f0ddb8}.msg small{color:#777}.msg .meta{display:flex;gap:8px;justify-content:flex-end;font-size:11px;margin-top:6px}
#typing{padding:0 22px;color:#777;font-size:12px}#composer{display:flex;gap:9px;padding:12px;background:#fff;border-top:1px solid var(--line)}#composer textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:12px;padding:10px;height:48px}#composer button{border-radius:12px;padding:0 20px}.attach{font-size:25px;cursor:pointer;padding:8px}
dialog{border:1px solid #eee8dc;border-radius:24px;width:min(92vw,680px);padding:0;overflow:hidden;box-shadow:0 28px 90px #20252b40;background:linear-gradient(145deg,#fff 0%,#fdfbf7 100%)}dialog::backdrop{background:#20252b73;backdrop-filter:blur(5px)}dialog>form[method="dialog"]{position:absolute;left:18px;top:16px;z-index:2}.close{display:grid;place-items:center;width:38px;height:38px;border:1px solid #e9e2d5;border-radius:50%;background:#fff;color:#5e6165;font-size:24px;cursor:pointer;transition:.2s}.close:hover{color:#fff;background:var(--gold);transform:rotate(90deg)}
#modalBody{padding:34px 38px 30px}.modal-heading{display:flex;align-items:center;gap:14px;padding-left:48px;margin-bottom:28px}.modal-heading h3{margin:0 0 6px;font-size:22px}.modal-heading p{margin:0;color:#777;font-size:13px}.modal-icon{display:grid;place-items:center;flex:0 0 48px;height:48px;border-radius:15px;background:linear-gradient(135deg,#c69a47,#9f7425);color:#fff;font-size:28px;box-shadow:0 9px 24px #b98b3445}
.admin-form .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.admin-form label>span:first-child{display:block;margin:0 3px 8px;font-size:13px;font-weight:bold;color:#45484c}.admin-form label.full{grid-column:1/-1}.admin-form input,.admin-form select{width:100%;height:48px;padding:0 14px;border:1px solid #ddd6ca;border-radius:13px;background:#fff;color:var(--dark);outline:none;transition:.2s}.admin-form input:focus,.admin-form select:focus{border-color:var(--gold);box-shadow:0 0 0 4px #b98b3418}.admin-form input::placeholder{color:#aaa}
.admin-switch{display:flex;align-items:center;gap:12px;margin-top:20px;padding:14px 16px;border:1px solid #e8e1d4;border-radius:15px;background:#faf7f1;cursor:pointer}.admin-switch>input{position:absolute;opacity:0;pointer-events:none}.admin-switch .switch-ui{position:relative;display:block!important;flex:0 0 44px;width:44px;height:24px;margin:0!important;border-radius:20px;background:#cbc5bb;transition:.2s}.admin-switch .switch-ui:after{content:"";position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 5px #0003;transition:.2s}.admin-switch>input:checked+.switch-ui{background:var(--gold)}.admin-switch>input:checked+.switch-ui:after{right:23px}.admin-switch b{display:block;font-size:13px}.admin-switch small{display:block;margin-top:4px;color:#7c7c7c;font-size:11px}
.form-actions{display:flex;justify-content:flex-start;gap:10px;margin-top:25px;padding-top:20px;border-top:1px solid #eee8dc}.form-actions button{min-width:120px;padding:12px 18px;border-radius:12px;cursor:pointer;font-weight:bold}.form-actions .primary{border:0;background:linear-gradient(135deg,#c0933d,#a87924);color:#fff;box-shadow:0 8px 20px #b98b3435}.form-actions .secondary{border:1px solid #ddd5c8;background:#fff;color:#666}
.member-title{margin:22px 3px 9px;font-size:13px;font-weight:bold}.member-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:280px;padding:6px;overflow:auto;border:1px solid #e8e1d4;border-radius:15px;background:#faf8f4}.member-option{display:flex;align-items:center;gap:9px;padding:9px;border-radius:12px;background:#fff;cursor:pointer}.member-option:hover{background:#f5ead5}.member-option>input{width:18px;height:18px;accent-color:var(--gold)}.member-option b,.member-option small{display:block}.member-option b{font-size:12px}.member-option small{margin-top:3px;color:#888;font-size:10px}.empty{grid-column:1/-1;text-align:center;color:#888}
.muted-field{opacity:.45}.muted-field input{background:#eee!important}
@media(max-width:700px){main{grid-template-columns:110px 1fr}aside header b,aside input,.room small,.user-info,.chat-arrow,.side-title span{display:none}.side-title{justify-content:center}.user-card{justify-content:center}.msg{max-width:90%}#modalBody{padding:28px 20px 22px}.admin-form .form-grid,.member-list{grid-template-columns:1fr}.admin-form label.full{grid-column:auto}.modal-heading{padding-left:42px}.form-actions button{flex:1;min-width:0}}

/* Horvash visual identity */
[hidden]{display:none!important}
body{background:radial-gradient(circle at 20% 15%,#e5eee9 0,transparent 34%),linear-gradient(135deg,#f7faf8,#edf3f0);color:var(--dark)}
#login{position:relative;width:min(92vw,430px);max-width:none;margin:7vh auto;padding:42px 42px 36px;border:1px solid #fff;border-radius:30px;background:#ffffffed;box-shadow:0 30px 90px #153c2e26;overflow:hidden}
#login:before{content:"";position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,var(--green),var(--gold),var(--green))}
#login .logo{width:220px;height:190px;margin:-18px auto 0;object-fit:contain}
#login h1{margin:2px 0 7px;color:var(--green);font-size:25px}
#login p{margin:0 0 23px;color:#718078;font-size:13px}
#login input{height:52px;margin:7px 0;padding:0 17px;border:1px solid #dbe5e0;border-radius:14px;background:#f8fbf9;transition:.2s}
#login input:focus{border-color:var(--green-2);outline:none;box-shadow:0 0 0 4px #1d433513;background:#fff}
#login button{height:52px;margin-top:14px;border-radius:14px;background:linear-gradient(135deg,var(--green),var(--green-2));box-shadow:0 12px 26px #1d43352e;font-weight:bold}

main{background:#edf3f0}
aside{padding:18px;background:linear-gradient(180deg,#173b2f 0%,#214b3c 100%);border-left:0;box-shadow:-8px 0 30px #173b2f18;color:#fff}
aside header{padding:4px 5px 14px;border-bottom:1px solid #ffffff1c;color:#fff}
aside header img{width:66px;height:58px;padding:0;border-radius:0;background:transparent;object-fit:contain}
.logo,aside header img{filter:sepia(1) saturate(1.7) hue-rotate(350deg) brightness(1.08) contrast(1.08) drop-shadow(0 2px 0 #6c4714) drop-shadow(0 5px 8px #0006)}
aside input{border-color:#ffffff1e;background:#ffffff12;color:#fff}
aside input::placeholder{color:#c6d3cd}
.side-title{color:#b9c9c2}.side-title small{background:#cfa45626;color:#f1ca80}
.user-card{color:#fff}.user-card:hover{background:#ffffff12}.avatar{background:linear-gradient(135deg,var(--gold),var(--gold-dark));box-shadow:0 5px 15px #0002}.avatar i{border-color:#214b3c}.user-info small{color:#b8c7c1}.chat-arrow{color:#d8bd86}
.room{border-bottom-color:#ffffff14;color:#fff}.room small{color:#b8c7c1}.room:hover,.room.active{background:#ffffff16;color:#fff}
#newRoom,#settingsBtn,#resetBtn,#adminBtn{border:1px solid #ddb76b;background:linear-gradient(135deg,var(--gold),#b68635);box-shadow:0 8px 20px #0002;font-weight:bold}
section{background:radial-gradient(circle at 50% 20%,#f9fbfa,#edf3f0)}
section>header{background:#ffffffed;border-bottom-color:#dfe8e3;color:var(--green);box-shadow:0 4px 18px #1d43350b}
#messages{background-image:linear-gradient(#ffffff45,#ffffff45),radial-gradient(#1d433508 1px,transparent 1px);background-size:auto,22px 22px}
.msg{border:1px solid #e2eae6;box-shadow:0 4px 14px #173b2f0d}.msg.mine{background:#dce9e2;border-color:#cfe0d7}.msg b{color:var(--green)}
#composer{border-top-color:#dfe8e3;box-shadow:0 -5px 22px #173b2f0b}#composer textarea{border-color:#d8e3dd;background:#f8fbf9}#composer textarea:focus{outline:none;border-color:var(--green-2);box-shadow:0 0 0 3px #1d433510}#composer button{background:linear-gradient(135deg,var(--green),var(--green-2));font-weight:bold}
dialog{border-color:#dfe7e2;background:linear-gradient(145deg,#fff,#f6faf8)}dialog::backdrop{background:#102d2378}.modal-icon{background:linear-gradient(135deg,var(--green),var(--green-2));box-shadow:0 9px 24px #1d433535}.admin-form input:focus,.admin-form select:focus{border-color:var(--green-2);box-shadow:0 0 0 4px #1d433512}.form-actions .primary{background:linear-gradient(135deg,var(--green),var(--green-2));box-shadow:0 8px 20px #1d43352b}.admin-switch>input:checked+.switch-ui{background:var(--green)}
.avatar img,.msg-avatar img{width:100%;height:100%;border-radius:inherit;object-fit:cover}.message-row{display:flex;align-items:flex-end;gap:8px}.message-row.mine{flex-direction:row-reverse}.message-row .msg{margin-bottom:8px}.msg-avatar{display:grid;place-items:center;flex:0 0 34px;height:34px;margin-bottom:9px;border-radius:11px;background:linear-gradient(135deg,var(--gold),var(--gold-dark));color:#fff;font-size:12px;font-weight:bold;overflow:hidden}
.upload-box{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:150px;padding:22px;border:2px dashed #cbdad2;border-radius:18px;background:#f7faf8;text-align:center;cursor:pointer}.upload-box:hover{border-color:var(--green-2);background:#f1f7f4}.upload-box input{width:auto;height:auto;margin-top:14px}.upload-box small{margin-top:7px;color:#7d8983}.upload-icon{display:block!important;margin:0 0 8px!important;font-size:34px}.avatar-preview{text-align:center}.avatar-preview img{width:110px;height:110px;margin-top:18px;border:4px solid #fff;border-radius:28px;object-fit:cover;box-shadow:0 10px 30px #1d433526}
.reply-quote{margin:0 0 8px;padding:7px 10px;border-right:3px solid var(--gold);border-radius:8px;background:#1d43350a;font-size:11px}.reply-quote b,.reply-quote span{display:block}.reply-quote span{margin-top:3px;color:#69766f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reply-btn{border:0;background:transparent;color:var(--green-2);cursor:pointer;font-size:11px}.ticks{direction:ltr;color:#8a948f;font-weight:bold}.ticks.read{color:#138a63}#replyBar{display:flex;align-items:center;justify-content:space-between;padding:8px 18px;border-top:1px solid #dfe8e3;background:#eef5f1;color:var(--green);font-size:12px}#replyBar button{width:28px;height:28px;border:0;border-radius:50%;background:#fff;color:#666;cursor:pointer}
.download-box{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid #ffffff1c}.download-box>span{display:block;width:100%;margin-bottom:1px;color:#d9c59c;font-size:11px}.download-box .platform-download{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;width:calc(50% - 4px);height:64px;padding:7px;border:1px solid #cfa35455;border-radius:14px;background:linear-gradient(145deg,#ffffff18,#0000001f);color:#fff;cursor:pointer;box-shadow:inset 0 1px #ffffff20,0 5px 12px #0003;transition:.2s transform,.2s border-color,.2s background}.download-box .platform-download+button{margin-right:0}.download-box .platform-download:hover{transform:translateY(-2px);border-color:#d7ab5d;background:linear-gradient(145deg,#ffffff25,#00000028)}.platform-download svg{width:30px;height:30px;filter:drop-shadow(0 2px 3px #0006)}.platform-download small{font:700 10px Arial,sans-serif;letter-spacing:.3px}.platform-download.android svg{fill:#a4c639}.platform-download.windows svg{fill:#39a9f0}
#mobileBack{display:none}

@media(max-width:700px){
  html,body{height:100%;overflow:hidden}
  main{display:block;position:relative;width:100%;height:100dvh;overflow:hidden}
  main aside{display:block;width:100%;height:100dvh;padding:14px 14px 24px;border:0;overflow-y:auto}
  main section{display:none;width:100%;height:100dvh;grid-template-rows:58px 1fr 22px auto auto}
  main.chat-open aside{display:none}
  main.chat-open section{display:grid}
  aside header b,aside input,.room small,.user-info,.chat-arrow,.side-title span{display:block}
  aside header{position:sticky;top:-14px;z-index:5;margin:-14px -14px 8px;padding:14px;background:#173b2ff2;backdrop-filter:blur(10px)}
  aside input{height:46px}
  .side-title{justify-content:space-between;margin-top:17px}.user-card{justify-content:flex-start;min-height:58px}.user-info{display:block}.room{min-height:58px;padding:12px}
  #newRoom,#settingsBtn,#resetBtn,#adminBtn{min-height:46px}
  section>header{display:flex;align-items:center;gap:10px;padding:10px 12px;font-size:15px}
  #mobileBack{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:0;border-radius:12px;background:#e8f0ec;color:var(--green);font-size:30px;line-height:1}
  #messages{padding:13px 10px}.message-row{gap:6px}.message-row .msg{max-width:82%;padding:9px 11px;border-radius:15px}.msg-avatar{flex-basis:30px;height:30px}
  #composer{gap:6px;padding:8px calc(8px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(8px + env(safe-area-inset-left))}
  #composer textarea{height:44px;padding:9px;font-size:14px}#composer button{min-width:62px;padding:0 12px}.attach{padding:7px 3px;font-size:23px}
  #replyBar{padding:7px 12px}
  dialog{width:calc(100vw - 20px);max-height:92dvh;border-radius:20px}#modalBody{max-height:88dvh;padding:25px 16px 18px;overflow-y:auto}.modal-heading{padding-left:38px}.modal-heading h3{font-size:19px}.modal-icon{flex-basis:42px;height:42px}
  .admin-form .form-grid,.member-list{grid-template-columns:1fr}.member-list{max-height:38dvh}.form-actions{position:sticky;bottom:-18px;padding:13px 0 3px;background:#f8fbf9}
  #login{margin:3vh auto;padding:25px 24px 24px}#login .logo{width:185px;height:155px}
}
