:root{--ground:#F3F5F7;--panel:#FFFFFF;--line:#DDE3E8;--ink:#16212B;--muted:#5B6875;--text2:#45525F;--accent:#0E6E64;--accent-dark:#0A524A;--accent-weak:#E3F1EF;--out:#D8EEEA;--out-line:#BFE0DA}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:'IBM Plex Sans',system-ui,sans-serif;color:var(--ink);background:var(--ground);font-size:14px}
[hidden]{display:none!important}
button{font-family:inherit;cursor:pointer}
input,textarea{font-family:inherit;font-size:14px;color:var(--ink);border:1px solid #C9D2DA;border-radius:6px;padding:10px 12px;background:#fff}
input:focus,textarea:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
a{color:var(--accent)}a:hover{color:var(--accent-dark)}
.muted{color:var(--muted)}.small{font-size:13px}.mono{font-family:'IBM Plex Mono',monospace}.pad{padding:16px 12px 0}
.error{color:#8F1D1D;background:#F8E6E6;border-radius:6px;padding:8px 10px;margin:8px 0 0;font-size:13px}
.row-between{display:flex;align-items:baseline;justify-content:space-between;gap:8px}

/* buttons */
.btn-primary{min-height:44px;padding:0 20px;border:0;border-radius:6px;background:var(--accent);color:#fff;font-size:15px;font-weight:600}
.btn-primary:hover{background:var(--accent-dark)}
.btn-primary:disabled{opacity:.6;cursor:default}
.btn-wide{width:100%}
.btn-outline{min-height:44px;padding:0 16px;border-radius:6px;font-size:14px;font-weight:600;background:#fff;color:var(--accent);border:1px solid var(--accent)}
.btn-outline.on{background:#E4F2E7;color:#2F5D3A;border-color:#9CC7A6}
.btn-outline-red{min-height:44px;padding:0 16px;border:1px solid #6E1F1F;background:#fff;color:#6E1F1F;border-radius:6px;font-size:14px;font-weight:600}
.btn-ghost-dark{color:#fff;background:transparent;border:1px solid #4A5866;border-radius:6px;padding:8px 12px;font-size:14px;min-height:36px}
.btn-link{background:none;border:0;color:var(--accent);padding:0;font-size:14px}

/* login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.login-card{width:100%;max-width:400px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:32px;display:flex;flex-direction:column;gap:18px}
.login-card label{display:flex;flex-direction:column;gap:6px;font-weight:500}
.login-card input{font-size:15px;padding:12px}
.brand{display:flex;align-items:center;gap:12px}
.brand h1{margin:0;font-size:20px;font-weight:600}
.brand div{display:flex;flex-direction:column}
.brand.light span{font-size:12px;color:#B9C4CE}.brand.light strong{font-size:16px;font-weight:600}

/* app */
.app{min-height:100vh;display:flex;flex-direction:column}
.topbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;background:var(--ink);color:#fff}
.who{display:flex;align-items:center;gap:16px;color:#DCE3E9}.who strong{color:#fff}
.columns{flex:1 1 auto;display:flex;flex-wrap:wrap;min-height:0;height:calc(100vh - 62px)}
.col-practices{flex:1 1 200px;max-width:240px;padding:20px 12px;border-right:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;gap:4px;overflow-y:auto}
.col-heading{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0 12px 8px}
.p-item{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:6px;text-align:left;font-size:14px;color:var(--ink);background:transparent}
.p-item:hover{background:#F0F3F5}.p-item.sel{background:var(--accent-weak);font-weight:600}
.p-item .lbl{display:flex;align-items:center;gap:10px}
.dot{width:10px;height:10px;border-radius:5px;display:inline-block;flex:0 0 auto}
.count{min-width:22px;height:22px;border-radius:11px;background:var(--accent);color:#fff;font-size:12px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;flex:0 0 auto}

.col-list{flex:1 1 300px;max-width:380px;border-right:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;min-height:0}
.list-head{padding:16px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.list-head h2{margin:0;font-size:18px;font-weight:600}
.search{display:flex;flex-direction:column;gap:4px}
.check{display:flex;align-items:center;gap:8px;color:var(--text2)}
.check input{width:16px;height:16px;padding:0}
.conv-list{overflow-y:auto;flex:1 1 auto}
.conv{display:flex;flex-direction:column;gap:6px;width:100%;padding:14px 16px;border:0;border-bottom:1px solid #E6EBEF;text-align:left;font-size:14px;background:#fff}
.conv:hover{background:#F7F9FA}.conv.sel{background:var(--accent-weak);box-shadow:inset 4px 0 0 var(--accent)}
.conv .name{font-weight:600;font-size:15px}.conv .time{font-size:12px;color:var(--muted);white-space:nowrap}
.conv .tags{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.conv .last{font-size:13px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conv .bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;min-width:0}
.empty{padding:48px;color:var(--muted);font-size:15px}

.badge{font-size:12px;font-weight:500;border-radius:4px;padding:2px 6px}
.chip{font-size:12px;border-radius:4px;padding:2px 6px}
.chip.open{color:#0A524A;background:var(--accent-weak)}
.chip.closing{color:#7A3B05;background:#FCEBD7}
.chip.closed,.chip.none{color:#6E1F1F;background:#F8E6E6}
.chip.handled{color:#2F5D3A;background:#E4F2E7}
.c0{color:#1D4E89;background:#E5EEF8}.c1{color:#5B2F94;background:#EFE8F8}.c2{color:#7A4A00;background:#FBEFDB}.c3{color:#24603A;background:#E4F2E7}.c4{color:#8A2448;background:#F9E6EE}.c5{color:#285E73;background:#E2F0F5}
.d0{background:#1D4E89}.d1{background:#5B2F94}.d2{background:#7A4A00}.d3{background:#24603A}.d4{background:#8A2448}.d5{background:#285E73}.dall{background:var(--ink)}

.col-thread{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;background:#EEF1F4;min-height:0}
.thread{display:flex;flex-direction:column;height:100%;min-height:0}
.thread-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 24px;background:#fff;border-bottom:1px solid var(--line)}
.thread-head h2{margin:0;font-size:18px;font-weight:600}
.meta-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:var(--text2);margin-top:4px}
.back{display:none;margin-bottom:6px}
.messages{flex:1 1 auto;overflow-y:auto;padding:24px;display:flex;flex-direction:column;gap:14px}
.m{display:flex}.m.out{justify-content:flex-end}.m.in{justify-content:flex-start}
.bubble{max-width:520px;padding:12px 14px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.m.out .bubble{background:var(--out);border-color:var(--out-line)}
.m.failed .bubble{border-color:#D9A3A3}
.m .label{font-size:12px;font-weight:600;color:var(--accent);margin-bottom:6px}
.m .text{font-size:14px;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere}
.m .foot{display:flex;justify-content:flex-end;gap:6px;margin-top:6px;font-size:12px;color:var(--muted)}
.m .st-read{color:var(--accent);font-weight:500}.m .st-failed{color:#8F1D1D;font-weight:600}
.m .err{font-size:12px;color:#8F1D1D;margin-top:4px}
.media-img{display:block;max-width:280px;max-height:240px;border-radius:6px;margin-bottom:8px}
.file{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #C9D2DA;border-radius:6px;background:#F7F9FA;margin-bottom:8px}
.file span{flex:1 1 auto;overflow-wrap:anywhere}
audio{max-width:260px;margin-bottom:8px}
.day{align-self:center;font-size:12px;color:var(--muted);background:#E2E7EC;border-radius:10px;padding:2px 10px}

.note-row{display:flex;flex-direction:column;gap:4px;padding:10px 24px;background:#FAFBFC;border-top:1px solid var(--line)}
.composer{background:#fff;border-top:1px solid var(--line);padding:16px 24px}
.reply-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:8px}
.reply-row textarea{flex:1 1 320px;min-width:0;line-height:1.5;resize:vertical}
.closed-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:6px;background:#F8E6E6;color:#6E1F1F}
.closed-box div{display:flex;flex-direction:column;gap:2px}

@media (max-width: 900px){
  .columns{height:auto}
  .col-practices,.col-list{max-width:none;flex-basis:100%}
  .col-practices{flex-direction:row;flex-wrap:wrap;padding:8px}
  .col-practices .col-heading,.col-practices .pad{display:none}
  .p-item{width:auto}
  .app.has-thread .col-list,.app.has-thread .col-practices{display:none}
  .app:not(.has-thread) .col-thread{display:none}
  .back{display:inline-block}
  .thread{min-height:calc(100vh - 62px)}
}

/* inbox / admin switch */
.views{display:flex;gap:4px;background:#24313D;border-radius:8px;padding:3px}
.view-btn{background:transparent;color:#DCE3E9;border:0;border-radius:6px;padding:7px 14px;font-size:14px;min-height:34px}
.view-btn.sel{background:#fff;color:var(--ink);font-weight:600}

/* admin */
.admin{flex:1 1 auto;display:flex;flex-wrap:wrap;min-height:calc(100vh - 62px)}
.admin-nav{flex:1 1 200px;max-width:240px;padding:20px 12px;border-right:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;gap:4px}
.admin-main{flex:999 1 560px;min-width:0;padding:24px 32px 48px;display:flex;flex-direction:column;gap:20px;max-width:1200px}
.a-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px}
.a-head h2{margin:0;font-size:22px;font-weight:600}.a-head p{margin:4px 0 0}
.a-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.a-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:14px}
.a-card h3{margin:0;font-size:17px;font-weight:600}
.a-highlight{border-color:var(--accent);box-shadow:inset 4px 0 0 var(--accent)}
.a-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px 20px}
.a-field{display:flex;flex-direction:column;gap:5px}
.a-label{font-size:13px;font-weight:600;color:var(--text2)}
.a-field input,.a-field select{width:100%}
select{font-family:inherit;font-size:14px;color:var(--ink);border:1px solid #C9D2DA;border-radius:6px;padding:9px 10px;background:#fff;min-height:40px}
.a-checks{display:flex;flex-wrap:wrap;gap:8px 24px}
.a-practices{border:1px solid var(--line);border-radius:8px;padding:10px 14px;display:flex;flex-wrap:wrap;gap:8px 20px;margin:0}
.a-practices legend{font-size:13px;font-weight:600;color:var(--text2);padding:0 4px}
.check{display:flex;align-items:center;gap:8px;font-size:14px}
.row-inline{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.row-inline input{flex:1 1 160px}
code{font-family:'IBM Plex Mono',monospace;font-size:13px;background:#F0F3F5;border-radius:4px;padding:2px 6px;overflow-wrap:anywhere}
.a-table-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:10px}
.a-table{border-collapse:collapse;width:100%;font-size:14px}
.a-table th{text-align:left;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.a-table td{padding:12px 14px;border-bottom:1px solid #EEF1F4;vertical-align:top}
.a-table tr:last-child td{border-bottom:0}
.pill{display:inline-block;font-size:12px;font-weight:500;border-radius:4px;padding:2px 8px;white-space:nowrap}
.pill.ok{color:#0A524A;background:var(--accent-weak)}.pill.warn{color:#7A3B05;background:#FCEBD7;white-space:normal}.pill.off{color:#6E1F1F;background:#F8E6E6}
.a-ok{color:#2F5D3A;background:#E4F2E7;border-radius:6px;padding:8px 10px;margin:0;font-size:14px}
.kv{display:grid;grid-template-columns:minmax(160px,240px) 1fr;gap:10px 20px;align-items:center}
.kv>span:nth-child(odd){font-size:13px;font-weight:600;color:var(--text2)}
.as-btn{display:inline-flex;align-items:center;text-decoration:none;min-height:44px;box-sizing:border-box}
.admin-main>h3{margin:8px 0 0;font-size:17px}
@media (max-width:900px){.admin-nav{max-width:none;flex-basis:100%;flex-direction:row;flex-wrap:wrap;padding:8px}.admin-main{padding:16px}.kv{grid-template-columns:1fr}}
.kv>.pill{justify-self:start}