:root{--bg:#06111f;--panel:#0b192d;--panel2:#101f37;--line:#263d61;--text:#f7f9ff;--muted:#9eb0d4;--purple:#7b34ff;--purple2:#9a4dff;--green:#2ed16f;--danger:#ff5c75;--owner:#ffbd3c;--admin:#9f72ff;--bot:#6f94ff}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(circle at 40% 0,#122643 0,#07111f 44%,#050b14 100%);color:var(--text)}button,input,textarea,select{font:inherit;color:inherit}.hidden{display:none!important}.app-shell{min-height:100vh;padding:28px;display:flex;justify-content:center}.chat-card{width:min(860px,100%);min-height:calc(100vh - 56px);border:2px solid #243b61;border-radius:22px;background:linear-gradient(180deg,rgba(9,23,42,.98),rgba(6,18,33,.98));box-shadow:0 28px 80px #0007;display:flex;flex-direction:column;overflow:hidden}.topbar{display:flex;align-items:center;gap:14px;padding:20px 22px}.brand-icon{width:52px;height:45px;border-radius:18px 18px 18px 6px;background:linear-gradient(135deg,#a25cff,#6122ec);display:grid;place-items:center;font-weight:900;letter-spacing:3px}.topbar h1{margin:0;font-size:28px}.connection{color:var(--muted);font-size:13px;margin-top:3px}.connection span:first-child{display:inline-block;width:9px;height:9px;border-radius:50%;background:#63718b;margin-right:7px}.connection.online span:first-child{background:var(--green)}.top-actions{margin-left:auto;display:flex;gap:8px}.ghost,.outline-btn{background:#101b31;border:1px solid #6f43c9;border-radius:10px;padding:10px 14px;cursor:pointer}.quick-row{display:flex;gap:10px;overflow-x:auto;padding:0 20px 14px;scrollbar-width:thin}.quick{flex:0 0 auto;min-width:150px;padding:13px 16px;border:1px solid #7645e8;border-radius:10px;background:#111b32;cursor:pointer;font-weight:700}.quick.primary,.primary-btn,.send-btn{background:linear-gradient(135deg,var(--purple),var(--purple2));border:0}.notice{margin:0 20px 6px;padding:10px 14px;border:1px solid #283e61;border-radius:9px;background:#13233b;color:#b7c4e4;text-align:center;font-size:13px}.chat-list{flex:1;min-height:360px;overflow:auto;padding:12px 20px 22px}.message{display:grid;grid-template-columns:48px 1fr auto;gap:12px;margin:16px 0;align-items:start}.avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#6840d8,#913cff);border:1px solid #a174ff;font-weight:700}.avatar.owner{background:linear-gradient(135deg,#6b4608,#ae7714);border-color:#f7b638}.avatar.bot{background:linear-gradient(135deg,#dfe9ff,#92aaff);color:#1e2358}.message-head{display:flex;align-items:center;gap:8px;margin:2px 0 6px}.message-name{font-weight:700}.badge{font-size:11px;font-weight:800;padding:3px 8px;border-radius:6px;background:#33496f}.badge.owner{background:var(--owner);color:#211400}.badge.admin{background:var(--admin);color:#17072b}.badge.bot{background:var(--bot);color:#06152f}.message-time{color:#8195ba;font-size:12px;padding-top:6px}.bubble{display:inline-block;max-width:min(610px,100%);padding:11px 14px;border:1px solid #293f62;border-radius:6px 14px 14px 14px;background:#142641;line-height:1.45;overflow-wrap:anywhere}.bubble img{display:block;max-width:100%;max-height:360px;border-radius:9px;margin-bottom:9px}.bubble audio{width:min(360px,100%)}.bubble a{color:#bb9cff}.load-older{margin:0 auto 12px;background:transparent;border:1px solid #2b4268;color:var(--muted);border-radius:9px;padding:8px 14px;cursor:pointer}.composer-wrap{border-top:1px solid #203653;padding:14px 18px 18px;background:#091629}.guest-gate{text-align:center;border:1px solid #243c5d;border-radius:12px;padding:14px;background:#0d1a2e}.guest-gate>div{display:flex;gap:10px;justify-content:center;margin:12px 0}.primary-btn,.send-btn{border-radius:9px;padding:11px 18px;font-weight:750;cursor:pointer}.primary-btn{border:0}.guest-gate small,.owner-note,.send-state{color:var(--muted)}.composer{display:flex;gap:8px}.composer input{flex:1;min-width:0;border:1px solid #324b73;background:#101f35;border-radius:10px;padding:11px 13px}.icon-btn{width:44px;border:1px solid #7049ca;background:#17213b;border-radius:10px;cursor:pointer}.send-state{font-size:12px;margin-top:7px;min-height:17px}.form-error{color:#ff7b8f;margin-top:10px;min-height:20px}
.modal{position:fixed;z-index:9999;inset:0;background:#020711dc;display:grid;place-items:center;padding:18px}.modal-card{position:relative;width:min(1080px,96vw);max-height:92vh;overflow:auto;border:2px solid #2a4169;border-radius:20px;background:linear-gradient(180deg,#0b1a2f,#081526);box-shadow:0 30px 90px #000b;padding:22px}.small-card{width:min(430px,96vw)}.wide-card{height:min(760px,92vh)}.owner-card{width:min(1180px,96vw)}.modal-close{position:absolute;right:14px;top:10px;border:0;background:transparent;font-size:28px;cursor:pointer;color:#b9c8e8}.tabs{display:flex;gap:8px;margin-bottom:18px}.tabs button{flex:1;padding:11px;background:#12203a;border:1px solid #2f456a;border-radius:10px;cursor:pointer}.tabs button.active{background:linear-gradient(135deg,#6631d8,#9b46ff)}.stack{display:grid;gap:12px}.stack label,.rule-grid label{display:grid;gap:6px;color:#dce6ff;font-size:14px}.stack input,.rule-grid input,.rule-grid textarea,.rule-grid select,.inline-form input,.inline-form select,.test-row input{width:100%;background:#102039;border:1px solid #3a527b;border-radius:9px;padding:10px}.private-layout{height:100%;display:grid;grid-template-columns:300px 1fr;gap:16px}.private-layout aside{border-right:1px solid #213754;padding-right:14px;overflow:auto}.private-layout section{display:flex;flex-direction:column;min-width:0}.private-header{font-weight:800;padding:8px 0 14px}.private-messages{flex:1;overflow:auto;min-height:380px}.conversation-item,.admin-item{padding:11px;border:1px solid #263c5d;background:#0f1d33;border-radius:10px;margin:8px 0;cursor:pointer}.conversation-item.active{border-color:#804cff;background:#182346}.conversation-item small{color:var(--muted);display:block;margin-top:3px}.unread{float:right;background:#793dff;border-radius:12px;padding:2px 7px;font-size:11px}.panel-title{display:flex;align-items:center;gap:10px}.owner-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel-box{border:1px solid #2a4165;background:#0e1c32;border-radius:14px;padding:16px}.panel-box.full{grid-column:1/-1}.panel-box h3{margin-top:0}.inline-form{display:grid;grid-template-columns:1fr 180px auto;gap:8px}.chips-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.chip{display:flex;gap:8px;align-items:center;background:#6f32de;border:1px solid #9d6cff;border-radius:8px;padding:7px 10px}.chip button{border:0;background:transparent;cursor:pointer}.rule-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.rule-grid .full{grid-column:1/-1}.rule-grid .check{display:flex;align-items:center;gap:8px}.rule-grid .check input{width:auto}.action-row{display:flex;gap:10px}.rule-item{display:grid;grid-template-columns:1fr auto;gap:10px;border-top:1px solid #253b5d;padding:11px 0}.rule-item small{color:var(--muted)}.rule-item .actions{display:flex;gap:8px}.rule-item button{background:#192741;border:1px solid #54407e;border-radius:8px;padding:7px 10px;cursor:pointer}.test-row{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:12px}.test-row #rulePreview{grid-column:1/-1;border:1px dashed #3b537b;padding:10px;border-radius:8px;min-height:40px;color:#c4d2ee}.user-role-list{display:grid;gap:8px}.user-row{display:flex;justify-content:space-between;align-items:center;border:1px solid #263d60;border-radius:10px;padding:10px}.user-row select{background:#142440;border:1px solid #425f8e;border-radius:8px;padding:7px}.owner-note{text-align:center;padding-top:14px;font-size:12px}
@media(max-width:760px){.app-shell{padding:0}.chat-card{min-height:100dvh;border-radius:0;border-width:0}.topbar{padding:16px 14px}.topbar h1{font-size:22px}.top-actions .ghost{padding:8px;font-size:12px}.quick-row{padding-left:14px;padding-right:14px}.quick{min-width:132px;font-size:12px}.notice{margin:0 14px}.chat-list{padding:10px 14px 18px}.message{grid-template-columns:40px 1fr auto;gap:9px}.avatar{width:40px;height:40px}.message-time{font-size:10px}.composer-wrap{padding:10px}.private-layout{grid-template-columns:1fr}.private-layout aside{border-right:0;border-bottom:1px solid #213754;max-height:220px;padding-right:0}.owner-grid{grid-template-columns:1fr}.panel-box.full{grid-column:auto}.rule-grid{grid-template-columns:1fr 1fr}.inline-form{grid-template-columns:1fr}.wide-card,.owner-card{width:100%;height:100%;max-height:none;border-radius:0}.modal{padding:0}.rule-grid .full{grid-column:1/-1}}
