:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color-scheme:light;--mint:#48e6c1;--dark:#0b1425;--dark2:#121f31;--ink:#182638;--muted:#718194;--border:#e4ebf1;--rounded:18px} *{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #27c5a8;outline-offset:3px}a{text-decoration:none;color:inherit}h1,h2,h3,p{margin-top:0}button svg{flex-shrink:0}input,select,textarea{min-width:0}input,textarea,select{background:#fff;border:1px solid #d9e2e9;padding:13px 14px;border-radius:11px;width:100%;min-height:48px;color:#203044}input::placeholder,textarea::placeholder{color:#91a0ac}textarea{resize:vertical;line-height:1.5}label{font-size:13px;font-weight:700;display:flex;flex-direction:column;gap:8px}.simple-eyebrow{font-size:11px;font-weight:850;letter-spacing:.15em;color:#42aa9b}.simple-logo{display:grid;place-items:center;position:relative;font-size:24px;letter-spacing:-.09em;font-weight:950;color:#0d1830;background:var(--mint);width:43px;height:43px;border-radius:13px;flex-shrink:0}.simple-logo span{font-size:15px;position:absolute;right:8px;top:7px}.simple-primary,.simple-secondary{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;border-radius:12px;padding:12px 20px;border:0;font-weight:800;font-size:14px;white-space:nowrap;transition:transform .14s ease,background .14s ease}.simple-primary{background:#25d7b4;color:#0a2330;box-shadow:0 6px 18px #25d7b42b}.simple-primary:hover{background:#41efcb}.simple-primary:active,.simple-secondary:active,.simple-ticket:active{transform:scale(.986)}.simple-secondary{background:#eef4f7;color:#26374c;border:1px solid #dee9ec}.simple-secondary:hover{background:#e2eef2}.wide{width:100%}.simple-error{background:#fff0f0;color:#b33648;border:1px solid #ffd1d8;border-radius:12px;padding:12px 15px;line-height:1.5;font-size:14px}.simple-error button{border:0;background:transparent;color:#a12238;font-weight:800;min-height:36px}.simple-tag{display:inline-flex;padding:6px 11px;color:#926922;border-radius:9px;background:#fff4da;font-size:12px;font-weight:700} /* Login intentionally calm and short. */ .simple-auth{min-height:100dvh;background:#0b1525;color:#eff6fc;padding:30px clamp(18px,5vw,65px);overflow:hidden;position:relative}.simple-auth:after{content:"";position:absolute;width:680px;height:680px;right:-250px;top:-270px;background:radial-gradient(circle,#2fe5be1c,transparent 70%);pointer-events:none}.simple-auth-brand{display:flex;align-items:center;gap:13px;position:relative;z-index:1}.simple-auth-brand b{display:block;font-size:16px;letter-spacing:.08em}.simple-auth-brand small{display:block;color:#96a8b8;font-size:10px;letter-spacing:.14em;margin-top:4px}.simple-login-wrap{min-height:calc(100dvh - 130px);max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1.2fr 450px;align-items:center;gap:9%}.simple-auth-intro h1{font-size:clamp(46px,5.3vw,84px);letter-spacing:-.065em;line-height:1.06;font-weight:850;margin:20px 0}.simple-auth-intro h1 em{font-style:normal;color:var(--mint)}.simple-auth-intro p{max-width:500px;line-height:1.8;font-size:17px;color:#a5b5c4}.simple-auth-chips{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}.simple-auth-chips span{display:flex;align-items:center;gap:9px;border:1px solid #37475a;border-radius:14px;padding:13px 15px;color:#d2e2ee;font-size:13px}.simple-login{position:relative;z-index:1;padding:34px;background:#152335;border:1px solid #304256;border-radius:24px;box-shadow:0 32px 90px #02081066;display:grid;gap:16px}.simple-login h2{font-size:29px;letter-spacing:-.035em;margin:0}.simple-login p{font-size:14px;color:#aebdca;line-height:1.6;margin:0 0 5px}.simple-login label{color:#e1eaf1}.simple-login input{background:#0e1929;color:white;border-color:#334256}.simple-login-note{color:#a8b7c7;text-align:center;font-size:11px;line-height:1.5}.password-row{display:flex;position:relative}.password-row input{padding-right:88px}.password-row button{position:absolute;right:5px;top:5px;bottom:5px;border:none;background:#2c3e52;color:#ecf6fc;border-radius:8px;padding:0 12px;min-width:68px;font-size:12px} /* Whole app: same typography, common accent, light admin/dark touch. */ .simple-app{display:flex;min-height:100dvh;color:#1a2c40;background:#f5f8fa}.simple-sidebar{width:234px;flex-shrink:0;background:#0d192a;color:#e6f0f8;display:flex;flex-direction:column;padding:27px 14px 18px;position:sticky;top:0;height:100dvh}.simple-brand{display:flex;align-items:center;gap:12px;padding:0 12px 34px}.simple-brand b{display:block;letter-spacing:-.04em;font-size:19px}.simple-brand small{display:block;font-size:10px;letter-spacing:.12em;color:#8ea3b5;margin-top:3px}.simple-side-caption{padding:0 15px;color:#73899e;font-size:10px;letter-spacing:.14em;font-weight:800;margin-bottom:14px}.simple-sidebar nav{display:grid;gap:6px}.simple-sidebar nav button{position:relative;height:54px;background:transparent;border:0;color:#a4b5c4;text-align:left;display:flex;align-items:center;gap:13px;padding:0 13px;border-radius:12px;font-weight:750}.simple-sidebar nav button.selected{color:#b2ffea;background:#1c3946}.simple-sidebar nav button.selected:before{content:"";width:4px;height:25px;background:var(--mint);position:absolute;left:13px;border-radius:4px}.simple-sidebar nav button:hover:not(.selected){background:#1b2c3e;color:white}.simple-sidebar nav button i{margin-left:auto;font-style:normal;padding:3px 7px;background:#304858;border-radius:7px;font-size:11px}.simple-sidebar-bottom{display:flex;align-items:center;gap:9px;margin-top:auto;border-top:1px solid #233448;padding:20px 9px 5px}.simple-sidebar-bottom b{font-size:13px}.simple-sidebar-bottom small{display:block;font-size:11px;color:#8ea3b5;margin-top:3px}.simple-sidebar-bottom>button{margin-left:auto;color:#9aafc4;background:transparent;border:0;width:42px;height:44px}.simple-user-avatar{width:36px;height:36px;min-width:36px;display:grid;place-items:center;border-radius:12px;background:#d7eee9;color:#147f70;font-size:12px;font-weight:850}.simple-main{min-width:0;flex:1;display:flex;flex-direction:column}.simple-topbar{height:78px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 clamp(18px,3vw,52px);border-bottom:1px solid #e5eaf0;background:#fff}.simple-mobile-logo{display:none}.simple-mode{display:flex;gap:4px;border-radius:12px;padding:4px;background:#eff3f6}.simple-mode button{border:0;background:transparent;color:#6c7a89;display:flex;align-items:center;gap:9px;padding:11px 17px;border-radius:9px;min-height:44px;font-weight:750;font-size:13px}.simple-mode button.active{background:#fff;color:#132d3b;box-shadow:0 2px 7px #102d3317}.simple-top-right{display:flex;gap:14px;align-items:center}.simple-live{color:#588174;display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:750}.simple-live i{width:8px;height:8px;background:#29d4a4;border-radius:50%}.simple-live.off i{background:#ff7373}.simple-logout{height:43px;width:43px;background:transparent;border:0;color:#8192a5;border-radius:12px}.simple-content{flex:1;width:100%;max-width:1500px;margin:0 auto;padding:33px clamp(18px,3vw,52px) 105px}.simple-pagehead{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:25px}.simple-pagehead h1{font-size:clamp(27px,3vw,40px);line-height:1.15;letter-spacing:-.045em;font-weight:850;margin:10px 0 10px}.simple-pagehead h1 span{color:#32c6a8}.simple-pagehead p{color:#7a8b9b;font-size:14px;margin:0;line-height:1.6}.simple-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:30px}.simple-metrics button{display:grid;text-align:left;gap:5px;min-width:0;min-height:165px;padding:22px;border:1px solid var(--border);background:#fff;border-radius:19px;box-shadow:0 5px 15px #19304b07}.simple-metrics button:hover{border-color:#70d6c4}.simple-metrics small{font-size:13px;color:#698093;font-weight:750}.simple-metrics strong{font-size:35px;font-weight:870;letter-spacing:-.06em;color:#18293c}.simple-metrics button>span:last-child{font-size:12px;color:#42998a;font-weight:700;display:flex;gap:7px;align-items:center}.simple-metric-icon{color:#0cbaa0}.simple-metric-icon.purple{color:#7566ca}.simple-metric-icon.blue{color:#4387bf}.simple-management-shortcuts{display:flex;gap:11px;flex-wrap:wrap;margin:-10px 0 26px}.simple-management-shortcuts button{display:flex;align-items:center;gap:11px;padding:14px 18px;background:#eaf2f5;border:none;color:#324e62;border-radius:12px;font-weight:800;font-size:13px;min-height:48px}.simple-management-shortcuts button svg:last-child{margin-left:18px}.simple-list-section{border-radius:21px;border:1px solid var(--border);background:#fff;overflow:hidden}.simple-list-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:25px 24px 17px}.simple-list-head h2{font-size:20px;letter-spacing:-.03em;margin-bottom:5px}.simple-list-head p{margin:0;color:#7b8c9b;font-size:13px}.simple-refresh{background:#f0f5f7;border:0;border-radius:11px;display:flex;align-items:center;gap:8px;padding:12px 14px;min-height:44px;color:#436176;font-weight:750}.simple-search{margin:0 24px 14px;display:flex;align-items:center;gap:12px;border:1px solid #e0e9ed;border-radius:13px;padding:0 13px;background:#f8fafb;color:#8296a5}.simple-search input{padding:12px 0;border:0;outline:none!important;background:transparent;min-height:45px}.simple-search button{border:0;background:transparent;width:36px;min-width:36px;height:36px;color:#8799a7}.simple-tickets{display:grid;padding-bottom:5px}.simple-ticket{min-width:0;display:flex;align-items:center;text-align:left;gap:17px;background:transparent;border:0;border-top:1px solid #edf1f3;padding:20px 24px;width:100%;color:#5e7890}.simple-ticket:hover{background:#f6fcfa}.simple-ticket-symbol{background:#edf9f6;color:#139f86;border-radius:14px;width:51px;height:51px;min-width:51px;display:grid;place-items:center}.simple-ticket-main{min-width:0;display:grid;gap:6px;flex:1}.simple-ticket-line{display:flex;gap:9px;align-items:center}.simple-ticket-line small{font-size:11px;color:#8da0ad;font-weight:800;letter-spacing:.03em}.simple-ticket-main>strong{color:#253c50;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.simple-ticket-client{color:#718396;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.simple-ticket-bottom{display:flex;align-items:center;gap:11px;min-width:0}.simple-ticket-bottom small{color:#889aa7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.simple-priority{display:inline-block;font-style:normal;border-radius:7px;font-size:10px;font-weight:850;padding:3px 6px;background:#ffebe3;color:#ad5b2d}.simple-priority.urgente{background:#ffe3e6;color:#c4455b}.simple-status{display:inline-flex;align-items:center;border-radius:7px;padding:5px 8px;font-size:10px;font-weight:850;white-space:nowrap;background:#eef4fd;color:#4d80bc}.simple-status.new{background:#e5f9f3;color:#198f79}.simple-status.ongoing{background:#f5efff;color:#8263bd}.simple-status.done{background:#ebf0f4;color:#718492}.simple-empty{padding:55px 25px;display:grid;place-items:center;text-align:center;color:#7a8fa1}.simple-empty svg{color:#56beaa;margin-bottom:12px}.simple-empty h3,.simple-empty h2{color:#334b5f;margin-bottom:6px}.simple-empty p{line-height:1.5;font-size:14px;max-width:310px}.simple-bottom-nav{display:none} /* Tech workspace uses one dark visual language with the rest of ProServitec. */ .simple-touch{background:#0b1424;color:#edf6fc}.simple-touch .simple-topbar{background:#101e2f;border-color:#26364b}.simple-touch .simple-content{color:#edf6fc}.simple-touch .simple-pagehead p{color:#95aabe}.simple-touch .simple-mode{background:#0b1625}.simple-touch .simple-mode button{color:#9eb1bf}.simple-touch .simple-mode button.active{background:#244156;color:#c0ffee}.simple-touch .simple-metrics button{background:#152438;border-color:#2b4055;box-shadow:none}.simple-touch .simple-metrics strong,.simple-touch .simple-metrics small{color:#e6f4fc}.simple-touch .simple-list-section{background:#132236;border-color:#2a3c50}.simple-touch .simple-list-head p{color:#93a8b9}.simple-touch .simple-search{background:#0d1a2b;border-color:#31485b;color:#9db0bf}.simple-touch .simple-search input{color:#fff}.simple-touch .simple-ticket{border-color:#29394e;color:#8ba9bf}.simple-touch .simple-ticket:hover{background:#1c3045}.simple-touch .simple-ticket-symbol{color:#49dfc1;background:#1b3b44}.simple-touch .simple-ticket-main>strong{color:#edf6fc}.simple-touch .simple-ticket-client,.simple-touch .simple-ticket-bottom small{color:#9aafc0}.simple-touch .simple-ticket-line small{color:#81a6b7}.simple-touch .simple-refresh{background:#22394c;color:#b8d4e1}.simple-touch .simple-management-shortcuts button{background:#244155;color:#bce8df}.simple-touch .simple-top-right .simple-user-avatar{background:#234b4b;color:#b7f5e2}.simple-touch .simple-search input::placeholder{color:#6d899d} /* Tickets detail: one sheet for touch & admin, actions pinned at bottom. */ .simple-detail-backdrop{position:fixed;inset:0;background:#030a12a9;z-index:50;display:flex;justify-content:flex-end}.simple-detail{width:min(100%,510px);height:100dvh;background:#fff;color:#24354a;display:flex;flex-direction:column;box-shadow:-20px 0 75px #010b1d55;animation:sheet-in .2s ease}.simple-detail-top{padding:20px 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e6ecf1;flex-shrink:0}.simple-detail-top strong{display:block;margin-top:5px;font-size:16px}.simple-detail-top button,.simple-person-edit button{min-width:44px;min-height:44px}.simple-detail-top>button{display:grid;place-items:center;border:0;border-radius:12px;background:#eef3f6;color:#43566b}.simple-detail-body{flex:1;overflow-y:auto;padding:25px 23px;overscroll-behavior:contain}.simple-detail-body h2{font-size:29px;line-height:1.2;letter-spacing:-.04em;margin:12px 0 25px}.simple-detail-customer{background:#f3f8fa;border-radius:15px;padding:15px;display:flex;gap:12px;align-items:center}.simple-detail-customer>div{display:grid;gap:4px;min-width:0;flex:1}.simple-detail-customer small,.simple-detail-facts small{font-size:10px;letter-spacing:.07em;color:#8da0ae;font-weight:800}.simple-detail-customer b{font-size:15px}.simple-detail-customer div span{color:#8295a3;font-size:12px}.simple-detail-customer a{display:grid;place-items:center;width:45px;height:45px;border-radius:11px;background:#daeee9;color:#10987f}.simple-person-avatar{width:46px;height:46px;min-width:46px;display:grid;place-items:center;border-radius:15px;background:#d9eee9;color:#148f79;font-size:14px;font-weight:850}.simple-detail-facts{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:23px 0;padding-bottom:23px;border-bottom:1px solid #edf1f2}.simple-detail-facts div{display:grid;gap:5px}.simple-detail-facts b{font-size:13px;overflow-wrap:anywhere}.simple-description h3{font-size:15px;margin-bottom:9px}.simple-description p{font-size:14px;color:#6e7f8e;line-height:1.7;white-space:pre-wrap}.simple-notebox{margin-top:24px;display:grid;gap:10px}.simple-notebox .simple-secondary{justify-self:start}.simple-warning{margin-top:16px;background:#fff7e8;padding:12px 14px;border-radius:12px;color:#966c2b;font-size:13px}.simple-more-button{background:transparent;border:none;color:#2d9f88;font-weight:800;padding:17px 0;display:flex;gap:9px;align-items:center;min-height:50px}.simple-extras{border-top:1px solid #e6eced;padding-top:20px;display:grid;gap:10px}.simple-extras>p{font-size:12px;color:#6e8394;border-bottom:1px solid #eaf0f1;padding:0 0 10px;margin:0;line-height:1.5}.simple-extras>p small{display:block;color:#9caab7}.simple-extras form{display:grid;gap:13px;background:#f6f9fa;border-radius:13px;padding:17px}.simple-extras h3{font-size:16px;margin-bottom:0}.simple-detail-actions{border-top:1px solid #e4ebef;padding:15px 23px max(17px,env(safe-area-inset-bottom));display:grid;gap:9px;flex-shrink:0;background:#fff}.simple-link{background:transparent;border:0;color:#ca6571;min-height:45px;font-weight:700}.simple-reject{padding:12px;background:#fff1f2;border-radius:12px;display:grid;gap:11px}.simple-complete{font-size:13px;text-align:center;font-weight:750;color:#558c81;display:flex;align-items:center;justify-content:center;gap:10px;min-height:40px}.simple-toast{position:fixed;bottom:25px;right:24px;z-index:80;max-width:min(92vw,400px);background:#15382f;border:1px solid #3ec4a6;color:white;padding:15px 16px;border-radius:12px;box-shadow:0 20px 40px #0002;display:flex;gap:15px;align-items:center;font-size:13px}.simple-toast.error{background:#631f31;border-color:#a73e50}.simple-toast button{background:transparent;color:white;border:0;min-width:35px;min-height:35px} /* Team & settings */ .simple-panel{background:#fff;border:1px solid var(--border);border-radius:18px;padding:23px}.simple-panel h2{margin-bottom:13px;font-size:20px}.simple-panel p{color:#718398;font-size:13px;line-height:1.6}.simple-team-form{margin-bottom:20px;display:grid;gap:20px}.simple-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.simple-row-end{display:flex;justify-content:flex-end}.simple-team-list{display:grid;gap:12px}.simple-person{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.simple-person-copy{min-width:0;flex:1}.simple-person-copy h3{font-size:16px;margin:0 0 5px}.simple-person-copy p{margin:0;color:#7890a0;font-size:12px}.simple-person-status{font-size:11px;font-weight:750;color:#269c7f;display:inline-block;margin-top:8px}.simple-person-status.inactive{color:#a9786c}.simple-person-edit{display:flex;align-items:end;gap:10px;flex-wrap:wrap;width:100%;padding-top:12px;border-top:1px solid #e5eeef}.simple-person-edit label{flex:1;min-width:170px}.simple-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:930px}.simple-settings-grid .simple-panel{display:grid;align-content:start;gap:12px}.simple-settings-grid label{display:grid} /* Existing ManualTicket form re-skinned, still calls real backend. */ .manual-backdrop{position:fixed;inset:0;z-index:70;background:#07111bb8;display:flex;align-items:center;justify-content:center;padding:14px}.manual-sheet{background:white;color:#23364a;border-radius:23px;width:min(100%,690px);max-height:calc(100dvh - 30px);overflow:auto;padding:25px}.manual-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.manual-head h2{font-size:26px;letter-spacing:-.04em;margin:9px 0}.manual-head p{font-size:13px;color:#728698;line-height:1.5}.manual-head>button{background:#f1f4f6;border:0;padding:10px;min-width:46px}.manual-form{display:grid;gap:20px}.manual-fields{display:grid;grid-template-columns:1fr 1fr;gap:17px}.manual-wide{grid-column:1/-1}.manual-fields label small{font-size:11px;color:#91a0ae;font-weight:400}.manual-actions{display:flex;gap:14px;justify-content:space-between;align-items:center}.manual-actions small{font-size:12px;color:#7d8da0;display:flex;gap:7px;align-items:center}.manual-actions button{background:#24d1ae;border:0;border-radius:12px;padding:12px 20px;font-weight:800;min-height:48px;display:flex;align-items:center;gap:10px} @keyframes sheet-in{from{transform:translateX(20px);opacity:.75}to{transform:none;opacity:1}} @media(max-width:1100px){.simple-sidebar{width:82px;align-items:center;padding-inline:9px}.simple-brand{padding:0 0 28px}.simple-brand>div,.simple-side-caption,.simple-sidebar nav button span,.simple-sidebar nav button i,.simple-sidebar-bottom>span:not(.simple-user-avatar){display:none}.simple-sidebar nav{width:100%}.simple-sidebar nav button{justify-content:center;padding:0;width:60px;position:relative}.simple-sidebar nav button.selected:before{left:0}.simple-sidebar-bottom{padding:18px 0 5px;flex-direction:column}.simple-sidebar-bottom>button{margin:0}} @media(max-width:760px){.simple-auth{padding:20px}.simple-login-wrap{display:flex;flex-direction:column;align-items:stretch;gap:21px;min-height:0;padding-top:34px;max-width:470px}.simple-auth-intro h1{font-size:38px;margin:12px 0}.simple-auth-intro p{font-size:14px;line-height:1.6}.simple-auth-chips{display:none}.simple-login{padding:23px 19px}.simple-login h2{font-size:24px}.simple-sidebar{display:none}.simple-topbar{height:68px;padding:0 17px}.simple-mobile-logo{display:flex;align-items:center;gap:9px;font-size:14px;letter-spacing:-.03em}.simple-mobile-logo .simple-logo{width:32px;height:32px;font-size:19px;border-radius:9px}.simple-mobile-logo .simple-logo span{font-size:10px;top:6px;right:6px}.simple-mode{margin-left:auto}.simple-mode button{padding:9px 12px;min-height:42px}.simple-mode button svg{display:none}.simple-top-right{display:none}.simple-content{padding:24px 15px 110px}.simple-pagehead{gap:11px}.simple-pagehead h1{font-size:29px;margin:7px 0}.simple-pagehead p{font-size:12px}.simple-pagehead>.simple-primary{padding:10px 12px;gap:4px;min-height:46px;font-size:12px}.simple-metrics{gap:8px;margin-bottom:20px}.simple-metrics button{min-height:125px;padding:12px;border-radius:14px}.simple-metrics strong{font-size:30px}.simple-metrics small{font-size:11px}.simple-metrics button>span:last-child{display:none}.simple-list-head{padding:18px 14px 12px}.simple-list-head h2{font-size:17px}.simple-list-head p{font-size:12px}.simple-refresh{padding:10px}.simple-refresh span{display:none}.simple-search{margin:0 13px 10px}.simple-ticket{gap:12px;padding:14px}.simple-ticket-symbol{width:44px;height:44px;min-width:44px;border-radius:12px}.simple-ticket-main>strong{font-size:14px}.simple-bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #e5edf0;background:#fff;padding:8px 7px max(8px,env(safe-area-inset-bottom));box-shadow:0 -8px 30px #031a2518}.simple-bottom-nav button{background:transparent;border:0;color:#7b8b9b;display:grid;justify-items:center;align-content:center;gap:6px;min-height:55px;font-weight:700;font-size:10px;border-radius:12px}.simple-bottom-nav button.active{color:#169e88;background:#e9f7f3}.simple-touch .simple-bottom-nav{background:#101e2f;border-color:#293e51}.simple-touch .simple-bottom-nav button.active{background:#20453f;color:#8cf0d3}.simple-detail-backdrop{align-items:flex-end}.simple-detail{width:100%;height:100dvh;border-radius:0}.simple-detail-top{padding:15px 18px}.simple-detail-body{padding:20px 18px}.simple-detail-actions{padding:13px 18px max(15px,env(safe-area-inset-bottom))}.simple-detail-body h2{font-size:25px}.simple-form-grid,.simple-settings-grid{grid-template-columns:1fr}.simple-panel{padding:18px}.simple-team-list{gap:10px}.simple-person{padding:16px}.simple-person-actions .simple-secondary{padding:9px 12px}.simple-toast{bottom:90px;right:12px}.manual-backdrop{align-items:flex-end;padding:0}.manual-sheet{border-radius:21px 21px 0 0;max-height:94dvh;padding:20px}.manual-fields{grid-template-columns:1fr;gap:14px}.manual-actions{flex-direction:column;align-items:stretch}.manual-actions button{justify-content:center}} @media(max-width:390px){.simple-mobile-logo>b{display:none}.simple-pagehead>.simple-primary span{display:none}.simple-metrics button{padding:10px}.simple-ticket-symbol{display:none}.simple-ticket{gap:5px}.simple-ticket>svg{width:16px}.simple-detail-facts{gap:14px}.simple-person-edit{display:grid}.simple-priority{font-size:9px}} @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}} /* OS 14 — Touch Station: one coherent identity, a dedicated tablet workspace. */ .simple-touch{--touch-card:#15283c;--touch-line:#294257;--touch-sub:#9cbbce;background:radial-gradient(ellipse at 30% -25%,#1a4255 0%,#0b1727 48%,#0b1625 100%)} .simple-touch .simple-sidebar{display:none} .simple-touch .simple-main{min-width:0;padding-bottom:88px;transition:margin-right .22s ease} .simple-touch .simple-topbar{height:75px;padding-inline:clamp(15px,3vw,46px);border-bottom-color:#294157;background:#101e30ed;position:relative;z-index:2} .simple-touch .simple-mobile-logo{display:flex;align-items:center;gap:12px} .simple-touch .simple-mobile-logo>b{font-size:17px;display:block} .simple-touch .simple-mobile-logo .simple-logo{width:39px;height:39px;font-size:22px;border-radius:12px} .simple-touch .simple-content{width:min(100%,1540px);max-width:none;padding:clamp(20px,3vw,40px) clamp(16px,3.5vw,52px) 45px} .simple-touch .simple-bottom-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:30;background:#12263aee;backdrop-filter:blur(16px);border-top:1px solid #355064;box-shadow:0 -15px 32px #030c1c45;padding:9px max(10px,env(safe-area-inset-left)) max(10px,env(safe-area-inset-bottom));gap:clamp(4px,2vw,14px)} .simple-touch .simple-bottom-nav button{min-height:62px;color:#9cb8c8;display:flex;justify-content:center;align-items:center;gap:9px;border:1px solid transparent;border-radius:13px;background:transparent;font-weight:800;font-size:13px} .simple-touch .simple-bottom-nav button.active{background:#224a48;color:#c1ffeb;border-color:#2c7869} .simple-touch .simple-bottom-nav button svg{width:23px;height:23px} .simple-touch .simple-top-right .simple-logout{display:none} .touch-signout{display:flex;align-items:center;justify-content:center;gap:7px;background:#213348;border:1px solid #355168;color:#b5cbd9;padding:8px 12px;border-radius:12px;min-height:44px;font-size:12px;font-weight:850;margin-left:auto} .touch-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:22px} .touch-heading-copy{min-width:0} .touch-heading h1{color:#f1fafc;font-size:clamp(27px,3vw,42px);letter-spacing:-.05em;line-height:1.12;margin:10px 0 7px} .touch-heading p{color:#9bb6c8;margin:0;font-size:14px;line-height:1.45} .touch-heading .simple-eyebrow{display:flex;align-items:center;gap:8px;color:#80dec7} .touch-live-dot{height:7px;width:7px;border-radius:50%;display:inline-block;background:#44e1b4;box-shadow:0 0 0 4px #44e1b418} .touch-new{display:flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;min-height:52px;padding:12px 18px;background:#42e1bf;border:0;border-radius:14px;font-weight:850;color:#092b2e;box-shadow:0 9px 24px #04a78b27} .touch-new:active,.touch-start:active,.touch-ticket:active{transform:scale(.984)} .touch-start-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:12px} .touch-start{min-height:164px;position:relative;display:flex;text-align:left;gap:18px;align-items:center;color:#edfffb;padding:24px;border:1px solid #398f83;border-radius:23px;transition:transform .15s ease,border-color .15s ease;background:linear-gradient(125deg,#1d544f,#123a40 80%)} .touch-start-desk{background:linear-gradient(125deg,#2a315c,#19294c 85%);border-color:#47567a} .touch-start-icon{height:65px;min-width:65px;display:grid;place-items:center;border-radius:19px;color:#c5ffed;background:#ffffff16} .touch-start-desk .touch-start-icon{color:#d8d4ff} .touch-start-body{display:grid;gap:7px;min-width:0;flex:1} .touch-start-body small{font-size:10px;font-weight:850;letter-spacing:.13em;color:#a6dfd5} .touch-start-body strong{font-size:clamp(28px,3vw,39px);line-height:1;letter-spacing:-.045em;font-weight:900} .touch-start-body strong span{font-size:clamp(13px,1.3vw,18px);font-weight:800;letter-spacing:0;color:#d7e7ed} .touch-start-body em{font-style:normal;font-size:13px;font-weight:750;color:#c7dedf} .touch-start-arrow{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#ffffff1b;flex-shrink:0} .touch-home-note{display:flex;align-items:center;gap:10px;padding:12px 14px 15px;color:#a8bece;font-size:13px;line-height:1.4} .touch-home-note>svg{color:#49dbb7;flex-shrink:0} .touch-home-note>span{flex:1} .touch-home-note button{background:transparent;border:0;color:#8ae8d2;display:flex;gap:7px;align-items:center;min-height:44px;font-weight:850;white-space:nowrap} .touch-queue{background:#101e31;border:1px solid #294158;border-radius:23px;padding:clamp(14px,2vw,24px)} .touch-queue-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:17px} .touch-queue-head h2{font-size:clamp(19px,2vw,25px);color:#f2f9fd;letter-spacing:-.035em;margin:6px 0 0} .touch-refresh{min-height:49px;min-width:49px;display:grid;place-items:center;border:1px solid #324b60;background:#213549;color:#b7e9dc;border-radius:13px} .touch-controls{display:flex;align-items:center;gap:12px;margin-bottom:17px} .touch-search{display:flex;align-items:center;gap:10px;min-width:0;flex:1;padding:0 13px;border:1px solid #324a61;border-radius:14px;background:#0c192a;color:#89adc1} .touch-search input{width:100%;border:0;background:transparent;color:#f7fffd;outline:0!important;min-height:51px;padding:10px 0;font-size:14px} .touch-search input::placeholder{color:#7898ab} .touch-search button{min-width:39px;min-height:42px;background:transparent;border:0;color:#90b0bf} .touch-filters{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none} .touch-filters::-webkit-scrollbar{display:none} .touch-filters button{display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;min-height:49px;border-radius:12px;background:#203349;color:#a7c0ce;border:1px solid #354d63;font-weight:850;font-size:12px;padding:10px 14px} .touch-filters button.active{background:#235b51;border-color:#45ae98;color:#baffeb} .touch-filters button span{background:#0003;border-radius:6px;padding:2px 6px} .touch-ticket-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,335px),1fr));gap:12px} .touch-ticket{display:grid;gap:14px;text-align:left;color:#edf9fe;background:#172a3f;border:1px solid #30465c;border-radius:19px;padding:20px;min-width:0;min-height:207px;transition:transform .15s ease,border-color .15s ease} .touch-ticket:hover,.touch-ticket.selected{border-color:#51d8bb;background:#1b3447} .touch-ticket-head,.touch-ticket-foot{display:flex;align-items:center;justify-content:space-between;gap:8px} .touch-ticket-number{font-size:11px;letter-spacing:.08em;color:#94aec0;font-weight:900} .touch-ticket>strong{font-size:17px;letter-spacing:-.02em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .touch-status{font-size:10px;font-weight:850;border-radius:7px;padding:5px 8px;background:#503f6e;color:#d9c3fd;white-space:nowrap} .touch-status.new{background:#20564a;color:#85efd2} .touch-status.done{background:#344355;color:#cad2de} .touch-ticket-customer{display:flex;align-items:center;gap:10px;min-width:0} .touch-avatar{width:40px;height:40px;display:grid;place-items:center;flex-shrink:0;background:#26445b;border-radius:12px;color:#bcdfec;font-size:12px;font-weight:850} .touch-ticket-customer>span:last-child{min-width:0;display:grid;gap:4px;font-size:13px;font-weight:750;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .touch-ticket-customer small{color:#9bb6c7;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:550} .touch-ticket-foot{border-top:1px solid #31465b;padding-top:13px;color:#9eb7c8;font-size:12px} .touch-priority{display:inline-flex;align-items:center;gap:4px;color:#ffb5a4;font-weight:850} .touch-ticket-open{color:#7dedd2;display:flex;gap:8px;align-items:center;font-weight:850} .touch-empty{grid-column:1/-1;display:grid;place-items:center;text-align:center;padding:36px 20px;color:#a8c0cd} .touch-empty svg{color:#71dbbf} .touch-empty h3{color:#eaf9fa;margin:10px 0 3px} .touch-empty p{font-size:13px;line-height:1.5} .touch-empty button{background:#294a4a;color:#c4ffef;border:0;border-radius:12px;padding:12px 18px;min-height:48px;font-weight:850} /* Touch detail is dark, high-contrast and action-first, unlike the admin drawer. */ .simple-touch .simple-detail{background:#132338;color:#f0f9fd;border-left:1px solid #355269} .simple-touch .simple-detail-top{background:#182d40;border-color:#355066} .simple-touch .simple-detail-top strong{color:#f4ffff} .simple-touch .simple-detail-top>button{background:#2a4054;color:#c7e4ee} .simple-touch .simple-detail-body{background:#14263a} .simple-touch .simple-detail-body h2{color:#f1fbfe} .simple-touch .simple-detail-customer{background:#1f384d} .simple-touch .simple-detail-customer small,.simple-touch .simple-detail-facts small{color:#9ab7c9} .simple-touch .simple-detail-customer div span{color:#c6d8e1} .simple-touch .simple-detail-facts{border-color:#2d455b} .simple-touch .simple-detail-facts b,.simple-touch .simple-description h3{color:#f2fafc} .simple-touch .simple-description p{color:#bbcede} .simple-touch .simple-detail-actions{background:#12253a;border-color:#355269} .simple-touch .simple-notebox label{color:#d2e2ea} .simple-touch .simple-notebox textarea,.simple-touch .simple-extras input,.simple-touch .simple-extras select{background:#0d192b;color:#f4fbfd;border-color:#385065} .simple-touch .simple-extras{border-color:#345066} .simple-touch .simple-extras>p{color:#c9dbe3;border-color:#30465d} .simple-touch .simple-extras form{background:#20364a} .simple-touch .simple-more-button{color:#7eebd1} .simple-touch .simple-secondary{background:#2a4255;border-color:#3e5b70;color:#f0f7fc} .simple-touch .simple-detail-actions .simple-primary{min-height:58px;font-size:16px} .simple-touch .simple-link{color:#ffacae} .simple-touch .simple-complete{color:#98e7d1} /* Management: slightly richer than OS 13, without adding navigation. */ .control-pagehead{margin-bottom:19px} .ops-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:16px} .ops-kpis button{min-width:0;display:grid;gap:14px;text-align:left;background:white;border:1px solid #e2eaef;border-radius:17px;min-height:147px;padding:18px;color:#193146} .ops-kpis button:hover{border-color:#58cbbb} .ops-kpi-title{font-size:12px;color:#71879b;display:flex;align-items:center;gap:9px;font-weight:850} .ops-kpi-title svg{color:#28b99f} .ops-kpis strong{font-size:34px;letter-spacing:-.05em;line-height:1} .ops-kpis small{font-size:11px;color:#77a49b;display:flex;align-items:center;gap:6px} .ops-kpis .ops-kpi-alert strong,.ops-kpis .ops-kpi-alert .ops-kpi-title svg{color:#dd8066} .ops-essentials{display:grid;grid-template-columns:1.15fr 1fr;gap:15px;margin-bottom:26px} .ops-card{min-width:0;background:#fff;border:1px solid #e1e9ef;border-radius:18px;padding:21px} .ops-card-title{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:13px} .ops-card-title h2{font-size:18px;letter-spacing:-.03em;margin:6px 0 0} .ops-count{background:#e9f6f2;color:#279d84;border-radius:9px;padding:8px 12px;font-size:13px;font-weight:850} .ops-alert-item{display:flex;align-items:center;text-align:left;gap:11px;background:#f7f9fb;border:1px solid #edf2f5;color:#4d7185;border-radius:12px;width:100%;padding:12px;margin-top:8px;min-height:57px} .ops-alert-item>span{min-width:0;display:grid;gap:4px;flex:1} .ops-alert-item b{font-size:12px;color:#2b4154;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ops-alert-item small{font-size:11px;color:#8fa0ae} .ops-calm{display:flex;gap:9px;align-items:center;font-size:13px;color:#6b968c;margin:21px 0 0} .ops-small-button{display:flex;align-items:center;gap:7px;min-height:45px;background:#edf6f3;border:0;border-radius:10px;padding:10px 13px;color:#348a79;font-weight:800;font-size:12px} .ops-team-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:19px 0} .ops-team-summary>div{display:grid;gap:5px;padding:13px;background:#f5f8fa;border-radius:13px} .ops-team-summary strong{font-size:24px;letter-spacing:-.04em;color:#273c4e} .ops-team-summary span{font-size:11px;color:#718b9b} .ops-team-footnote{margin:0!important;font-size:12px!important;color:#8495a2!important} .control-search-row{display:flex;align-items:center;gap:8px;padding:0 18px 14px} .control-search-row .simple-search{flex:1;min-width:0;margin:0} .control-filters{display:flex;gap:5px} .control-filters button{min-height:44px;background:#eff4f6;border:0;border-radius:10px;padding:10px 13px;font-weight:800;color:#70889c;white-space:nowrap;font-size:12px} .control-filters button.active{background:#ddf6ee;color:#188c77} /* Tablet landscape: keep the queue visible while operating a ticket. */ @media (min-width:940px) and (orientation:landscape){ .simple-touch.touch-focus .simple-main{margin-right:min(51vw,610px)} .simple-touch.touch-focus .simple-content{padding-inline:20px} .simple-touch.touch-focus .simple-topbar{padding-inline:20px} .simple-touch.touch-focus .touch-start-grid{grid-template-columns:1fr} .simple-touch.touch-focus .touch-ticket-grid{grid-template-columns:1fr} .simple-touch.touch-focus .touch-controls{flex-direction:column;align-items:stretch} .simple-touch.touch-focus .touch-heading p{display:none} .simple-touch.touch-focus .touch-start{min-height:110px;padding:17px} .simple-touch.touch-focus .touch-start-icon{width:50px;min-width:50px;height:50px} .simple-touch.touch-focus .touch-start-arrow{display:none} .simple-touch.touch-focus .simple-detail-backdrop{left:auto;right:0;top:0;bottom:calc(80px + env(safe-area-inset-bottom));width:min(51vw,610px);height:auto;background:transparent;z-index:17;box-shadow:-16px 0 50px #0003} .simple-touch.touch-focus .simple-detail{height:100%;width:100%;animation:none;box-shadow:none} } @media(max-width:1100px){ .ops-kpis{grid-template-columns:repeat(2,minmax(0,1fr))} .simple-touch .simple-content{padding-inline:22px} .simple-touch.touch-focus .touch-filters button{padding-inline:10px} } @media(max-width:800px){ .touch-controls{flex-direction:column;align-items:stretch} .touch-filters{width:100%} .ops-essentials{grid-template-columns:1fr} .control-search-row{flex-direction:column;align-items:stretch} .control-filters{width:100%;overflow-x:auto} .control-filters button{flex:1} } @media(max-width:760px){ .simple-touch .simple-topbar{height:69px;padding-inline:12px} .simple-touch .simple-mobile-logo>b{font-size:14px} .simple-touch .simple-mobile-logo .simple-logo{width:33px;height:33px;font-size:19px} .touch-signout{margin-left:0;min-width:43px;width:43px;padding:0} .touch-signout span{display:none} .simple-touch .simple-mode button{font-size:12px;padding:10px 12px} .simple-touch .simple-content{padding:23px 14px 22px} .touch-heading h1{font-size:30px} .touch-heading p{font-size:12px} .touch-start-grid{gap:10px} .touch-start{padding:17px;min-height:154px;gap:12px;border-radius:18px} .touch-start-icon{height:47px;min-width:47px;border-radius:14px} .touch-start-icon svg{width:26px;height:26px} .touch-start-arrow{display:none} .touch-start-body strong{font-size:28px} .touch-start-body strong span{display:block;margin-top:5px;font-size:12px} .touch-start-body em{font-size:11px} .touch-home-note{flex-wrap:wrap;padding:9px 4px 14px} .touch-home-note button{margin-left:auto} .touch-queue{border-radius:18px;padding:14px} .touch-ticket{min-height:190px;padding:16px;gap:10px} .simple-touch .simple-bottom-nav{gap:3px;padding:7px 6px max(7px,env(safe-area-inset-bottom))} .simple-touch .simple-bottom-nav button{min-height:59px;display:grid;justify-items:center;align-content:center;gap:6px;font-size:10px} .simple-touch .simple-bottom-nav button svg{width:23px;height:23px} .simple-touch .simple-detail{height:100dvh} .control-pagehead{flex-wrap:wrap} .ops-kpis button{min-height:115px;padding:13px;gap:8px} .ops-kpis strong{font-size:30px} .ops-team-summary>div{padding:10px} } @media(max-width:410px){ .simple-touch .simple-mobile-logo>b{display:none} .touch-heading{align-items:flex-start} .touch-new{padding:10px 13px;min-height:48px} .touch-start{gap:8px;padding:14px;min-height:145px} .touch-start-icon{min-width:43px;width:43px;height:43px} .touch-start-body strong{font-size:27px} .touch-ticket-grid{grid-template-columns:1fr} .touch-filters button{padding:10px 12px} .ops-kpis{gap:8px} .ops-kpis button{padding:12px} .ops-kpi-title{font-size:11px} .ops-kpi-title svg{width:17px} .control-pagehead>.simple-primary{font-size:12px} } @media(prefers-reduced-motion:reduce){.simple-touch .simple-main,.touch-ticket,.touch-start{transition:none}} .touch-list-more{width:100%;display:flex;justify-content:center;align-items:center;gap:9px;margin-top:13px;min-height:52px;border:1px solid #375568;color:#9fe9d4;background:#213746;border-radius:12px;font-weight:850;font-size:13px} /* ===================================================================== OS 14b — Touch Station + Painel Operacional Mesma identidade futurista (navy + mint), duas áreas: Touch = cartões grandes, gestos, zona do polegar. Painel = cockpit denso com HUD. Animações usam transform/opacity (swipe, sheets, morph); apenas a altura da folha do chamado em retrato anima layout. ===================================================================== */ .simple-app{--bg0:#060d19;--bg1:#0b1628;--card:#101e32;--card2:#15283f;--line:#233a52;--line2:#2f4b66;--txt:#eaf4fb;--sub:#a3b8ca;--mute:#8aa2b6;--red:#ff7587;--amber:#ffc169;--blue:#74b0ff;--violet:#a898ff;--ok:#6fe3a1;color:var(--txt)} .simple-control{background:radial-gradient(900px 420px at 88% -8%,#0f3a4a66,transparent 65%),repeating-linear-gradient(0deg,#48e6c109 0 1px,transparent 1px 44px),repeating-linear-gradient(90deg,#48e6c109 0 1px,transparent 1px 44px),var(--bg0)} .simple-control .simple-content,.simple-control .simple-pagehead h1{color:var(--txt)} .simple-control .simple-pagehead p{color:var(--sub)} .simple-app .simple-secondary{background:#1b3248;border-color:#34536f;color:var(--txt)} .simple-app .simple-secondary:hover{background:#244159} .simple-app .simple-error{background:#3a1822;border-color:#7b2c3b;color:#ffc9d1} .simple-app .simple-error button{color:#ffe0e5} .simple-control .simple-panel{background:#0f1e33;border-color:var(--line);color:var(--txt)} .simple-control .simple-panel p,.simple-control .simple-person-copy p{color:var(--sub)} .simple-control .simple-panel input,.simple-control .simple-panel select{background:#0a1626;border-color:#33506b;color:var(--txt)} .simple-control .simple-panel label{color:#d5e4ee} .simple-control .simple-person-edit{border-color:var(--line)} .simple-control .simple-empty{color:var(--sub)} .simple-control .simple-empty h2,.simple-control .simple-empty h3{color:var(--txt)} .simple-control .simple-tag{background:#3b2f14;color:#ffd58c} .simple-brand{background:none;border:0;color:inherit;text-align:left;width:100%;cursor:pointer;border-radius:14px} .simple-sidebar nav button{position:relative} /* ---- cabeçalho comum (gestos: ↑ painel · ↓ touch · toque duplo busca) ---- */ .simple-topbar.hd{height:66px;display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:0 clamp(10px,2.4vw,34px);background:#0b1829f0;border-bottom:1px solid var(--line);touch-action:none;position:sticky;top:0;z-index:25;backdrop-filter:blur(14px);user-select:none;-webkit-user-select:none} .hd-logo{display:flex;align-items:center;gap:10px;background:none;border:0;color:var(--txt);min-height:48px;padding:0 6px 0 0;border-radius:12px;font-weight:850;font-size:16px;letter-spacing:-.03em} .hd-logo .simple-logo{width:38px;height:38px;font-size:22px;border-radius:12px;box-shadow:0 0 18px #48e6c155} .hd-logo .simple-logo span{font-size:13px;top:6px;right:6px} .hd-dots{display:flex;gap:7px;align-items:center;padding:0 4px} .hd-dots i{width:8px;height:8px;border-radius:50%;background:#37536d;transition:transform .3s cubic-bezier(.2,.9,.3,1.4),background .3s} .hd-dots i.on{background:var(--mint);transform:scale(1.45);box-shadow:0 0 10px var(--mint)} .simple-app .simple-mode{background:#07111e;border:1px solid var(--line)} .simple-app .simple-mode button{color:var(--sub);min-height:42px;padding:8px 14px} .simple-app .simple-mode button.active{background:#1d4a50;color:#c9fff0;box-shadow:0 0 0 1px #3fb89f66 inset} .hd-right{margin-left:auto;display:flex;align-items:center;gap:4px} .hd-btn{position:relative;width:46px;height:46px;border-radius:14px;background:transparent;border:0;color:var(--sub);display:grid;place-items:center} .hd-btn:active{background:#1c3147} .hd-btn b{position:absolute;top:3px;right:1px;min-width:20px;height:20px;border-radius:10px;background:var(--red);color:#2b0a10;font-size:11px;font-weight:900;display:grid;place-items:center;padding:0 5px} .hd-demo{font-size:10px;font-weight:900;letter-spacing:.12em;padding:5px 8px;border-radius:8px;background:#3b2f14;color:var(--amber)} .simple-app .simple-live{color:var(--sub);margin-right:6px} .simple-live.off{color:var(--red)} .hd-avatar{background:#173f46;color:#b7f5e2;margin:0 4px} .hd-offline{margin-bottom:14px} .simple-control .hd-logo{display:none} .simple-control .simple-topbar.hd{padding-left:clamp(14px,2.4vw,34px)} .simple-app .simple-bottom-nav{background:#0d1a2cf2;border-top:1px solid var(--line);backdrop-filter:blur(16px)} .simple-bottom-nav button{position:relative} .simple-bottom-nav button i{position:absolute;top:5px;right:calc(50% - 26px);min-width:20px;height:20px;border-radius:10px;background:var(--mint);color:#052b2a;font-style:normal;font-size:11px;font-weight:900;display:grid;place-items:center;padding:0 5px} .simple-app .simple-bottom-nav button{color:var(--sub)} .simple-app .simple-bottom-nav button.active{background:#1d4a50;color:#c9fff0} /* ---- morph entre áreas: o container expande a partir da borda (400ms, mola) ---- */ .stage{backface-visibility:hidden} .stage-up{animation:morph-up .4s cubic-bezier(.2,.9,.25,1.12) both;transform-origin:50% 100%} .stage-down{animation:morph-down .4s cubic-bezier(.2,.9,.25,1.12) both;transform-origin:50% 0} @keyframes morph-up{from{transform:translate3d(0,16%,0) scale(.94,.84);opacity:.02}55%{opacity:1}to{transform:none;opacity:1}} @keyframes morph-down{from{transform:translate3d(0,-12%,0) scale(.94,.84);opacity:.02}55%{opacity:1}to{transform:none;opacity:1}} @keyframes fade{from{opacity:0}to{opacity:1}} @keyframes sheet-up{from{transform:translate3d(0,40px,0);opacity:.4}to{transform:none;opacity:1}} @keyframes pop{from{transform:scale(.3);opacity:0}to{transform:none;opacity:1}} @keyframes card-in{from{transform:translate3d(0,-22px,0);opacity:0}to{transform:none;opacity:1}} @keyframes blink{0%,100%{opacity:.25}50%{opacity:1}} @keyframes ping{from{transform:scale(1);opacity:.8}to{transform:scale(2.6);opacity:0}} /* ---- gesto genérico: cartão deslizável ---- */ .sw{position:relative;border-radius:20px;overflow:hidden} .sw-fg{position:relative;z-index:1;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;will-change:transform;border-radius:inherit;outline-offset:-3px} .sw-bg{position:absolute;inset:0;display:flex;align-items:center;gap:10px;padding:0 22px;color:#fff;font-size:16px;opacity:0;transition:opacity .12s} .sw-bg-r{justify-content:flex-start;background:linear-gradient(90deg,#126b52,#1fb386)} .sw-bg-l{justify-content:flex-end;background:linear-gradient(270deg,#7d2437,#d1485f)} .sw[data-dir=r] .sw-bg-r,.sw[data-dir=l] .sw-bg-l{opacity:1} .sw[data-armed="1"] .sw-bg{filter:brightness(1.3)} .sw-fg:focus-visible{outline:3px solid #48e6c1} /* ================= TOUCH ================= */ .simple-touch{background:radial-gradient(900px 520px at 20% -10%,#1b4a5a 0%,transparent 60%),radial-gradient(700px 400px at 100% 30%,#1b2a5a66,transparent 70%),var(--bg1)} .simple-touch .simple-content{max-width:1240px;padding:clamp(14px,2.4vw,30px) clamp(12px,3vw,40px) 40px} .tz{display:grid;gap:16px;align-content:start} .tz-hello h1{font-size:clamp(30px,4.2vw,48px);letter-spacing:-.055em;line-height:1.08;margin:10px 0 6px;color:#f4fbff} .tz-hello p{color:var(--sub);margin:0;font-size:15px} .tz-hello .simple-eyebrow{display:flex;align-items:center;gap:9px;color:#80dec7} .tz-live{position:relative;display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--mint)} .tz-live:after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--mint);animation:ping 1.8s ease-out infinite} .tz-next{position:relative;overflow:hidden;display:grid;gap:10px;text-align:left;padding:22px;border-radius:26px;border:1px solid #3a9d8e;color:#effffb;min-height:178px;background:linear-gradient(125deg,#1b5a58 0%,#143f56 55%,#1a2d5c 100%);box-shadow:0 18px 50px #0006,0 0 0 1px #48e6c122 inset;transition:transform .16s} .tz-next:active{transform:scale(.985)} .tz-next:before{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#48e6c133,transparent 70%)} .tz-next.l-urgente{border-color:#d9667a;background:linear-gradient(125deg,#5a2433,#3a2146 60%,#1a2d5c)} .tz-next-tag{font-size:11px;font-weight:900;letter-spacing:.16em;color:#a6f3de} .tz-next>strong{font-size:clamp(22px,3vw,30px);letter-spacing:-.035em;line-height:1.15} .tz-next-who{display:flex;align-items:center;gap:10px;color:#d5ece9;font-size:14px} .tz-next-go{justify-self:end;display:inline-flex;align-items:center;gap:10px;margin-top:6px;padding:0 20px;min-height:54px;border-radius:16px;background:var(--mint);color:#04302c;font-weight:900;font-size:16px;box-shadow:0 10px 26px #48e6c133} .tz-calm{display:grid;justify-items:center;gap:6px;padding:28px 20px;border:1px dashed var(--line2);border-radius:22px;color:var(--sub);text-align:center} .tz-calm svg{color:var(--mint)}.tz-calm b{color:var(--txt);font-size:18px} .tz-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px} .tz-tile{display:flex;align-items:center;gap:14px;text-align:left;min-height:104px;padding:16px;border-radius:22px;border:1px solid var(--line2);background:linear-gradient(135deg,#17304a,#112238);color:var(--txt);transition:transform .15s} .tz-tile:active{transform:scale(.985)} .tz-tile.desk{background:linear-gradient(135deg,#25295a,#16213f);border-color:#42508a} .tz-tile-ic{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#ffffff12;color:#bff8e7;flex-shrink:0} .tz-tile.desk .tz-tile-ic{color:#d9d4ff} .tz-tile small{display:block;font-size:10px;letter-spacing:.14em;font-weight:900;color:#9fc7d6} .tz-tile strong{display:block;font-size:34px;line-height:1.05;letter-spacing:-.05em} .tz-tile em{font-style:normal;font-size:12px;color:#b8d0dc;font-weight:700} .tz-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px} .tz-stats button{display:grid;gap:2px;justify-items:center;min-height:72px;padding:10px;border-radius:18px;background:#0f2034;border:1px solid var(--line);color:var(--txt)} .tz-stats b{font-size:24px;letter-spacing:-.04em}.tz-stats span{font-size:11px;color:var(--sub)} .tz-stats .warn b{color:var(--red)} .tz-queue{display:grid;gap:12px} .tz-q-head{display:flex;align-items:center;justify-content:space-between;gap:10px} .tz-q-head h2{margin:0;font-size:clamp(20px,2.4vw,26px);letter-spacing:-.04em;display:flex;align-items:center;gap:10px} .tz-q-head h2 small{font-size:13px;padding:3px 9px;border-radius:9px;background:#173247;color:#9fe9d5} .tz-q-tools{display:flex;gap:8px} .tz-ico{width:50px;height:50px;border-radius:15px;background:#152a41;border:1px solid var(--line2);color:var(--sub);display:grid;place-items:center} .tz-ico.on{background:#1d4a50;color:#c9fff0;border-color:#3fb89f} .tz-lanes{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;position:sticky;top:66px;z-index:6;padding:8px 0;background:linear-gradient(#0b1628f5 70%,transparent)} .tz-lanes::-webkit-scrollbar{display:none} .tz-lanes button{flex:1 0 auto;min-height:52px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:15px;background:#12253a;border:1px solid var(--line2);color:var(--sub);font-weight:850;font-size:14px;transition:transform .12s} .tz-lanes button:active{transform:scale(.97)} .tz-lanes button b{min-width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:#0006;font-size:12px;padding:0 6px} .tz-lanes button.on{color:#06262a;background:var(--mint);border-color:transparent} .tz-lanes button.on.l-urgente{background:var(--red)} .tz-lanes button.on.l-normal{background:var(--blue)} .tz-lanes button.on.l-baixa{background:#b6c6d3} .tz-lanes button.on b{background:#0002} .tz-legend-strip{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;color:var(--mute);font-size:12px} .tz-legend-strip span{white-space:nowrap;padding:6px 11px;border-radius:999px;border:1px dashed var(--line2)} .tz-filter-chip{justify-self:start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:12px;background:#173a44;color:#c9fff0;border:1px solid #3fb89f66;font-weight:800} .tz-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:12px} .tz-list.dense{grid-template-columns:1fr;gap:8px} .tz-card.enter{animation:card-in .3s cubic-bezier(.2,.9,.3,1) both} .tz-card .sw-fg{display:grid;gap:11px;padding:16px 16px 14px;background:linear-gradient(160deg,#17304a,#122338);border:1px solid #2c4862;border-radius:20px;color:var(--txt);text-align:left} .tz-card.l-urgente .sw-fg{box-shadow:inset 5px 0 0 var(--red)} .tz-card.l-normal .sw-fg{box-shadow:inset 5px 0 0 var(--blue)} .tz-card.l-baixa .sw-fg{box-shadow:inset 5px 0 0 #7d93a6} .tz-card.sel .sw-fg{border-color:var(--mint);background:linear-gradient(160deg,#1a3d52,#14293e)} .tz-card.vip .sw-fg{border-color:#ffc16999} .tz-card.muted{opacity:.55} .tz-c-top{display:flex;align-items:center;gap:8px;font-size:11px} .tz-c-top b{letter-spacing:.07em;color:var(--sub)} .tz-pri{font-weight:900;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:8px;background:#203a52;color:#cfe3f1;font-size:10px} .l-urgente .tz-pri{background:#5a2433;color:#ffc2cc}.l-normal .tz-pri{background:#1e3b66;color:#c4dcff} .tz-vip{color:var(--amber);display:grid} .tz-new{font-style:normal;font-weight:900;font-size:10px;letter-spacing:.1em;padding:4px 7px;border-radius:7px;background:var(--mint);color:#052b2a} .tz-ch{padding:3px 8px;border-radius:7px;background:#0d1b2e;color:var(--sub);font-weight:700} .tz-grip{touch-action:none;margin:-12px -10px -12px auto;width:48px;height:48px;display:grid;place-items:center;color:var(--mute);border-radius:14px;cursor:grab} .tz-card .sw-fg>strong{font-size:17px;letter-spacing:-.025em;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .tz-c-cust{display:flex;align-items:center;gap:11px;min-width:0} .tz-c-cust>span:last-child{display:grid;gap:3px;min-width:0;font-weight:750;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .tz-c-cust small{color:var(--sub);font-weight:500;font-size:12px;overflow:hidden;text-overflow:ellipsis} .tz-av{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#24445c;color:#bfe3f1;font-weight:850;font-size:12px;flex-shrink:0} .tz-c-foot{display:flex;align-items:center;gap:12px;border-top:1px solid #2a435a;padding-top:11px;font-size:12px;color:var(--sub)} .tz-wait{display:inline-flex;align-items:center;gap:5px;font-weight:800;color:#9fe9d5} .tz-wait.late{color:var(--red)} .tz-hint{margin-left:auto;font-size:11px;color:var(--mute);white-space:nowrap} .tz-hint-zero .tz-hint,.tz-hint-zero .tz-grip{opacity:.0} .tz-hint-zero .tz-grip{opacity:.35} .tz-card.dense .sw-fg{padding:10px 12px;gap:6px} .tz-card.dense .tz-c-cust,.tz-card.dense .tz-who,.tz-card.dense .tz-hint{display:none} .tz-card.dense .tz-c-foot{border:0;padding:0;margin-top:-2px} .tz-card.dense .sw-fg>strong{-webkit-line-clamp:1;font-size:15px} .tz-empty{grid-column:1/-1;display:grid;justify-items:center;gap:8px;text-align:center;padding:38px 18px;color:var(--sub);border:1px dashed var(--line2);border-radius:22px} .tz-empty svg{color:var(--mint)}.tz-empty h3{color:var(--txt);margin:4px 0 0;font-size:18px}.tz-empty p{margin:0;max-width:320px;line-height:1.5;font-size:14px} .tz-empty button,.tz-more{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:52px;padding:0 20px;border-radius:15px;background:#1d4a50;color:#c9fff0;border:1px solid #3fb89f77;font-weight:850;font-size:14px;margin-top:6px} .tz-more{width:100%} .tz-fabs{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:calc(92px + env(safe-area-inset-bottom));display:grid;gap:12px;z-index:12} .tz-fab{width:58px;height:58px;border-radius:20px;background:#17304a;border:1px solid var(--line2);color:#c9fff0;display:grid;place-items:center;box-shadow:0 12px 30px #0007;transition:transform .12s} .tz-fab:active{transform:scale(.93)} .tz-fab.main{background:var(--mint);color:#04302c;border-color:transparent;width:64px;height:64px;border-radius:22px;box-shadow:0 12px 30px #48e6c144} /* menu radial (segurar ½ s) */ .tz-radial{position:fixed;inset:0;z-index:75;background:#02070fa6;backdrop-filter:blur(5px);animation:fade .15s both;touch-action:none} .tz-radial-core{position:absolute;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:#04302c;font-weight:900;font-size:13px;box-shadow:0 0 0 8px #48e6c133,0 0 0 18px #48e6c11a;animation:pop .22s both} .tz-radial-btn{position:absolute;width:66px;height:66px;border-radius:50%;display:grid;align-content:center;justify-items:center;gap:1px;background:#142c44;border:1.5px solid #48e6c199;color:#d9fff4;box-shadow:0 10px 26px #000a;animation:pop .3s cubic-bezier(.2,.9,.3,1.4) both} .tz-radial-btn span{font-size:9.5px;font-weight:800;letter-spacing:.01em} .tz-radial-btn:active{background:#1d4a50} /* folhas inferiores */ .tz-sheet-bg{position:fixed;inset:0;z-index:65;background:#02070fb8;display:flex;align-items:flex-end;justify-content:center;animation:fade .2s both} .tz-sheet{width:min(100%,680px);max-height:90dvh;display:flex;flex-direction:column;background:#0e1d31;border:1px solid var(--line2);border-bottom:0;border-radius:28px 28px 0 0;box-shadow:0 -24px 70px #000a;animation:sheet-up .34s cubic-bezier(.2,.9,.25,1.1) both;color:var(--txt)} .tz-sheet.tall{height:90dvh} .tz-sheet-handle{display:grid;place-items:center;height:30px;touch-action:none;flex-shrink:0;cursor:grab} .tz-sheet-handle i{width:46px;height:5px;border-radius:3px;background:#47627b} .tz-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 18px 8px} .tz-sheet-head h2{margin:0;font-size:20px;letter-spacing:-.03em} .tz-x{width:48px;height:48px;border-radius:14px;background:#193049;border:0;color:var(--sub);display:grid;place-items:center} .tz-sheet-body{overflow-y:auto;padding:6px 18px max(20px,env(safe-area-inset-bottom));display:grid;gap:12px;align-content:start;overscroll-behavior:contain} .tz-sheet-note{color:var(--sub);font-size:14px;line-height:1.5;margin:0} .tz-sheet textarea,.tz-search input{background:#091524;border:1px solid #33506b;color:var(--txt);border-radius:14px;font-size:16px} .tz-quick{display:flex;flex-wrap:wrap;gap:8px} .tz-quick button{min-height:48px;padding:0 14px;border-radius:13px;background:#173149;border:1px solid var(--line2);color:var(--txt);font-weight:700;font-size:13px} .tz-quick button.on{background:#5a2433;border-color:var(--red);color:#ffd5db} .tz-big{min-height:58px;font-size:16px} .simple-primary.danger{background:var(--red);color:#2b0a10;box-shadow:none} .tz-opts{display:grid;gap:10px} .tz-opt{display:flex;align-items:center;gap:14px;text-align:left;min-height:68px;padding:12px 14px;border-radius:18px;background:#14293f;border:1px solid var(--line2);color:var(--txt)} .tz-opt>span:first-child{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#24445c;color:#bfe3f1;flex-shrink:0;font-weight:850;font-size:12px} .tz-opt b{display:block;font-size:15px}.tz-opt small{color:var(--sub);font-size:12px} .tz-opt.warn>span:first-child{background:#5a2433;color:#ffc2cc} .tz-opt:active{background:#1d3a54} .tz-search{display:flex;align-items:center;gap:10px;padding:0 14px;border-radius:16px;background:#091524;border:1px solid #33506b;color:var(--sub);flex-direction:row} .tz-search input{border:0;background:transparent;min-height:56px;padding:0;outline:0!important} .tz-search button{background:none;border:0;color:var(--sub);width:44px;height:44px} .tz-results{display:grid;gap:8px} .tz-res{display:flex;align-items:center;gap:12px;text-align:left;min-height:66px;padding:10px 12px;border-radius:16px;background:#13273c;border:1px solid var(--line);color:var(--txt)} .tz-res>div{flex:1;min-width:0;display:grid;gap:3px}.tz-res b{font-size:14px}.tz-res small{color:var(--sub);font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .tz-res .touch-status{font-size:10px} .tz-legend{list-style:none;margin:0;padding:0;display:grid;gap:8px} .tz-legend li{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:15px;background:#12253a} .tz-legend li>span{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#1d4a50;color:#c9fff0;flex-shrink:0} .tz-legend b{display:block;font-size:14px}.tz-legend small{color:var(--sub);font-size:12px} .tz-setrow{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:12px 4px;border-top:1px solid var(--line)} .tz-setrow b{display:block;font-size:14px}.tz-setrow small{color:var(--sub);font-size:12px;display:block;max-width:300px;line-height:1.4} .tz-seg,.pn-seg{display:inline-flex;gap:4px;padding:4px;border-radius:14px;background:#07111e;border:1px solid var(--line)} .tz-seg button,.pn-seg button{min-height:44px;padding:0 14px;border-radius:10px;border:0;background:transparent;color:var(--sub);font-weight:800;font-size:13px;display:inline-flex;align-items:center;gap:7px} .tz-seg button.on,.pn-seg button.on{background:#1d4a50;color:#c9fff0} /* ficha do chamado — escura nas duas áreas */ .simple-app .simple-detail{background:#112238;color:#f0f9fd;border-left:1px solid #355269} .simple-app .simple-detail-top{background:#17304a;border-color:#30506a} .simple-app .simple-detail-top strong{color:#f4ffff} .simple-app .simple-detail-top>button{background:#25425a;color:#c7e4ee} .simple-app .simple-detail-body{background:#112238} .simple-app .simple-detail-body h2{color:#f1fbfe} .simple-app .simple-detail-customer{background:#1b3850} .simple-app .simple-detail-customer small,.simple-app .simple-detail-facts small{color:#a3c0d1} .simple-app .simple-detail-customer div span{color:#cfdfe8} .simple-app .simple-detail-customer a{background:#1d4a50;color:#c9fff0} .simple-app .simple-detail-facts{border-color:#2d455b} .simple-app .simple-detail-facts b,.simple-app .simple-description h3{color:#f2fafc} .simple-app .simple-description p{color:#c3d4e1} .simple-app .simple-detail-actions{background:#0f1f34;border-color:#30506a} .simple-app .simple-notebox label{color:#d2e2ea} .simple-app .simple-detail textarea,.simple-app .simple-detail input,.simple-app .simple-detail select{background:#091524;color:#f4fbfd;border-color:#385065} .simple-app .simple-extras{border-color:#345066} .simple-app .simple-extras>p{color:#cddce4;border-color:#30465d} .simple-app .simple-extras form{background:#1a3249} .simple-app .simple-more-button{color:#7eebd1} .simple-app .simple-link{color:#ffacae} .simple-app .simple-complete{color:#98e7d1} .simple-app .simple-reject{background:#3a1822} .simple-app .simple-warning{background:#3b2f14;color:#ffd58c} .simple-app .simple-status{background:#1e3552;color:#9cc4f5} .simple-app .simple-status.new{background:#16463f;color:#8cf0d6}.simple-app .simple-status.ongoing{background:#2f2a5a;color:#cbbdff}.simple-app .simple-status.done{background:#2a3b4d;color:#c1cfdb} .simple-app .simple-priority{background:#4a2c1d;color:#ffc2a0}.simple-app .simple-priority.urgente{background:#5a2433;color:#ffc2cc} .simple-app .simple-detail-actions .simple-primary{min-height:58px;font-size:16px} .simple-app .simple-detail-actions .simple-secondary{min-height:54px} .sd-badges{display:flex;gap:8px;align-items:center} .sd-note{position:relative}.sd-note textarea{padding-right:60px} .sd-mic{position:absolute;right:8px;bottom:8px;width:46px;height:46px;border-radius:50%;border:0;background:#1d4a50;color:#c9fff0;display:grid;place-items:center} .sd-mic.on{background:var(--red);color:#2b0a10;animation:blink 1s infinite} .sd-grip{display:none} .simple-detail-customer a+a{margin-left:0} /* Touch + chamado aberto: paisagem = fila 40% / chamado 60%; retrato = fila em cima e folha embaixo */ @media (min-width:940px) and (orientation:landscape){ .simple-touch.touch-focus .simple-main{margin-right:60vw} .simple-touch.touch-focus .simple-detail-backdrop{width:60vw} .simple-touch.touch-focus .tz-list{grid-template-columns:1fr} .simple-touch.touch-focus .tz-tiles{grid-template-columns:1fr} .simple-touch.touch-focus .tz-next{min-height:0} .simple-touch.touch-focus .tz-fabs{right:calc(60vw + 14px)} .simple-touch.touch-focus .simple-bottom-nav{right:0} } @media (orientation:portrait),(max-width:939px){ .simple-touch .simple-detail-backdrop.sd-touch{background:transparent;pointer-events:none;align-items:flex-end;justify-content:center} .simple-touch .sd-touch .simple-detail{pointer-events:auto;width:min(100%,760px);height:46dvh;border-radius:28px 28px 0 0;border:1px solid #355269;border-bottom:0;box-shadow:0 -22px 60px #000b;transition:height .34s cubic-bezier(.2,.9,.25,1.05);animation:sheet-up .34s cubic-bezier(.2,.9,.25,1.1) both} .simple-touch .sd-touch.sd-full{pointer-events:auto;background:#02070f99} .simple-touch .sd-touch.sd-full .simple-detail{height:100dvh;border-radius:0} .simple-touch .sd-touch .sd-grip{display:grid;place-items:center;height:30px;flex-shrink:0;touch-action:none;cursor:grab} .simple-touch .sd-touch .sd-grip i{width:50px;height:5px;border-radius:3px;background:#4b677f} .simple-touch .sd-touch .simple-detail-top{padding:6px 18px 10px} .simple-touch .sd-touch:not(.sd-full) .simple-detail-body{padding:14px 18px} .simple-touch .sd-touch:not(.sd-full) .simple-detail-body h2{font-size:21px;margin:8px 0 14px} .simple-touch.touch-focus:not(.sheet-full) .simple-main{padding-bottom:calc(46dvh + 24px)} .simple-touch.touch-focus .tz-fabs{display:none} } /* ================= PAINEL ================= */ .pn{display:grid;gap:14px;align-content:start} .pn-bar{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap} .pn-bar .simple-eyebrow{display:flex;align-items:center;gap:9px;color:#80dec7} .pn-bar h1{font-size:clamp(26px,3.2vw,40px);letter-spacing:-.05em;margin:8px 0 0;line-height:1.1} .pn-bar h1 span{color:var(--mint)} .pn-bar-act{display:flex;gap:8px;flex-wrap:wrap} .pn-btn{min-height:46px;display:inline-flex;align-items:center;gap:9px;padding:0 15px;border-radius:13px;background:#12263b;border:1px solid var(--line2);color:var(--txt);font-weight:800;font-size:13px} .pn-btn.on{background:#1d4d4a;border-color:#3fb89f;color:#c7ffef} .pn-btn.solid{background:var(--mint);color:#06262a;border-color:transparent} .pn-alerts{display:grid;gap:10px} .pn-banner-sw .sw-fg{background:linear-gradient(90deg,#4a3410,#2d2210);border:1px solid #8a6a2a;border-radius:16px} .pn-banner-sw{border-radius:16px} .pn-banner{display:flex;align-items:center;gap:12px;padding:14px 18px;color:#ffe0a8;font-size:14px;min-height:56px} .pn-banner span{color:#e9c88b}.pn-banner em{margin-left:auto;font-style:normal;font-weight:800;display:inline-flex;gap:6px;align-items:center;white-space:nowrap} .pn-alert-row{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px} .pn-alert-row::-webkit-scrollbar{display:none} .pn-alert-sw{flex:1 0 min(86vw,300px);border-radius:16px} .pn-alert-sw .sw-fg{background:#15283f;border:1px solid var(--line2);border-radius:16px} .pn-alert-sw.crit .sw-fg{border-color:#c04a5e;background:linear-gradient(120deg,#3a1b2a,#15283f)} .pn-alert-sw.crit .sw-fg:after{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid var(--red);pointer-events:none;animation:blink 1.4s ease-in-out infinite} .pn-alert{display:flex;align-items:center;gap:12px;padding:14px;min-height:68px;text-align:left} .pn-alert>div{display:grid;gap:3px;min-width:0}.pn-alert b{font-size:14px}.pn-alert small{color:var(--sub);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pn-alert-ic{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#2a3f58;color:var(--amber);flex-shrink:0} .crit .pn-alert-ic{background:#5a2433;color:#ffc2cc} .pn-alert-hint{color:var(--mute);font-size:11px} .pn-modnav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;position:sticky;top:66px;z-index:6;padding:8px 0;background:linear-gradient(#060d19f2 75%,transparent)} .pn-modnav::-webkit-scrollbar{display:none} .pn-modnav button{flex:0 0 auto;min-height:44px;padding:0 15px;border-radius:12px;background:#11233a;border:1px solid var(--line);color:var(--sub);font-weight:800;font-size:13px} .pn-modnav button.on{background:#1d4a50;color:#c9fff0;border-color:#3fb89f} .pn-edit-tray{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:12px 14px;border-radius:16px;border:1px dashed #48e6c188;background:#0d2432;color:var(--sub);font-size:13px} .pn-edit-tray b{color:var(--mint)} .pn-edit-tray button{min-height:44px;padding:0 13px;border-radius:11px;background:#173a44;color:#c9fff0;border:1px solid #3fb89f66;font-weight:800;display:inline-flex;gap:6px;align-items:center} .pn-body{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start} .pn-sidebtn{display:flex;align-items:center;gap:9px;min-height:48px;padding:0 15px;border-radius:13px;background:#12263b;border:1px solid var(--line2);color:var(--txt);font-weight:800;justify-self:start} .pn-sidebtn b{background:var(--mint);color:#052b2a;border-radius:8px;padding:2px 7px;font-size:12px} .pn-side{display:none;gap:16px;padding:16px;border-radius:20px;background:#0d1b2e;border:1px solid var(--line)} .pn-side.open{display:grid} .pn-side h3{margin:0;font-size:12px;letter-spacing:.16em;color:var(--mint)} .pn-fgroup{display:grid;gap:8px}.pn-fgroup>span{font-size:11px;font-weight:850;letter-spacing:.1em;color:var(--mute);text-transform:uppercase} .pn-seg{width:100%}.pn-seg button{flex:1;justify-content:center;padding:0 6px} .pn-vchips{display:grid;gap:6px} .pn-vchips button{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:0 12px;border-radius:12px;background:#12263b;border:1px solid var(--line);color:var(--sub);font-weight:750;font-size:13px;text-align:left} .pn-vchips button b{font-size:11px;background:#0007;border-radius:7px;padding:2px 7px} .pn-vchips button.on{background:#1d4a50;color:#c9fff0;border-color:#3fb89f} .pn-mini{display:none} .pn-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;grid-auto-flow:dense;min-width:0} .pn-w{position:relative;min-width:0;border-radius:20px;border:1px solid var(--line);background:linear-gradient(180deg,#0f2136 0,#0c1a2c 100%);box-shadow:0 14px 40px #0004;scroll-margin-top:130px} .pn-w:before,.pn-w:after{content:"";position:absolute;width:20px;height:20px;pointer-events:none;opacity:.85} .pn-w:before{top:-1px;left:-1px;border-top:2px solid var(--mint);border-left:2px solid var(--mint);border-radius:20px 0 0 0} .pn-w:after{bottom:-1px;right:-1px;border-bottom:2px solid var(--mint);border-right:2px solid var(--mint);border-radius:0 0 20px 0} .pn-w.edit{outline:1.5px dashed #48e6c177;outline-offset:3px} .pn-w.dragging{opacity:.7;transform:scale(.985)} .pn-wh{display:flex;align-items:center;gap:12px;padding:15px 12px 6px 16px;position:relative;user-select:none;-webkit-user-select:none} .pn-wi{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#133a42;color:var(--mint);flex-shrink:0} .pn-wh h2{margin:3px 0 0;font-size:17px;letter-spacing:-.025em} .pn-wh .simple-eyebrow{font-size:10px} .pn-wact{margin-left:auto;display:flex;gap:2px} .pn-wact button{width:46px;height:46px;border-radius:13px;background:transparent;border:0;color:var(--sub);display:grid;place-items:center} .pn-grab{touch-action:none;cursor:grab;color:var(--mint)!important;background:#133a42!important} .pn-wmenu{position:absolute;right:10px;top:60px;z-index:30;min-width:230px;padding:6px;border-radius:16px;background:#0e2036;border:1px solid var(--line2);box-shadow:0 24px 60px #000b;display:grid;animation:pop .18s both;transform-origin:top right} .pn-wmenu button{display:flex;align-items:center;gap:11px;min-height:50px;padding:0 14px;border-radius:11px;background:transparent;border:0;color:var(--txt);font-weight:750;font-size:14px;text-align:left} .pn-wmenu button:active{background:#1d3a54} .pn-wb{padding:8px 16px 16px;display:grid;gap:12px} .pn-wb-in{display:grid;gap:12px;min-width:0} .pn-fila{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:10px} .pn-stat{position:relative;overflow:hidden;display:grid;gap:2px;text-align:left;padding:14px 14px 18px;min-height:96px;border-radius:16px;background:#0b1a2c;border:1px solid var(--line);color:var(--txt)} .pn-stat b{font-size:34px;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums} .pn-stat span{font-size:12px;color:var(--sub);font-weight:700} .pn-stat i{position:absolute;left:0;right:0;bottom:0;height:4px;transform-origin:left;background:var(--mint);transition:transform .5s cubic-bezier(.2,.9,.3,1)} .pn-stat.t-run i{background:var(--blue)}.pn-stat.t-wait i{background:var(--amber)}.pn-stat.t-ok i{background:var(--ok)}.pn-stat.t-lost i{background:var(--red)} .pn-stat.t-new b{color:var(--mint)}.pn-stat.t-run b{color:var(--blue)}.pn-stat.t-wait b{color:var(--amber)}.pn-stat.t-ok b{color:var(--ok)}.pn-stat.t-lost b{color:var(--red)} .pn-stat.on{border-color:var(--mint);background:#102b3a} .pn-stat:active{transform:scale(.98)} .pn-live{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--sub)} .pn-live button{margin-left:auto;background:none;border:0;color:var(--mint);font-weight:800;min-height:44px} .pn-pulse{position:relative;width:8px;height:8px;border-radius:50%;background:var(--mint)} .pn-pulse:after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--mint);animation:ping 1.6s ease-out infinite} .pn-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(138px,1fr));gap:10px} .pn-kpi{display:grid;gap:4px;text-align:left;padding:13px 13px 8px;min-height:112px;border-radius:16px;background:#0b1a2c;border:1px solid var(--line);color:var(--txt);box-shadow:inset 3px 0 0 #3a5873} .pn-kpi span{font-size:11px;font-weight:900;letter-spacing:.14em;color:var(--sub)} .pn-kpi b{font-size:28px;letter-spacing:-.045em;line-height:1.1;font-variant-numeric:tabular-nums} .pn-kpi.ok{box-shadow:inset 3px 0 0 var(--ok)}.pn-kpi.warn{box-shadow:inset 3px 0 0 var(--amber)}.pn-kpi.bad{box-shadow:inset 3px 0 0 var(--red)} .pn-kpi.ok b{color:var(--ok)}.pn-kpi.warn b{color:var(--amber)}.pn-kpi.bad b{color:var(--red)} .pn-kpi.open{border-color:var(--mint);background:#102b3a} .pn-spark{width:100%;display:block;margin-top:auto} .pn-spark-line{fill:none;stroke:var(--mint);stroke-width:2;stroke-linejoin:round} .pn-spark-area{fill:#48e6c120;stroke:none} .pn-spark circle{fill:var(--mint)}.pn-spark text{fill:var(--sub);font-size:9px;font-weight:700} .pn-kpi-detail{display:grid;gap:8px;padding:14px;border-radius:16px;background:#0a1828;border:1px solid var(--line)} .pn-kpi-detail>div{display:grid;gap:3px}.pn-kpi-detail span{color:var(--sub);font-size:13px;line-height:1.5} .pn-kpi-detail .pn-spark{max-width:560px;margin:0} .pn-axis-row{display:flex;justify-content:space-between;color:var(--mute);font-size:11px;max-width:560px} .pn-bars{display:grid;gap:7px} .pn-bars>div{display:grid;grid-template-columns:78px 1fr 28px;gap:10px;align-items:center;font-size:12px;color:var(--sub)} .pn-bars i{height:8px;border-radius:4px;background:#16304a;overflow:hidden}.pn-bars u{display:block;height:100%;background:linear-gradient(90deg,var(--mint),#2f9bff);border-radius:4px} .pn-bars b{color:var(--txt);text-align:right} .pn-tabs{display:inline-flex;gap:4px;padding:4px;border-radius:13px;background:#07111e;border:1px solid var(--line);justify-self:start} .pn-tabs button{min-height:44px;padding:0 15px;border-radius:10px;border:0;background:transparent;color:var(--sub);font-weight:800;font-size:13px} .pn-tabs button.on{background:#1d4a50;color:#c9fff0} .pn-chart{display:grid;gap:8px} .pn-chart-box{touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab} .pn-chart svg{width:100%;display:block} .pn-grid-line{stroke:#1d3248;stroke-width:1} .pn-axis{fill:var(--mute);font-size:11px} .pn-line{fill:none;stroke:var(--mint);stroke-width:2.6;stroke-linecap:round} .pn-hover-line{stroke:#48e6c188;stroke-dasharray:3 3} .pn-dot{fill:var(--mint);stroke:#06202a;stroke-width:2} .pn-tip{fill:#0a2338;stroke:#2f6a78}.pn-tip-text{fill:var(--txt);font-size:11px;font-weight:800} .pn-cell{fill:var(--mint);cursor:pointer}.pn-cell.sel{stroke:#fff;stroke-width:1.6} .pn-chart-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--sub);font-size:13px} .pn-chart-foot b{color:var(--txt)} .pn-zoom{display:flex;gap:6px}.pn-zoom button{width:46px;height:46px;border-radius:13px;background:#12263b;border:1px solid var(--line2);color:var(--txt);display:grid;place-items:center} .pn-tip-hint{color:var(--mute);font-size:11px} .pn-funnel{display:grid;gap:2px} .pn-drop{display:block;color:var(--mute);font-size:11px;margin:5px 0 5px 4px} .pn-stage{display:block;width:100%;text-align:left;background:none;border:0;padding:0;color:var(--txt)} .pn-stage-bar{display:flex;align-items:center;height:48px;width:var(--w);min-width:70px;border-radius:13px;background:linear-gradient(90deg,#17665f,#38c7a6);padding-left:15px;color:#032a27;font-weight:900;font-size:21px;transition:width .5s cubic-bezier(.2,.9,.3,1);font-variant-numeric:tabular-nums} .pn-stage.on .pn-stage-bar{box-shadow:0 0 0 2px #fff6,0 0 22px #48e6c177} .pn-stage-name{display:flex;flex-direction:column;margin-top:6px;font-size:13px;font-weight:850} .pn-stage-name small{font-weight:500;color:var(--sub);font-size:11px} .pn-drill{display:grid;gap:6px;padding:10px;border-radius:15px;background:#0a1828;border:1px solid var(--line)} .pn-drill>button{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 10px;border-radius:11px;background:#12263b;border:0;color:var(--txt);font-size:13px;text-align:left} .pn-drill>button>span:nth-of-type(2){flex:1;min-width:0;color:var(--sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pn-dot-s{width:9px;height:9px;border-radius:50%;background:var(--mint);flex-shrink:0} .pn-dot-s.t-run{background:var(--blue)}.pn-dot-s.t-wait{background:var(--amber)}.pn-dot-s.t-ok{background:var(--ok)}.pn-dot-s.t-lost{background:var(--red)} .pn-link{display:inline-flex;align-items:center;gap:7px;min-height:46px;background:none;border:0;color:var(--mint);font-weight:850;font-size:13px;justify-self:start} .pn-rank{display:grid;gap:8px} .pn-agent-main{display:grid;grid-template-columns:22px 46px minmax(0,1fr) auto;gap:5px 12px;align-items:center;width:100%;text-align:left;background:#0b1a2c;border:1px solid var(--line);border-radius:16px;padding:12px;color:var(--txt);min-height:66px} .pn-agent.open .pn-agent-main{border-color:var(--mint)} .pn-pos{color:var(--mute);font-weight:900;font-size:13px;text-align:center} .pn-av{position:relative;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:#24445c;color:#bfe3f1;font-weight:850;font-size:13px} .pn-av i{position:absolute;right:-3px;bottom:-3px;width:14px;height:14px;border-radius:50%;border:3px solid #0b1a2c;background:var(--mint)} .pn-av i.s-chamado{background:var(--blue)}.pn-av i.s-ausente{background:#6d8296} .pn-agent-name{display:grid;gap:2px;min-width:0}.pn-agent-name b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pn-agent-name small{color:var(--sub);font-size:11px} .pn-agent-n{display:grid;justify-items:end}.pn-agent-n b{font-size:20px;letter-spacing:-.04em}.pn-agent-n small{font-size:10px;color:var(--sub)} .pn-agent-bar{grid-column:3/5;height:6px;border-radius:3px;background:#16304a;overflow:hidden} .pn-agent-bar u{display:block;height:100%;background:linear-gradient(90deg,var(--mint),#2f9bff);transform-origin:left;border-radius:3px;transition:transform .5s cubic-bezier(.2,.9,.3,1)} .pn-badges{grid-column:3/5;display:flex;gap:6px;flex-wrap:wrap} .pn-badges em{font-style:normal;font-size:10.5px;font-weight:850;padding:3px 8px;border-radius:7px;background:#16463f;color:#8cf0d6} .pn-badges em.s-chamado{background:#1e3b66;color:#c4dcff}.pn-badges em.s-ausente{background:#2a3b4d;color:#c1cfdb}.pn-badges em.bad{background:#5a2433;color:#ffc2cc} .pn-agent-det{display:grid;gap:8px;padding:10px 4px 4px} .pn-mini-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:6px} .pn-mini-kpis span{display:grid;gap:2px;padding:9px 6px;border-radius:12px;background:#0a1828;text-align:center;font-size:10px;color:var(--sub)}.pn-mini-kpis b{font-size:16px;color:var(--txt)} .pn-hist{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 12px;border-radius:12px;background:#12263b;border:0;color:var(--txt);font-size:12px;text-align:left} .pn-hist span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sub)} .pn-hist em{font-style:normal;font-size:10px;font-weight:850} .pn-agent-det p{margin:0;color:var(--sub);font-size:13px} .t-new{color:var(--mint)}.t-run{color:var(--blue)}.t-wait{color:var(--amber)}.t-ok{color:var(--ok)}.t-lost{color:var(--red)} .pn-tools{display:grid;gap:10px} .pn-search{display:flex;align-items:center;gap:10px;padding:0 13px;border-radius:14px;background:#091524;border:1px solid #33506b;color:var(--sub);flex-direction:row} .pn-search input{border:0;background:transparent;color:var(--txt);min-height:48px;padding:0;outline:0!important} .pn-search button{width:44px;height:44px;background:none;border:0;color:var(--sub)} .pn-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px} .pn-chips::-webkit-scrollbar{display:none} .pn-chips button{flex:0 0 auto;min-height:44px;padding:0 14px;border-radius:12px;background:#12263b;border:1px solid var(--line);color:var(--sub);font-weight:800;font-size:12.5px} .pn-chips button.on{background:#1d4a50;color:#c9fff0;border-color:#3fb89f} .pn-thead,.pn-row{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(0,1.5fr) minmax(0,.95fr) minmax(0,.8fr) minmax(0,1.1fr) minmax(0,1.5fr) minmax(0,.8fr);gap:10px;align-items:center} .pn-thead{display:none;padding:0 14px;color:var(--mute);font-size:11px;font-weight:850;letter-spacing:.06em;text-transform:uppercase} .pn-th{background:none;border:0;color:inherit;font:inherit;text-align:left;min-height:40px;padding:0;letter-spacing:inherit;text-transform:inherit;display:inline-flex;gap:4px;align-items:center} .pn-th.on{color:var(--mint)}.pn-th i{font-style:normal} .pn-rows{display:grid;gap:8px} .pn-swrow{border-radius:14px} .pn-swrow .sw-fg{background:#0b1a2c;border:1px solid var(--line);border-radius:14px} .pn-swrow .sw-fg:hover{border-color:#3d6179} .pn-row{padding:12px 14px;min-height:60px;font-size:13px;text-align:left;grid-template-areas:"main main st" "cli cli tm" "ch pri ag"} .pn-c-main{grid-area:main;display:grid;gap:2px;min-width:0}.pn-c-main small{color:var(--mute);font-size:11px;letter-spacing:.05em}.pn-c-main b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px} .pn-c-cli{grid-area:cli;display:grid;gap:1px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pn-c-cli small{color:var(--sub);font-size:11px} .pn-c-ch{grid-area:ch;color:var(--sub);font-size:12px}.pn-c-ag{grid-area:ag;color:var(--sub);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pn-c-tm{grid-area:tm;justify-self:end;color:var(--sub);font-variant-numeric:tabular-nums;font-size:12px} .pn-st{grid-area:st;justify-self:end;font-size:11px;font-weight:850;padding:4px 9px;border-radius:8px;background:#0007} .pn-pri{grid-area:pri;font-size:11px;font-weight:850} .p-urgente{color:var(--red)}.p-alta{color:var(--amber)}.p-normal{color:var(--blue)}.p-baixa{color:var(--mute)} .pn-tfoot{display:flex;align-items:center;gap:12px;color:var(--sub);font-size:12px;flex-wrap:wrap} .pn-tfoot button{min-height:46px;padding:0 16px;border-radius:12px;background:#1d4a50;color:#c9fff0;border:0;font-weight:800} .pn-tfoot small{margin-left:auto;color:var(--mute)} .pn-empty{display:grid;justify-items:center;gap:8px;padding:28px 12px;color:var(--sub);text-align:center}.pn-empty svg{color:var(--mint)}.pn-empty p{margin:0} .pn-empty.wide{grid-column:1/-1;border:1px dashed var(--line2);border-radius:20px} .pn-step{display:flex;align-items:center;gap:6px} .pn-step button{width:50px;height:50px;border-radius:14px;background:#1b3248;border:1px solid var(--line2);color:var(--txt);font-size:22px;font-weight:700} .pn-step b{min-width:44px;text-align:center;font-size:20px} @media(min-width:480px){ .pn-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .pn-w{grid-column:span 2} } @media(max-width:479px){ .pn-kpis{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -4px;padding:0 4px} .pn-kpi{flex:0 0 150px;scroll-snap-align:start} .pn-mini-kpis{grid-template-columns:repeat(2,1fr)} } @media(min-width:768px){ .pn-body{grid-template-columns:220px minmax(0,1fr)} .pn-sidebtn{display:none} .pn-side{display:grid;position:sticky;top:84px} .pn-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .pn-w,.pn-w-fila,.pn-w-kpis,.pn-w-tabela{grid-column:span 3} .pn-w-tempo{grid-column:span 2}.pn-w-funil{grid-column:span 1}.pn-w-ranking{grid-column:span 3} .pn-w-tabela{grid-column:span 3} .pn-thead{display:grid} .pn-row{grid-template-areas:none;min-height:56px} .pn-row>*{grid-area:auto!important} .pn-c-tm,.pn-st{justify-self:start} .pn-w-ranking .pn-agent-main{grid-template-columns:22px 42px minmax(0,1fr)} .pn-w-ranking .pn-agent-n{display:none} .pn-modnav{top:66px} } @media(min-width:1200px){ .pn-body{grid-template-columns:230px minmax(0,1fr) 54px} .pn-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .pn-w,.pn-w-fila,.pn-w-kpis{grid-column:span 4} .pn-w-tempo{grid-column:span 3}.pn-w-funil{grid-column:span 1}.pn-w-ranking{grid-column:span 4}.pn-w-tabela{grid-column:span 4} .pn-modnav{display:none} .pn-mini{display:grid;position:sticky;top:84px;gap:8px;align-content:start} .pn-mini button{position:relative;width:50px;height:50px;border-radius:15px;background:#10223a;border:1px solid var(--line);color:var(--sub);display:grid;place-items:center} .pn-mini button.on{background:#1d4a50;color:#c9fff0;border-color:#3fb89f;box-shadow:0 0 16px #48e6c133} .pn-mini button span{display:none;position:absolute;right:58px;white-space:nowrap;padding:8px 12px;border-radius:10px;background:#0a2338;border:1px solid var(--line2);color:var(--txt);font-size:12px;font-weight:700;z-index:3} .pn-mini button:hover span,.pn-mini button:focus-visible span{display:block} .pn-w-ranking .pn-agent-main{grid-template-columns:22px 42px minmax(0,1fr) auto} .pn-w-ranking .pn-agent-n{display:grid} } @media(min-width:768px) and (max-width:1199px){.pn-w-ranking .pn-agent-main{grid-template-columns:22px 42px minmax(0,1fr) auto}.pn-w-ranking .pn-agent-n{display:grid}.pn-w-ranking .pn-agent-bar,.pn-w-ranking .pn-badges{grid-column:3/5}} /* telas pequenas */ @media(max-width:760px){ .simple-topbar.hd{gap:6px} .simple-control .hd-logo{display:flex} .hd-logo>b{display:none} .simple-app .simple-mode button{padding:8px 12px;font-size:12px} .simple-live>span{display:none} .hd-demo{display:none} .tz-tiles{gap:10px}.tz-tile{padding:13px;gap:10px}.tz-tile-ic{width:44px;height:44px}.tz-tile strong{font-size:28px} .tz-next{padding:18px;min-height:160px} .tz-fabs{bottom:calc(86px + env(safe-area-inset-bottom))} .simple-control .simple-content{padding:16px 12px 110px} .pn-wb{padding:6px 12px 14px} } @media(max-width:420px){.hd-avatar{display:none}.hd-btn{width:42px}.simple-app .simple-mode button{padding:8px 10px}.tz-stats b{font-size:21px}} @media (hover:none){.sw-fg{cursor:default}} @media(prefers-reduced-motion:reduce){.stage,.tz-card.enter,.tz-sheet,.pn-wmenu,.tz-radial-btn{animation:none!important}.pn-pulse:after,.tz-live:after{animation:none}} .pn-w-ranking .pn-rank{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}.pn-st{white-space:nowrap}.pn-w-funil .pn-wh{padding-right:6px}.pn-w-funil .pn-wact button{width:40px} @media (min-width:940px) and (orientation:landscape){.simple-touch.touch-focus .hd-right .simple-live,.simple-touch.touch-focus .hd-demo,.simple-touch.touch-focus .hd-avatar,.simple-touch.touch-focus .hd-dots{display:none}.simple-touch.touch-focus .simple-topbar.hd{overflow:hidden}} /* Conversa e resposta ao cliente na ficha */ .sd-thread,.sd-reply{display:grid;gap:10px;margin-top:22px} .sd-thread h3,.sd-reply h3{margin:0;font-size:15px} .sd-msg{max-width:88%;padding:10px 13px;border-radius:16px;background:#1b3850;display:grid;gap:4px} .sd-msg p{margin:0;font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere} .sd-msg small{font-size:10.5px;color:#a3c0d1;font-weight:700} .sd-msg.cli{justify-self:start;border-bottom-left-radius:5px} .sd-msg.eq{justify-self:end;background:#17564f;border-bottom-right-radius:5px} .sd-msg.int{justify-self:center;max-width:100%;background:#3b2f14;color:#ffe0a8} .sd-quick{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px} .sd-quick::-webkit-scrollbar{display:none} .sd-quick button{flex:0 0 auto;max-width:260px;min-height:46px;padding:8px 13px;border-radius:13px;background:#173149;border:1px solid #32506b;color:#dcecf6;font-size:12.5px;text-align:left} .sd-quick button:active{background:#1d4a50}