/* Shell and overview only. No group or ticket card selectors. */
.reference-shell{background:#f1f5fb}
.reference-shell .app-shell{grid-template-columns:246px minmax(0,1fr);grid-template-rows:74px minmax(0,1fr)}
.reference-shell .app-shell>.topbar{height:74px;padding:0 20px;gap:14px;background:#fff;border-bottom:1px solid #e5ebf4;backdrop-filter:none}
.reference-shell .sidebar{height:100dvh;padding:0 0 18px;background:linear-gradient(#f0f5fe,#f8faff);border-right:1px solid #e1e8f4;border-radius:0;overflow-y:auto}
.reference-shell .sidebar-brand{height:74px;min-height:74px;margin:0 0 14px;padding:0 24px;gap:14px;background:#075cf6;color:#fff}
.reference-shell .sidebar-brand strong{color:#fff;font-size:25px;letter-spacing:.025em}.reference-shell .sidebar-brand small{color:#e4efff;font-size:11px;font-weight:500}
.reference-brand-mark{display:grid;place-items:center;width:42px;height:42px;background:#fff;color:#075cf6;border-radius:9px;flex-shrink:0}.reference-brand-mark svg{width:27px;height:27px}
.reference-shell .sidebar nav{display:flex;flex-direction:column;gap:3px;padding:0 8px}
.reference-shell .sidebar .nav-link{min-height:47px;padding:0 20px;border:0;border-radius:5px;gap:14px;color:#263955;font-size:14px;font-weight:500;box-shadow:none}
.reference-shell .sidebar .nav-link>span{width:23px;display:grid;place-items:center;color:#52647d}.reference-shell .nav-link svg{width:21px;height:21px}
.reference-shell .nav-link.active{color:#065cf4;background:#dbe9ff;box-shadow:inset 4px 0 #065cf4}.reference-shell .nav-link.active>span{color:#065cf4}.reference-shell .nav-link.active em{background:#c5dbff;color:#075cf6}
.reference-shell .sidebar-connection{margin:18px 16px 12px;padding:10px;border:0;background:#eaf1fb}.reference-shell .sidebar-note{margin:12px 18px}.reference-shell .sidebar-footer{padding:12px 18px;margin-top:auto}
.reference-shell .advanced-menu-toggle{display:grid;flex-shrink:0;background:#f1f5fb;color:#4b5d78;width:39px;height:39px;border:0;border-radius:10px}
.reference-screen-title{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.reference-search{display:flex;align-items:center;gap:9px;max-width:540px;flex:1;min-width:120px;padding:6px 10px;border:1px solid #e1e8f3;border-radius:11px;background:#f6f8fc;height:42px}
.reference-search svg{width:19px;flex-shrink:0;color:#62728c}.reference-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;font-size:12px;color:#20344f}.reference-search select{max-width:90px;border:0;background:transparent;font-size:10px;color:#556984}.reference-search button{border:0;background:transparent;color:#075cf6}
.reference-shell .top-actions{gap:8px;flex-shrink:0}.reference-shell #connectionPill{white-space:nowrap;font-size:11px!important;border:1px solid #d4efdf!important;background:#fff!important;border-radius:9px!important;padding:10px!important}.reference-shell .top-actions .avatar{border-radius:50%;background:#075cf6;color:#fff}
.reference-shell #overview>.page-heading{margin:0 0 16px}.reference-shell #overview>.page-heading h1{font-size:23px;margin:3px 0 6px}.reference-shell #overview>.page-heading p{font-size:12px}.reference-shell #overview>.page-heading .eyebrow{font-size:9px}
.reference-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.reference-metric{display:flex;align-items:center;gap:16px;min-height:100px;padding:18px 20px;background:#fff;border:1px solid #ebeff6;border-radius:10px}
.reference-metric>span{width:56px;height:56px;display:grid;place-items:center;flex-shrink:0;border-radius:15px;background:#e4efff;color:#075cf6}.reference-metric svg{width:29px;height:29px}.reference-metric div{min-width:0}.reference-metric small{display:block;font-size:14px;color:#526482}.reference-metric strong{display:block;font-size:24px;font-weight:750;line-height:1.35;overflow-wrap:anywhere;color:#111e35}.reference-metric em{display:block;font-size:11px;color:#7988a0;font-style:normal}.reference-metric.metric-1>span{background:#ddf5e8;color:#0b9b53}.reference-metric.metric-2>span{background:#ffe4e7;color:#e23948}.reference-metric.metric-3>span{background:#eee6ff;color:#7243e9}
.reference-dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 295px;gap:16px;align-items:start}.reference-dashboard-main,.reference-dashboard-side{display:grid;gap:16px;min-width:0}
.reference-shell #overview .panel{border:1px solid #e9eef6;border-radius:10px;background:#fff;box-shadow:none;overflow:hidden}.reference-shell #overview .panel-head{padding:18px;gap:12px}.reference-shell #overview .panel-head h2{display:flex;align-items:center;gap:10px;font-size:16px}.reference-shell #overview .panel-head h2 svg{width:21px;height:21px;color:#075cf6}.reference-shell #overview .panel-head .eyebrow{display:none}
.reference-shell #overview .groups-preview{margin:0}.reference-shell #overview .table-wrap{padding:0 17px 16px}.reference-shell #overview table{font-size:13px;min-width:560px}.reference-shell #overview th{background:#f2f6fc;color:#536581;font-size:12px}.reference-shell #overview td{padding:13px 10px}.reference-shell #overview .panel-foot{padding:12px 18px}.reference-shell #overview .panel-actions{flex-wrap:wrap}.reference-shell #overview .search input{width:140px}.reference-shell #overview .btn{border-radius:7px}
.reference-shell #overview .quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0 16px 18px;margin:0}
.reference-shell #overview .quick-actions>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:88px;padding:14px 10px;border:0;border-radius:8px;background:#075cf6;color:#fff;text-align:center}.reference-shell #overview .quick-actions>button:nth-child(2){background:#0baa5c}.reference-shell #overview .quick-actions>button:nth-child(3){background:#e13f49}.reference-shell #overview .quick-actions>button:nth-child(4){background:#7550da}.reference-shell #overview .quick-actions .quick-icon{background:transparent!important;color:#fff!important;padding:0;width:30px;height:30px;font-size:27px}.reference-shell #overview .quick-actions svg{width:27px;height:27px}.reference-shell #overview .quick-actions strong{color:#fff;font-size:14px;font-weight:500}.reference-shell #overview .quick-actions small,.reference-shell #overview .quick-actions>button>b{display:none}
.reference-activity #referenceActivity{padding:0 17px 14px}.reference-activity article{display:flex;gap:12px;padding:13px 0;align-items:flex-start}.reference-activity-symbol{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#e9f1ff;color:#075cf6;flex-shrink:0}.reference-activity-symbol svg{width:21px;height:21px}.reference-activity-symbol.failed{background:#ffeded;color:#d3404b}.reference-activity strong{font-size:13px;font-weight:650}.reference-activity p{font-size:12px;margin:5px 0;color:#546682;overflow-wrap:anywhere}.reference-activity small{font-size:11px;color:#8090a8}.reference-payment-type{display:inline-flex;padding:4px 8px;background:#e7f6ee;color:#137a4a;border-radius:6px;font-size:10px}.reference-empty{font-size:12px;padding:15px;color:#72839c}.reference-empty[hidden]{display:none}
.reference-controls{margin-top:18px;border:1px solid #e0e8f4;border-radius:10px;background:#fff}.reference-controls>summary{padding:15px 18px;cursor:pointer;color:#315c9e;font-size:12px;font-weight:700}.reference-controls-body{padding:0 18px 18px}.reference-controls .heading-actions{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;margin-bottom:15px}.reference-controls .metric-grid{margin:15px 0}.reference-controls .bottom-grid{margin-top:15px}
.reference-shell button:focus-visible,.reference-shell input:focus-visible,.reference-shell select:focus-visible,.reference-controls summary:focus-visible{outline:2px solid #075cf6;outline-offset:3px}
@media(min-width:821px){.reference-sidebar-collapsed .app-shell{grid-template-columns:76px minmax(0,1fr)}.reference-sidebar-collapsed .sidebar-brand{padding:0 16px}.reference-sidebar-collapsed .sidebar-brand>span:last-child,.reference-sidebar-collapsed .nav-link b,.reference-sidebar-collapsed .nav-link em,.reference-sidebar-collapsed .sidebar-note,.reference-sidebar-collapsed .sidebar-connection,.reference-sidebar-collapsed .sidebar-footer{display:none}.reference-sidebar-collapsed .sidebar .nav-link{padding:0;justify-content:center}}
@media(max-width:1200px){.reference-dashboard-grid{grid-template-columns:minmax(0,1fr) 255px}.reference-metric{padding:15px 12px;gap:10px}.reference-metric>span{width:44px;height:44px}.reference-metric strong{font-size:18px}.reference-shell #connectionPill{font-size:10px!important;padding:8px!important}.reference-shell .top-actions{gap:5px}}
@media(max-width:1000px){.reference-dashboard-grid{grid-template-columns:1fr}.reference-dashboard-side{grid-template-columns:1fr 1fr}.reference-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.reference-search select{max-width:68px}}
@media(max-width:820px){.reference-shell .app-shell{display:block}.reference-shell .app-shell>.topbar{height:auto;min-height:70px;padding:10px 12px;flex-wrap:wrap;gap:8px}.reference-shell .sidebar{position:fixed;width:min(290px,85vw);height:100dvh;top:0;bottom:0;left:0;z-index:100;transform:translateX(-110%);visibility:hidden}.reference-shell.advanced-menu-open .sidebar{transform:translateX(0);visibility:visible}.reference-shell .sidebar nav{flex-direction:column}.reference-shell .sidebar .nav-link b,.reference-shell .sidebar .nav-link em,.reference-shell .sidebar-brand>span:last-child{display:block}.reference-shell .top-actions{margin-left:auto}.reference-search{order:3;flex-basis:100%;max-width:none}.reference-dashboard-side{grid-template-columns:1fr}.reference-shell .sidebar-brand{margin-bottom:14px}.reference-shell .top-actions .avatar{display:none}.reference-shell .top-language-picker span{display:none}.reference-shell .top-language-picker select{max-width:65px}.reference-metric strong{font-size:18px}.reference-shell .logout-btn{font-size:10px;padding:0 8px}.reference-controls-body{padding:0 12px 12px}.reference-controls .heading-actions .btn{flex:1 1 140px}}
@media(max-width:420px){.reference-metric{gap:8px;padding:12px 9px;min-height:95px}.reference-metric>span{width:36px;height:36px;border-radius:10px}.reference-metric svg{width:23px;height:23px}.reference-metric strong{font-size:16px}.reference-metric small{font-size:10px}.reference-shell #overview .panel-head{flex-wrap:wrap}.reference-shell #overview .panel-actions{width:100%}}
@media(prefers-reduced-motion:reduce){.reference-shell .sidebar{transition:none}}

@media(min-width:821px) and (max-width:1100px){.reference-shell:not(.reference-sidebar-collapsed) .app-shell{grid-template-columns:230px minmax(0,1fr)}}

/* Match reference 1: four actions with icons; keep legacy card files untouched. */
.reference-dashboard-heading{display:none}
.reference-shell .content:has(>#overview.active){padding-top:14px}
.reference-shell #overview .quick-actions>button{width:100%;min-width:0;box-shadow:none;line-height:1.3;transition:filter .15s,box-shadow .15s}
.reference-shell #overview .quick-actions>button:hover{filter:brightness(.95);box-shadow:0 4px 12px #1d3b651a;transform:none}
.reference-shell #overview .quick-actions>button:active{filter:brightness(.9)}
.reference-shell #overview .quick-actions>button:nth-child(1){background:linear-gradient(135deg,#0061ff,#0756e4)}
.reference-shell #overview .quick-actions>button:nth-child(2){background:linear-gradient(135deg,#0ab660,#0aa552)}
.reference-shell #overview .quick-actions>button:nth-child(3){background:linear-gradient(135deg,#f13e46,#e9323e)}
.reference-shell #overview .quick-actions>button:nth-child(4){background:linear-gradient(135deg,#7436ed,#592ae0)}
.reference-shell #overview .quick-actions .quick-icon{display:grid;place-items:center;flex:none}
.reference-shell #overview .quick-actions strong{display:block;color:#fff}
.reference-control-shortcuts{margin:0 0 12px}
.reference-control-shortcuts button{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:1px solid #dce5f1;border-radius:8px;background:#f7faff;color:#26466e;text-align:left}
.reference-control-shortcuts small{display:block;margin-top:3px;color:#61728c;font-size:12px}
.reference-control-shortcuts button>b{margin-left:auto}
.reference-shell #overview .panel-head .btn{min-height:40px;font-size:13px;font-weight:600}
.reference-shell #overview .text-btn{font-size:13px;font-weight:550;min-height:32px}
.reference-shell #overview .search{min-width:0;border-radius:8px;background:#f5f8fc}
.reference-shell #overview .search input{font-size:13px;min-height:38px}
.reference-shell #overview td strong{font-size:13px;font-weight:600}
.reference-shell #overview .panel-foot{font-size:12px}
.reference-search input{font-size:13px}.reference-search select{font-size:12px;max-width:110px}.reference-search button{display:grid;place-items:center;width:28px;height:28px;border-radius:5px;cursor:pointer}
.reference-search button:hover{background:#e8f0ff}
.reference-shell .nav-link b{font-weight:500}.reference-shell .sidebar .nav-link{font-size:15px;min-height:50px}
.reference-shell .top-actions{flex-wrap:wrap}.reference-shell .top-actions .toolbar-action{flex-shrink:0}
/* Existing operational screens: readable typography, balanced forms and action rows. */
.reference-workspace{min-width:0}
.reference-workspace .section-title h1,.reference-workspace .page-heading h1{font-size:26px;line-height:1.25;letter-spacing:-.025em}
.reference-workspace .section-title p:not(.eyebrow),.reference-workspace .page-heading p:not(.eyebrow){font-size:14px;line-height:1.6;color:#596b85}
.reference-workspace .panel{border-color:#e2e8f1;border-radius:10px;box-shadow:0 2px 8px #21355704;background:#fff}
.reference-workspace .panel-head{padding:16px 20px;gap:14px}
.reference-workspace .panel-head h2{font-size:18px;line-height:1.35}
.reference-workspace .panel-actions,.reference-workspace .heading-actions,.reference-workspace .form-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.reference-workspace .btn{min-height:40px;border-radius:8px;font-size:13px;font-weight:600;padding:9px 15px;line-height:1.3;white-space:normal}
.reference-workspace .text-btn{font-size:13px;min-height:32px}
.reference-workspace .form-grid label,.reference-workspace .field{min-width:0}
.reference-workspace .form-grid label>span,.reference-workspace .field>label{font-size:12px;letter-spacing:0;text-transform:none;font-weight:600}
.reference-workspace .form-grid input,.reference-workspace .form-grid select,.reference-workspace .field input,.reference-workspace .field textarea{font-size:14px;min-height:42px;border-radius:8px}
.reference-workspace .form-grid small{font-size:12px;line-height:1.5}
.reference-workspace .search{min-width:0;max-width:100%;border-radius:8px}
.reference-workspace .search input{font-size:14px;min-width:0;max-width:100%}
.reference-workspace table{font-size:13px}.reference-workspace th{font-size:12px;font-weight:600;color:#586b85;background:#f5f8fc;text-transform:none;letter-spacing:0}
.reference-workspace td{padding:13px 12px}.reference-workspace td strong{font-size:13px}.reference-workspace td small{font-size:12px;line-height:1.5}
.reference-workspace .row-actions,.reference-workspace .loan-row-actions,.reference-workspace .ledger-actions{flex-wrap:wrap;gap:6px}
.reference-workspace .row-actions button,.reference-workspace .loan-row-actions button,.reference-workspace .ledger-actions button{min-height:34px;font-size:12px;border-radius:7px;padding:7px 10px;line-height:1.3}
.reference-workspace .empty{font-size:14px;padding:30px 20px}
.reference-workspace .setting-row p,.reference-workspace .setting-toggle small{font-size:13px;line-height:1.6}
@media(max-width:820px){
 .reference-shell .top-actions{flex:1 1 auto;justify-content:flex-end;gap:7px}
 .reference-shell .app-shell>.topbar{row-gap:10px}
 .reference-search{height:44px}.reference-search input{font-size:16px}
 .reference-shell .sidebar .nav-link b{font-weight:550}
 .reference-workspace .panel-head{padding:16px;align-items:flex-start}
 .reference-workspace .section-title,.reference-workspace .page-heading{gap:14px;flex-wrap:wrap}
 .reference-workspace .form-actions .btn{flex:1 1 150px}
}
@media(max-width:420px){
 .reference-shell #overview .quick-actions>button{min-height:96px}
 .reference-shell #overview .quick-actions strong{font-size:14px}
 .reference-shell #overview .panel-head{padding:15px}
 .reference-workspace .section-title h1,.reference-workspace .page-heading h1{font-size:23px}
}

.reference-shell #connectionPill svg{width:22px;height:22px;flex:none;color:currentColor}
.reference-shell #connectionPill:not(.ready){border-color:#dce4ef!important;color:#60718b!important}
.reference-shell #connectionPill.ready{color:#179553!important}
.reference-shell #groups>.section-title h1,.reference-shell .ticket-hero h2{font-size:26px;line-height:1.3}
.reference-shell #groups>.section-title p:not(.eyebrow),.reference-shell .ticket-hero p:not(.eyebrow){font-size:14px;line-height:1.6}
.reference-shell #groups>.section-title .btn{font-size:13px;min-height:42px;border-radius:8px}
.reference-shell #groupFormCard .form-grid label>span{font-size:12px;text-transform:none;letter-spacing:0}
.reference-shell #groupFormCard .form-grid input,.reference-shell #groupFormCard .form-grid select,.reference-shell #groupFormCard .form-grid textarea{font-size:14px;min-height:42px}
.reference-workspace :is(.primary-btn,.secondary-btn,.reliability-row-actions button,.review-tabs button,.followup-filters button){font-size:13px;min-height:38px;line-height:1.4;border-radius:8px}
.reference-workspace .notification-list button{font-size:13px;min-height:38px;padding:9px 13px;white-space:normal}
@media(max-width:820px){.reference-shell #groupFormCard .form-grid input,.reference-shell #groupFormCard .form-grid select,.reference-shell #groupFormCard .form-grid textarea{font-size:16px}}

@media(max-width:820px){.reference-shell #connectionPill{display:inline-flex;order:4;min-height:34px}.reference-shell #connectionPill svg{width:18px;height:18px}}