:root{font-family:'IBM Plex Sans Thai','Noto Sans Thai',ui-sans-serif,system-ui,sans-serif;color:#17233b;background:#f6f8fc;font-size:14px;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}a{text-decoration:none;color:inherit}[hidden]{display:none!important}.app-shell{min-height:100vh;display:flex}.side{width:273px;min-width:273px;background:#fff;border-right:1px solid #e8edf4;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;height:100vh;z-index:10;padding:25px 16px 0}.brand{display:flex;align-items:center;gap:11px;margin:0 11px 34px}.brand-symbol{width:42px;height:42px;display:grid;place-items:center;background:linear-gradient(140deg,#344dd8,#7866eb);color:white;border-radius:13px;box-shadow:0 5px 16px #6366d133}.brand-symbol svg{width:28px}.brand b{font-size:18px;letter-spacing:-.6px}.brand small{display:block;color:#8b94a4;font-weight:600;font-size:9px;letter-spacing:1.7px;margin-top:-2px}.new-chat{background:#304ddd;border:0;border-radius:12px;color:white;width:100%;padding:12px 14px;text-align:left;font-weight:700;display:flex;align-items:center;gap:8px;box-shadow:0 7px 16px #344ddd28}.new-chat:hover,.solid-button:hover,.send-button:hover:not(:disabled){background:#1c35ba}.plus{font-size:22px;line-height:1}.key-hint{margin-left:auto;opacity:.65;font-size:11px}.side-label,.side-section-heading{font-size:11px;color:#9aa6b6;font-weight:800;letter-spacing:.6px;text-transform:uppercase;margin:30px 13px 12px}.nav{display:grid;gap:4px}.nav-button{display:flex;align-items:center;gap:12px;text-align:left;border:0;background:none;border-radius:10px;padding:11px 13px;color:#657188;font-weight:650;width:100%}.nav-button:hover,.nav-button.active{background:#edf1ff;color:#334dc8}.nav-icon{font-size:21px;width:24px;text-align:center}.side-section-heading{display:flex;justify-content:space-between;align-items:center;margin-top:27px}.icon-button{border:0;background:transparent;color:#7c88a0;border-radius:8px;padding:5px 8px;font-size:17px}.icon-button:hover{background:#f0f3fa}.conversation-list{overflow:auto;min-height:100px;flex:1;padding:0 2px 12px;scrollbar-width:thin}.conversation-row{display:flex;align-items:center;gap:4px;margin-bottom:3px;border-radius:10px;padding:3px}.conversation-row.selected{background:#f0f3fd}.conversation-open{display:flex;gap:11px;align-items:center;min-width:0;flex:1;border:0;background:none;text-align:left;padding:9px 6px;color:#53617b}.conversation-open b{font-size:13px;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600;color:#263452}.conversation-open small{color:#94a0b0;font-size:11px}.conversation-row.selected .conversation-open b{color:#2e4ac5}.conversation-delete{border:none;background:none;color:#b4bdca;opacity:0;padding:7px}.conversation-row:hover .conversation-delete{opacity:1}.conversation-delete:hover{color:#d4475d}.side-footer{border-top:1px solid #eef1f6;display:flex;align-items:center;gap:9px;padding:22px 10px;color:#526074;font-size:11px}.side-footer small{margin-left:auto;color:#a5afbc}.online-dot,.live-tag i{width:7px;height:7px;background:#29b88a;border-radius:50%;display:inline-block}.main-area{flex:1;min-width:0;min-height:100vh;display:flex;flex-direction:column}.topbar{height:72px;min-height:72px;border-bottom:1px solid #e8edf5;display:flex;align-items:center;justify-content:space-between;padding:0 34px;background:#fff}.crumb{font-size:13px;color:#8793a7}.crumb span{color:#c2cad5;padding:0 10px}.crumb b{color:#2d3952;font-weight:700}.top-left,.top-right{display:flex;align-items:center;gap:17px}.live-tag{display:flex;align-items:center;gap:9px;background:#edfaf4;color:#20805b;border-radius:25px;padding:7px 12px;font-size:12px;font-weight:700}.header-avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;color:#5d55c7;background:#eae9ff;font-weight:800;font-size:11px}.mobile-menu{display:none}.chat-view{flex:1;display:flex;flex-direction:column;min-height:calc(100vh - 72px);height:calc(100vh - 72px);overflow:hidden}.chat-head{padding:27px clamp(22px,4.5%,74px) 15px;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:10px;letter-spacing:2px;color:#5369d5;font-weight:800}.chat-head h1,.dashboard-heading h1{font-size:26px;margin:5px 0 2px;letter-spacing:-.65px;font-weight:800}.chat-head p,.dashboard-heading p{color:#8993a5;margin:3px 0;font-size:12px}.head-action{border:1px solid #e2e8f2;border-radius:9px;color:#6f7a91;background:white;padding:9px 12px;font-size:12px}.head-action:hover{border-color:#8ca0dc;color:#2f4bd1}.messages-wrap{flex:1;min-height:0;overflow:auto;padding:10px clamp(22px,4.5%,74px) 20px;scrollbar-width:thin}.messages{max-width:930px;margin:0 auto;display:flex;flex-direction:column;gap:24px}.empty-hero{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;min-height:300px;padding:30px;color:#39455d}.hero-symbol{width:69px;height:69px;background:linear-gradient(135deg,#e3e8ff,#f3ebff);border-radius:23px;display:grid;place-items:center;font-size:37px;color:#5761ce;margin-bottom:18px;box-shadow:0 8px 35px #5959c51e}.empty-hero h2{font-size:23px;margin:0 0 8px}.empty-hero p{color:#8b95a8;line-height:1.8;max-width:390px;margin:0}.example-row{display:flex;gap:8px;margin-top:23px;flex-wrap:wrap;justify-content:center}.example-row button{border:1px solid #dfe5f2;background:#fff;border-radius:999px;padding:8px 13px;font-size:12px;color:#56627c}.message{display:flex;gap:12px;max-width:100%;align-items:flex-start}.message.user{flex-direction:row-reverse}.message-avatar{width:33px;height:33px;border-radius:11px;background:#e5eafe;color:#5464d1;font-weight:800;display:grid;place-items:center;flex-shrink:0}.message.user .message-avatar{background:#dce7fb;color:#4563a5}.message-main{min-width:0;max-width:min(85%,800px)}.message-label{font-size:11px;color:#929cad;margin:2px 0 7px;font-weight:700}.message.user .message-label{text-align:right}.bubble{background:white;border:1px solid #e6ebf3;border-radius:5px 16px 16px 16px;padding:16px 20px;box-shadow:0 4px 14px #253b6210;white-space:pre-wrap;line-height:1.85;overflow-wrap:anywhere;font-size:13.5px}.message.user .bubble{background:#3953d6;border-color:#3953d6;color:white;border-radius:16px 5px 16px 16px;white-space:pre-wrap}.answer-meta{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap;font-size:11px;color:#7f8ba0}.status-pill{border-radius:6px;background:#edf1ff;padding:3px 7px;color:#4560bb}.status-pill.insufficient,.status-pill.failed{background:#fff0ef;color:#b7444a}.status-pill.partial{background:#fff7e5;color:#ae7a21}.composer-area{padding:0 clamp(22px,4.5%,74px) 22px;background:linear-gradient(0deg,#f6f8fc 82%,#f6f8fc00);position:relative}.composer,.attachment-bar,.under-composer{max-width:930px;margin-left:auto;margin-right:auto}.composer{background:white;border:1px solid #dce3f0;border-radius:17px;box-shadow:0 10px 35px #253d6d12;padding:11px 13px}.composer:focus-within{border-color:#7e93e3;box-shadow:0 9px 25px #4f67da14}.composer-tools,.composer-bottom,.composer-lower{display:flex;align-items:center;gap:14px}.attach-button{color:#4b63c8;background:#f0f4ff;border:0;border-radius:8px;padding:7px 11px;font-weight:700;font-size:12px}.attach-button:hover{background:#e6ecff}.composer-label{font-size:11px;color:#a0aaba}.composer textarea{display:block;border:0;outline:0;resize:none;width:100%;min-height:54px;max-height:155px;padding:17px 8px 8px;font-size:13.5px;color:#1e2b42}.composer textarea::placeholder{color:#a1aabd}.composer-bottom{justify-content:space-between}.char-count{font-size:11px;color:#9da8ba;white-space:nowrap}.char-count.near{color:#b7642d}.simple-option{font-size:11px;color:#738098;display:flex;align-items:center;gap:5px;white-space:nowrap}.simple-option input{accent-color:#4259ce}.send-button,.solid-button{background:#354fd4;color:white;border:0;border-radius:9px;padding:10px 16px;font-weight:700;display:flex;align-items:center;gap:12px;justify-content:center}.under-composer{font-size:10px;color:#9aa6b7;text-align:center;margin-top:9px}.attachment-bar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:8px}.doc-chip{background:#e9f7f3;color:#23886a;padding:7px 10px;border-radius:8px;font-size:11px}.loading-label{color:#7885a3;display:flex;gap:9px;align-items:center;font-size:12px}.spinner{display:inline-block;width:13px;height:13px;border:2px solid #cbd4fa;border-top-color:#455ddb;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;right:28px;bottom:25px;background:#16243a;color:white;box-shadow:0 10px 35px #203b5c44;padding:13px 18px;border-radius:11px;z-index:30;font-size:12px;max-width:420px}.toast.error{background:#ad3c47}.dashboard-view{padding:30px clamp(20px,3.9%,62px) 48px;overflow:auto;height:calc(100vh - 72px)}.dashboard-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:21px}.dashboard-heading select{padding:11px 16px;border:1px solid #e1e6f0;background:white;border-radius:10px;color:#34415b}.admin-login,.chart-card,.detail-card,.metric-card{background:#fff;border:1px solid #e4eaf3;border-radius:16px;box-shadow:0 5px 20px #293e6910}.admin-login{padding:29px;margin-top:28px}.admin-login h2,.chart-card h2,.detail-card h2{font-size:16px;margin:0 0 5px}.admin-login p,.detail-card p{color:#8290a4;font-size:12px;line-height:1.8}.login-fields{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.login-fields input{flex:1;min-width:150px}.login-fields input,.key-form input,.field-label select,.key-options select{border:1px solid #dbe4f0;border-radius:9px;padding:11px 12px;background:#fff;color:#203047;outline:none}.login-fields input:focus,.key-form input:focus{border-color:#6d83db}.dashboard-actions{display:flex;justify-content:flex-end;gap:10px;align-items:center;margin-bottom:16px}.identity-tag{margin-right:auto;font-size:12px;color:#78849b}.metrics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.metric-card{padding:20px;display:flex;flex-direction:column;gap:8px}.metric-title{font-size:12px;color:#79869e;font-weight:700}.metric-card strong{font-size:29px;color:#19263d;letter-spacing:-1px;line-height:1.2}.metric-card small{font-size:10px;color:#a4afbf}.metric-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;font-size:19px}.metric-icon.violet{background:#eeeaff;color:#6d59bd}.metric-icon.blue{background:#eaf1ff;color:#466ad2}.metric-icon.teal{background:#e5f8f5;color:#21a18c}.metric-icon.amber{background:#fff4df;color:#d99b2a}.chart-card{margin-top:17px;padding:24px}.chart-heading{display:flex;align-items:center;justify-content:space-between}.chart-heading p{margin:2px 0;color:#a2abb9;font-size:11px}.chart-legend{display:flex;gap:18px;color:#71809b;font-size:11px}.chart-legend span{display:flex;gap:7px;align-items:center}.chart-legend i{width:9px;height:9px;border-radius:3px;background:#4b67df;display:inline-block}.chart-legend .legend-api{background:#2cb49e}.chart-frame{height:278px;margin-top:20px}.chart-frame svg{width:100%;height:100%}.chart-foot{font-size:11px;color:#98a5b7;margin-top:8px}.detail-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:17px;margin-top:17px}.detail-card{padding:24px}.detail-card h2{margin-bottom:14px}.usage-line{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eef2f7;padding:16px 0;gap:10px}.usage-line b{color:#24324c}.usage-line small{display:block;color:#94a0b2;font-size:11px}.field-label{display:grid;gap:7px;font-size:12px;color:#7d8ba1;margin-top:14px}.key-form{display:flex;gap:8px;margin-top:13px}.key-form input{min-width:0;flex:1}.key-options{display:flex;align-items:center;justify-content:space-between;margin-top:12px;font-size:11px;color:#91a0b1}.key-options select{padding:7px}.secret-panel{display:grid;gap:9px;margin:14px 0;padding:13px;background:#fff9e8;border:1px solid #f6d797;border-radius:10px;font-size:11px;overflow-wrap:anywhere}.secret-panel code{white-space:normal;overflow-wrap:anywhere}.key-list{margin-top:12px;max-height:190px;overflow:auto}.key-row{padding:10px 0;border-bottom:1px solid #eef1f8;display:flex;justify-content:space-between;gap:8px;font-size:12px}.key-row small{display:block;color:#9eaabd}.key-row button{border:0;background:none;color:#c25261}.api-note{font-size:11px!important}.api-note code{color:#314ece;background:#eff2ff;padding:3px 5px;border-radius:4px}@media(max-width:1100px){.side{width:238px;min-width:238px}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-grid{grid-template-columns:1fr}.topbar{padding:0 20px}}@media(max-width:740px){.side{position:fixed;transform:translateX(-100%);transition:transform .2s;box-shadow:20px 0 35px #102c4b22}.side.open{transform:translateX(0)}.mobile-menu{display:inline-block}.chat-head{padding:21px 20px 14px}.chat-head h1{font-size:20px}.chat-head p{font-size:11px}.head-action span{display:none}.messages-wrap{padding:8px 17px 18px}.composer-area{padding:0 13px 12px}.topbar{height:62px;min-height:62px}.chat-view,.dashboard-view{height:calc(100vh - 62px);min-height:calc(100vh - 62px)}.top-right .live-tag{display:none}.composer-label{display:none}.simple-option{font-size:10px}.metrics-grid{gap:9px}.metric-card{padding:15px}.metric-card strong{font-size:24px}.dashboard-view{padding:23px 13px}.dashboard-heading h1{font-size:23px}.chart-card,.detail-card{padding:17px}.message-main{max-width:92%}.login-fields{flex-direction:column}}

.studio-modal{max-width:390px;width:calc(100% - 32px);border:1px solid #dfe6f1;border-radius:17px;box-shadow:0 24px 70px #1d2c5055;padding:0;background:white;color:#25324a}.studio-modal::backdrop{background:#12234288}.studio-modal-content{padding:23px}.studio-modal-content h3{font-size:17px;margin:0 0 10px}.studio-modal-content p{line-height:1.8;color:#7e8ba0;font-size:13px;margin:0 0 22px}.studio-modal-actions{display:flex;justify-content:flex-end;gap:10px}.empty-list{font-size:12px;color:#a4afbf;text-align:center;padding:12px}.key-row button:hover{color:#a52d46}.bubble.loading-label{white-space:normal}

.source-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.source-chip{border:1px solid #e0e9f3;border-radius:7px;background:#f8fbff;color:#6c7c9b;padding:5px 8px;font-size:10px}
