:root{--brand: #1e4fd8;--brand-dark: #123199;--brand-light: #eef2ff;--ink: #0f172a;--ink-soft: #64748b;--ink-faint: #94a3b8;--paper: #ffffff;--surface: #f8fafc;--surface-alt: #f1f5f9;--border: #e7eaf3;--danger: #ef4444;--success: #22c55e;--warning: #f59e0b;--rail-bg: #0b1220;--rail-bg-soft: #131c2e;--radius-lg: 18px;--radius-md: 12px;--radius-sm: 8px;--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--surface);-webkit-font-smoothing:antialiased}button{font:inherit}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}::-webkit-scrollbar-track{background:transparent}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pop-in{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}@keyframes shimmer{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}@keyframes bounce-dot{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}.login-screen{min-height:100%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 15% 10%,#2d5eea,#123199 55%,#0b2170);padding:24px}.login-card{width:100%;max-width:380px;background:var(--paper);border-radius:22px;padding:38px 34px;box-shadow:0 30px 70px -20px #00000073;animation:rise-in .5s var(--ease-smooth) both}.login-mark{width:46px;height:46px;border-radius:13px;background:linear-gradient(135deg,var(--brand),var(--brand-dark));display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:20px;box-shadow:0 10px 24px -8px #1e4fd88c}.login-mark svg{width:22px;height:22px}.login-card h1{font-size:21px;font-weight:800;margin:0 0 6px}.login-card p.sub{margin:0 0 26px;font-size:13.5px;color:var(--ink-soft)}.field{margin-bottom:14px}.field label{display:block;font-size:12.5px;font-weight:600;color:var(--ink-soft);margin-bottom:6px}.field input{width:100%;padding:11px 13px;border-radius:var(--radius-sm);border:1.5px solid var(--border);font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease;background:var(--surface)}.field input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-light);background:#fff}.btn-primary{width:100%;border:none;cursor:pointer;padding:12px 16px;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;font-weight:700;font-size:14px;transition:transform .2s var(--ease-spring),box-shadow .2s ease;box-shadow:0 10px 22px -10px #1e4fd899;margin-top:6px;display:flex;align-items:center;justify-content:center;gap:8px}.btn-primary:hover{transform:translateY(-1px)}.btn-primary:active{transform:translateY(0) scale(.98)}.btn-primary:disabled{opacity:.65;cursor:default;transform:none}.login-error{background:#fef2f2;color:#b91c1c;font-size:12.5px;padding:9px 12px;border-radius:var(--radius-sm);margin-bottom:14px;animation:pop-in .25s var(--ease-spring) both}.login-hint{margin-top:20px;font-size:11.5px;color:var(--ink-faint);text-align:center}.otp-step{animation:rise-in .32s var(--ease-smooth) both}.app-shell{display:flex;height:100vh;overflow:hidden}.rail{width:64px;flex-shrink:0;background:var(--rail-bg);display:flex;flex-direction:column;align-items:center;padding:16px 0;gap:6px}.rail-logo{width:34px;height:34px;border-radius:10px;margin-bottom:18px;background:linear-gradient(135deg,var(--brand),#4f7bf0);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:13px}.rail-nav{display:flex;flex-direction:column;gap:4px;flex:1}.rail-btn{position:relative;width:42px;height:42px;border-radius:12px;border:none;cursor:pointer;background:transparent;color:#7d8aab;display:flex;align-items:center;justify-content:center;transition:background .2s ease,color .2s ease,transform .2s var(--ease-spring)}.rail-btn svg{width:19px;height:19px}.rail-btn:hover{background:var(--rail-bg-soft);color:#cbd5e1;transform:translateY(-1px)}.rail-btn.active{color:#fff;background:var(--rail-bg-soft)}.rail-btn.active:before{content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%);width:3px;height:20px;border-radius:999px;background:var(--brand);animation:rail-indicator .3s var(--ease-spring) both}@keyframes rail-indicator{0%{height:0;opacity:0}to{height:20px;opacity:1}}.rail-badge{position:absolute;top:2px;right:2px;min-width:15px;height:15px;border-radius:999px;background:var(--danger);color:#fff;font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--rail-bg);padding:0 3px;animation:pop-in .3s var(--ease-spring) both}.rail-footer{display:flex;flex-direction:column;align-items:center;gap:10px}.rail-avatar{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:700;cursor:pointer;position:relative;transition:transform .2s var(--ease-spring)}.rail-avatar:hover{transform:scale(1.08)}.rail-avatar .dot{position:absolute;bottom:-1px;right:-1px;width:9px;height:9px;border-radius:50%;background:var(--success);border:2px solid var(--rail-bg)}.workspace{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--paper)}.page-scroll{flex:1;overflow-y:auto}.inbox{flex:1;display:flex;min-height:0}.chats-col{width:300px;flex-shrink:0;border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0}.chats-head{padding:18px 16px 12px;flex-shrink:0}.chats-head h2{margin:0 0 12px;font-size:18px;font-weight:800}.search-box{position:relative;margin-bottom:12px}.search-box svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--ink-faint)}.search-box input{width:100%;padding:9px 12px 9px 33px;border-radius:999px;border:1.5px solid var(--border);font-size:13px;outline:none;background:var(--surface);transition:border-color .2s ease,background .2s ease}.search-box input:focus{border-color:var(--brand);background:#fff}.tab-row{display:flex;gap:4px;background:var(--surface-alt);padding:3px;border-radius:10px}.tab-btn{flex:1;border:none;background:none;cursor:pointer;padding:7px 4px;border-radius:8px;font-size:12px;font-weight:600;color:var(--ink-soft);transition:background .25s var(--ease-smooth),color .2s ease}.tab-btn.active{background:#fff;color:var(--brand);box-shadow:0 2px 8px -4px #0f172a40}.chats-list{flex:1;overflow-y:auto;padding:4px 8px 12px}.chats-group-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-faint);padding:12px 8px 6px;display:flex;align-items:center;gap:6px}.chats-group-count{background:var(--surface-alt);color:var(--ink-soft);border-radius:999px;padding:1px 7px;font-size:10.5px}.chat-row{display:flex;gap:10px;padding:10px 8px;border-radius:var(--radius-sm);cursor:pointer;transition:background .18s ease;animation:rise-in .3s var(--ease-smooth) both;position:relative}.chat-row:hover{background:var(--surface)}.chat-row.active{background:var(--brand-light)}.chat-row-avatar{width:38px;height:38px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;position:relative}.chat-row-avatar .status-dot{position:absolute;bottom:-1px;right:-1px;width:9px;height:9px;border-radius:50%;border:2px solid #fff;background:var(--ink-faint)}.chat-row-avatar .status-dot.new{background:var(--warning)}.chat-row-body{flex:1;min-width:0}.chat-row-top{display:flex;align-items:baseline;justify-content:space-between;gap:6px}.chat-row-name{font-size:13.5px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-row-time{font-size:10.5px;color:var(--ink-faint);flex-shrink:0}.chat-row-preview{font-size:12px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.chat-row-meta{display:flex;align-items:center;gap:6px;margin-top:6px}.corridor-pill{font-size:10px;font-weight:700;color:var(--brand);background:var(--brand-light);padding:2px 7px;border-radius:999px}.unread-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);flex-shrink:0;animation:pop-in .3s var(--ease-spring) both}.chats-empty,.chat-panel-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--ink-faint);font-size:13px;gap:10px;padding:40px;text-align:center}.chats-empty svg,.chat-panel-empty svg{width:34px;height:34px;opacity:.5}.skeleton-row{display:flex;gap:10px;padding:10px 8px}.skeleton-avatar,.skeleton-line{border-radius:8px;background:linear-gradient(90deg,#eef1f6 25%,#f7f9fc 37%,#eef1f6 63%);background-size:400px 100%;animation:shimmer 1.4s ease infinite}.skeleton-avatar{width:38px;height:38px;border-radius:50%;flex-shrink:0}.skeleton-line{height:10px;margin-bottom:6px}.chat-panel{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--surface)}.chat-panel-header{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--border);background:var(--paper);flex-shrink:0}.chp-avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:13px;flex-shrink:0}.chp-title{flex:1;min-width:0}.chp-name{font-size:14.5px;font-weight:700;display:flex;align-items:center;gap:8px}.chp-sub{font-size:11.5px;color:var(--ink-soft);margin-top:1px}.status-badge{font-size:10.5px;font-weight:700;padding:2px 9px;border-radius:999px;text-transform:capitalize}.status-badge.open{background:#fef3c7;color:#92400e}.status-badge.assigned{background:var(--brand-light);color:var(--brand)}.status-badge.resolved{background:#dcfce7;color:#15803d}.status-badge.closed{background:var(--surface-alt);color:var(--ink-soft)}.chp-actions{display:flex;align-items:center;gap:8px}.select-pill{border:1.5px solid var(--border);background:#fff;border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer;outline:none;color:var(--ink);transition:border-color .2s ease}.select-pill:focus{border-color:var(--brand)}.btn-ghost{border:1.5px solid var(--border);background:#fff;border-radius:999px;padding:7px 14px;font-size:12.5px;font-weight:700;cursor:pointer;color:var(--ink);transition:background .2s ease,transform .2s var(--ease-spring),border-color .2s ease;display:flex;align-items:center;gap:6px}.btn-ghost:hover{background:var(--surface);transform:translateY(-1px)}.btn-ghost.success{color:#15803d;border-color:#bbf7d0}.btn-ghost.success:hover{background:#f0fdf4}.icon-btn{width:32px;height:32px;border-radius:50%;border:1.5px solid var(--border);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);transition:background .2s ease,transform .2s var(--ease-spring)}.icon-btn svg{width:15px;height:15px}.icon-btn:hover{background:var(--surface);transform:translateY(-1px)}.thread{flex:1;overflow-y:auto;padding:20px 22px;display:flex;flex-direction:column;gap:3px}.date-sep{align-self:center;font-size:11px;color:var(--ink-soft);background:#fff;border:1px solid var(--border);padding:3px 12px;border-radius:999px;margin:12px 0}.presurvey-card{align-self:center;max-width:320px;width:100%;background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:14px 16px;margin-bottom:14px;animation:rise-in .35s var(--ease-smooth) both}.presurvey-card h4{margin:0 0 8px;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-faint)}.presurvey-row{display:flex;justify-content:space-between;font-size:12.5px;padding:3px 0}.presurvey-row span:first-child{color:var(--ink-soft)}.presurvey-row span:last-child{font-weight:600}.msg-row{display:flex;margin-bottom:6px;animation:rise-in .28s var(--ease-smooth) both}.msg-row.from-customer{justify-content:flex-start}.msg-row.from-agent{justify-content:flex-end}.msg-row.from-note{justify-content:center}.bubble{max-width:62%;padding:10px 13px;border-radius:16px;font-size:13.5px;line-height:1.5;word-wrap:break-word}.from-customer .bubble{background:#fff;border:1px solid var(--border);color:var(--ink);border-bottom-left-radius:5px}.from-agent .bubble{background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;border-bottom-right-radius:5px}.from-note .bubble{background:#fef9c3;border:1px solid #fde68a;color:#713f12;border-radius:12px;max-width:70%}.msg-meta{display:flex;align-items:center;gap:4px;margin-top:3px;font-size:10.5px;color:var(--ink-faint)}.from-agent .msg-meta{justify-content:flex-end}.msg-meta svg{width:12px;height:12px}.msg-meta .read{color:var(--brand)}.msg-sender-name{font-size:11px;font-weight:700;color:var(--ink-soft);margin-bottom:3px}.typing-row{display:flex;align-items:center;gap:8px;margin:2px 0 8px;animation:rise-in .2s var(--ease-smooth) both}.typing-bubble{background:#fff;border:1px solid var(--border);border-radius:16px 16px 16px 5px;padding:11px 14px;display:flex;gap:4px}.typing-dot{width:6px;height:6px;border-radius:50%;background:var(--ink-soft);animation:bounce-dot 1.3s ease-in-out infinite}.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}.typing-label{font-size:11px;color:var(--ink-soft)}.composer{border-top:1px solid var(--border);background:#fff;padding:12px 18px 14px;flex-shrink:0;position:relative}.composer-mode-row{display:flex;gap:6px;margin-bottom:8px}.mode-btn{border:none;background:none;cursor:pointer;font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;color:var(--ink-soft);transition:background .2s ease,color .2s ease}.mode-btn.active.reply{background:var(--brand-light);color:var(--brand)}.mode-btn.active.note{background:#fef9c3;color:#92400e}.composer-box{border:1.5px solid var(--border);border-radius:var(--radius-md);transition:border-color .2s ease,box-shadow .2s ease;overflow:hidden}.composer-box.focused{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-light)}.composer-box.note-mode.focused{border-color:#f59e0b;box-shadow:0 0 0 3px #fef3c7}.composer-textarea{width:100%;border:none;outline:none;resize:none;font:inherit;font-size:13.5px;padding:12px 14px 6px;max-height:120px;background:none}.composer-toolbar{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 8px}.composer-toolbar-left{display:flex;align-items:center;gap:2px}.tool-btn{width:30px;height:30px;border-radius:8px;border:none;background:none;cursor:pointer;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;transition:background .2s ease,color .2s ease}.tool-btn svg{width:16px;height:16px}.tool-btn:hover{background:var(--surface);color:var(--brand)}.hint-text{font-size:11px;color:var(--ink-faint)}.send-btn{border:none;cursor:pointer;padding:8px 18px;border-radius:999px;font-weight:700;font-size:13px;background:var(--border);color:var(--ink-faint);transition:background .2s ease,color .2s ease,transform .2s var(--ease-spring);display:flex;align-items:center;gap:7px}.send-btn.active{background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;box-shadow:0 8px 18px -8px #1e4fd899}.send-btn.note-active{background:linear-gradient(135deg,#f59e0b,#b45309);color:#fff}.send-btn.active:hover,.send-btn.note-active:hover{transform:translateY(-1px)}.send-btn svg{width:13px;height:13px}.canned-picker{position:absolute;left:18px;right:18px;bottom:100%;margin-bottom:8px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:0 20px 45px -18px #0f172a59;max-height:220px;overflow-y:auto;z-index:5;animation:rise-in .2s var(--ease-smooth) both}.canned-item{padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--border);transition:background .15s ease}.canned-item:last-child{border-bottom:none}.canned-item:hover,.canned-item.highlighted{background:var(--brand-light)}.canned-item .shortcut{font-size:11.5px;font-weight:700;color:var(--brand)}.canned-item .title{font-size:12.5px;font-weight:600;color:var(--ink);margin:2px 0}.canned-item .preview{font-size:11.5px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.details-col{width:300px;flex-shrink:0;border-left:1px solid var(--border);background:var(--paper);overflow-y:auto;transition:width .3s var(--ease-smooth),opacity .2s ease}.details-col.collapsed{width:0;opacity:0;overflow:hidden;border-left:none}.details-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 10px}.details-head h3{margin:0;font-size:14px;font-weight:800}.details-section{padding:12px 18px;border-bottom:1px solid var(--border)}.details-section:last-child{border-bottom:none}.details-section h4{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-faint);margin:0 0 10px}.contact-avatar{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px;margin-bottom:10px}.contact-name{font-size:15px;font-weight:700}.contact-row{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-soft);margin-top:7px}.contact-row svg{width:14px;height:14px;color:var(--ink-faint);flex-shrink:0}.tag-chip-row{display:flex;flex-wrap:wrap;gap:6px}.tag-chip{background:var(--brand-light);color:var(--brand);font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;display:flex;align-items:center;gap:5px}.tag-chip button{border:none;background:none;cursor:pointer;color:var(--brand);display:flex;padding:0}.tag-chip button svg{width:10px;height:10px}.tag-add-input{border:1.5px dashed var(--border);border-radius:999px;padding:4px 10px;font-size:11px;background:none;outline:none;width:90px}.tag-add-input:focus{border-color:var(--brand);border-style:solid}.notes-list{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}.note-item{background:#fef9c3;border:1px solid #fde68a;border-radius:var(--radius-sm);padding:9px 11px;font-size:12px;color:#713f12;animation:rise-in .25s var(--ease-smooth) both}.note-item .note-meta{font-size:10px;color:#a16207;margin-bottom:3px;font-weight:700}.note-input-row{display:flex;gap:6px}.note-input-row input{flex:1;border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:8px 10px;font-size:12px;outline:none}.note-input-row input:focus{border-color:#f59e0b}.quick-actions{display:flex;flex-direction:column;gap:6px}.quick-action-btn{display:flex;align-items:center;gap:9px;border:none;background:none;cursor:pointer;padding:8px 6px;border-radius:var(--radius-sm);font-size:12.5px;font-weight:600;color:var(--ink);transition:background .2s ease}.quick-action-btn:hover{background:var(--surface)}.quick-action-btn svg{width:15px;height:15px;color:var(--ink-soft)}.quick-action-btn.danger{color:var(--danger)}.quick-action-btn.danger svg{color:var(--danger)}.timeline-item{font-size:12px;color:var(--ink-soft);padding:6px 0;border-bottom:1px dashed var(--border)}.timeline-item:last-child{border-bottom:none}.toast-stack{position:fixed;top:16px;right:16px;display:flex;flex-direction:column;gap:8px;z-index:999}.toast{background:var(--ink);color:#fff;padding:11px 16px;border-radius:12px;font-size:12.5px;font-weight:600;box-shadow:0 16px 34px -12px #0006;display:flex;align-items:center;gap:10px;animation:rise-in .3s var(--ease-spring) both}.toast .dot{width:7px;height:7px;border-radius:50%;background:var(--brand);flex-shrink:0}.page{padding:28px 32px;max-width:1000px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.page-header h1{font-size:21px;font-weight:800;margin:0}.page-header p{margin:4px 0 0;font-size:13px;color:var(--ink-soft)}.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin-bottom:16px}.card h3{margin:0 0 14px;font-size:14px;font-weight:800}.list-table{width:100%;border-collapse:collapse}.list-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-faint);padding:8px 10px;border-bottom:1px solid var(--border)}.list-table td{padding:12px 10px;border-bottom:1px solid var(--border);font-size:13px;vertical-align:middle}.list-table tr:last-child td{border-bottom:none}.list-table tr{animation:rise-in .25s var(--ease-smooth) both}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:22px}.stat-tile{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:16px 18px;animation:rise-in .3s var(--ease-smooth) both}.stat-tile .label{font-size:11.5px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.4px}.stat-tile .value{font-size:26px;font-weight:800;margin-top:6px}.bar-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}.bar-row .bar-label{width:46px;font-size:12px;font-weight:700;color:var(--ink-soft);flex-shrink:0}.bar-track{flex:1;height:10px;background:var(--surface-alt);border-radius:999px;overflow:hidden}.bar-fill{height:100%;background:linear-gradient(90deg,var(--brand),#4f7bf0);border-radius:999px;transition:width .6s var(--ease-smooth)}.bar-row .bar-value{width:28px;text-align:right;font-size:12px;font-weight:700;color:var(--ink)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid.full{grid-template-columns:1fr}.form-field label{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);margin-bottom:6px}.form-field input,.form-field textarea,.form-field select{width:100%;border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:9px 11px;font:inherit;font-size:13px;outline:none;transition:border-color .2s ease;background:var(--surface)}.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:var(--brand);background:#fff}.form-field textarea{resize:vertical;min-height:60px}.color-swatch{width:34px;height:34px;border-radius:8px;border:1.5px solid var(--border);cursor:pointer;padding:0}.empty-state{text-align:center;padding:40px 20px;color:var(--ink-faint);font-size:13px}.sparkline{display:flex;align-items:flex-end;gap:3px;height:120px;padding-top:10px}.spark-bar{flex:1;background:linear-gradient(180deg,var(--brand),#4f7bf0);border-radius:3px 3px 0 0;min-height:3px;transition:height .5s var(--ease-smooth),opacity .15s ease;cursor:default}.spark-bar:hover{opacity:.75}.spark-axis{display:flex;justify-content:space-between;margin-top:6px;font-size:10.5px;color:var(--ink-faint)}