/* One scoped action/header system for the two accepted native products only. */
:is(#app,#supervision-app,#modal,#supervision-dialog){--tl-brand-blue:#4e72ff;--tl-action:#4468ea;--tl-action-hover:#405fd9;--tl-action-pressed:#3958c9;--tl-focus:#17233e;--tl-header-title:20px;--tl-header-line:26px}
:is(#app,#supervision-app) .product-header :is(.product-header-brand,.product-header-context){font-size:var(--tl-header-title);line-height:var(--tl-header-line);font-weight:700;letter-spacing:normal;align-self:center}
:is(#app,#supervision-app) .product-header-brand b{font:inherit}
:is(#app,#supervision-app,#modal,#supervision-dialog) :is(.btn,.header-account-button,.sv-button,.modal-close),#supervision-dialog button,:is(#app,#supervision-app) .product-header-account :is(a,button){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;max-width:100%;padding:10px 12px;border:1px solid var(--tl-action);border-radius:11px;font-size:14px;font-weight:650;color:var(--tl-action);background:#fff;text-align:center;line-height:1.4;white-space:normal;overflow-wrap:anywhere;opacity:1}
:is(#app,#supervision-app,#modal,#supervision-dialog) :is(.btn.primary,.sv-button.sv-primary),#supervision-dialog button.primary{background:var(--tl-action);border-color:var(--tl-action);color:#fff}
:is(#app,#supervision-app,#modal,#supervision-dialog) :is(.btn,.header-account-button,.sv-button,.modal-close):hover:not(:disabled),#supervision-dialog button:hover:not(:disabled),:is(#app,#supervision-app) .product-header-account :is(a,button):hover:not(:disabled){background:#edf1ff;border-color:var(--tl-action-hover);color:var(--tl-action-pressed)}
:is(#app,#supervision-app,#modal,#supervision-dialog) :is(.btn.primary,.sv-button.sv-primary):hover:not(:disabled),#supervision-dialog button.primary:hover:not(:disabled){background:var(--tl-action-hover);border-color:var(--tl-action-hover);color:#fff}
:is(#app,#supervision-app,#modal,#supervision-dialog) :is(.btn.primary,.sv-button.sv-primary):active:not(:disabled),#supervision-dialog button.primary:active:not(:disabled){background:var(--tl-action-pressed);border-color:var(--tl-action-pressed);color:#fff}
:is(#app,#supervision-app,#modal,#supervision-dialog) :is(.btn,.header-account-button,.sv-button,.modal-close):disabled,#supervision-dialog button:disabled{background:#edf1ff;color:#3958c9;border-color:#a6b5e8;opacity:1;cursor:not-allowed}
:is(#app,#supervision-app,#modal,#supervision-dialog) :is(button,a,input,textarea,summary):focus-visible{outline:3px solid var(--tl-focus);outline-offset:2px}
#modal [data-rotation-errors]:not(:empty){margin:12px 0;padding:12px;border:1px solid #bc4852;border-radius:10px;color:#8c2631;background:#fff;overflow-wrap:anywhere}
#modal [data-rotation-errors] ul{margin:0;padding-left:20px}#modal [data-rotation-field-error]{color:#8c2631;line-height:1.5;display:block;margin-top:6px}#modal [aria-invalid=true]{border-color:#bc4852}
#modal .picker-list{max-height:min(280px,40dvh);overflow:auto;overscroll-behavior:contain}
@media(max-width:620px){:is(#app,#supervision-app){--tl-header-title:18px;--tl-header-line:24px}:is(#app,#supervision-app) .product-header{gap:8px}:is(#app,#supervision-app) .product-header-context{min-width:0}:is(#app,#supervision-app) .product-header-account :is(a,button){padding:8px;font-size:12px}}
#app .auth-brand span{display:flex;align-items:center;gap:8px}#app .auth-brand :is(b,small){font-size:var(--tl-header-title);line-height:var(--tl-header-line);font-weight:700;color:inherit}#app .auth-brand small::before{content:'| '}
#modal .picker-trigger:focus-visible,#modal [role=option]:focus-visible{outline-color:var(--tl-focus)}

#modal .modal-close,#supervision-dialog button[data-close]{font-size:22px;padding:6px}

#modal .picker.opens-up .picker-list{top:auto;bottom:calc(100% + 5px)}
