#viewCustomers{--brand: #c8291d; --brand-hover: #b52319; --text: #19202e; --secondary: #6f7787; --muted: #969dab; --border: #e9e5e2; --pink: #fff3f1; --surface: #fff; --canvas: #faf8f6; --shadow: 0 5px 24px rgba(73,48,37,.035); --radius: 15px; --font: "PingFang SC","Microsoft YaHei","Noto Sans CJK SC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
#viewCustomers *{box-sizing: border-box;}
#viewCustomers{scroll-behavior: smooth;}
#viewCustomers{margin: 0px; color: var(--text); background: radial-gradient(ellipse at 48% 5%,#f8f4f0 0%,transparent 52%),var(--canvas); font-family: var(--font); font-size: 14px; -webkit-font-smoothing: antialiased; line-height: 1.6;}
#viewCustomers button,#viewCustomers input,#viewCustomers textarea,#viewCustomers select{font: inherit;}
#viewCustomers button,#viewCustomers a,#viewCustomers input,#viewCustomers textarea,#viewCustomers select{-webkit-tap-highlight-color: transparent;}
#viewCustomers button{cursor: pointer; color: inherit;}
#viewCustomers button{border: 0px; background: none;}
#viewCustomers button:disabled{cursor: wait; opacity: 0.6;}
#viewCustomers a{color: inherit; text-decoration: none;}
#viewCustomers h1,#viewCustomers h2,#viewCustomers h3,#viewCustomers p{margin: 0px;}
#viewCustomers h1,#viewCustomers h2,#viewCustomers h3{font-weight: 750; letter-spacing: -0.4px;}
#viewCustomers img{max-width: 100%; display: block;}
#viewCustomers em{font-style: normal; color: var(--brand);}
#viewCustomers [hidden]{display: none !important;}
#viewCustomers .icon-defs{position: absolute; width: 0px; height: 0px; overflow: hidden;}
#viewCustomers .ico{width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; vertical-align: middle;}
#viewCustomers .ico svg{width: 100%; height: 100%; fill: none; stroke: currentcolor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;}
#viewCustomers .small-icon .ico{width: 14px; height: 14px;}
#viewCustomers button:focus-visible,#viewCustomers a:focus-visible{outline: rgb(229, 151, 142) solid 3px; outline-offset: 4px;}
#viewCustomers input:focus,#viewCustomers textarea:focus,#viewCustomers select:focus{outline: none;}
#viewCustomers input::placeholder,#viewCustomers textarea::placeholder{color: rgb(146, 153, 167);}
#viewCustomers input[type="search"]::-webkit-search-cancel-button{cursor: pointer;}
#viewCustomers input[type="search"]{min-width: 0px;}
#viewCustomers .panel{border: 1px solid var(--border); border-radius: var(--radius); background: rgba(255, 255, 255, 0.93); box-shadow: var(--shadow);}
#viewCustomers .button{display: inline-flex; align-items: center; justify-content: center; gap: 9px; height: 43px; padding: 0px 17px; border: 1px solid rgb(227, 229, 233); border-radius: 10px; background: rgba(255, 255, 255, 0.94); color: rgb(41, 49, 67); font-size: 14px; line-height: 1; white-space: nowrap; box-shadow: rgba(32, 35, 42, 0.01) 0px 2px 5px; transition: background 0.16s, border-color 0.16s, transform 0.16s;}
#viewCustomers .button:hover{background: rgb(252, 246, 243); border-color: rgb(222, 200, 192);}
#viewCustomers .button.primary{background: linear-gradient(135deg, rgb(213, 45, 32), rgb(188, 39, 28)); color: rgb(255, 255, 255); border: 1px solid rgb(195, 38, 27); box-shadow: rgba(255, 255, 255, 0.12) 0px 0px 0px 1px inset;}
#viewCustomers .button.primary:hover{background: var(--brand-hover); border-color: var(--brand-hover); box-shadow: rgba(200, 41, 29, 0.133) 0px 4px 12px;}
#viewCustomers .button:active,#viewCustomers .action-card:active{transform: translateY(1px);}
#viewCustomers .button.large{height: 57px; padding: 0px 22px; font-size: 16px; border-radius: 12px;}
#viewCustomers .button.small{height: 38px; font-size: 12px; padding: 0px 16px; border-radius: 8px;}
#viewCustomers .button.text-button{background: transparent; border-color: transparent; box-shadow: none; color: var(--brand);}
#viewCustomers .icon-button{padding: 0px; width: 35px; height: 35px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; color: rgb(44, 53, 68);}
#viewCustomers .icon-button:hover{background: rgb(242, 234, 230);}
#viewCustomers .icon-button .ico{width: 22px; height: 22px;}
#viewCustomers .circle-button{height: 39px; width: 39px; display: inline-flex; align-items: center; justify-content: center; background: rgb(245, 245, 246); color: rgb(115, 123, 137); border-radius: 50%; flex-shrink: 0;}
#viewCustomers .circle-button .ico{height: 16px; width: 16px;}
#viewCustomers .circle-button:hover{background: rgb(237, 231, 227); color: var(--brand);}
#viewCustomers .topbar{height: 60px; margin: 0px 32px; display: flex; align-items: center; gap: 0px; padding: 0px 24px; border-radius: 0px 0px 20px 20px; background: rgba(255, 255, 255, 0.93); position: relative; z-index: 8;}
#viewCustomers .brand{display: flex; align-items: center; gap: 10px; flex-shrink: 0;}
#viewCustomers .brand strong{font-size: 21px; font-weight: 800; letter-spacing: 0.1px;}
#viewCustomers .brand-mark{height: 31px; width: 31px; display: grid; place-items: center; background: linear-gradient(145deg, rgb(230, 58, 44), rgb(189, 39, 29)); border: 1px solid rgb(184, 41, 29); border-radius: 8px; color: rgb(255, 255, 255); box-shadow: rgba(255, 255, 255, 0.14) 0px 0px 0px 2px inset, rgba(173, 42, 32, 0.082) 0px 1px 4px;}
#viewCustomers .brand-mark .ico{height: 24px; width: 24px;}
#viewCustomers .brand-mark .ico svg{stroke-width: 1.4;}
#viewCustomers .brand-tagline{color: rgb(133, 139, 153); margin-left: 24px; white-space: nowrap; letter-spacing: 0.25px; font-size: 14px;}
#viewCustomers .topnav{display: flex; gap: 18px; align-items: center; margin-left: auto; margin-right: 37px; height: 100%;}
#viewCustomers .nav-item{font-size: 14px; font-weight: 500; color: rgb(120, 128, 141); height: 42px; display: flex; align-items: center; justify-content: center; position: relative; padding: 0px 8px; white-space: nowrap; border-radius: 10px;}
#viewCustomers .nav-item.active{color: var(--brand); font-weight: 750; background: rgb(255, 247, 245);}
#viewCustomers .nav-item.active::after{content: ""; height: 2px; background: var(--brand); position: absolute; left: 9px; right: 9px; bottom: 3px;}
#viewCustomers .nav-item:hover{color: var(--brand); background: rgb(251, 244, 241);}
#viewCustomers .notification{position: relative; margin-right: 26px;}
#viewCustomers .notification-dot{position: absolute; right: 1px; top: 0px; height: 11px; min-width: 11px; padding: 0px 2px; background: var(--brand); border-radius: 50%; color: rgb(255, 255, 255); font-size: 8px; line-height: 11px;}
#viewCustomers .profile-wrap{position: relative;}
#viewCustomers .profile{display: flex; align-items: center; gap: 12px; height: 44px; padding: 0px; color: rgb(67, 76, 91); white-space: nowrap;}
#viewCustomers .profile > img{width: 32px; height: 32px; object-fit: cover; border-radius: 50%; background: rgb(230, 229, 228);}
#viewCustomers .profile > .small-icon{margin-left: 3px;}
#viewCustomers .profile-menu,#viewCustomers .filter-menu{position: absolute; right: 0px; top: calc(100% + 7px); padding: 7px; background: rgb(255, 255, 255); border: 1px solid var(--border); border-radius: 12px; box-shadow: rgba(49, 32, 23, 0.09) 0px 10px 30px; z-index: 30; min-width: 166px;}
#viewCustomers .profile-menu button,#viewCustomers .filter-menu button{display: block; width: 100%; padding: 9px 12px; text-align: left; border-radius: 7px; font-size: 13px; white-space: nowrap;}
#viewCustomers .profile-menu button:hover,#viewCustomers .filter-menu button:hover{background: var(--pink); color: var(--brand);}
#viewCustomers .dashboard{padding: 0px 40px 20px; max-width: 1760px; margin: auto;}
#viewCustomers .hero{height: 324px; position: relative; isolation: isolate;}
#viewCustomers .hero-art{position: absolute; left: calc(50% - 316px); top: 0px; width: 586px; height: 316px; object-fit: contain; z-index: -1; mix-blend-mode: multiply; mask-image: linear-gradient(to right, transparent, rgb(0, 0, 0) 9%, rgb(0, 0, 0) 98%, transparent); user-select: none; pointer-events: none;}
#viewCustomers .hero-copy{padding: 31px 0px 0px 17px; position: relative; z-index: 1; width: 490px;}
#viewCustomers .greeting{color: rgb(109, 117, 130); font-size: 14px; margin-bottom: 12px;}
#viewCustomers .hero h1{font-size: 43px; line-height: 1.3; font-weight: 850; letter-spacing: -1.6px;}
#viewCustomers .hero h1 em{display: inline-block; margin-top: 1px;}
#viewCustomers .hero-subtitle{font-size: 15px; color: rgb(123, 131, 146); margin-top: 11px; white-space: nowrap;}
#viewCustomers .hero-features{display: flex; align-items: center; gap: 25px; margin-top: 22px;}
#viewCustomers .mini-feature{display: flex; align-items: center; gap: 10px; white-space: nowrap;}
#viewCustomers .feature-icon{width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, rgb(254, 232, 227), rgb(255, 246, 243)); display: grid; place-items: center; color: var(--brand); flex-shrink: 0;}
#viewCustomers .feature-icon .ico{width: 20px; height: 20px;}
#viewCustomers .feature-icon.filled .ico svg{fill: currentcolor; stroke-width: 0.4;}
#viewCustomers .mini-feature strong{font-size: 12px; display: block; font-weight: 700; line-height: 1.7;}
#viewCustomers .mini-feature small{display: block; color: rgb(151, 157, 170); font-size: 11px; line-height: 1.6;}
#viewCustomers .hero-actions{position: absolute; right: 0px; top: 45px; display: grid; gap: 16px; width: 412px;}
#viewCustomers .action-card{width: 100%; min-height: 116px; border: 1px solid rgb(241, 215, 208); border-radius: 15px; background: rgb(255, 248, 247); display: flex; align-items: center; text-align: left; padding: 20px 24px; gap: 22px; box-shadow: rgba(108, 65, 32, 0.03) 0px 4px 14px; transition: box-shadow 0.2s, transform 0.2s, border-color 0.2s;}
#viewCustomers .action-card:hover{border-color: rgb(229, 182, 169); box-shadow: rgba(150, 50, 36, 0.05) 0px 6px 20px;}
#viewCustomers .action-card-pink{background: linear-gradient(125deg, rgb(255, 250, 250), rgb(255, 242, 241));}
#viewCustomers .action-card-cream{border-color: rgb(238, 224, 213); background: linear-gradient(125deg, rgb(255, 253, 250), rgb(253, 247, 241));}
#viewCustomers .action-icon{width: 65px; height: 65px; border: 1px solid rgb(241, 216, 208); border-radius: 50%; background: rgba(255, 255, 255, 0.91); color: var(--brand); display: grid; place-items: center; flex-shrink: 0; box-shadow: rgba(187, 108, 48, 0.063) 0px 3px 10px;}
#viewCustomers .action-icon .ico{width: 31px; height: 31px;}
#viewCustomers .action-copy strong{display: block; font-size: 19px; font-weight: 750; letter-spacing: -0.6px;}
#viewCustomers .action-copy small{display: block; margin-top: 7px; font-size: 14px; color: rgb(125, 133, 146); white-space: nowrap;}
#viewCustomers .round-arrow{width: 40px; height: 40px; border-radius: 50%; margin-left: auto; display: grid; place-items: center; color: var(--brand); background: rgb(253, 233, 229); flex-shrink: 0;}
#viewCustomers .round-arrow .ico{width: 17px; height: 17px;}
#viewCustomers .action-card-cream .round-arrow{background: rgb(252, 237, 223);}
#viewCustomers .plan-banner{height: 128px; border: 1px solid rgb(244, 220, 214); background: linear-gradient(115deg, rgb(255, 245, 242), rgb(255, 247, 246) 65%, rgb(255, 243, 241)); border-radius: 15px; display: flex; align-items: center; padding: 19px 22px; gap: 19px; position: relative;}
#viewCustomers .robot-art{width: 92px; height: 89px; object-fit: contain; mix-blend-mode: multiply; flex-shrink: 0;}
#viewCustomers .plan-copy{flex: 1 1 0%; min-width: 0px;}
#viewCustomers .eyebrow{font-size: 12px; color: rgb(183, 58, 42); line-height: 1.5; display: block; margin-bottom: 7px;}
#viewCustomers .plan-copy h2{font-size: 18px; font-weight: 750; letter-spacing: -0.5px; line-height: 1.6; white-space: nowrap;}
#viewCustomers .plan-copy p{font-size: 13px; color: rgb(149, 155, 165); line-height: 1.6; margin-top: 7px; white-space: nowrap;}
#viewCustomers .plan-actions{display: flex; align-items: center; gap: 17px; margin-left: 4px; flex-shrink: 0;}
#viewCustomers .plan-actions .primary{min-width: 188px;}
#viewCustomers .plan-actions .button:not(.primary){min-width: 151px;}
#viewCustomers .coach-note{width: 174px; height: 85px; object-fit: contain; mix-blend-mode: multiply; flex-shrink: 0; margin-left: 2px;}
#viewCustomers .generated-plan{margin-top: 14px; padding: 22px 26px; background: rgb(255, 250, 247);}
#viewCustomers .generated-plan h3{font-size: 17px; margin-bottom: 8px;}
#viewCustomers .demo-pill{display: inline-flex; font-size: 11px; color: rgb(146, 125, 110); border: 1px solid rgb(233, 221, 210); background: rgb(250, 245, 237); border-radius: 5px; padding: 2px 7px; font-weight: 400; letter-spacing: 0px;}
#viewCustomers .plan-demo-items{display: flex; gap: 16px; margin-top: 14px;}
#viewCustomers .plan-demo-item{flex: 1 1 0%; border: 1px solid rgb(238, 230, 224); background: rgb(255, 255, 255); border-radius: 10px; padding: 14px;}
#viewCustomers .plan-demo-item strong{display: block; font-size: 14px;}
#viewCustomers .plan-demo-item p{color: var(--secondary); font-size: 12px; margin: 7px 0px 10px;}
#viewCustomers .overview-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 15px;}
#viewCustomers .overview-card{height: 149px; padding: 20px 25px; position: relative; overflow: hidden;}
#viewCustomers .section-heading{display: flex; align-items: center; gap: 13px; min-width: 0px;}
#viewCustomers .section-heading h2{font-size: 22px; line-height: 1.5; font-weight: 800; white-space: nowrap;}
#viewCustomers .section-icon{display: flex; color: var(--brand); flex-shrink: 0;}
#viewCustomers .section-icon .ico{height: 28px; width: 28px; stroke-width: 1.8;}
#viewCustomers .count-pill{display: inline-flex; align-items: center; justify-content: center; padding: 4px 13px; background: rgb(255, 240, 237); color: var(--brand); border-radius: 20px; font-size: 14px; font-weight: 500; white-space: nowrap; margin-left: 7px; line-height: 1.6;}
#viewCustomers .today{font-size: 13px; color: rgb(128, 135, 151); margin-left: auto; white-space: nowrap;}
#viewCustomers .overview-text{font-size: 14px; line-height: 1.9; color: rgb(126, 134, 150); margin-top: 17px; max-width: 90%;}
#viewCustomers .overview-next{position: absolute; right: 25px; bottom: 29px;}
#viewCustomers .focus-art{position: absolute; right: 17px; bottom: 20px; width: 214px; height: 106px; object-fit: contain; mix-blend-mode: multiply;}
#viewCustomers .focus-overview .overview-text{max-width: 72%; position: relative; z-index: 1;}
#viewCustomers .focus-list{display: flex; gap: 8px; flex-wrap: wrap; padding-right: 120px;}
#viewCustomers .focus-chip{display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 6px; background: rgb(255, 243, 237); color: rgb(168, 64, 46); font-size: 12px;}
#viewCustomers .schedule-link{color: var(--secondary); display: block; text-align: left;}
#viewCustomers .schedule-link:hover{color: var(--brand);}
#viewCustomers .neutral-count{font-size: 14px; background: rgb(241, 242, 244); border-radius: 15px; min-width: 27px; text-align: center; line-height: 27px; margin-left: 1px; font-weight: 700;}
#viewCustomers .customers-table-panel{margin-top: 16px; padding: 16px 17px 0px; border-radius: 14px;}
#viewCustomers .table-toolbar{height: 47px; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; padding-left: 7px;}
#viewCustomers .table-toolbar .section-heading{gap: 13px;}
#viewCustomers .table-toolbar .section-heading h2{font-size: 21px;}
#viewCustomers .table-tools{display: flex; align-items: center; gap: 10px;}
#viewCustomers .search-field{height: 44px; display: flex; align-items: center; gap: 10px; background: rgba(255, 255, 255, 0.93); border: 1px solid rgb(228, 229, 233); border-radius: 10px; padding: 0px 13px; color: rgb(138, 147, 160); transition: border-color 0.15s, box-shadow 0.15s;}
#viewCustomers .search-field:focus-within{border-color: rgb(220, 158, 144); box-shadow: rgba(200, 41, 29, 0.04) 0px 0px 0px 3px;}
#viewCustomers .search-field .ico{height: 18px; width: 18px;}
#viewCustomers .search-field input{border: 0px; background: transparent; outline: none; flex: 1 1 0%; width: 100%; font-size: 13px; color: var(--text);}
#viewCustomers .table-tools .search-field{width: 252px;}
#viewCustomers .table-tools .button{height: 43px; padding: 0px 17px; font-size: 13px;}
#viewCustomers .filter-wrap{position: relative;}
#viewCustomers .customer-table{width: 100%; border-collapse: collapse; table-layout: fixed; text-align: left;}
#viewCustomers .customer-table th{background: rgb(247, 246, 245); height: 35px; font-size: 12px; color: rgb(130, 136, 149); font-weight: 650; padding: 0px 12px;}
#viewCustomers .customer-table th:first-child{border-radius: 6px 0px 0px 6px;}
#viewCustomers .customer-table th:last-child{border-radius: 0px 6px 6px 0px;}
#viewCustomers .customer-table td{height: 57px; border-bottom: 1px solid rgb(239, 238, 237); padding: 5px 12px; font-size: 13px; color: rgb(88, 97, 113); vertical-align: middle;}
#viewCustomers .col-client{width: 24%;}
#viewCustomers .col-status{width: 13%;}
#viewCustomers .col-recent{width: 19%;}
#viewCustomers .col-next{width: 16%;}
#viewCustomers .col-actions{width: 28%;}
#viewCustomers .customer-table th:first-child,#viewCustomers .customer-table td:first-child{padding-left: 10px;}
#viewCustomers .customer-table th:last-child{text-align: left; padding-left: 12px;}
#viewCustomers .customer-table tbody tr:hover{background: rgb(254, 250, 248);}
#viewCustomers .client-cell{display: flex; align-items: center; gap: 16px; min-width: 0px;}
#viewCustomers .avatar-initial{display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; height: 38px; width: 38px; background: rgb(253, 235, 231); color: rgb(187, 62, 44); font-size: 14px; font-weight: 700; flex-shrink: 0;}
#viewCustomers .client-cell-text{min-width: 0px;}
#viewCustomers .client-name{font-size: 13px; font-weight: 750; color: rgb(34, 42, 54); display: block; line-height: 1.55; text-align: left; padding: 0px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#viewCustomers .client-name:hover{color: var(--brand);}
#viewCustomers .client-note{display: block; color: rgb(155, 160, 171); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; margin-top: 1px;}
#viewCustomers .status-pill{display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 15px; line-height: 1.5; font-size: 11px; background: rgb(255, 239, 235); color: rgb(198, 87, 67); white-space: nowrap;}
#viewCustomers .status-pill.intent{color: rgb(216, 116, 65); background: rgb(255, 241, 232);}
#viewCustomers .status-pill.sent{background: rgb(234, 244, 255); color: rgb(82, 139, 214);}
#viewCustomers .status-pill.new{background: rgb(237, 246, 238); color: rgb(104, 165, 119);}
#viewCustomers .status-pill.neutral{background: rgb(240, 241, 243); color: rgb(147, 154, 165);}
#viewCustomers .recent-date{font-size: 13px; color: rgb(88, 97, 113); line-height: 1.6;}
#viewCustomers .recent-activity{font-size: 11px; color: rgb(146, 153, 165); line-height: 1.6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#viewCustomers .next-follow{display: flex; align-items: center; gap: 9px; font-size: 13px; color: rgb(160, 165, 176); white-space: nowrap;}
#viewCustomers .next-follow .ico{width: 16px; height: 16px;}
#viewCustomers .next-follow:not(.has-date) .ico svg{fill: rgb(161, 166, 177); color: white; stroke-width: 1.2;}
#viewCustomers .next-follow.has-date{color: rgb(170, 89, 68);}
#viewCustomers .row-actions{display: flex; align-items: center; justify-content: flex-end; gap: 10px;}
#viewCustomers .row-actions .button{height: 38px; padding: 0px 15px; font-size: 12px; gap: 7px; border-radius: 8px;}
#viewCustomers .row-actions .ico{width: 15px; height: 15px;}
#viewCustomers .row-actions .is-focused{color: rgb(190, 68, 48); background: rgb(255, 242, 235); border-color: rgb(234, 202, 188);}
#viewCustomers .is-focused .ico svg{fill: currentcolor;}
#viewCustomers .table-footer{display: flex; align-items: center; justify-content: space-between; height: 42px; padding: 0px 7px; font-size: 12px; color: rgb(150, 157, 169);}
#viewCustomers .empty-table td{height: 150px; text-align: center; font-size: 14px; color: rgb(146, 153, 165);}
#viewCustomers .empty-table button{margin-left: 12px;}
#viewCustomers .archive-page{display: grid; grid-template-columns: 325px minmax(0px, 1fr); min-height: calc(-60px + 100vh); max-width: 1760px; margin: auto;}
#viewCustomers .customer-sidebar{border-right: 1px solid rgb(236, 233, 230); padding: 18px 18px 32px 31px;}
#viewCustomers .customer-sidebar h1{font-size: 23px; line-height: 1.5; font-weight: 800;}
#viewCustomers .customer-sidebar > p{color: rgb(124, 133, 148); font-size: 13px; margin: 5px 0px 17px; white-space: nowrap;}
#viewCustomers .sidebar-search{height: 39px; padding: 0px 10px; gap: 8px; margin-bottom: 15px;}
#viewCustomers .sidebar-search input{font-size: 12px;}
#viewCustomers .customer-sidebar-list{display: grid; gap: 9px;}
#viewCustomers .sidebar-client{display: flex; align-items: center; gap: 13px; width: 100%; border: 1px solid rgb(232, 229, 226); background: rgba(255, 255, 255, 0.84); border-radius: 12px; padding: 11px 10px; text-align: left; min-height: 69px; position: relative; transition: background 0.15s, border-color 0.15s;}
#viewCustomers .sidebar-client.active{background: rgb(255, 243, 239); border-color: rgb(237, 148, 134); box-shadow: rgba(255, 255, 255, 0.55) 0px 0px 0px 3px inset;}
#viewCustomers .sidebar-client:hover{background: rgb(255, 246, 242); border-color: rgb(231, 183, 170);}
#viewCustomers .sidebar-client .avatar-initial{width: 42px; height: 42px; font-size: 17px;}
#viewCustomers .sidebar-client .client-name{font-size: 13px; max-width: 150px;}
#viewCustomers .sidebar-client .client-note{max-width: 180px; font-size: 11px;}
#viewCustomers .sidebar-client .status-pill{font-size: 10px; padding: 3px 7px; position: absolute; right: 10px; top: 18px;}
#viewCustomers .sidebar-client .client-cell-text{flex: 1 1 0%;}
#viewCustomers .sidebar-client .client-name{padding-right: 38px;}
#viewCustomers .sidebar-empty{text-align: center; color: var(--secondary); padding: 26px 0px;}
#viewCustomers .archive-main{min-width: 0px; padding: 18px 30px 22px 24px;}
#viewCustomers .customer-detail-header{display: flex; align-items: center; justify-content: space-between; height: 59px; margin-bottom: 10px;}
#viewCustomers .customer-identity{display: flex; gap: 15px; align-items: center;}
#viewCustomers .customer-identity .avatar-initial{width: 57px; height: 57px; font-size: 24px; background: rgb(254, 228, 222);}
#viewCustomers .customer-identity h1{font-size: 23px; font-weight: 800;}
#viewCustomers .customer-identity p{font-size: 14px; color: rgb(150, 157, 168); margin-top: 1px;}
#viewCustomers .header-actions{display: flex; gap: 12px; align-items: center;}
#viewCustomers .header-actions .button{height: 44px;}
#viewCustomers .archive-ai-banner{display: flex; align-items: center; gap: 16px; min-height: 115px; background: linear-gradient(120deg, rgb(255, 243, 239), rgb(255, 247, 245)); border: 1px solid rgb(245, 217, 210); border-radius: 12px; padding: 14px 17px; margin-bottom: 15px;}
#viewCustomers .archive-ai-banner .robot-art{width: 88px; height: 82px;}
#viewCustomers .archive-ai-copy{min-width: 0px; flex: 1 1 0%;}
#viewCustomers .archive-ai-copy .eyebrow{font-size: 13px; margin-bottom: 2px; color: rgb(166, 83, 67);}
#viewCustomers .archive-ai-copy h2{font-size: 23px; font-weight: 800; line-height: 1.5;}
#viewCustomers .archive-ai-copy p{font-size: 13px; color: rgb(149, 156, 168); line-height: 1.65; margin-top: 2px; white-space: nowrap;}
#viewCustomers .archive-ai-banner .button{height: 51px; min-width: 185px; flex-shrink: 0; font-size: 15px;}
#viewCustomers .archive-ai-banner .coach-note{width: 145px; height: 80px; margin: 0px;}
#viewCustomers .archive-utilities{display: flex; gap: 11px; flex-wrap: wrap; margin-bottom: 13px;}
#viewCustomers .archive-utilities .button{height: 41px; padding: 0px 16px; font-size: 13px; gap: 9px;}
#viewCustomers .archive-tabs{display: flex; align-items: center; gap: 11px; margin-bottom: 10px;}
#viewCustomers .archive-tabs .button{height: 41px; font-size: 13px; padding: 0px 19px;}
#viewCustomers .archive-tabs .selected{color: var(--brand); background: rgb(255, 244, 241); border-color: rgb(244, 219, 211); font-weight: 650;}
#viewCustomers .progress-stepper{height: 89px; padding: 16px 16px 12px; display: flex; margin-bottom: 16px; border-radius: 11px;}
#viewCustomers .progress-step{flex: 1 1 0%; display: flex; flex-direction: column; align-items: center; position: relative; gap: 8px; color: rgb(124, 146, 152); font-size: 13px;}
#viewCustomers .progress-step:not(:last-child)::after{position: absolute; content: ""; height: 1px; background: rgb(217, 224, 228); left: calc(50% + 26px); width: calc(100% - 52px); top: 15px;}
#viewCustomers .step-circle{width: 27px; height: 27px; display: grid; place-items: center; background: rgb(237, 241, 237); border-radius: 50%; color: rgb(118, 140, 147); line-height: 1; font-size: 13px;}
#viewCustomers .progress-step.current{color: var(--brand); font-weight: 700;}
#viewCustomers .progress-step.current .step-circle{background: linear-gradient(135deg, rgb(223, 54, 39), rgb(190, 32, 23)); color: white; box-shadow: rgb(251, 228, 223) 0px 0px 0px 4px;}
#viewCustomers .progress-step.done .step-circle{background: rgb(246, 233, 227); color: rgb(187, 106, 81);}
#viewCustomers .follow-card{border: 1px solid rgb(229, 217, 210); box-shadow: var(--shadow); border-radius: 13px; overflow: hidden; background: rgb(255, 255, 255);}
#viewCustomers .follow-card-header{padding: 13px 25px 12px; color: white; background: linear-gradient(108deg, rgb(136, 75, 59), rgb(124, 57, 46) 64%, rgb(137, 75, 61)); position: relative; min-height: 109px;}
#viewCustomers .follow-card-header .overline{font-size: 13px; font-weight: 500; opacity: 0.92;}
#viewCustomers .follow-card-header h2{font-size: 29px; font-weight: 800; line-height: 1.4; margin: 1px 0px;}
#viewCustomers .follow-card-header .card-meta{font-size: 11px; color: rgb(244, 221, 213);}
#viewCustomers .current-badge{position: absolute; right: 21px; top: 16px; border-radius: 20px; background: rgba(255, 255, 255, 0.145); padding: 5px 15px; font-size: 12px;}
#viewCustomers .follow-card-body{padding: 10px 24px 9px;}
#viewCustomers .follow-intro{font-size: 12px; color: rgb(114, 125, 142); line-height: 1.85; margin-bottom: 8px;}
#viewCustomers .inline-block{display: grid; grid-template-columns: 165px minmax(0px, 1fr); gap: 0px; align-items: start; border-radius: 10px; padding: 10px 16px; margin-bottom: 8px; font-size: 12px; line-height: 1.65; background: rgb(251, 243, 240);}
#viewCustomers .inline-label{display: flex; align-items: center; gap: 10px; color: rgb(185, 61, 39); font-size: 13px; font-weight: 750; white-space: nowrap;}
#viewCustomers .inline-label .ico{width: 21px; height: 21px;}
#viewCustomers .inline-copy{padding-top: 1px; color: rgb(45, 55, 71);}
#viewCustomers .objective .inline-copy{font-weight: 650;}
#viewCustomers .inline-block.script{border: 1px solid rgb(248, 222, 170); background: rgb(255, 250, 240); position: relative;}
#viewCustomers .inline-block.script .inline-label{color: rgb(183, 109, 46);}
#viewCustomers .inline-block.next-action{background: rgb(252, 242, 239);}
#viewCustomers .script:hover .copy-inline{opacity: 1;}
#viewCustomers .copy-inline{position: absolute; right: 8px; top: 5px; background: rgb(255, 250, 240); border: 1px solid rgb(241, 225, 199); border-radius: 6px; padding: 4px 7px; font-size: 10px; color: rgb(168, 118, 73); opacity: 0;}
#viewCustomers .follow-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin-bottom: 8px;}
#viewCustomers .follow-small-box{border: 1px solid rgb(228, 232, 234); border-radius: 10px; padding: 8px 14px; min-height: 82px; font-size: 11px; color: rgb(115, 128, 148); line-height: 1.8;}
#viewCustomers .follow-small-box h3{display: flex; align-items: center; gap: 11px; font-size: 12px; color: rgb(36, 49, 71); margin-bottom: 2px;}
#viewCustomers .follow-small-box h3 .ico{width: 20px; height: 20px;}
#viewCustomers .follow-small-box ul{padding: 0px 0px 0px 25px; margin: 0px;}
#viewCustomers .follow-notice{background: rgb(255, 255, 255); border: 1px solid rgb(232, 232, 232); grid-template-columns: 140px minmax(0px, 1fr); padding: 8px 15px; line-height: 1.75; font-size: 11px;}
#viewCustomers .follow-notice .inline-label{color: rgb(200, 41, 29);}
#viewCustomers .follow-notice ul{padding-left: 16px; margin: 0px; color: rgb(118, 128, 150);}
#viewCustomers .follow-evidence{grid-template-columns: 154px minmax(0px, 1fr); margin-bottom: 0px; background: rgb(242, 244, 246); padding: 9px 15px; font-size: 10px; line-height: 1.7; color: rgb(148, 155, 164);}
#viewCustomers .follow-evidence .inline-label{color: rgb(53, 66, 89); font-size: 12px;}
#viewCustomers .follow-evidence .inline-copy{color: rgb(144, 153, 162); padding: 0px;}
#viewCustomers .facts-panel,#viewCustomers .history-panel{padding: 22px; margin-top: 13px;}
#viewCustomers .facts-panel h2,#viewCustomers .history-panel h2{font-size: 19px; margin-bottom: 12px;}
#viewCustomers .facts-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 14px;}
#viewCustomers .fact-item{padding: 14px; background: rgb(250, 248, 245); border-radius: 8px;}
#viewCustomers .fact-item dt{font-size: 12px; color: var(--secondary);}
#viewCustomers .fact-item dd{margin: 5px 0px 0px; font-size: 14px;}
#viewCustomers .facts-note{font-size: 13px; line-height: 1.8; margin-top: 16px; color: var(--secondary);}
#viewCustomers .history-entry{padding: 13px 0px; border-top: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center;}
#viewCustomers .history-entry p{color: var(--secondary); font-size: 12px;}
#viewCustomers .guide-page{padding: 0px 32px 42px; position: relative; max-width: 1600px; margin: auto;}
#viewCustomers .guide-hero{position: relative; text-align: center; padding-top: 65px;}
#viewCustomers .guide-hero h1{font-size: 39px; line-height: 1.5; letter-spacing: -1.2px; font-weight: 800;}
#viewCustomers .guide-hero > p{color: rgb(139, 148, 163); font-size: 16px; margin-top: 5px; letter-spacing: 0.15px;}
#viewCustomers .guide-features{display: flex; align-items: center; justify-content: space-between; max-width: 760px; margin: 38px auto 0px; text-align: left;}
#viewCustomers .guide-features .mini-feature{gap: 14px;}
#viewCustomers .guide-features .feature-icon{width: 52px; height: 52px;}
#viewCustomers .guide-features .feature-icon .ico{width: 26px; height: 26px;}
#viewCustomers .guide-features .mini-feature strong{font-size: 16px; line-height: 1.8;}
#viewCustomers .guide-features .mini-feature small{font-size: 13px; line-height: 1.65;}
#viewCustomers .upload-note-top{position: absolute; right: 8px; top: 87px; width: 195px; height: 115px; object-fit: contain; mix-blend-mode: multiply; pointer-events: none;}
#viewCustomers .upload-flow{width: 1004px; max-width: 100%; margin: 42px auto 0px; position: relative;}
#viewCustomers .upload-note-left{position: absolute; left: -158px; top: 25px; width: 123px; height: 120px; object-fit: contain; mix-blend-mode: multiply; pointer-events: none;}
#viewCustomers .upload-card{padding: 29px 36px 23px; border-radius: 20px; box-shadow: rgba(82, 69, 57, 0.02) 0px 8px 26px;}
#viewCustomers .step-title{display: flex; align-items: center; gap: 22px; margin-bottom: 26px;}
#viewCustomers .step-number{display: flex; align-items: center; justify-content: center; width: 51px; height: 51px; border-radius: 50%; background: rgb(255, 240, 237); color: var(--brand); font-size: 23px; font-weight: 650; flex-shrink: 0;}
#viewCustomers .step-title h2{font-size: 22px; line-height: 1.6; font-weight: 750;}
#viewCustomers .step-title p{font-size: 14px; color: rgb(150, 157, 171); margin-top: 2px;}
#viewCustomers .dropzone{width: 100%; height: 276px; border: 1px dashed rgb(234, 162, 146); border-radius: 15px; background: linear-gradient(145deg, rgb(255, 250, 248), rgb(253, 249, 247)); display: flex; flex-direction: column; align-items: center; justify-content: center; transition: background 0.2s, border-color 0.2s; position: relative; overflow: hidden;}
#viewCustomers .dropzone:hover,#viewCustomers .dropzone.dragover{background: rgb(255, 241, 234); border-color: var(--brand);}
#viewCustomers .dropzone.dragover{outline: rgb(252, 225, 216) solid 4px;}
#viewCustomers .upload-plus{width: 73px; height: 73px; background: rgb(251, 232, 226); display: grid; place-items: center; color: var(--brand); border-radius: 50%; margin-bottom: 16px;}
#viewCustomers .upload-plus .ico{width: 28px; height: 28px; stroke-width: 1.8;}
#viewCustomers .dropzone > strong{font-size: 19px; line-height: 1.6; font-weight: 750;}
#viewCustomers .dropzone-help{font-size: 14px; color: rgb(142, 151, 167); margin-top: 8px;}
#viewCustomers .upload-info{display: flex; align-items: center; gap: 24px; border-radius: 12px; background: linear-gradient(105deg, rgb(255, 245, 242), rgb(255, 247, 245)); margin-top: 22px; height: 137px; padding: 16px 21px; position: relative; overflow: hidden;}
#viewCustomers .upload-info > img:first-child{width: 92px; height: 90px; object-fit: contain; mix-blend-mode: multiply;}
#viewCustomers .upload-info-copy{border-left: 1px solid rgb(239, 221, 215); padding-left: 27px;}
#viewCustomers .upload-info h3{font-size: 16px; color: var(--brand); font-weight: 750; margin-bottom: 9px;}
#viewCustomers .upload-info p{display: flex; align-items: center; gap: 12px; font-size: 13px; color: rgb(135, 146, 162); margin-top: 7px; white-space: nowrap;}
#viewCustomers .check-dot{width: 16px; height: 16px; border-radius: 50%; background: rgb(206, 51, 36); color: rgb(255, 255, 255); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;}
#viewCustomers .check-dot .ico{width: 12px; height: 12px;}
#viewCustomers .check-dot svg{stroke-width: 2.5;}
#viewCustomers .upload-note-bottom{width: 163px; height: 100px; object-fit: contain; mix-blend-mode: multiply; margin-left: auto;}
#viewCustomers .result-teaser{display: flex; align-items: center; gap: 24px; padding: 23px 36px; margin-top: 18px; border-radius: 16px; color: rgb(139, 148, 160); height: 109px; box-shadow: none;}
#viewCustomers .step-number.muted{background: rgb(240, 242, 244); color: rgb(146, 155, 169);}
#viewCustomers .result-teaser h2{font-size: 20px;}
#viewCustomers .result-teaser p{color: rgb(161, 168, 180); font-size: 14px; margin-top: 1px;}
#viewCustomers .result-teaser .circle-button{margin-left: auto;}
#viewCustomers .upload-preview{margin-top: 16px; padding: 16px; border-radius: 12px; border: 1px solid rgb(235, 222, 214); background: rgb(255, 252, 249); display: flex; gap: 18px; align-items: center;}
#viewCustomers .upload-thumb{width: 88px; height: 98px; object-fit: contain; background: rgb(243, 239, 235); border-radius: 7px;}
#viewCustomers .upload-file-info{min-width: 0px; flex: 1 1 0%;}
#viewCustomers .upload-file-info strong{display: block; word-break: break-all; font-size: 14px;}
#viewCustomers .upload-file-info small{display: block; font-size: 12px; color: var(--secondary); margin: 5px 0px;}
#viewCustomers .upload-preview .button{font-size: 12px; padding: 0px 12px;}
#viewCustomers .guide-result{padding: 28px 34px; margin-top: 20px; scroll-margin-top: 20px;}
#viewCustomers .guide-result h2{font-size: 22px; margin-bottom: 8px;}
#viewCustomers .guide-result > p{font-size: 13px; color: var(--secondary);}
#viewCustomers .guide-result .result-script{padding: 20px; background: rgb(255, 250, 239); border: 1px solid rgb(238, 219, 184); border-radius: 10px; line-height: 1.9; margin: 18px 0px;}
#viewCustomers .guide-result-actions{display: flex; gap: 12px; margin-top: 18px;}
#viewCustomers .file-miniature{position: absolute; inset: 14px; display: flex; align-items: center; justify-content: center; gap: 28px;}
#viewCustomers .file-miniature img{max-height: 100%; max-width: 45%; object-fit: contain; border-radius: 8px; box-shadow: rgba(101, 64, 46, 0.086) 0px 3px 12px;}
#viewCustomers .file-miniature div{text-align: left; max-width: 40%; overflow-wrap: anywhere;}
#viewCustomers .file-miniature h3{font-size: 18px; margin-bottom: 10px;}
#viewCustomers .file-miniature p{font-size: 12px; color: var(--secondary);}
#viewCustomers .file-miniature span{font-size: 12px; color: var(--brand); display: block; margin-top: 13px;}
#viewCustomers .drawer-scrim{position: fixed; inset: 0px; background: rgba(29, 28, 26, 0.43); z-index: 40; animation: 0.18s ease 0s 1 normal none running fade-in;}
#viewCustomers .chat-drawer{position: fixed; right: 6px; top: 6px; bottom: 6px; width: 576px; max-width: calc(-12px + 100vw); border-radius: 16px; background: linear-gradient(145deg, rgb(255, 253, 252), rgb(255, 255, 255) 45%); box-shadow: rgba(46, 35, 30, 0.1) -8px 0px 36px; z-index: 41; display: flex; flex-direction: column; overflow: hidden; animation: 0.22s ease 0s 1 normal none running drawer-in;}
#viewCustomers .chat-header{min-height: 108px; padding: 24px 28px 18px; border-bottom: 1px solid rgb(240, 236, 233); display: flex; gap: 16px; background: rgb(255, 250, 247); position: relative;}
#viewCustomers .chat-header h2{font-size: 22px; font-weight: 800; line-height: 1.5; letter-spacing: -0.5px; margin-right: 15px;}
#viewCustomers .chat-header p{font-size: 11px; line-height: 1.8; color: rgb(134, 144, 160); max-width: 490px; margin-top: 9px; white-space: nowrap; letter-spacing: -0.3px;}
#viewCustomers .close-chat{position: absolute; right: 20px; top: 20px; width: 32px; height: 32px; background: rgb(241, 238, 235); border-radius: 9px;}
#viewCustomers .close-chat .ico{height: 17px; width: 17px;}
#viewCustomers .chat-messages{flex: 1 1 0%; min-height: 0px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 22px;}
#viewCustomers .chat-welcome{height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 490px; padding-top: 8px;}
#viewCustomers .chat-robot{width: 268px; height: 175px; object-fit: contain; mix-blend-mode: multiply; margin-bottom: 24px;}
#viewCustomers .chat-welcome h3{font-size: 21px; line-height: 1.5; font-weight: 750; margin-bottom: 10px;}
#viewCustomers .chat-welcome > p{font-size: 14px; color: rgb(139, 148, 164); line-height: 1.95; text-align: center; max-width: 465px;}
#viewCustomers .suggestions{display: grid; grid-template-columns: 1.26fr 1fr; gap: 12px; margin-top: 48px; width: 100%; padding: 0px;}
#viewCustomers .suggestion-chip{display: flex; align-items: center; justify-content: center; gap: 8px; background: rgb(255, 243, 241); border: 1px solid transparent; border-radius: 30px; padding: 11px 10px; min-height: 44px; color: rgb(142, 120, 116); font-size: 11px; white-space: nowrap; letter-spacing: -0.2px;}
#viewCustomers .suggestion-chip .ico{width: 17px; height: 17px; color: rgb(216, 101, 81);}
#viewCustomers .suggestion-chip:hover{border-color: rgb(240, 192, 179); background: rgb(253, 235, 223);}
#viewCustomers .chat-footer{flex-shrink: 0; padding: 18px 20px 28px; position: relative; background: rgb(255, 253, 252);}
#viewCustomers .chat-footer::before{content: ""; height: 1px; position: absolute; top: 0px; left: 20px; right: 20px; background: rgb(240, 235, 231);}
#viewCustomers .chat-tools{display: flex; align-items: center; gap: 10px;}
#viewCustomers .mode-select{height: 43px; position: relative; display: flex; align-items: center;}
#viewCustomers .mode-select select{height: 43px; appearance: none; border: 1px solid rgb(226, 223, 220); border-radius: 11px; padding: 0px 28px 0px 15px; background: rgb(255, 255, 255); color: rgb(53, 63, 80); font-size: 13px;}
#viewCustomers .mode-select > .ico{position: absolute; pointer-events: none; right: 10px; width: 12px; height: 12px;}
#viewCustomers .update-card-button{font-size: 12px; height: 43px; padding: 0px 15px;}
#viewCustomers .update-card-button .ico{color: var(--brand); width: 17px; height: 17px;}
#viewCustomers .composer-helper{font-size: 11px; color: rgb(139, 147, 160); line-height: 1.4; margin: 12px 0px 13px;}
#viewCustomers .composer{border: 1px solid rgb(240, 173, 163); border-radius: 14px; min-height: 103px; position: relative; padding: 12px 123px 12px 14px; background: rgb(255, 255, 255); transition: box-shadow 0.15s, border 0.15s;}
#viewCustomers .composer:focus-within{border-color: rgb(218, 102, 84); box-shadow: rgba(211, 87, 67, 0.035) 0px 0px 0px 3px;}
#viewCustomers .composer textarea{width: 100%; height: 75px; resize: none; border: 0px; outline: none; color: var(--text); line-height: 1.85; font-size: 15px; background: transparent; display: block;}
#viewCustomers .composer textarea::placeholder{color: rgb(142, 152, 168);}
#viewCustomers .composer-controls{display: flex; align-items: center; gap: 16px; position: absolute; right: 13px; bottom: 13px;}
#viewCustomers .mic-button{width: 25px; height: 36px;}
#viewCustomers .mic-button .ico{height: 23px; width: 23px;}
#viewCustomers .send-button{height: 46px; width: 79px; border-radius: 10px; font-size: 15px; padding: 0px;}
#viewCustomers .chat-turn{margin: 8px 0px 23px; animation: 0.15s ease 0s 1 normal none running fade-in;}
#viewCustomers .chat-turn.user{display: flex; justify-content: flex-end;}
#viewCustomers .chat-bubble{font-size: 14px; line-height: 1.85; white-space: pre-wrap; overflow-wrap: anywhere; border-radius: 14px; padding: 14px 16px; max-width: 93%;}
#viewCustomers .chat-turn.user .chat-bubble{background: rgb(250, 235, 229); border: 1px solid rgb(240, 216, 207); color: rgb(112, 67, 51);}
#viewCustomers .chat-turn.assistant .chat-bubble{background: rgb(250, 248, 245); border: 1px solid rgb(236, 229, 222); max-width: 100%;}
#viewCustomers .assistant-name{font-size: 12px; color: rgb(170, 98, 80); margin-bottom: 7px; display: flex; align-items: center; gap: 8px;}
#viewCustomers .assistant-name .ico{width: 17px; height: 17px;}
#viewCustomers .chat-message-demo{font-size: 10px; color: rgb(165, 146, 131); display: block; margin-top: 11px;}
#viewCustomers .chat-typing{color: rgb(151, 144, 135); font-size: 13px; padding: 10px 0px;}
#viewCustomers .message-actions{margin-top: 7px; text-align: right;}
#viewCustomers .message-actions .button{height: 29px; font-size: 11px; padding: 0px 9px;}
#viewCustomers .message-actions .ico{height: 13px; width: 13px;}
#viewCustomers .modal-layer{position: fixed; inset: 0px; z-index: 60; display: flex; align-items: center; justify-content: center; padding: 20px;}
#viewCustomers .modal-scrim{position: absolute; inset: 0px; background: rgba(29, 29, 27, 0.43); animation: 0.15s ease 0s 1 normal none running fade-in;}
#viewCustomers .modal{width: 772px; max-width: 100%; background: rgb(255, 255, 255); border-radius: 23px; position: relative; box-shadow: rgba(31, 26, 23, 0.18) 0px 18px 70px; overflow: hidden auto; max-height: calc(100dvh - 40px); animation: 0.18s ease 0s 1 normal none running modal-in;}
#viewCustomers .modal-create{min-height: 449px;}
#viewCustomers .modal-heading{display: flex; align-items: center; gap: 27px; padding: 35px 38px 0px;}
#viewCustomers .modal-symbol{width: 75px; height: 75px; background: rgb(255, 243, 240); border-radius: 17px; display: grid; place-items: center; color: var(--brand); flex-shrink: 0;}
#viewCustomers .modal-symbol .ico{width: 36px; height: 36px;}
#viewCustomers .modal-heading h2{font-size: 32px; line-height: 1.5; font-weight: 800; letter-spacing: -0.5px;}
#viewCustomers .modal-heading p{font-size: 18px; color: rgb(139, 143, 152); margin-top: 1px;}
#viewCustomers .modal-close{position: absolute; right: 33px; top: 30px; width: 44px; height: 44px; border-radius: 50%; background: rgb(247, 239, 235);}
#viewCustomers .modal-close .ico{width: 21px; height: 21px;}
#viewCustomers .modal-form-body{padding: 33px 38px 26px;}
#viewCustomers .field-label{font-size: 18px; font-weight: 500; color: rgb(62, 70, 85); display: block; margin-bottom: 10px;}
#viewCustomers .required{color: var(--brand); margin-right: 7px;}
#viewCustomers .form-input{width: 100%; border: 1px solid rgb(230, 188, 177); border-radius: 12px; background: rgb(255, 255, 255); height: 71px; padding: 0px 18px; font-size: 20px; color: var(--text); box-shadow: none; transition: border 0.15s, box-shadow 0.15s;}
#viewCustomers .form-input:focus{border-color: rgb(217, 101, 81); box-shadow: rgba(215, 92, 71, 0.035) 0px 0px 0px 3px;}
#viewCustomers .form-input::placeholder{color: rgb(175, 179, 189);}
#viewCustomers .field-info{display: flex; align-items: center; gap: 12px; color: rgb(155, 161, 173); font-size: 14px; line-height: 1.6; margin-top: 19px;}
#viewCustomers .field-info .ico{width: 20px; height: 20px; color: rgb(142, 150, 163);}
#viewCustomers .field-error{color: var(--brand); font-size: 12px; margin-top: 7px; min-height: 0px;}
#viewCustomers .modal-footer{height: 116px; display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 0px 30px 0px 37px; background: linear-gradient(120deg, rgb(255, 251, 248), rgb(255, 248, 245)); position: relative; isolation: isolate; overflow: hidden;}
#viewCustomers .modal-footer::before,#viewCustomers .modal-footer::after{content: ""; position: absolute; z-index: -1; background: rgb(253, 232, 226); border-radius: 50%; width: 180px; height: 180px; right: -91px; bottom: -130px;}
#viewCustomers .modal-footer::after{width: 100px; height: 180px; right: -80px; bottom: -36px; transform: rotate(20deg); background: rgb(252, 239, 235);}
#viewCustomers .modal-footer > .button{height: 54px; min-width: 112px; font-size: 17px; border-radius: 13px;}
#viewCustomers .modal-footer > .button:not(.primary){border-color: rgb(233, 201, 190);}
#viewCustomers .create-note{width: 227px; height: 83px; object-fit: contain; mix-blend-mode: multiply; margin-right: auto;}
#viewCustomers .modal-compact{width: 570px;}
#viewCustomers .modal-compact .modal-heading{padding: 28px 28px 0px; gap: 16px;}
#viewCustomers .modal-compact .modal-heading h2{font-size: 23px;}
#viewCustomers .modal-compact .modal-heading p{font-size: 13px;}
#viewCustomers .modal-compact .modal-symbol{width: 52px; height: 52px; border-radius: 13px;}
#viewCustomers .modal-compact .modal-symbol .ico{width: 26px; height: 26px;}
#viewCustomers .modal-compact .modal-close{width: 32px; height: 32px; top: 22px; right: 22px;}
#viewCustomers .modal-compact .modal-form-body{padding: 23px 28px;}
#viewCustomers .modal-compact .field-label{font-size: 14px; margin-bottom: 8px;}
#viewCustomers .modal-compact .form-input{height: 45px; font-size: 14px; border-color: rgb(222, 217, 212); border-radius: 9px; padding: 0px 12px;}
#viewCustomers .modal-compact textarea.form-input{height: 134px; padding: 12px; resize: vertical;}
#viewCustomers .modal-compact .modal-footer{height: 83px; padding: 0px 28px;}
#viewCustomers .modal-compact .modal-footer .button{height: 43px; font-size: 14px; min-width: 88px; border-radius: 9px;}
#viewCustomers .modal-compact .field-info{font-size: 12px; margin-top: 14px;}
#viewCustomers .form-row{margin-bottom: 17px;}
#viewCustomers .form-row:last-child{margin-bottom: 0px;}
#viewCustomers .form-two-columns{display: grid; grid-template-columns: 1fr 1fr; gap: 14px;}
#viewCustomers .progress-options{display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 10px 0px;}
#viewCustomers .progress-option{padding: 12px; text-align: left; border: 1px solid rgb(231, 224, 218); border-radius: 9px; font-size: 13px;}
#viewCustomers .progress-option.active{color: var(--brand); border-color: rgb(223, 157, 141); background: rgb(255, 242, 237);}
#viewCustomers .schedule-card{display: flex; align-items: center; justify-content: space-between; border: 1px solid rgb(236, 229, 222); border-radius: 10px; padding: 12px 14px; margin-top: 11px;}
#viewCustomers .schedule-card p{font-size: 12px; color: var(--secondary); margin-top: 3px;}
#viewCustomers .about-content{color: var(--secondary); font-size: 13px; line-height: 1.9;}
#viewCustomers .about-content p + p{margin-top: 13px;}
#viewCustomers .about-content strong{color: var(--text);}
#viewCustomers .toast-container{position: fixed; left: 50%; bottom: 25px; transform: translateX(-50%); z-index: 100; display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; max-width: calc(-32px + 100vw);}
#viewCustomers .toast{padding: 13px 20px; max-width: 100%; border: 1px solid rgb(232, 225, 217); border-radius: 10px; background: rgb(255, 255, 255); box-shadow: rgba(53, 37, 26, 0.133) 0px 7px 24px; color: rgb(81, 91, 102); font-size: 13px; line-height: 1.6; display: flex; align-items: center; gap: 10px; animation: 0.2s ease 0s 1 normal none running toast-in; pointer-events: auto;}
#viewCustomers .toast > .ico{color: rgb(180, 84, 61); width: 18px; height: 18px;}
#viewCustomers .export-note{font-size: 12px; color: var(--secondary); line-height: 1.8;}
@keyframes fade-in { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes drawer-in { 
  0% { opacity: 0; transform: translateX(20px); }
  100% { opacity: 1; transform: translateX(0px); }
}
@keyframes modal-in { 
  0% { opacity: 0; transform: translateY(10px) scale(0.99); }
  100% { opacity: 1; transform: none; }
}
@keyframes toast-in { 
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: none; }
}
@keyframes spin { 
  100% { transform: rotate(360deg); }
}
#viewCustomers .spinning{animation: 0.8s linear 0s infinite normal none running spin;}
@media (min-width: 1600px){#viewCustomers .plan-copy h2{font-size: 19px;}
#viewCustomers .hero-art{left: calc(50% - 310px);}
#viewCustomers .hero-copy{padding-left: 25px;}
#viewCustomers .hero-actions{width: 445px;}
#viewCustomers .plan-actions{margin-left: 20px;}
#viewCustomers .coach-note{width: 184px;}
#viewCustomers .follow-card-body{padding: 17px 25px;}
#viewCustomers .inline-block{padding-top: 14px; padding-bottom: 14px;}
#viewCustomers .follow-intro{font-size: 14px;}
#viewCustomers .follow-small-box{font-size: 12px;}
#viewCustomers .archive-main{padding-left: 30px; padding-right: 34px;}}
@media (max-width: 1380px){#viewCustomers .topnav{gap: 12px; margin-right: 22px;}
#viewCustomers .brand-tagline{font-size: 13px; margin-left: 20px;}
#viewCustomers .dashboard{padding: 0px 32px 22px;}
#viewCustomers .hero h1{font-size: 40px;}
#viewCustomers .hero-art{width: 548px; left: calc(50% - 296px);}
#viewCustomers .hero-actions{width: 370px;}
#viewCustomers .action-card{padding: 18px; gap: 17px;}
#viewCustomers .action-icon{width: 60px; height: 60px;}
#viewCustomers .action-copy strong{font-size: 17px;}
#viewCustomers .action-copy small{font-size: 12px;}
#viewCustomers .plan-banner{gap: 14px; padding: 18px;}
#viewCustomers .plan-copy h2{font-size: 16px;}
#viewCustomers .plan-copy p{font-size: 12px;}
#viewCustomers .coach-note{width: 145px;}
#viewCustomers .plan-actions{gap: 12px;}
#viewCustomers .plan-actions .button{font-size: 14px; padding: 0px 17px;}
#viewCustomers .plan-actions .primary{min-width: 170px;}
#viewCustomers .plan-actions .button:not(.primary){min-width: 138px;}
#viewCustomers .overview-card{padding-left: 22px; padding-right: 22px;}
#viewCustomers .section-heading h2{font-size: 21px;}
#viewCustomers .overview-text{font-size: 13px;}
#viewCustomers .focus-art{width: 190px; right: 6px;}
#viewCustomers .row-actions{gap: 6px;}
#viewCustomers .row-actions .button{padding: 0px 10px; font-size: 11px;}
#viewCustomers .archive-page{grid-template-columns: 294px minmax(0px, 1fr);}
#viewCustomers .customer-sidebar{padding-left: 24px;}
#viewCustomers .sidebar-client .status-pill{right: 8px;}
#viewCustomers .archive-main{padding-left: 20px; padding-right: 25px;}
#viewCustomers .archive-ai-banner{gap: 12px;}
#viewCustomers .archive-ai-copy h2{font-size: 21px;}
#viewCustomers .archive-ai-copy p{font-size: 11px;}
#viewCustomers .archive-ai-banner .coach-note{width: 121px;}
#viewCustomers .archive-ai-banner .button{min-width: 162px; font-size: 13px;}
#viewCustomers .archive-utilities{gap: 8px;}
#viewCustomers .archive-utilities .button{padding: 0px 12px; font-size: 12px;}
#viewCustomers .guide-hero h1{font-size: 35px;}
#viewCustomers .upload-note-top{right: 0px; width: 150px;}
#viewCustomers .upload-note-left{width: 110px; left: -125px;}}
@media (max-width: 1180px){#viewCustomers .topbar{margin: 0px 20px; padding: 0px 18px;}
#viewCustomers .brand-tagline{display: none;}
#viewCustomers .topnav{gap: 16px;}
#viewCustomers .dashboard{padding: 0px 24px 25px;}
#viewCustomers .hero-art{left: calc(50% - 265px); width: 480px; top: 14px; opacity: 0.95;}
#viewCustomers .hero-actions{width: 326px; top: 49px;}
#viewCustomers .action-card{gap: 13px; min-height: 110px; padding: 16px 14px;}
#viewCustomers .action-icon{width: 49px; height: 49px;}
#viewCustomers .action-icon .ico{width: 26px; height: 26px;}
#viewCustomers .action-copy strong{font-size: 16px;}
#viewCustomers .action-copy small{font-size: 11px;}
#viewCustomers .round-arrow{height: 30px; width: 30px;}
#viewCustomers .hero-copy{width: 415px; padding-left: 10px;}
#viewCustomers .hero h1{font-size: 37px;}
#viewCustomers .hero-features{gap: 14px;}
#viewCustomers .mini-feature{gap: 7px;}
#viewCustomers .hero-subtitle{font-size: 13px;}
#viewCustomers .hero-features .feature-icon{width: 32px; height: 32px;}
#viewCustomers .mini-feature strong{font-size: 11px;}
#viewCustomers .mini-feature small{font-size: 10px;}
#viewCustomers .plan-banner{height: auto; min-height: 128px; gap: 12px;}
#viewCustomers .plan-banner .coach-note{display: none;}
#viewCustomers .plan-copy h2{white-space: normal; font-size: 16px; line-height: 1.65;}
#viewCustomers .plan-copy p{white-space: normal; font-size: 11px;}
#viewCustomers .plan-actions{gap: 9px;}
#viewCustomers .plan-actions .button{padding: 0px 12px; font-size: 13px; height: 50px;}
#viewCustomers .plan-actions .primary{min-width: 150px;}
#viewCustomers .plan-actions .button:not(.primary){min-width: 120px;}
#viewCustomers .robot-art{width: 78px; height: 80px;}
#viewCustomers .section-heading{gap: 10px;}
#viewCustomers .section-heading h2{font-size: 19px;}
#viewCustomers .count-pill{font-size: 12px; padding: 4px 10px; margin-left: 3px;}
#viewCustomers .today{font-size: 11px;}
#viewCustomers .focus-art{width: 150px; right: 0px; opacity: 0.75;}
#viewCustomers .focus-overview .overview-text{max-width: 80%;}
#viewCustomers .table-tools{gap: 7px;}
#viewCustomers .table-tools .search-field{width: 212px;}
#viewCustomers .table-tools .button{padding: 0px 12px; font-size: 12px;}
#viewCustomers .table-toolbar .section-heading h2{font-size: 20px;}
#viewCustomers .client-cell{gap: 10px;}
#viewCustomers .client-name{font-size: 12px;}
#viewCustomers .client-note{font-size: 10px;}
#viewCustomers .row-actions{gap: 5px;}
#viewCustomers .row-actions .button{padding: 0px 8px; font-size: 10px;}
#viewCustomers .row-actions .button .ico{width: 12px; height: 12px;}
#viewCustomers .col-client{width: 24%;}
#viewCustomers .col-status{width: 10%;}
#viewCustomers .col-recent{width: 20%;}
#viewCustomers .col-next{width: 15%;}
#viewCustomers .col-actions{width: 31%;}
#viewCustomers .archive-page{grid-template-columns: 262px minmax(0px, 1fr);}
#viewCustomers .customer-sidebar{padding: 20px 13px 26px 20px;}
#viewCustomers .customer-sidebar > p{font-size: 11px;}
#viewCustomers .sidebar-client{gap: 8px;}
#viewCustomers .sidebar-client .avatar-initial{height: 36px; width: 36px;}
#viewCustomers .sidebar-client .client-name{font-size: 11px; padding-right: 36px; max-width: 142px;}
#viewCustomers .sidebar-client .client-note{font-size: 10px; max-width: 160px;}
#viewCustomers .sidebar-client .status-pill{font-size: 9px; padding: 2px 5px;}
#viewCustomers .archive-main{padding: 18px 20px;}
#viewCustomers .archive-ai-banner .coach-note{display: none;}
#viewCustomers .archive-ai-banner .robot-art{width: 67px; height: 76px;}
#viewCustomers .archive-ai-copy h2{font-size: 20px;}
#viewCustomers .archive-ai-copy p{white-space: normal;}
#viewCustomers .archive-ai-banner .button{min-width: 149px;}
#viewCustomers .archive-utilities{gap: 7px;}
#viewCustomers .archive-utilities .button{font-size: 11px; padding: 0px 10px; height: 37px;}
#viewCustomers .archive-utilities .button .ico{width: 16px; height: 16px;}
#viewCustomers .inline-block{grid-template-columns: 143px minmax(0px, 1fr); font-size: 11px; padding-left: 12px; padding-right: 12px;}
#viewCustomers .inline-label{font-size: 12px; gap: 7px;}
#viewCustomers .follow-card-body{padding: 12px 16px;}
#viewCustomers .follow-intro{font-size: 11px;}
#viewCustomers .follow-grid{gap: 10px;}
#viewCustomers .follow-small-box{padding: 9px 11px; font-size: 10px;}
#viewCustomers .follow-notice{grid-template-columns: 127px minmax(0px, 1fr); font-size: 10px;}
#viewCustomers .follow-evidence{grid-template-columns: 143px minmax(0px, 1fr); font-size: 9px;}
#viewCustomers .guide-hero{padding-top: 55px;}
#viewCustomers .guide-hero h1{font-size: 32px;}
#viewCustomers .guide-hero > p{font-size: 14px;}
#viewCustomers .upload-note-top{display: none;}
#viewCustomers .upload-flow{width: 950px;}
#viewCustomers .upload-note-left{display: none;}}
@media (max-width: 940px){#viewCustomers .hero{height: 300px;}
#viewCustomers .hero-art{left: calc(50% - 196px); width: 412px; height: 293px; opacity: 0.8; mask-image: linear-gradient(to right, transparent, rgb(0, 0, 0) 16%, rgb(0, 0, 0) 90%, transparent);}
#viewCustomers .hero-actions{width: 290px; top: 42px; gap: 13px;}
#viewCustomers .action-card{min-height: 107px; padding: 12px; gap: 11px;}
#viewCustomers .action-icon{width: 43px; height: 43px;}
#viewCustomers .action-copy strong{font-size: 14px;}
#viewCustomers .action-copy small{font-size: 10px;}
#viewCustomers .round-arrow{height: 26px; width: 26px;}
#viewCustomers .hero-copy{padding-top: 32px; width: 395px;}
#viewCustomers .hero h1{font-size: 34px;}
#viewCustomers .hero-features{gap: 12px 10px; flex-wrap: wrap; max-width: 280px; margin-top: 19px;}
#viewCustomers .hero-features .mini-feature:last-child{display: none;}
#viewCustomers .plan-banner{flex-wrap: wrap; padding: 17px;}
#viewCustomers .plan-copy{flex-basis: calc(100% - 100px);}
#viewCustomers .plan-actions{margin-left: 90px; margin-top: -4px;}
#viewCustomers .plan-banner .robot-art{align-self: flex-start;}
#viewCustomers .overview-grid{gap: 12px;}
#viewCustomers .overview-card{padding: 18px; height: 156px;}
#viewCustomers .today{position: absolute; right: 15px; bottom: 10px; font-size: 10px;}
#viewCustomers .overview-next{right: 15px; bottom: 33px;}
#viewCustomers .focus-art{display: none;}
#viewCustomers .focus-overview .overview-text{max-width: 100%;}
#viewCustomers .overview-text{font-size: 12px; margin-top: 15px;}
#viewCustomers .section-heading h2{font-size: 17px;}
#viewCustomers .section-icon .ico{width: 23px; height: 23px;}
#viewCustomers .count-pill{font-size: 11px;}
#viewCustomers .table-toolbar{height: auto; flex-wrap: wrap;}
#viewCustomers .table-tools{width: 100%;}
#viewCustomers .table-tools .search-field{flex: 1 1 0%;}
#viewCustomers .customer-table{min-width: 870px;}
#viewCustomers .table-scroll{overflow: auto;}
#viewCustomers .archive-page{grid-template-columns: 228px minmax(0px, 1fr);}
#viewCustomers .customer-sidebar{padding-left: 16px; padding-right: 12px;}
#viewCustomers .sidebar-client .avatar-initial{height: 31px; width: 31px; font-size: 13px;}
#viewCustomers .sidebar-client .status-pill{position: static; margin-left: auto; font-size: 8px; padding: 2px 5px; max-width: 44px;}
#viewCustomers .sidebar-client .client-name{padding-right: 0px; max-width: 103px; font-size: 10px;}
#viewCustomers .sidebar-client .client-note{max-width: 100px; font-size: 9px;}
#viewCustomers .customer-sidebar > p{font-size: 10px; white-space: normal;}
#viewCustomers .archive-main{padding: 15px;}
#viewCustomers .customer-identity h1{font-size: 18px;}
#viewCustomers .customer-identity .avatar-initial{width: 46px; height: 46px;}
#viewCustomers .customer-identity p{font-size: 12px;}
#viewCustomers .header-actions{gap: 7px;}
#viewCustomers .header-actions .button{font-size: 11px; height: 36px; padding: 0px 11px;}
#viewCustomers .archive-ai-banner{padding: 13px; flex-wrap: wrap; gap: 10px;}
#viewCustomers .archive-ai-copy{flex-basis: calc(100% - 80px);}
#viewCustomers .archive-ai-banner .button{margin-left: 76px; height: 40px; font-size: 12px;}
#viewCustomers .archive-ai-copy h2{font-size: 18px;}
#viewCustomers .archive-ai-copy p{font-size: 10px;}
#viewCustomers .archive-utilities{gap: 7px;}
#viewCustomers .archive-utilities .button{font-size: 10px; padding: 0px 9px;}
#viewCustomers .progress-step{font-size: 10px;}
#viewCustomers .progress-stepper{padding: 16px 9px 10px;}
#viewCustomers .progress-step:not(:last-child)::after{left: calc(50% + 21px); width: calc(100% - 42px);}
#viewCustomers .inline-block{grid-template-columns: 1fr; gap: 6px; font-size: 12px;}
#viewCustomers .follow-grid{grid-template-columns: 1fr;}
#viewCustomers .follow-small-box{font-size: 12px;}
#viewCustomers .follow-notice{font-size: 11px;}
#viewCustomers .follow-evidence{font-size: 10px;}
#viewCustomers .follow-intro{font-size: 12px;}
#viewCustomers .guide-hero h1{font-size: 27px; letter-spacing: -0.7px;}
#viewCustomers .guide-hero > p{font-size: 12px;}
#viewCustomers .guide-features{max-width: 670px;}
#viewCustomers .guide-features .mini-feature strong{font-size: 14px;}
#viewCustomers .guide-features .mini-feature small{font-size: 11px;}
#viewCustomers .guide-features .feature-icon{width: 43px; height: 43px;}
#viewCustomers .guide-features .mini-feature{gap: 10px;}
#viewCustomers .upload-card{padding: 25px;}
#viewCustomers .upload-info{gap: 17px; padding: 13px;}
#viewCustomers .upload-info-copy{padding-left: 17px;}
#viewCustomers .upload-note-bottom{width: 115px;}
#viewCustomers .upload-info p{font-size: 11px;}
#viewCustomers .upload-info h3{font-size: 14px;}
#viewCustomers .guide-features{margin-top: 30px;}
#viewCustomers .upload-flow{margin-top: 33px;}}
@media (max-width: 680px){#viewCustomers{font-size: 13px;}
#viewCustomers .topbar{height: 102px; flex-wrap: wrap; margin: 0px 12px; padding: 0px 12px; border-radius: 0px 0px 16px 16px; align-content: start;}
#viewCustomers .brand{height: 54px;}
#viewCustomers .brand strong{font-size: 19px;}
#viewCustomers .brand-mark{width: 28px; height: 28px;}
#viewCustomers .topnav{position: absolute; left: 4px; right: 4px; bottom: 2px; height: 40px; gap: 0px; margin: 0px; justify-content: space-around;}
#viewCustomers .nav-item{font-size: 12px; height: 36px; padding: 0px 9px;}
#viewCustomers .notification{margin-left: auto; margin-right: 10px; margin-top: 9px;}
#viewCustomers .profile-wrap{margin-top: 6px;}
#viewCustomers .profile{gap: 7px; font-size: 12px;}
#viewCustomers .profile > img{width: 27px; height: 27px;}
#viewCustomers .profile .small-icon{display: none;}
#viewCustomers .dashboard{padding: 0px 15px 20px;}
#viewCustomers .hero{height: auto; padding-bottom: 18px;}
#viewCustomers .hero-copy{padding: 25px 6px 0px; width: 100%;}
#viewCustomers .greeting{font-size: 12px; margin-bottom: 8px;}
#viewCustomers .hero h1{font-size: 31px; line-height: 1.35; letter-spacing: -0.8px;}
#viewCustomers .hero-subtitle{font-size: 11px; margin-top: 10px; white-space: normal; max-width: 72%;}
#viewCustomers .hero-art{top: 31px; right: -14px; left: auto; width: 224px; height: 194px; object-fit: cover; object-position: 58% 0px; opacity: 0.7; mask-image: linear-gradient(to right, transparent, rgb(0, 0, 0) 28%, rgb(0, 0, 0) 95%, transparent); z-index: -1;}
#viewCustomers .hero-features{display: none;}
#viewCustomers .hero-actions{position: relative; top: auto; width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 23px;}
#viewCustomers .action-card{min-height: 88px; gap: 10px; padding: 13px 11px; border-radius: 12px;}
#viewCustomers .action-icon{width: 37px; height: 37px; border-radius: 12px; flex-shrink: 0;}
#viewCustomers .action-icon .ico{width: 23px; height: 23px;}
#viewCustomers .action-copy strong{font-size: 12px; letter-spacing: -0.3px;}
#viewCustomers .action-copy small{font-size: 9px; white-space: normal; line-height: 1.65; margin-top: 3px;}
#viewCustomers .round-arrow{display: none;}
#viewCustomers .plan-banner{padding: 16px 12px; gap: 10px; border-radius: 13px; min-height: 155px;}
#viewCustomers .plan-banner .robot-art{width: 50px; height: 55px;}
#viewCustomers .plan-copy{flex-basis: calc(100% - 70px);}
#viewCustomers .eyebrow{font-size: 10px; margin-bottom: 4px;}
#viewCustomers .plan-copy h2{font-size: 13px; line-height: 1.65; letter-spacing: -0.2px;}
#viewCustomers .plan-copy p{font-size: 10px; margin-top: 5px;}
#viewCustomers .plan-actions{margin: 2px 0px 0px 60px; gap: 8px;}
#viewCustomers .plan-actions .button{font-size: 11px; height: 39px; padding: 0px 11px; gap: 6px; border-radius: 9px; min-width: 0px !important;}
#viewCustomers .plan-actions .button .ico{width: 15px; height: 15px;}
#viewCustomers .plan-demo-items{flex-direction: column;}
#viewCustomers .overview-grid{grid-template-columns: 1fr; gap: 12px; margin-top: 12px;}
#viewCustomers .overview-card{height: 131px; padding: 16px;}
#viewCustomers .section-heading h2{font-size: 18px;}
#viewCustomers .count-pill{font-size: 11px; padding: 3px 10px;}
#viewCustomers .overview-text{font-size: 12px; margin-top: 11px;}
#viewCustomers .focus-art{display: block; width: 125px; right: 8px; bottom: 14px; opacity: 0.65;}
#viewCustomers .focus-overview .overview-text{max-width: 75%;}
#viewCustomers .today{position: static; font-size: 10px;}
#viewCustomers .overview-next{right: 15px; bottom: 20px; width: 32px; height: 32px;}
#viewCustomers .customers-table-panel{margin-top: 12px; padding: 13px 12px 0px;}
#viewCustomers .table-toolbar{gap: 12px; padding: 0px; margin-bottom: 12px;}
#viewCustomers .table-toolbar .section-heading h2{font-size: 18px;}
#viewCustomers .table-toolbar .section-heading{gap: 10px;}
#viewCustomers .table-tools{gap: 7px; flex-wrap: wrap;}
#viewCustomers .table-tools .search-field{width: 100%; flex: 1 1 0%; min-width: 155px; height: 37px;}
#viewCustomers .search-field input{font-size: 11px;}
#viewCustomers .table-tools .button{height: 37px; font-size: 11px; padding: 0px 10px; gap: 5px;}
#viewCustomers .table-tools > .button[data-action="customers"]{display: none;}
#viewCustomers .table-tools .button .ico{width: 15px; height: 15px;}
#viewCustomers .table-tools > .button[data-action="refresh"]{padding: 0px 7px; font-size: 0px; gap: 0px;}
#viewCustomers .customer-table{min-width: 750px;}
#viewCustomers .table-footer{font-size: 10px; height: 36px;}
#viewCustomers .archive-page{display: block; min-height: calc(-102px + 100vh);}
#viewCustomers .customer-sidebar{border-right: 0px; border-bottom: 1px solid var(--border); padding: 16px 15px 14px;}
#viewCustomers .customer-sidebar h1{font-size: 20px;}
#viewCustomers .customer-sidebar > p{font-size: 11px; margin-bottom: 12px;}
#viewCustomers .sidebar-search{height: 37px; margin-bottom: 11px;}
#viewCustomers .customer-sidebar-list{display: flex; overflow-x: auto; padding-bottom: 3px; gap: 8px; scrollbar-width: thin;}
#viewCustomers .sidebar-client{min-width: 165px; width: 165px; min-height: 56px; padding: 8px;}
#viewCustomers .sidebar-client .avatar-initial{height: 33px; width: 33px;}
#viewCustomers .sidebar-client .status-pill{display: none;}
#viewCustomers .sidebar-client .client-name{max-width: 106px; font-size: 11px;}
#viewCustomers .sidebar-client .client-note{font-size: 9px; max-width: 106px;}
#viewCustomers .archive-main{padding: 14px 15px 24px;}
#viewCustomers .customer-detail-header{height: auto; margin-bottom: 13px;}
#viewCustomers .customer-identity{gap: 10px;}
#viewCustomers .customer-identity h1{font-size: 18px;}
#viewCustomers .customer-identity .avatar-initial{height: 44px; width: 44px; font-size: 21px;}
#viewCustomers .header-actions .button{padding: 0px 8px; height: 34px; font-size: 10px; gap: 5px;}
#viewCustomers .header-actions .ico{width: 14px; height: 14px;}
#viewCustomers .archive-ai-banner{min-height: 120px; margin-bottom: 12px;}
#viewCustomers .archive-ai-copy h2{font-size: 18px;}
#viewCustomers .archive-ai-banner .robot-art{width: 54px; height: 64px;}
#viewCustomers .archive-ai-copy{flex-basis: calc(100% - 72px);}
#viewCustomers .archive-ai-copy p{font-size: 10px;}
#viewCustomers .archive-ai-copy .eyebrow{font-size: 11px;}
#viewCustomers .archive-ai-banner .button{margin-left: 65px; height: 36px; min-width: 142px; font-size: 11px;}
#viewCustomers .archive-utilities{gap: 6px; margin-bottom: 11px;}
#viewCustomers .archive-utilities .button{font-size: 10px; padding: 0px 10px; height: 34px;}
#viewCustomers .archive-tabs{gap: 8px;}
#viewCustomers .archive-tabs .button{font-size: 11px; height: 35px; padding: 0px 13px;}
#viewCustomers .progress-stepper{height: 78px; padding: 14px 5px 9px; margin-bottom: 13px;}
#viewCustomers .progress-step{font-size: 9px; gap: 7px;}
#viewCustomers .step-circle{height: 23px; width: 23px; font-size: 11px;}
#viewCustomers .progress-step:not(:last-child)::after{top: 11px; left: calc(50% + 16px); width: calc(100% - 32px);}
#viewCustomers .follow-card-header{padding: 16px 17px;}
#viewCustomers .follow-card-header h2{font-size: 25px;}
#viewCustomers .follow-card-header .overline{font-size: 11px;}
#viewCustomers .current-badge{font-size: 10px; right: 13px; top: 15px; padding: 4px 10px;}
#viewCustomers .follow-card-header .card-meta{font-size: 9px;}
#viewCustomers .follow-card-body{padding: 12px;}
#viewCustomers .follow-intro{font-size: 11px; line-height: 1.9; margin-bottom: 11px;}
#viewCustomers .inline-block{font-size: 12px; padding: 12px; gap: 7px; margin-bottom: 10px;}
#viewCustomers .inline-label{font-size: 12px;}
#viewCustomers .follow-grid{gap: 10px; margin-bottom: 10px;}
#viewCustomers .follow-small-box{font-size: 11px; padding: 11px 12px;}
#viewCustomers .follow-notice{font-size: 10px;}
#viewCustomers .follow-evidence{font-size: 9px;}
#viewCustomers .facts-grid{grid-template-columns: 1fr;}
#viewCustomers .guide-page{padding: 0px 15px 28px;}
#viewCustomers .guide-hero{padding-top: 29px;}
#viewCustomers .guide-hero h1{font-size: 25px; letter-spacing: -0.6px; line-height: 1.5;}
#viewCustomers .guide-hero h1 em{display: block; font-size: 23px;}
#viewCustomers .guide-hero > p{font-size: 11px; line-height: 1.9; margin: 10px auto 0px; max-width: 335px;}
#viewCustomers .guide-features{margin-top: 23px; gap: 8px; max-width: 100%;}
#viewCustomers .guide-features .mini-feature{flex-direction: column; gap: 7px; flex: 1 1 0%; text-align: center;}
#viewCustomers .guide-features .feature-icon{width: 38px; height: 38px;}
#viewCustomers .guide-features .feature-icon .ico{width: 21px; height: 21px;}
#viewCustomers .guide-features .mini-feature strong{font-size: 11px; line-height: 1.8;}
#viewCustomers .guide-features .mini-feature small{font-size: 8px; white-space: normal; line-height: 1.6;}
#viewCustomers .upload-flow{margin-top: 25px;}
#viewCustomers .upload-card{padding: 19px 15px 16px; border-radius: 15px;}
#viewCustomers .step-title{gap: 13px; margin-bottom: 19px;}
#viewCustomers .step-number{width: 38px; height: 38px; font-size: 19px;}
#viewCustomers .step-title h2{font-size: 17px;}
#viewCustomers .step-title p{font-size: 10px; line-height: 1.8;}
#viewCustomers .dropzone{height: 220px; border-radius: 12px;}
#viewCustomers .upload-plus{width: 61px; height: 61px; margin-bottom: 13px;}
#viewCustomers .dropzone > strong{font-size: 16px;}
#viewCustomers .dropzone-help{font-size: 10px; margin-top: 8px;}
#viewCustomers .upload-info{margin-top: 17px; padding: 12px 10px; height: 116px; gap: 9px;}
#viewCustomers .upload-info > img:first-child{width: 48px; height: 64px;}
#viewCustomers .upload-info-copy{padding-left: 11px;}
#viewCustomers .upload-info h3{font-size: 12px; margin-bottom: 7px;}
#viewCustomers .upload-info p{font-size: 9px; white-space: normal; gap: 6px; line-height: 1.8; margin-top: 5px;}
#viewCustomers .check-dot{width: 13px; height: 13px;}
#viewCustomers .check-dot .ico{width: 10px; height: 10px;}
#viewCustomers .upload-note-bottom{display: none;}
#viewCustomers .result-teaser{margin-top: 13px; height: 97px; padding: 18px 16px; gap: 13px;}
#viewCustomers .result-teaser h2{font-size: 16px;}
#viewCustomers .result-teaser p{font-size: 10px; line-height: 1.9;}
#viewCustomers .result-teaser .circle-button{width: 28px; height: 28px;}
#viewCustomers .upload-preview{flex-wrap: wrap; padding: 12px; gap: 10px;}
#viewCustomers .upload-thumb{width: 60px; height: 70px;}
#viewCustomers .upload-file-info{flex-basis: calc(100% - 75px);}
#viewCustomers .upload-preview > .button{font-size: 11px;}
#viewCustomers .file-miniature{gap: 15px;}
#viewCustomers .file-miniature h3{font-size: 13px;}
#viewCustomers .file-miniature p{font-size: 10px;}
#viewCustomers .file-miniature span{font-size: 10px;}
#viewCustomers .guide-result{padding: 22px 16px;}
#viewCustomers .guide-result h2{font-size: 19px;}
#viewCustomers .guide-result > p{font-size: 11px;}
#viewCustomers .guide-result .result-script{font-size: 12px; padding: 15px;}
#viewCustomers .guide-result-actions{gap: 9px; flex-wrap: wrap;}
#viewCustomers .guide-result-actions .button{font-size: 11px; padding: 0px 11px;}
#viewCustomers .chat-drawer{right: 0px; top: 0px; bottom: 0px; width: 100%; max-width: 100%; border-radius: 0px;}
#viewCustomers .chat-header{padding: 20px 20px 15px; min-height: 101px;}
#viewCustomers .chat-header h2{font-size: 18px; margin-right: 25px;}
#viewCustomers .chat-header p{font-size: 10px; white-space: normal; max-width: 95%; line-height: 1.85; margin-top: 6px;}
#viewCustomers .close-chat{right: 15px; top: 17px; width: 29px; height: 29px;}
#viewCustomers .chat-messages{padding: 16px;}
#viewCustomers .chat-welcome{min-height: 360px; padding-top: 0px;}
#viewCustomers .chat-robot{width: 205px; height: 124px; margin-bottom: 13px;}
#viewCustomers .chat-welcome h3{font-size: 18px; margin-bottom: 8px;}
#viewCustomers .chat-welcome > p{font-size: 11px; line-height: 1.95;}
#viewCustomers .suggestions{margin-top: 23px; gap: 8px; grid-template-columns: 1fr 1fr;}
#viewCustomers .suggestion-chip{font-size: 9px; padding: 10px 8px; white-space: normal; gap: 5px; line-height: 1.7; min-height: 41px; text-align: left;}
#viewCustomers .suggestion-chip .ico{width: 15px; height: 15px;}
#viewCustomers .chat-footer{padding: 14px 15px 18px;}
#viewCustomers .chat-footer::before{left: 15px; right: 15px;}
#viewCustomers .chat-tools{gap: 8px;}
#viewCustomers .mode-select,#viewCustomers .mode-select select{height: 37px; font-size: 11px;}
#viewCustomers .update-card-button{font-size: 10px; padding: 0px 10px; height: 37px; gap: 7px;}
#viewCustomers .composer-helper{font-size: 9px; margin: 9px 0px;}
#viewCustomers .composer{padding: 10px 105px 10px 11px; min-height: 98px;}
#viewCustomers .composer textarea{font-size: 13px; height: 72px;}
#viewCustomers .composer-controls{right: 10px; bottom: 12px; gap: 9px;}
#viewCustomers .send-button{width: 65px; height: 41px; font-size: 13px;}
#viewCustomers .mic-button .ico{width: 20px; height: 20px;}
#viewCustomers .chat-bubble{font-size: 12px;}
#viewCustomers .modal-layer{padding: 15px;}
#viewCustomers .modal{border-radius: 18px;}
#viewCustomers .modal-create{min-height: 0px;}
#viewCustomers .modal-heading{padding: 27px 23px 0px; gap: 15px;}
#viewCustomers .modal-symbol{width: 50px; height: 50px; border-radius: 13px;}
#viewCustomers .modal-symbol .ico{width: 28px; height: 28px;}
#viewCustomers .modal-heading h2{font-size: 23px;}
#viewCustomers .modal-heading p{font-size: 13px; line-height: 1.8;}
#viewCustomers .modal-close{width: 32px; height: 32px; right: 17px; top: 17px;}
#viewCustomers .modal-close .ico{width: 17px; height: 17px;}
#viewCustomers .modal-form-body{padding: 28px 23px 23px;}
#viewCustomers .field-label{font-size: 15px; margin-bottom: 10px;}
#viewCustomers .form-input{height: 56px; font-size: 16px; border-radius: 10px; padding: 0px 13px;}
#viewCustomers .field-info{font-size: 11px; gap: 8px; line-height: 1.9; margin-top: 15px; align-items: flex-start;}
#viewCustomers .field-info .ico{margin-top: 2px; flex-shrink: 0; width: 16px; height: 16px;}
#viewCustomers .modal-footer{height: 92px; padding: 0px 22px; gap: 10px;}
#viewCustomers .modal-footer > .button{height: 43px; min-width: 79px; font-size: 14px; border-radius: 10px;}
#viewCustomers .create-note{width: 130px; height: 63px; object-fit: contain;}
#viewCustomers .modal-compact .modal-heading{padding: 25px 23px 0px; gap: 13px;}
#viewCustomers .modal-compact .modal-heading h2{font-size: 21px;}
#viewCustomers .modal-compact .modal-heading p{font-size: 11px;}
#viewCustomers .modal-compact .modal-form-body{padding: 23px;}
#viewCustomers .modal-compact .modal-symbol{height: 47px; width: 47px;}
#viewCustomers .modal-compact .modal-footer{height: 80px; padding: 0px 23px;}
#viewCustomers .toast{font-size: 11px; padding: 11px 13px;}
#viewCustomers .toast-container{width: max-content;}
#viewCustomers .modal-compact .modal-close{right: 17px; top: 17px;}}
@media (prefers-reduced-motion: reduce){#viewCustomers{scroll-behavior: auto;}
#viewCustomers *,#viewCustomers ::before,#viewCustomers ::after{animation: auto ease 0s 1 normal none running none !important; transition: none !important;}}
#viewCustomers .robot-art,#viewCustomers .coach-note,#viewCustomers .focus-art,#viewCustomers .chat-robot,#viewCustomers .create-note,#viewCustomers .upload-note-top,#viewCustomers .upload-note-left,#viewCustomers .upload-note-bottom,#viewCustomers .upload-info > img:first-child{mix-blend-mode: normal;}
@media (min-width: 1381px){#viewCustomers .dashboard{padding-bottom: 9px;}}
#viewCustomers .mode-select > [data-icon]{position: absolute; right: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; display: flex; align-items: center;}
#viewCustomers .mode-select > [data-icon] > .ico{width: 12px; height: 12px;}
@media (min-width: 681px){#viewCustomers .suggestion-chip{font-size: 12px;}
#viewCustomers .chat-robot{width: 295px; height: 180px;}
#viewCustomers .chat-welcome{padding-top: 30px;}}
@media (min-width: 1381px){#viewCustomers .guide-page{padding-bottom: 38px;}}