:root{--bg: #f8fafc;--bg-card: #ffffff;--bg-muted: #f1f5f9;--border: #e2e8f0;--text: #0f172a;--text-muted: #64748b;--text-dim: #94a3b8;--brand: #4f46e5;--brand-dark: #4338ca;--brand-soft: #eef2ff;--success: #059669;--success-soft: #d1fae5;--warning: #d97706;--warning-soft: #fef3c7;--danger: #dc2626;--danger-soft: #fee2e2;--info: #2563eb;--info-soft: #dbeafe;--radius: 12px;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);--shadow: 0 4px 12px rgba(15, 23, 42, .06);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-top: env(safe-area-inset-top, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;padding:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;font-size:15px;line-height:1.5;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;overscroll-behavior-y:none}button{font:inherit;cursor:pointer}input,textarea,select{font:inherit;color:inherit;-moz-appearance:none;appearance:none;-webkit-appearance:none}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}.app{display:flex;flex-direction:column;min-height:100dvh;max-width:480px;margin:0 auto;background:var(--bg)}.header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:calc(12px + var(--safe-top)) 16px 12px;background:var(--bg-card);border-bottom:1px solid var(--border)}.header h1{font-size:17px;font-weight:600;margin:0}.header .user{font-size:12px;color:var(--text-muted)}.main{flex:1;padding:12px 16px calc(80px + var(--safe-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch}.tabs{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:var(--bg-card);border-top:1px solid var(--border);padding:6px 0 calc(6px + var(--safe-bottom));max-width:480px;margin:0 auto;z-index:10}.tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10px;font-weight:500;color:var(--text-muted);padding:6px 4px;border:none;background:none;text-decoration:none}.tab svg{width:22px;height:22px;stroke-width:1.6}.tab.active{color:var(--brand)}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin-bottom:12px;box-shadow:var(--shadow-sm)}.card h3{margin:0 0 6px;font-size:14px;font-weight:600}.card .card-body{font-size:15px}.card .card-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.meta{font-size:12px;color:var(--text-muted)}.prewrap{white-space:pre-wrap;word-break:break-word}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:12px 16px;background:var(--brand);color:#fff;border:none;border-radius:var(--radius);font-size:15px;font-weight:600;transition:background .15s}.btn:hover:not(:disabled){background:var(--brand-dark)}.btn:disabled{opacity:.5}.btn-ghost{background:transparent;color:var(--brand);border:1px solid var(--border)}.btn-danger{background:var(--danger)}.btn-danger:hover:not(:disabled){background:#b91c1c}.btn-pill{padding:6px 12px;font-size:13px;background:var(--brand);color:#fff;border:none;border-radius:999px;font-weight:500}.btn-pill.ghost{background:var(--bg-muted);color:var(--text)}.field{margin-bottom:12px}.field label{display:block;font-size:12px;color:var(--text-muted);margin-bottom:4px}.field input,.field textarea,.field select{width:100%;padding:12px 14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);font-size:15px}.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--brand);outline-offset:-1px;border-color:var(--brand)}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;text-transform:capitalize}.badge-open{background:var(--warning-soft);color:var(--warning)}.badge-assigned,.badge-in_progress{background:var(--info-soft);color:var(--info)}.badge-waiting_customer{background:#ede9fe;color:#6d28d9}.badge-resolved{background:var(--success-soft);color:var(--success)}.badge-closed{background:var(--bg-muted);color:var(--text-muted)}.banner{padding:10px 14px;border-radius:var(--radius);font-size:13px;margin-bottom:12px;display:flex;align-items:center;gap:10px}.banner-info{background:var(--info-soft);color:var(--info)}.banner-warning{background:var(--warning-soft);color:var(--warning)}.banner-error{background:var(--danger-soft);color:var(--danger)}.banner-success{background:var(--success-soft);color:var(--success)}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}.row:last-child{border-bottom:none}.row-title{font-size:14px;font-weight:500}.row-sub{font-size:12px;color:var(--text-muted);margin-top:2px}.stars{display:flex;gap:4px}.star{background:none;border:none;font-size:32px;line-height:1;padding:0;color:#cbd5e1}.star.on{color:#f59e0b}.empty{text-align:center;padding:40px 20px;color:var(--text-muted)}.timeline{position:relative;padding-left:18px}.timeline:before{content:"";position:absolute;left:5px;top:0;bottom:0;width:1px;background:var(--border)}.timeline-item{position:relative;padding:0 0 14px}.timeline-item:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-16px;top:4px;width:11px;height:11px;border-radius:50%;background:var(--brand);border:2px solid var(--bg-card)}.timeline-dot.resolved{background:var(--success)}.timeline-dot.escalation{background:var(--warning)}.timeline-dot.message{background:var(--info)}.timeline-dot.system{background:var(--text-dim)}.timeline-dot.progress{background:var(--brand)}.timeline-dot.customer{background:var(--brand-dark)}.timeline-dot.closed{background:var(--text-dim);border-color:var(--bg-card)}.timeline-title{font-size:14px;font-weight:500}.timeline-meta{font-size:11px;color:var(--text-muted);margin-top:2px}