:root{--ink: #14171c;--ink-soft: #1e232b;--ink-line: #2a3038;--paper: #f7f6f3;--panel: #ffffff;--line: #e4e1da;--text: #1b1d22;--text-soft: #6b6f76;--accent: #2f8f5b;--accent-soft: #e6f2ea;--warn: #b8862b;--warn-soft: #f7eedb;--danger: #b23b3b;--danger-soft: #f8e9e9;--mono: "IBM Plex Mono", ui-monospace, monospace;--sans: "Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--sans);color:var(--text);background:var(--paper);-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.app-shell{display:grid;grid-template-columns:220px 1fr;height:100vh}.sidebar{background:var(--ink);color:#cfd3d9;padding:20px 14px;display:flex;flex-direction:column;gap:4px}.sidebar-brand{font-family:var(--mono);font-size:13px;letter-spacing:.04em;color:#fff;padding:0 10px 18px;border-bottom:1px solid var(--ink-line);margin-bottom:10px}.sidebar-brand small{display:block;color:#7f8792;font-weight:400;margin-top:2px}.nav-item{background:transparent;border:none;color:inherit;text-align:left;padding:10px;border-radius:6px;font-size:14px;display:flex;align-items:center;gap:10px}.nav-item:hover{background:var(--ink-soft)}.nav-item.active{background:var(--ink-soft);color:#fff;font-weight:500}.nav-icon{font-size:15px;width:18px;text-align:center;flex-shrink:0;opacity:.75}.nav-item.active .nav-icon{opacity:1}.sidebar-footer{margin-top:auto;font-family:var(--mono);font-size:11px;color:#7d8590;padding:10px;border-top:1px solid var(--ink-line)}.main{overflow:hidden;display:flex;flex-direction:column}.topbar{padding:16px 24px;border-bottom:1px solid var(--line);background:var(--panel);display:flex;align-items:baseline;justify-content:space-between}.topbar h1{font-size:16px;margin:0;font-weight:600}.topbar .sub{font-size:12px;color:var(--text-soft);font-family:var(--mono)}.view{flex:1;overflow:hidden}.window-pill{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;padding:2px 8px 2px 6px;border-radius:20px;white-space:nowrap}.window-pill.open{background:var(--accent-soft);color:#1f6b41}.window-pill.closed{background:var(--warn-soft);color:#8a611f}.window-pill .ring{width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;position:relative}.window-pill.open .ring:after{content:"";position:absolute;top:-1.5px;right:-1.5px;bottom:-1.5px;left:-1.5px;border-radius:50%;border:1.5px solid transparent;border-top-color:currentColor}.inbox{display:grid;grid-template-columns:300px 1fr;height:100%}.conv-list{border-right:1px solid var(--line);overflow-y:auto;background:var(--panel)}.conv-row{width:100%;text-align:left;background:none;border:none;padding:12px 16px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:4px}.conv-row:hover{background:var(--paper)}.conv-row.selected{background:var(--accent-soft)}.conv-row .name{font-size:13.5px;font-weight:600}.conv-row .wa-id{font-family:var(--mono);font-size:11px;color:var(--text-soft)}.conv-row .preview{font-size:12.5px;color:var(--text-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px}.conv-empty{padding:40px 20px;color:var(--text-soft);font-size:13px;text-align:center}.thread{display:flex;flex-direction:column;height:100%}.thread-header{padding:14px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;background:var(--panel)}.thread-body{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:10px;background:var(--paper)}.bubble{max-width:60%;padding:9px 13px;border-radius:10px;font-size:13.5px;line-height:1.45}.bubble.inbound{align-self:flex-start;background:var(--panel);border:1px solid var(--line)}.bubble.outbound{align-self:flex-end;background:#1f2937;color:#fff}.bubble .meta{font-family:var(--mono);font-size:10px;opacity:.6;margin-top:5px}.bubble-media{max-width:100%;border-radius:8px;display:block;margin-bottom:4px}.bubble-sticker{width:84px;display:block}.bubble audio{max-width:220px}.icon-btn{border:1px solid var(--line);background:var(--panel);border-radius:8px;width:38px;height:38px;font-size:15px;flex-shrink:0}.icon-btn:hover{background:var(--paper)}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.location-form{border-top:1px solid var(--line);background:var(--paper);padding:10px 16px;display:flex;gap:8px;align-items:center}.location-form input{border:1px solid var(--line);border-radius:6px;padding:7px 9px;font-size:12.5px;width:130px}.reply-bar{border-top:1px solid var(--line);background:var(--panel);padding:12px 16px;display:flex;gap:10px}.reply-bar input{flex:1;border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:13.5px}.reply-bar button{border:none;background:var(--ink);color:#fff;padding:0 18px;border-radius:8px;font-size:13px;font-weight:500}.reply-bar button:disabled{background:#c8ccd2;cursor:not-allowed}.reply-blocked{padding:12px 16px;background:var(--warn-soft);color:#8a611f;font-size:12.5px;border-top:1px solid var(--line)}.panel-view{padding:24px;overflow-y:auto;height:100%}.panel-grid{display:grid;grid-template-columns:1fr 380px;gap:24px;align-items:start}.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px 20px}.card h3{margin:0 0 14px;font-size:13.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-soft)}.field{margin-bottom:12px;display:flex;flex-direction:column;gap:5px}.field label{font-size:12px;font-weight:500;color:var(--text-soft)}.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-size:13.5px;font-family:inherit}.field textarea{resize:vertical;min-height:70px}.btn-primary{background:var(--ink);color:#fff;border:none;padding:9px 16px;border-radius:7px;font-size:13px;font-weight:500}.btn-danger{background:none;border:1px solid var(--danger);color:var(--danger);padding:5px 10px;border-radius:6px;font-size:11.5px}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;font-size:11px;text-transform:uppercase;color:var(--text-soft);padding:6px 8px;border-bottom:1px solid var(--line)}td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:top}.status-pill{font-family:var(--mono);font-size:10.5px;padding:2px 7px;border-radius:20px}.status-pill.APPROVED{background:var(--accent-soft);color:#1f6b41}.status-pill.PENDING{background:var(--warn-soft);color:#8a611f}.status-pill.REJECTED{background:var(--danger-soft);color:var(--danger)}.result-row{font-family:var(--mono);font-size:11.5px;padding:4px 0;border-bottom:1px dashed var(--line);display:flex;justify-content:space-between}.result-row.ok{color:#1f6b41}.result-row.fail{color:var(--danger)}.banner{padding:10px 14px;border-radius:8px;font-size:12.5px;margin-bottom:14px}.banner.error{background:var(--danger-soft);color:var(--danger)}.banner.info{background:var(--accent-soft);color:#1f6b41}.form-section-label{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-soft);margin:18px 0 8px;padding-top:14px;border-top:1px solid var(--line)}.form-section-label:first-child{margin-top:0;padding-top:0;border-top:none}.back-btn{display:none;border:none;background:none;font-size:18px;padding:4px 8px 4px 0;color:var(--text);margin-right:4px}@media (max-width: 900px){.app-shell{grid-template-columns:64px 1fr}.sidebar{padding:16px 8px;align-items:center}.sidebar-brand{display:none}.nav-item{justify-content:center;padding:12px 0}.nav-item .nav-label{display:none}.nav-icon{font-size:18px}.sidebar-footer{display:none}.panel-grid{grid-template-columns:1fr}}@media (max-width: 700px){.inbox{grid-template-columns:1fr}.back-btn{display:inline-flex;align-items:center}.inbox.show-list .thread,.inbox.show-thread .conv-list{display:none}}.conv-list-toolbar{padding:10px 16px;border-bottom:1px solid var(--line)}.archive-toggle{border:1px solid var(--line);background:var(--panel);border-radius:20px;font-size:11.5px;padding:4px 12px;color:var(--text-soft)}.archive-toggle.active{background:var(--ink);color:#fff;border-color:var(--ink)}.progress-track{height:6px;background:var(--line);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--accent);transition:width .3s ease}.history-row{width:100%;display:flex;justify-content:space-between;align-items:center;background:none;border:none;border-bottom:1px solid var(--line);padding:8px 4px;font-size:12.5px;text-align:left}.history-row:hover{background:var(--paper)}
