:root{font-family:Inter,Arial,sans-serif;color:#1d2430;background:#f4f5f8}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}.shell{display:flex}.shell,.sidebar{min-height:100vh}.sidebar{width:254px;background:#11151d;color:#d9dce4;padding:22px 14px;flex-shrink:0}.brand{display:block;text-decoration:none;color:#f6bf31;font-weight:900;font-size:26px;padding:12px}.brand small{display:block;color:#aaa;font-size:10px;letter-spacing:1.5px}.sidebar nav{margin-top:25px}.sidebar details{padding:8px 0}.sidebar summary{cursor:pointer;font-weight:700;padding:12px;border-radius:8px}.sidebar summary:hover{background:#262c36}.subnav{display:flex;flex-direction:column;padding:5px 0 5px 20px;gap:2px}.subnav a{color:#c8cbd2;text-decoration:none;font-size:13px;padding:9px;border-radius:7px}.subnav a:hover{background:#2c313c;color:#ffcd42}.main{padding:28px;flex:1 1;min-width:0}.pagehead{margin-bottom:20px}.pagehead span{font-size:13px;color:#667}.pagehead h1{margin:6px 0;font-size:27px}.pagehead p{color:#647083;margin:0}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));grid-gap:16px;gap:16px}.card{background:white;border:1px solid #e1e4e9;border-radius:13px;padding:20px}.card h2{font-size:18px;margin-top:0}.card a{color:#9a6c00}.notice{padding:16px;background:#fff8e6;border-radius:9px;margin-top:20px}.conversation-layout{height:min(76vh,760px);min-height:520px;display:grid;grid-template-columns:minmax(230px,29%) minmax(320px,1fr) minmax(190px,20%);border:1px solid #dce1e5;border-radius:15px;overflow:hidden;background:white}.conversation-list{border-right:1px solid #ddd;min-width:0}.chat-list-head{justify-content:space-between;padding:20px}.chat-list-head,.search{display:flex;align-items:center}.search{margin:0 12px 15px;gap:8px;background:#f0f2f4;padding:11px;border-radius:9px}.search input{border:0;background:transparent;width:100%;outline:none}.empty-chat{font-size:13px;color:#68778a;padding:20px;line-height:1.5}.conversation-main{min-width:0;display:flex;flex-direction:column;background:#eeeae3}.chat-header{display:flex;align-items:center;gap:10px;background:#f5f6f7;padding:12px 15px;min-height:72px}.chat-header div{flex:1 1}.chat-header small{display:block;color:#667;font-size:12px}.chat-tools{gap:7px;flex-wrap:wrap}.chat-tools,.chat-tools button{display:flex;padding:8px;background:#fff}.chat-tools button{align-items:center;gap:5px;border:1px solid #ddd;border-radius:7px;font-size:12px}.message-history{flex:1 1;min-height:0;overflow:auto;padding:20px;display:flex;flex-direction:column;gap:9px}.message-hint{align-self:center;background:#fff9e8;color:#68531a;font-size:12px;border-radius:8px;padding:9px;max-width:340px;text-align:center}.bubble{max-width:78%;border-radius:9px;padding:11px;font-size:14px;overflow-wrap:anywhere}.bubble.agent{align-self:flex-end;background:#d9f4de}.bubble.client{align-self:flex-start;background:white}.composer{display:flex;align-items:center;gap:8px;padding:12px;background:#f5f6f7;position:relative;flex-shrink:0}.attachment-wrap>button,.composer>button{background:none;border:0;padding:5px;color:#53616b}.composer input{border:0;border-radius:24px;background:white;flex:1 1;min-width:0;padding:12px;outline:none}.attachment-wrap{position:relative}.attachment-menu{position:absolute;bottom:45px;left:0;width:210px;background:white;border-radius:12px;box-shadow:0 8px 28px #0002;padding:8px;z-index:2}.attachment-menu button{display:flex;align-items:center;gap:8px;width:100%;border:0;background:white;text-align:left;padding:10px;border-radius:6px}.attachment-menu button:hover{background:#f4f4f4}.contact-panel{border-left:1px solid #ddd;padding:20px;text-align:center;color:#647083}.contact-panel h3{font-size:15px;color:#27303b}.contact-panel dl{text-align:left;font-size:13px}.contact-panel dt{font-weight:700;margin-top:12px}.contact-panel dd{margin:2px 0}.flow-grid{display:grid;grid-template-columns:230px 1fr;grid-gap:24px;gap:24px}.flow-block-button{display:block;width:100%;padding:10px;margin:6px 0;border:1px solid #ddd;background:#fafafa;text-align:left;border-radius:7px}.flow-step{display:flex;align-items:center;gap:10px;background:#f7f8fa;border:1px solid #ddd;border-radius:9px;padding:14px;margin-bottom:12px}.flow-step span{background:#f3c332;padding:6px;border-radius:50%}.flow-step button{margin-left:auto;border:0;background:none;font-size:20px}@media(max-width:1100px){.contact-panel{display:none}.conversation-layout{grid-template-columns:35% 65%}}@media(max-width:700px){.sidebar{width:190px}.main{padding:12px}.conversation-layout{grid-template-columns:1fr;height:75vh}.conversation-list{display:none}.flow-grid{grid-template-columns:1fr}}