.at-demo{color:#183c30;width:100%;height:100dvh;font-family:var(--font);background:#edf2ef;grid-template-rows:minmax(0,1fr) auto;display:grid;position:relative}.at-demo-stage{justify-content:center;align-items:center;min-width:0;min-height:0;display:flex}.at-demo-screen{width:100%;min-width:0;height:100%;min-height:0}.at-demo-screen>.at-invitation{height:100%;min-height:0}.at-demo[data-view=phone] .at-demo-stage{padding:16px}.at-demo[data-view=phone] .at-demo-screen{border:1px solid #d0ded5;border-radius:16px;max-width:390px;overflow:hidden;box-shadow:0 8px 40px #15332715}.at-demo[data-view=compact] .at-demo-screen{width:300px;max-width:100%;height:600px;max-height:100%}.at-demo-bar{z-index:5;background:#fff;border-top:1px solid #dbe6df;align-items:center;gap:14px;min-width:0;padding:10px 24px;display:flex}.at-demo-bar a{text-decoration:none}.at-demo-back{color:#325547;align-items:center;gap:8px;min-height:44px;font-size:13px;font-weight:600;display:flex}.at-demo-name{gap:4px;min-width:0;margin-right:auto;display:grid}.at-demo-name strong{overflow-wrap:anywhere;font-size:14px}.at-demo-name span{color:#587063;font-size:12px}.at-demo-views{border:1px solid #dbe6df;border-radius:9px;gap:3px;display:flex}.at-demo :is(.at-demo-bar,.at-demo-details) button{color:#325547;cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;min-width:44px;min-height:44px;display:grid}.at-demo .at-demo-views [aria-pressed=true]{color:#075943;background:#e5f2e9}.at-demo-start{color:#fff;background:#08745e;border-radius:9px;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:10px 16px;font-size:13px;font-weight:650;display:flex}.at-demo :is(.at-demo-bar,.at-demo-details) :is(button,a):focus-visible{outline-offset:3px;outline:3px solid #08745e}.at-demo-details{z-index:10;background:#fff;border:1px solid #dbe6df;border-radius:16px;width:min(400px,100% - 32px);max-height:calc(100% - 116px);padding:24px;position:absolute;bottom:84px;right:24px;overflow:auto;box-shadow:0 12px 40px #16382f24}.at-demo-details h2{font:650 24px/1.2 var(--font);margin:0 0 14px}.at-demo-details p{color:#446053;margin:0 0 14px;font-size:14px;line-height:1.65}.at-demo .at-demo-details button{font:650 14px var(--font);background:#edf4ef;padding:0 20px}@media (max-width:640px){.at-demo-bar{flex-wrap:wrap;gap:8px;padding:8px 10px}.at-demo-back{justify-content:center;width:44px}.at-demo-back span,.at-demo-views{display:none}.at-demo-name{flex:1}.at-demo-name strong{font-size:12px}.at-demo-name span{font-size:11px}.at-demo-start{padding:9px 12px;font-size:12px}.at-demo-info{display:none!important}.at-demo-details{bottom:80px;right:16px}.at-demo[data-view=phone] .at-demo-stage{padding:0}.at-demo[data-view=phone] .at-demo-screen{border:0;border-radius:0}}@media (max-width:360px){.at-demo-bar{gap:4px;padding:6px}.at-demo-name{max-width:100px}.at-demo-start{gap:4px;padding:9px 8px;font-size:11px}}.at-demo .at-demo-bar .at-demo-name{text-align:left;font-family:var(--font);justify-items:start;gap:3px;padding:0 5px}.at-demo-screen>.invitation-v4{--invitation-height:100%;height:100%;min-height:0}.at-demo-screen .k-root{height:100%}
