:root{
  --bg:#f5f3f6;--panel:#fff;--ink:#232026;--muted:#77717a;--accent:#7b2f63;--accent2:#a34b85;
  --line:#e7e1e8;--ok:#238753;--danger:#c93c4a;--shadow:0 8px 28px rgba(37,20,32,.10);
}
*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
button,input,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.screen{min-height:100vh}.center-screen{display:grid;place-items:center;padding:20px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.login-card{width:min(420px,100%);padding:28px}.brand-mark{font-size:44px;text-align:center}.login-card h1{text-align:center;margin:8px 0 0}.login-card p{text-align:center}.login-card label{display:block;margin:16px 0 0;font-size:13px;color:var(--muted)}
input,textarea{width:100%;border:1px solid var(--line);background:white;border-radius:12px;padding:12px 13px;outline:none;color:var(--ink)}input:focus,textarea:focus{border-color:var(--accent2);box-shadow:0 0 0 3px rgba(123,47,99,.12)}
button{border:0;border-radius:12px;padding:10px 14px;background:#eee8ee}.primary{background:var(--accent);color:#fff;font-weight:700}.wide{width:100%;margin-top:18px}.error{color:var(--danger);min-height:22px;margin-top:10px}.muted{color:var(--muted)}.small{font-size:13px}.tiny{font-size:11px;color:#eee;margin-top:2px}
.topbar{position:sticky;top:0;z-index:20;height:62px;padding:10px 14px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:0 1px 9px rgba(0,0,0,.15)}.top-actions{display:flex;gap:8px}.icon-btn{width:40px;height:40px;padding:0;display:grid;place-items:center;background:rgba(255,255,255,.16);color:inherit;font-size:20px}.view{max-width:900px;margin:auto;padding-bottom:110px}.sticky-tools{position:sticky;top:62px;z-index:10;background:var(--bg);padding:12px 10px 8px}.search-row{display:flex;gap:8px}.search-row input{min-width:0}.filters{display:flex;gap:7px;overflow:auto;padding:9px 0 2px;scrollbar-width:none}.filters::-webkit-scrollbar{display:none}.filter{white-space:nowrap;padding:8px 11px;border-radius:999px;font-size:13px}.filter.active{background:var(--accent);color:#fff}.orders-list{padding:0 10px 12px;display:grid;gap:9px}.order-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:12px 13px;box-shadow:0 2px 10px rgba(20,10,18,.04);cursor:pointer}.order-card:active{transform:scale(.995)}.card-top{display:flex;align-items:flex-start;gap:8px}.order-no{font-size:12px;color:var(--muted);font-weight:700}.card-title{font-weight:800;font-size:16px;line-height:1.25}.customer{font-size:13px;color:var(--muted);margin-top:2px}.unread{margin-left:auto;min-width:24px;height:24px;padding:0 7px;border-radius:999px;background:#e2334c;color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800}.status-icons{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}.status-dot{border:1px solid var(--line);background:#f4f1f4;color:#a39aa4;border-radius:9px;padding:5px 8px;font-size:13px}.status-dot.done{background:#e6f5ec;color:#147141;border-color:#c6e8d4}.preview{margin-top:9px;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.empty{text-align:center;color:var(--muted);padding:60px 20px}
.order-head{position:sticky;top:62px;z-index:11;background:#fff;border-bottom:1px solid var(--line);padding:9px 10px;display:flex;align-items:center;gap:10px}.order-head .icon-btn{background:#eee8ee;color:var(--ink)}.grow{flex:1;min-width:0}.order-title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-bar{display:flex;gap:7px;overflow:auto;padding:9px 10px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:121px;z-index:10}.status-btn{white-space:nowrap;padding:7px 10px;border-radius:9px;color:#817680;font-size:12px}.status-btn.done{background:#dff2e6;color:#12683b;font-weight:700}.description{margin:8px 10px;padding:10px 12px;border-radius:12px;background:#fff8df;border:1px solid #f0e3ac;font-size:13px;white-space:pre-wrap}.chat{padding:12px 10px 150px;display:flex;flex-direction:column;gap:8px}.msg{max-width:84%;align-self:flex-start}.msg.mine{align-self:flex-end}.msg .who{font-size:10px;color:var(--muted);margin:0 6px 2px}.bubble{background:#fff;border:1px solid var(--line);border-radius:15px 15px 15px 4px;padding:8px 10px;box-shadow:0 1px 5px rgba(0,0,0,.03);overflow:hidden}.mine .bubble{background:#efe1eb;border-color:#e6cfe0;border-radius:15px 15px 4px 15px}.bubble .text{white-space:pre-wrap;overflow-wrap:anywhere}.time{font-size:9px;color:var(--muted);margin-top:4px;text-align:right}.bubble img{display:block;max-width:min(100%,420px);max-height:420px;border-radius:10px}.bubble audio{width:min(310px,72vw);display:block}.file-card{display:flex;gap:9px;align-items:center;color:var(--ink);text-decoration:none;min-width:180px}.file-icon{font-size:28px}.file-name{font-weight:700;font-size:13px;overflow-wrap:anywhere}.file-size{font-size:10px;color:var(--muted)}
.composer-wrap{position:fixed;left:0;right:0;bottom:0;z-index:30;background:rgba(250,248,250,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:7px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}.composer-wrap>*{max-width:900px;margin-left:auto;margin-right:auto}.attach-row{display:flex;gap:7px;align-items:center;margin-bottom:5px}.attach-btn{width:38px;height:34px;padding:0;border-radius:10px;background:#ece6ec;display:grid;place-items:center;font-size:18px;border:0}.recording{color:var(--danger);font-size:12px;font-weight:700}.composer{display:flex;align-items:flex-end;gap:7px}.composer textarea{resize:none;max-height:120px}.send-btn{width:44px;height:44px;padding:0;border-radius:50%;background:var(--accent);color:#fff;font-size:20px;flex:0 0 auto}
.modal{position:fixed;inset:0;z-index:100;background:rgba(22,14,20,.48);display:grid;place-items:center;padding:12px}.modal-card{background:#fff;width:min(560px,100%);max-height:90vh;overflow:auto;border-radius:18px;padding:20px;position:relative;box-shadow:var(--shadow)}.modal-close{position:absolute;right:10px;top:8px;width:36px;height:36px;padding:0;font-size:24px}.modal h2{margin:0 44px 16px 0}.form-grid{display:grid;gap:11px}.form-grid label{font-size:12px;color:var(--muted)}.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}.danger{background:#fce3e6;color:#a71f31}.users{display:grid;gap:8px;margin-top:15px}.user-row{border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;align-items:center;gap:10px}.user-row .grow{font-size:13px}.badge-admin{font-size:10px;background:#eee3a9;border-radius:999px;padding:3px 7px}.switch{font-size:12px}.uploading{}
@media(min-width:760px){.orders-list{grid-template-columns:1fr 1fr}.topbar{padding-left:calc((100vw - 900px)/2 + 10px);padding-right:calc((100vw - 900px)/2 + 10px)}.composer-wrap{padding-left:0;padding-right:0}}
.notify-on{background:rgba(255,255,255,.3)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.due-line{font-size:12px;color:#635c64;margin-top:5px;font-weight:650}.due-line.overdue{color:var(--danger);font-weight:800}.archived-card{opacity:.82}.archived-card .order-no{color:#6e6570}.order-edit-actions{flex-wrap:wrap}.order-edit-actions .danger{margin-right:auto}
.share-list{display:grid;gap:12px}.share-card{border:1px solid var(--line);border-radius:14px;padding:12px;background:#faf8fa}.share-text{font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere;margin-bottom:9px}.share-file{padding:7px 0;border-bottom:1px dashed var(--line);font-size:13px;overflow-wrap:anywhere}.share-file:last-of-type{border-bottom:0}.share-select-label{display:block;margin-top:11px;font-size:12px;color:var(--muted)}select{width:100%;border:1px solid var(--line);background:white;border-radius:12px;padding:11px 12px;margin-top:5px;color:var(--ink);font:inherit}.share-card .form-actions{margin-top:10px}
@media(max-width:520px){.order-edit-actions button{flex:1 1 auto}.order-edit-actions .danger{margin-right:0}.top-actions{gap:5px}.topbar .icon-btn{width:37px;height:37px}}

/* v3 chats + search */
.chat-top-btn{position:relative}
.top-badge{position:absolute;right:-5px;top:-5px;min-width:18px;height:18px;padding:0 5px;border-radius:10px;background:#d92f4b;color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center;border:2px solid var(--surface,#fff)}
.message-search-wrap{display:flex;align-items:center;gap:8px;margin:8px 12px 0;padding:7px 10px;background:var(--surface,#fff);border:1px solid #ddd;border-radius:12px;position:sticky;top:64px;z-index:5}
.message-search-wrap input{border:0;outline:0;flex:1;min-width:0;background:transparent;padding:4px 0}
.search-clear{border:0;background:transparent;font-size:22px;line-height:1;padding:0 4px;color:#777}
.search-info{font-size:12px;color:#6e6870;margin:4px 18px 0}
.chat-list-tools{padding-bottom:8px}
.chat-list-tools input{width:100%}
.chat-card{cursor:pointer}
.chat-empty{padding:28px 12px}
.chat-image{max-width:min(72vw,420px);max-height:420px;border-radius:10px;display:block;cursor:zoom-in}
@media (max-width:640px){
  .message-search-wrap{top:58px;margin-left:8px;margin-right:8px}
  .chat-image{max-width:78vw}
}

/* v3.2 admin SSL */
.admin-divider{height:1px;background:var(--line);margin:22px 0 18px}.admin-section-title{font-size:16px;margin:12px 0}.ssl-form{margin-top:12px}.ssl-status{border:1px solid var(--line);background:#f7f5f7;border-radius:12px;padding:11px 12px}.ssl-status.ssl-good{background:#e7f5ec;border-color:#c5e6d1;color:#17653c}.ssl-status.ssl-warn{background:#fff5dc;border-color:#eddba4;color:#765b12}.ssl-status .small{margin-top:4px;overflow-wrap:anywhere}.ssl-details{margin:8px 2px 0;overflow-wrap:anywhere}.ssl-help{line-height:1.45;background:#f7f5f7;border-radius:10px;padding:9px 10px}.ssl-actions{align-items:center}.ssl-actions .primary{flex:1}

/* v3.3.6 mobile upload + PWA install */
.secondary{background:#f1e9ef;color:var(--ink);border:1px solid var(--line)}
.login-card .install-action{margin-top:8px}
.upload-overlay{position:fixed;inset:0;z-index:2000;background:rgba(25,18,24,.42);display:grid;place-items:center;padding:18px}
.upload-overlay.hidden{display:none}
.upload-card{width:min(92vw,390px);background:white;border-radius:18px;padding:20px;box-shadow:0 18px 60px #0005;text-align:center}
.upload-spinner{width:34px;height:34px;border:4px solid #eadde7;border-top-color:var(--accent,#7b2f63);border-radius:50%;margin:0 auto 12px;animation:uploadspin .8s linear infinite}
@keyframes uploadspin{to{transform:rotate(360deg)}}
.upload-progress{height:8px;background:#eee7ec;border-radius:999px;overflow:hidden;margin:13px 0 6px}
#uploadProgressBar{height:100%;width:0;background:var(--accent,#7b2f63);transition:width .15s linear}
#uploadCancelBtn{margin-top:14px;min-width:120px}