.product-demo{--purple:#7159df;--purple-dark:#5741ba;--muted:#706d7e;font-family:Arial,Helvetica,sans-serif;line-height:1.7}.product-demo .icon{width:23px;height:23px;flex-shrink:0;vertical-align:middle}
.product-demo{position:relative;background:#fff;border:1px solid #e7e1f1;border-radius:17px;overflow:hidden;box-shadow:0 24px 65px #4231570c;text-align:left}.product-demo .window-chrome{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border-bottom:1px solid #eeebf3;height:40px;padding:0 16px;font-size:8px;color:#8d859a}.product-demo .window-chrome b{font-weight:400;color:#b0a9b8}.product-demo .window-dots{display:flex;gap:4px}.product-demo .window-dots i{display:block;width:5px;height:5px;border-radius:50%;background:#e0dae8}.product-demo .window-dots i:first-child{background:#e4b5b4}.product-demo .window-dots i:nth-child(2){background:#e8d49b}.product-demo .window-dots i:last-child{background:#b1d4bf}.product-demo .window-lock{display:flex;align-items:center;gap:4px;font-size:7px}.product-demo .window-lock .icon{height:10px;width:10px}.product-demo .app-shell{display:flex;min-height:355px}.product-demo .app-sidebar{width:55px;flex-shrink:0;background:#fcfbfe;border-right:1px solid #eeebf3;display:flex;flex-direction:column;align-items:center;padding:17px 8px 12px;gap:14px}.product-demo .app-brand{color:var(--purple);margin-bottom:10px}.product-demo .app-brand .icon{width:23px;height:23px}.product-demo .app-nav-icon{display:grid;place-items:center;padding:6px;border-radius:6px;color:#aca3bb}.product-demo .app-nav-icon .icon{height:16px;width:16px}.product-demo .app-nav-icon.selected{background:#eae3fc;color:var(--purple)}.product-demo .app-avatar{background:#eae3fc;font-size:8px;color:var(--purple);width:23px;height:23px;display:grid;place-items:center;border-radius:50%;margin-top:auto}.product-demo .app-content{flex:1;min-width:0;padding:22px;background:#f9f8fc}.product-demo .ui-greeting{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:22px}.product-demo .ui-greeting small{font-size:7px;color:#9990a7;display:block;letter-spacing:.06em}.product-demo .ui-greeting h3{font-family:var(--body);font-size:16px;font-weight:600;letter-spacing:-.02em;line-height:1.4;margin-top:4px}.product-demo .ui-greeting h3>span{color:#d8aa70;margin-left:5px}.product-demo .pill{font-size:7px;font-weight:600;border-radius:5px;display:inline-flex;align-items:center;padding:4px 7px;line-height:1.3;white-space:nowrap}.product-demo .pill.green,.product-demo .avatar.mint{color:#42775a;background:#e4f0e7}.product-demo .pill.peach,.product-demo .avatar.peach{color:#a87345;background:#faeadb}.product-demo .pill.lilac,.product-demo .avatar.lavender{color:#7a5ab0;background:#eee6fc}.product-demo .metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:17px}.product-demo .metric-grid>div{padding:13px;background:white;border:1px solid #eeeaf4;border-radius:9px}.product-demo .metric-grid small{display:block;color:#9b91a9;font-size:8px}.product-demo .metric-grid strong{display:block;font-size:26px;line-height:1.4;font-weight:500;letter-spacing:-1px;margin:4px 0}.product-demo .metric-grid strong>span{font-size:12px;color:#b5adc0;letter-spacing:0}.product-demo .metric-grid div>span{font-size:7px;color:#aaa2b6}.product-demo .metric-grid div>span.green-text{color:#74a287}.product-demo .dashboard-lower{display:grid;grid-template-columns:1.45fr 1fr;gap:12px}.product-demo .ui-panel{background:white;border:1px solid #eeeaf4;border-radius:9px;padding:13px;font-size:9px}.product-demo .panel-heading{display:flex;justify-content:space-between;align-items:center}.product-demo .panel-heading small{color:#b5adbf;font-size:6px}.product-demo .task-line{display:flex;gap:8px;align-items:center;font-size:8px;margin-top:20px}.product-demo .task-line>.icon{width:24px;height:24px;color:var(--purple);background:#f4effc;border-radius:6px;padding:5px}.product-demo .task-line small{display:block;font-size:6px;color:#a69cad;line-height:1.7}.product-demo .chart{display:flex;height:149px;margin-top:14px;gap:12px}.product-demo .chart-lines{display:flex;flex-direction:column;justify-content:space-between;font-size:6px;color:#b4aabe;padding-bottom:17px}.product-demo .chart-bars{display:flex;justify-content:space-around;align-items:flex-end;gap:10px;flex:1;background:repeating-linear-gradient(to top,transparent 0,transparent 31px,#f0edf6 32px)}.product-demo .chart-bars>div{height:100%;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.product-demo .bar{display:block;width:100%;max-width:21px;height:var(--bar);background:#b8a5f4;border-radius:4px 4px 0 0;position:relative;transform-origin:bottom;animation:grow-bars 1.4s cubic-bezier(.2,.8,.2,1) both}.product-demo .chart-bars>div:nth-child(2n) .bar{background:#d4c9f4;animation-delay:.1s}.product-demo .bar i{position:absolute;bottom:0;width:100%;height:23%;background:#e9e2fa}.product-demo .chart-bars small{font-size:6px;color:#a79db5;margin-top:6px}.product-demo .avatar{display:inline-grid;place-items:center;width:29px;height:29px;border-radius:50%;font-size:9px;font-weight:600;flex-shrink:0}.product-demo .hero-dashboard .app-content{padding:22px}.product-demo .hero-dashboard .app-shell{min-height:385px}.product-demo .hero-dashboard .chart{height:165px}.product-demo .sample-label{display:block;text-align:center;font-size:10px;color:#9a8faa;margin-top:17px;letter-spacing:.02em}.product-demo .ui-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:17px}.product-demo .ui-filter{border:1px solid #ece7f1;border-radius:5px;background:white;padding:5px 8px;font-size:7px;display:flex;gap:30px}.product-demo .rota-legend{font-size:6px;display:flex;gap:5px;align-items:center;margin-left:auto;color:#9b91a8}.product-demo .rota-legend i{background:#e2d7fa;width:5px;height:5px;border-radius:2px}.product-demo .rota-legend i:last-child{background:#f3d8b5;margin-left:4px}.product-demo .rota-grid{display:grid;grid-template-columns:125px repeat(5,minmax(72px,1fr));border-left:1px solid #eeeaf3;border-top:1px solid #eeeaf3;min-width:510px}.product-demo .rota-head{font-size:7px;padding:10px 8px;background:#fff;border-right:1px solid #eeeaf3;border-bottom:1px solid #eeeaf3;color:#92879f}.product-demo .rota-head.today{color:var(--purple);background:#f2edfd}.product-demo .rota-person{display:flex;gap:7px;align-items:center;background:#fff;padding:12px 8px;border-right:1px solid #eeeaf3;border-bottom:1px solid #eeeaf3}.product-demo .rota-person .avatar{width:23px;height:23px;font-size:7px}.product-demo .rota-person>span:last-child{font-size:7px;font-weight:600;line-height:1.5}.product-demo .rota-person small{font-size:5px;font-weight:400;color:#a59aaf;display:block}.product-demo .rota-cell{padding:5px;min-height:69px;border-right:1px solid #eeeaf3;border-bottom:1px solid #eeeaf3;background:#fff;display:flex;align-items:stretch}.product-demo .shift-block{border:0;border-left:2px solid #b6a2e7;border-radius:5px;padding:7px 5px;background:#f0eafa;width:100%;font-size:6px;text-align:left;line-height:1.6;display:flex;flex-direction:column;color:#8670ac;transition:background .3s}.product-demo .shift-block b{font-size:6px;white-space:nowrap}.product-demo .shift-block small{font-size:6px}.product-demo .shift-block>span{font-size:5px;margin-top:3px;opacity:.65}.product-demo .shift-block.mint{background:#e8f2eb;border-color:#b3d5bf;color:#739280}.product-demo .shift-block.open{background:#fff8ee;border:1px dashed #e1bd8c;color:#b18a55;justify-content:center}.product-demo .shift-block.open:hover{background:#f8ecd7}.product-demo .available{color:#c1b8cc;font-size:7px;margin:auto}.product-demo .rota-scroll{overflow:auto}.product-demo .ui-action{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:7px;padding:6px 9px;color:#fff;background:var(--purple);border:0;border-radius:5px;line-height:1.5}.product-demo .ui-action .icon{width:10px;height:10px}.product-demo .ui-action:hover{background:var(--purple-dark)}.product-demo .ui-action.done{background:#5a966e}.product-demo .ui-bottomline{display:flex;justify-content:space-between;align-items:center;font-size:7px;margin-top:15px;color:#a99db6}.product-demo .ui-bottomline .icon{width:10px;height:10px;color:#79a486}.product-demo .quiet-button{border:0;padding:0;background:none;font-size:7px;color:#a499ad}.product-demo .kanban{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.product-demo .kanban-column{background:#f0ecf6;border-radius:8px;padding:11px}.product-demo .kanban-column h4{display:flex;justify-content:space-between;font-size:8px;font-family:var(--body);letter-spacing:0;margin-bottom:12px}.product-demo .kanban-column h4>span{background:#e0d8ec;color:#89789e;padding:2px 5px;border-radius:3px}.product-demo .candidate-card{padding:15px 12px;background:white;border-radius:7px;margin-bottom:10px;box-shadow:0 2px 3px #31283b04}.product-demo .candidate-card strong,.product-demo .candidate-card small{display:block;font-size:9px;line-height:1.5;margin-top:7px}.product-demo .candidate-card small{font-size:7px;color:#a498b0;margin-top:2px}.product-demo .candidate-card>span:last-child{font-size:6px;color:#a89aaf}.product-demo .mini-progress{height:3px;background:#f2eef6;border-radius:3px;margin-top:12px}.product-demo .mini-progress i{display:block;width:66%;height:3px;background:#b9a6de;border-radius:3px}.product-demo .compliance-layout{display:flex;gap:45px;align-items:center;padding:25px 5px}.product-demo .compliance-ring{width:155px;height:155px;background:conic-gradient(#9d85d8 92%,#e8e2f1 0);border-radius:50%;padding:13px;flex-shrink:0;transform:rotate(-25deg)}.product-demo .compliance-ring>div{background:#f9f8fc;width:100%;height:100%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(25deg)}.product-demo .compliance-ring strong{font-family:var(--heading);font-size:39px;font-weight:600}.product-demo .compliance-ring strong>span{font-size:20px}.product-demo .compliance-ring small{font-size:7px;color:#9b8ba9}.product-demo .check-list{flex:1}.product-demo .check-list>div{display:flex;align-items:center;gap:10px;font-size:9px;padding:15px 0;border-bottom:1px solid #eae4f1}.product-demo .check-list .icon{width:15px;height:15px;color:#9e88bc}.product-demo .check-list .pill{margin-left:auto}.product-demo .ui-note{display:flex;align-items:center;gap:9px;background:#f0eafa;border-radius:7px;padding:13px;margin-top:20px;font-size:8px;color:#9984ae}.product-demo .ui-note .icon{width:15px;height:15px}.product-demo .ui-table-wrap{overflow:auto}.product-demo .ui-table{width:100%;border-collapse:collapse;background:white;border:1px solid #eee8f4}.product-demo .ui-table th{font-size:7px;font-weight:500;color:#a194ad;padding:10px;text-align:left;background:#fcfbfe;border:1px solid #f1ecf6}.product-demo .ui-table td{padding:14px 10px;font-size:8px;color:#a194ad;border:1px solid #f1ecf6;white-space:nowrap}.product-demo .ui-table td b{color:#776b84;font-size:8px}.product-demo .ui-table td small{display:block;font-size:6px;color:#b1a6ba;margin-top:3px}.product-demo .screen-footnote{font-size:7px;display:block;margin-top:12px;color:#aa9db7}.product-demo .record-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:30px}.product-demo .record-card{background:#fff;border:1px solid #ece7f3;border-radius:10px;padding:20px 15px;text-align:center}.product-demo .record-card>.avatar{width:43px;height:43px;font-size:13px}.product-demo .record-card h4{font-family:var(--body);font-size:10px;letter-spacing:0;margin:16px 0 6px}.product-demo .record-card p{font-size:7px;margin-bottom:12px}.product-demo .record-bottom{display:flex;align-items:center;justify-content:space-between;font-size:6px;color:#a396af;border-top:1px solid #eee8f4;margin-top:20px;padding-top:13px}.product-demo .record-bottom .icon{width:11px;height:11px}.product-demo .messages-ui{display:grid;grid-template-columns:180px 1fr;min-height:340px;margin:-22px}.product-demo .message-list{background:#fff;border-right:1px solid #ece6f2;padding:20px 10px}.product-demo .message-list h3{font-family:var(--body);font-size:13px;padding:0 8px;margin-bottom:20px}.product-demo .message-person{display:flex;align-items:center;gap:8px;padding:13px 7px;font-size:8px;border-radius:6px}.product-demo .message-person.active{background:#f4effc}.product-demo .message-person small{display:block;font-size:6px;color:#a396ae}.product-demo .message-conversation{display:flex;flex-direction:column;padding:13px 20px;gap:10px}.product-demo .conversation-head{display:flex;align-items:center;gap:9px;border-bottom:1px solid #eee6f3;padding-bottom:10px;font-size:9px}.product-demo .conversation-head small{display:block;font-size:6px;font-weight:400;color:#a597af}.product-demo .chat-date{text-align:center;font-size:6px;color:#b0a0bc}.product-demo .bubble{background:white;border:1px solid #eee7f4;border-radius:9px 9px 9px 1px;padding:10px 12px;font-size:8px;max-width:85%;line-height:1.7}.product-demo .bubble small{font-size:5px;display:block;margin-top:5px;color:#b0a2ba}.product-demo .bubble.outgoing{background:#ece3fb;margin-left:auto;border-radius:9px 9px 1px 9px}.product-demo .chat-status{font-size:6px;color:#7ca18b;text-align:center}.product-demo .chat-status .icon{width:9px;height:9px}.product-demo .message-input{padding:9px 12px;background:white;border:1px solid #e6dfed;border-radius:7px;display:flex;justify-content:space-between;font-size:7px;color:#b0a1bb;margin-top:auto}.product-demo .message-input>span{color:var(--purple)}.product-demo .demo-feedback{position:absolute;bottom:16px;left:50%;transform:translate(-50%,10px);background:#292338;color:#fff;padding:10px 16px;border-radius:7px;font-size:10px;opacity:0;visibility:hidden;transition:.2s;z-index:10;white-space:nowrap;box-shadow:0 4px 15px #211a3420}.product-demo .demo-feedback.visible{transform:translate(-50%,0);opacity:1;visibility:visible}