Revision control
Copy as Markdown
Other Tools
html{--colour-user-red: #e53935;--colour-user-orange: #ff8c00;--colour-user-yellow: #f4c430;--colour-user-graphite: #b0b0b0;--colour-user-green: #34c759;--colour-user-blue: #0a84ff;--colour-user-purple: #7753cc;--colour-user-pink: #e91e63;--colour-neutral-900: #26272a;--colour-neutral-base: #feffff;--colour-neutral-lower: #f7f7f7;--colour-neutral-raised: var(--colour-neutral-base);--colour-neutral-subtle: var(--colour-neutral-lower);--colour-neutral-border: #e4e4e7;--colour-neutral-border-intense: #777580;--colour-primary-soft: #f0f8ff;--colour-primary-default: #1373d9;--colour-primary-default-light: #1373d9;--colour-primary-default-dark: #58c9ff;--colour-primary-hover: #175fb6;--colour-primary-hover-light: #175fb6;--colour-primary-pressed: #19518f;--colour-secondary-soft: #faf5ff;--colour-secondary-default: #6b21a8;--colour-secondary-hover: #571c87;--colour-secondary-pressed: #3a0764;--colour-success-soft: #f4f9f4;--colour-success-default: #1d783b;--colour-success-hover: #1c5f32;--colour-success-pressed: #194e2c;--colour-warning-soft: #fefae8;--colour-warning-default: #facc15;--colour-warning-hover: #eabd08;--colour-warning-pressed: #caa204;--colour-danger-soft: #fef2f2;--colour-danger-default: #991b1b;--colour-danger-hover: #7f1d1d;--colour-danger-pressed: #450a0a;--colour-ti-base: #1a202c;--colour-ti-base-light: #1a202c;--colour-ti-base-dark: #eeeef0;--colour-ti-secondary: #4c4d58;--colour-ti-muted: #737584;--colour-ti-highlight: #1373d9;--colour-ti-warning: #713f12;--colour-ti-critical: #dc2626;--colour-ti-success: #1d783b;--colour-accent-teal: #25a6a0;--colour-accent-blue: #37adf9;--colour-accent-purple: #ae55f7;--colour-accent-orange: #ea7308;--colour-accent-pink: #e247c4;--colour-accent-gray: #6e6f9b;--colour-apmt-soft: #f3f9fc;--colour-apmt-primary: #008080;--colour-apmt-primary-hover: #066769;--colour-apmt-primary-pressed: #0a5757;--colour-apmt-secondary: #81d4b5;--colour-apmt-accent-1: #a3ece3;--colour-apmt-accent-2: #03afd7;--colour-send-soft: #fef7ec;--colour-send-primary: #f09d38;--colour-send-primary-hover: #f09d38;--colour-send-primary-pressed: #f09d38;--colour-send-primary-secondary: #aa6000;--colour-send-primary-accent-1: #1f8ddb;--colour-send-primary-accent-2: #1f8ddb}html.dark{--colour-neutral-base: #1a202c;--colour-neutral-lower: #18181b;--colour-neutral-raised: #262d3b;--colour-neutral-subtle: var(--colour-neutral-raised);--colour-neutral-border: #303a4a;--colour-neutral-border-intense: #3d4d67;--colour-primary-soft: #262c40;--colour-primary-default: #58c9ff;--colour-primary-hover: #32aeff;--colour-primary-pressed: #1b90f5;--colour-secondary-soft: #3a0764;--colour-secondary-default: #f5e8ff;--colour-secondary-hover: #ecd5ff;--colour-secondary-pressed: #ddb4fe;--colour-success-soft: #082b16;--colour-success-default: #defae7;--colour-success-hover: #c0f2cf;--colour-success-pressed: #8ee7aa;--colour-warning-soft: #423606;--colour-warning-default: #fef2c3;--colour-warning-hover: #fee78a;--colour-warning-pressed: #fdd847;--colour-danger-soft: #7f1d1d;--colour-danger-default: #fee2e2;--colour-danger-hover: #fecaca;--colour-danger-pressed: #fca5a5;--colour-ti-base: #eeeef0;--colour-ti-secondary: #d9d9de;--colour-ti-muted: #7f94ac;--colour-ti-highlight: #58c9ff;--colour-ti-warning: #fee78a;--colour-ti-critical: #ef4444;--colour-ti-success: #55d37e;--colour-accent-teal: #a3ece3;--colour-accent-blue: #58c9ff;--colour-accent-purple: #8022ce;--colour-accent-orange: #fec18a;--colour-accent-pink: #fbd3f6;--colour-accent-gray: #c3cade;--colour-apmt-soft: #152f3c;--colour-apmt-primary: #a3ece3;--colour-apmt-primary-hover: #6ddbd1;--colour-apmt-primary-pressed: #3ec3ba;--colour-apmt-secondary: #25a6a0;--colour-apmt-accent-1: #a3ece3;--colour-apmt-accent-2: #58c9ff;--colour-send-soft: #411107;--colour-send-primary: #f09d38;--colour-send-primary-hover: #f09d38;--colour-send-primary-pressed: #f09d38;--colour-send-primary-secondary: #aa6000;--colour-send-primary-accent-1: #1f8ddb;--colour-send-primary-accent-2: #1f8ddb}html{--colour-service-soft: var(--colour-primary-soft);--colour-service-primary: var(--colour-primary-default);--colour-service-primary-hover: var(--colour-primary-hover);--colour-service-primary-pressed: var(--colour-primary-pressed);--colour-service-secondary: var(--colour-secondary-default);--colour-service-accent-1: var(--colour-accent-purple);--colour-service-accent-2: var(--colour-accent-teal)}html[data-tbpro-service=apmt]{--colour-service-soft: var(--colour-apmt-soft);--colour-service-primary: var(--colour-apmt-primary);--colour-service-primary-hover: var(--colour-apmt-primary-hover);--colour-service-primary-pressed: var(--colour-apmt-primary-pressed);--colour-service-secondary: var(--colour-apmt-secondary);--colour-service-accent-1: var(--colour-apmt-accent-1);--colour-service-accent-2: var(--colour-apmt-accent-2)}html[data-tbpro-service=send]{--colour-service-soft: var(--colour-primary-soft);--colour-service-primary: var(--colour-primary-default);--colour-service-primary-hover: var(--colour-primary-hover);--colour-service-primary-pressed: var(--colour-primary-pressed);--colour-service-secondary: var(--colour-neutral-subtle);--colour-service-accent-1: var(--colour-send-primary-accent-1);--colour-service-accent-2: var(--colour-send-primary-accent-2)}html{--border-radius: .5rem;--txt-default: .875rem;--txt-input: var(--txt-default);--line-height-input: 1.25rem;--font-sans: "Inter", sans-serif;--txt-colour: var(--colour-ti-base);--transition-timing-function: initial;--transition-duration: 0}@media(prefers-reduced-motion:no-preference){html{--transition-timing-function: ease-in-out;--transition-duration: .25s}}.__sb_preview_background.dark{background-color:#374151}.services-ui-base{font-family:Inter,sans-serif;font-size:.8125rem}.dark .services-ui-base{color:var(--txt-colour)}.is-light-mode{display:block}.is-dark-mode,.dark .is-light-mode{display:none}.dark .is-dark-mode{display:block}.modal-active{overflow:hidden}.screen-reader-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.icon[data-v-be2a67dd]{display:flex;align-items:center;justify-content:center;width:1rem;height:1rem}.text[data-v-be2a67dd]{margin:auto;font-size:.8125rem;font-weight:600;line-height:normal;text-transform:uppercase}.badge[data-v-be2a67dd]{display:inline-flex;justify-content:center;align-items:center;border-radius:4rem;gap:.25rem;border:1px solid transparent;padding:.25rem .75rem}.badge[data-v-be2a67dd]:has(.icon){padding-inline-start:.25rem}.primary[data-v-be2a67dd]{background-color:var(--colour-accent-blue);color:var(--colour-ti-base)}.subscription[data-v-be2a67dd]{background:color-mix(in srgb,var(--colour-primary-default-dark),transparent 80%);color:var(--colour-ti-secondary)}.subscription .icon[data-v-be2a67dd]{color:var(--colour-primary-default)}.pending[data-v-be2a67dd]{background-color:var(--colour-warning-soft);border-color:var(--colour-warning-default);color:var(--colour-ti-secondary)}.pending .icon[data-v-be2a67dd]{color:var(--colour-ti-warning)}.set[data-v-be2a67dd],.verified[data-v-be2a67dd]{background-color:var(--colour-success-soft);border-color:var(--colour-ti-success);color:var(--colour-ti-secondary)}:is(.set,.verified) .icon[data-v-be2a67dd]{color:var(--colour-ti-success)}.emails[data-v-be2a67dd]{background-color:var(--colour-neutral-border);color:var(--colour-ti-base)}.emails .icon[data-v-be2a67dd]{color:var(--colour-ti-secondary)}.not-set[data-v-be2a67dd],.default[data-v-be2a67dd]{background-color:var(--colour-neutral-lower);color:var(--colour-ti-base)}:is(.not-set,.default) .icon[data-v-be2a67dd]{color:var(--colour-ti-muted)}.counter[data-v-be2a67dd]{background:color-mix(in srgb,var(--colour-ti-highlight),transparent 60%);color:var(--colour-ti-base);padding:.25rem .5rem;font-variant-numeric:tabular-nums}.icon[data-v-c0f77626]{display:flex;align-items:center;justify-content:center;width:.75rem;height:.75rem;padding:.03125rem}.text[data-v-c0f77626]{margin:auto;font-size:.625rem;font-weight:700;line-height:normal;text-transform:uppercase}.badge[data-v-c0f77626]{position:relative;display:inline-flex;justify-content:center;align-items:center;border-radius:.1875rem;gap:.1875rem;border:.0625rem solid;padding:.1875rem}.notify[data-v-c0f77626]{background-color:var(--colour-primary-soft);border-color:var(--colour-primary-hover);color:var(--colour-primary-hover)}.expired[data-v-c0f77626]{background-color:var(--colour-neutral-subtle);border-color:var(--colour-ti-secondary);color:var(--colour-ti-secondary)}.warning[data-v-c0f77626]{background-color:var(--colour-warning-soft);border-color:var(--colour-ti-warning);color:var(--colour-ti-warning)}.tooltip[data-v-95b82bf9]{position:absolute;text-wrap:wrap;border-radius:.5rem;background-color:var(--colour-neutral-base);font-family:var(--font-sans);color:var(--colour-ti-secondary);z-index:100;width:-moz-max-content;width:max-content;max-width:15rem;box-shadow:0 4px 8px #00000024,0 0 2px #0000001f}.tooltip-body[data-v-95b82bf9]{display:flex;justify-content:center;align-items:center;padding:.75rem 1rem}.tooltip-container[data-v-95b82bf9]{position:relative;display:flex;justify-content:center;align-items:center}.beak[data-v-95b82bf9]{position:absolute;color:var(--colour-neutral-base);filter:drop-shadow(0px 1px 0px #00000010)}.pos-none[data-v-95b82bf9]{display:none}.pos-top[data-v-95b82bf9]{top:-6px;transform:scaleY(-1)}.pos-top.beak[data-v-95b82bf9]{filter:drop-shadow(0px -1px 0px #00000010)}.pos-bottom[data-v-95b82bf9]{top:100%}.pos-left[data-v-95b82bf9]{left:-17px;transform:rotate(90deg)}.pos-right[data-v-95b82bf9]{right:-17px;transform:rotate(-90deg)}html{--button-destructive-color: var(--colour-danger-default);--button-destructive-color-hover: var(--colour-danger-hover);--button-destructive-color-active: var(--colour-danger-pressed)}html.dark{--button-destructive-color: var(--colour-danger-pressed);--button-destructive-color-hover: #f87171;--button-destructive-color-active: var(--colour-ti-critical)}.tooltip[data-v-1a1b9d0c]{pointer-events:none;opacity:0;transition:opacity .25s ease-out;bottom:calc(100% + .5rem)}a[data-v-1a1b9d0c]{text-decoration:none}a:hover>.tooltip[data-v-1a1b9d0c],button:hover>.tooltip[data-v-1a1b9d0c],.display-tooltip[data-v-1a1b9d0c]{opacity:1}a:hover>.tooltip[data-v-1a1b9d0c],button:hover>.tooltip[data-v-1a1b9d0c]{z-index:110}.base[data-v-1a1b9d0c]{display:flex;justify-content:center;align-items:center;gap:.5rem;border:0;border-radius:var(--border-radius);font-family:Inter,sans-serif;font-size:var(--txt-input);font-weight:400;line-height:1;padding:1rem 1.12rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative}.base .icon[data-v-1a1b9d0c]{display:flex;align-items:center;justify-content:center;width:.75rem;height:.75rem}:is(.base .icon) svg[data-v-1a1b9d0c]{width:100%;height:100%}.base[data-v-1a1b9d0c]:active{outline:none!important}.base[data-v-1a1b9d0c]:focus{outline:.125rem solid var(--colour-primary-default);outline-offset:.125rem}.base.filled[data-v-1a1b9d0c]:disabled{background:var(--colour-neutral-border);color:var(--colour-ti-muted);cursor:not-allowed}:is(.base.outline[data-v-1a1b9d0c],.base.brand.filled[data-v-1a1b9d0c]):before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--button-outline-border);box-sizing:border-box;padding:.0625rem;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}:is(.base.outline[data-v-1a1b9d0c],.base.brand.filled[data-v-1a1b9d0c]):disabled{--button-outline-border: transparent;background:var(--colour-neutral-base);border:.0625rem solid var(--colour-neutral-border);color:var(--colour-ti-muted);cursor:not-allowed}.primary.filled[data-v-1a1b9d0c]{background:linear-gradient(180deg,var(--colour-accent-blue) -31.82%,var(--colour-primary-default) 8.74%,var(--colour-primary-hover) 100%) border-box;color:var(--colour-neutral-base)}.primary.filled[data-v-1a1b9d0c]:hover:not(:disabled){background:linear-gradient(180deg,var(--colour-primary-hover) 0%,var(--colour-primary-hover) 100%)}.primary.filled[data-v-1a1b9d0c]:active:not(:disabled){background:linear-gradient(180deg,var(--colour-primary-pressed) 0%,var(--colour-primary-pressed) 100%)}.primary.outline[data-v-1a1b9d0c]{--button-outline-border: var(--colour-primary-default);position:relative;background:transparent;color:var(--colour-primary-hover)}.primary.outline[data-v-1a1b9d0c]:hover:not(:disabled):before{padding:.125rem}.primary.outline[data-v-1a1b9d0c]:active:not(:disabled){background:color-mix(in srgb,var(--colour-accent-blue),transparent 90%);transition:none}.primary.outline[data-v-1a1b9d0c]:active:not(:disabled):before{padding:.125rem}.brand[data-v-1a1b9d0c]{padding:1rem 1.5rem;font-weight:600;font-size:.8125rem;text-transform:uppercase}.brand.filled[data-v-1a1b9d0c]{--button-outline-border: linear-gradient(to bottom right, #7bc6f4 10%, #2b8cdc 60%) border-box;background:linear-gradient(329deg,var(--colour-primary-default) -21.06%,var(--colour-accent-blue) 64%);color:var(--colour-ti-base-light);position:relative}.brand.filled[data-v-1a1b9d0c]:hover:not(:disabled){background:linear-gradient(var(--colour-primary-hover),var(--colour-primary-hover));color:var(--colour-neutral-base)}.brand.filled[data-v-1a1b9d0c]:active:not(:disabled){background:linear-gradient(var(--colour-primary-pressed),var(--colour-primary-pressed));color:var(--colour-neutral-base)}.brand.outline[data-v-1a1b9d0c]{--button-outline-border: linear-gradient(99deg, var(--colour-accent-blue) 19.15%, var(--colour-accent-gray) 75.77%) border-box;position:relative;background:transparent;color:var(--colour-ti-base)}.brand.outline[data-v-1a1b9d0c]:hover:not(:disabled){background:#f2f2f2;color:var(--colour-ti-base-light)}.brand.outline[data-v-1a1b9d0c]:active:not(:disabled){background:#e3e3e3;color:var(--colour-ti-base-light)}.danger.filled[data-v-1a1b9d0c]{background-color:var(--button-destructive-color);color:var(--colour-neutral-base)}.danger.filled[data-v-1a1b9d0c]:hover:not(:disabled){background-color:var(--button-destructive-color-hover)}.danger.filled[data-v-1a1b9d0c]:active:not(:disabled){background-color:var(--button-destructive-color-active)}.danger.outline[data-v-1a1b9d0c]{--button-outline-border: var(--button-destructive-color);position:relative;background:transparent;color:var(--button-destructive-color)}.danger.outline[data-v-1a1b9d0c]:hover:not(:disabled){--button-outline-border: var(--button-destructive-color-hover);color:var(--button-destructive-color-hover)}.danger.outline[data-v-1a1b9d0c]:hover:not(:disabled):before{padding:.125rem}.danger.outline[data-v-1a1b9d0c]:active:not(:disabled){--button-outline-border: var(--button-destructive-color-active);color:var(--button-destructive-color-active)}.danger.outline[data-v-1a1b9d0c]:active:not(:disabled):before{padding:.125rem}.link[data-v-1a1b9d0c]{--colour-btn-border: transparent;background-color:transparent;color:var(--colour-service-primary);text-decoration:underline;box-shadow:none!important;border:none!important;min-width:0}.link .text[data-v-1a1b9d0c]{padding:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-weight:400;line-height:1}.link.small .text[data-v-1a1b9d0c]{padding:0}.link[data-v-1a1b9d0c]:hover{box-shadow:none!important}.link.outline[data-v-1a1b9d0c]:disabled,.link.filled[data-v-1a1b9d0c]:disabled{background:none;color:var(--colour-ti-muted);cursor:not-allowed}.small[data-v-1a1b9d0c]{padding:.38rem .75rem}.small.brand .text[data-v-1a1b9d0c]{font-size:.6875rem}.small .text[data-v-1a1b9d0c]{font-size:.875rem}button.small[data-v-1a1b9d0c]{min-width:initial;height:2rem}@media(prefers-reduced-motion:no-preference){.base[data-v-1a1b9d0c]{transition:background-color .25s ease-in-out,background .25s ease-in-out,border .25s ease-in-out,color .25s ease-in-out,box-shadow .25s ease-in-out}}.link.icon-only{padding:.5rem}.link.icon-only .icon,.link.icon-only .icon svg{width:1rem;height:1rem}.link.icon-only.small .icon,.link.icon-only.small .icon svg{width:.75rem;height:.75rem}.link.icon-only.medium .icon,.link.icon-only.medium .icon svg{width:1.25rem;height:1.25rem}.link.icon-only.large .icon,.link.icon-only.large .icon svg{width:1.5rem;height:1.5rem}.link.icon-only .text{display:none}.wrapper[data-v-40de1f17]{display:flex;flex-direction:column;gap:.5rem;color:var(--colour-ti-secondary);font-family:Inter,sans-serif;font-size:1rem;line-height:var(--line-height-input);font-weight:400}.bubble-list[data-v-40de1f17]{padding:0;margin:0;display:flex;list-style:none}.bubble-list.gap-default[data-v-40de1f17]{gap:.5rem}.bubble-list.gap-large[data-v-40de1f17]{gap:1rem}.label[data-v-40de1f17]{width:100%;font-weight:600}.help-label[data-v-40de1f17]{display:flex;align-items:center;color:var(--colour-ti-muted);box-sizing:border-box;width:100%;font-size:.6875rem;line-height:.9375rem}.help-label.invalid[data-v-40de1f17]{gap:.25rem;border-radius:.25rem;padding:.25rem;font-size:.75rem;background-color:var(--colour-danger-soft);color:var(--colour-danger-default)}.tbpro-bubble[data-v-40de1f17]{transition-duration:var(--transition-duration);transition-timing-function:var(--transition-timing-function);transition-property:color,border-color,background-color;display:flex;justify-content:center;align-items:center;width:2.75rem;height:2.75rem;border:.0625rem solid rgba(0,0,0,.1);border-radius:6.25rem;box-shadow:2px 2px 4px #0000000d inset;background-color:var(--colour-neutral-lower);font-weight:600;font-size:.8125rem;line-height:150%;color:var(--colour-ti-secondary);cursor:pointer;text-transform:uppercase}.tbpro-bubble[data-v-40de1f17]:hover:not(.selected):not(.disabled){border-color:var(--colour-primary-hover)}.selected[data-v-40de1f17]{background-color:var(--colour-ti-secondary);color:var(--colour-neutral-base)}.required[data-v-40de1f17]{color:var(--colour-ti-critical);padding-inline-start:.25rem}.disabled[data-v-40de1f17]{cursor:default}.error[data-v-40de1f17]{border-color:var(--colour-ti-critical)}.selected.disabled[data-v-40de1f17]{background-color:var(--colour-neutral-border);border-color:var(--colour-ti-muted);color:var(--colour-ti-muted)}input[type=checkbox][data-v-465d89b9]{-webkit-appearance:none;-moz-appearance:none;appearance:none}.checkbox-wrapper[data-v-465d89b9]{display:flex;flex-direction:column;align-items:start;gap:.5rem;color:var(--colour-ti-secondary);font-weight:400;font-size:1rem;width:100%}.dark .checkbox-control[data-v-465d89b9]{color:var(--colour-ti-base-light)}.label[data-v-465d89b9]{display:flex;gap:.625rem;justify-content:flex-start;align-items:center;color:var(--colour-ti-secondary)}.help-label[data-v-465d89b9]{display:flex;align-items:center;color:var(--colour-ti-muted);box-sizing:border-box;width:100%;font-size:.6875rem;line-height:.9375rem}.help-label.invalid[data-v-465d89b9]{gap:.25rem;border-radius:.25rem;padding:.25rem;font-size:.75rem;background-color:var(--colour-danger-soft);color:var(--colour-danger-default)}.required[data-v-465d89b9]{color:var(--colour-ti-critical);padding-inline-start:.25rem}.checkbox-control[data-v-465d89b9]{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:1.5rem;height:1.5rem;border-radius:.25rem;border:1px solid rgba(0,0,0,.2);box-shadow:2px 2px 4px #0000000d inset;background-color:var(--colour-neutral-raised, #fff);color:var(--colour-ti-base-dark)}.checkbox-control .checkbox-icon[data-v-465d89b9]{width:1rem;height:1rem}input:hover+.checkbox-control[data-v-465d89b9]{border-color:#0000004d}input:focus-visible+.checkbox-control[data-v-465d89b9]{outline:2px solid var(--colour-primary-hover);outline-offset:2px}input.dirty:invalid+.checkbox-control[data-v-465d89b9]{border-color:var(--colour-ti-critical)}input:checked+.checkbox-control[data-v-465d89b9],input:checked+.checkbox-control[data-v-465d89b9]:hover,input:checked:focus-visible+.checkbox-control[data-v-465d89b9]{background-color:var(--colour-primary-default-light);border-color:var(--colour-primary-hover-light)}input:disabled+.checkbox-control[data-v-465d89b9]:hover,input:disabled+.checkbox-control[data-v-465d89b9]{cursor:not-allowed;border-color:var(--colour-neutral-border)}input:disabled:checked+.checkbox-control[data-v-465d89b9]{background-color:var(--colour-ti-muted)}input:disabled+.checkbox-control~span[data-v-465d89b9]{color:var(--colour-ti-secondary)}.wrapper[data-v-79361ff5]{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--colour-ti-secondary);font-family:var(--font-sans);font-size:1rem;line-height:var(--line-height-input);font-weight:400}.label[data-v-79361ff5]{display:flex;gap:.25rem;width:100%;font-weight:600}.help-label[data-v-79361ff5]{display:flex;align-items:center;color:var(--colour-ti-muted);box-sizing:border-box;width:100%;font-size:.6875rem;line-height:.9375rem}.help-label.invalid[data-v-79361ff5]{gap:.25rem;border-radius:.25rem;padding:.25rem;font-size:.75rem;background-color:var(--colour-danger-soft);color:var(--colour-danger-default)}.visible[data-v-79361ff5]{visibility:visible}.required[data-v-79361ff5]{color:var(--colour-ti-critical)}.tbpro-select-container[data-v-79361ff5]{position:relative;width:100%}.tbpro-select-container .dropdown-caret[data-v-79361ff5]{position:absolute;top:.75rem;right:.75rem;width:1.25rem;height:1.25rem;pointer-events:none}.tbpro-select[data-v-79361ff5]{font-size:var(--txt-input);font-weight:400;padding:.75rem 2.5rem .75rem .75rem;width:100%;border-radius:var(--border-radius);color:var(--colour-ti-secondary);background-color:var(--colour-neutral-base);border:.0625rem solid var(--colour-neutral-border);box-shadow:2px 2px 4px #0000000d inset;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.tbpro-select[data-v-79361ff5]::-moz-placeholder{color:var(--colour-ti-muted)}.tbpro-select[data-v-79361ff5]::placeholder{color:var(--colour-ti-muted)}.tbpro-select[data-v-79361ff5]:hover:not(:disabled){border-color:var(--colour-neutral-border-intense)}.tbpro-select[data-v-79361ff5]:focus-within{border-color:var(--colour-primary-default);box-shadow:0 0 0 .0625rem var(--colour-primary-default)}.tbpro-select[data-v-79361ff5]:active{background-color:var(--colour-neutral-subtle)}.tbpro-select[data-v-79361ff5]:disabled{filter:grayscale(50%);cursor:not-allowed}.tbpro-select.invalid[data-v-79361ff5],.tbpro-select.dirty[data-v-79361ff5]:invalid:not(:focus),.tbpro-select.error[data-v-79361ff5]:not(:focus){border-color:var(--colour-ti-critical)}.dark .tbpro-select[data-v-79361ff5]{background-color:var(--colour-neutral-base)}.component-container[data-v-27608a06]{position:relative;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.component-container[data-v-27608a06]:has(.toggle-input:disabled){cursor:not-allowed}.toggle-container[data-v-27608a06]{display:flex;align-items:center;gap:.375rem}.toggle-label[data-v-27608a06]{font-size:.75rem;line-height:1.5rem}.toggle[data-v-27608a06]{background:var(--colour-neutral-border);width:2.5rem;height:1.5rem;flex-shrink:0;border-radius:9999px;display:flex;align-items:center;box-shadow:1px 1px 3px #00000026 inset}.toggle[data-v-27608a06]:has(.toggle-input:checked){background:var(--colour-primary-default)}.toggle[data-v-27608a06]:has(.toggle-input:disabled){opacity:70%}.toggle .toggle-input[data-v-27608a06]{display:none}:is(.toggle .toggle-input):checked~.toggle-handle[data-v-27608a06]{transform:translate(1.125rem);background-color:var(--colour-neutral-base);border-color:var(--colour-primary-default);color:var(--colour-primary-default)}.toggle .toggle-handle[data-v-27608a06]{transition-duration:var(--transition-duration);transition-timing-function:var(--transition-timing-function);transition-property:transform,color,border-color,background-color;display:flex;align-items:center;justify-content:center;background-color:var(--colour-neutral-base);width:1.125rem;height:1.125rem;margin-left:.125rem;margin-right:.125rem;border-radius:9999px;box-shadow:0 1px 2px #0000001a;color:transparent}:is(.toggle .toggle-handle) .toggle-icon-on[data-v-27608a06]{width:.625rem;height:.625rem}.title[data-v-108dc9a2]{font-size:.8125rem;line-height:1.21875rem}.wrapper[data-v-108dc9a2]{--colour-highlight: var(--colour-service-primary);border-radius:.5625rem;border:.0625rem solid var(--colour-neutral-border);background:var(--colour-neutral-base);font-family:Inter,sans-serif;font-size:var(--txt-input);color:var(--colour-ti-base)}.dark .wrapper[data-v-108dc9a2]{--colour-highlight: var(--colour-service-secondary)}.header[data-v-108dc9a2]{box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative;min-height:3.375rem;gap:.5rem;padding:.75rem .625rem;border-top-left-radius:.5rem;border-top-right-radius:.5rem;border-bottom:.0625rem solid var(--colour-neutral-border);background-color:var(--colour-neutral-lower);font-weight:700}.selected[data-v-108dc9a2]{font-size:.5625rem;line-height:var(--txt-default);color:var(--colour-highlight)}.rows[data-v-108dc9a2]{height:12rem;overflow-y:scroll;border-radius:.5rem;list-style:none;padding:0}.row[data-v-108dc9a2]{width:100%;background-color:var(--colour-neutral-base);padding:.375rem .75rem;font-size:var(--txt-input);box-sizing:border-box}.row[data-v-108dc9a2]:nth-child(2n){background-color:var(--colour-neutral-lower)}label[data-v-108dc9a2]{display:flex;gap:.625rem;justify-content:flex-start;align-items:center}.tbpro-checkbox[data-v-108dc9a2]{width:1rem;height:1rem;border-radius:var(--border-radius);border:1px solid var(--colour-neutral-border-intense);accent-color:var(--colour-highlight)}.tbpro-checkbox[data-v-108dc9a2]:focus{outline-color:var(--colour-highlight)}.tbpro-checkbox[data-v-108dc9a2]:checked,.tbpro-checkbox[data-v-108dc9a2]:checked:hover,.tbpro-checkbox[data-v-108dc9a2]:checked:focus{background-color:var(--colour-highlight);border-color:var(--colour-highlight);color:var(--colour-neutral-raised)}.select-all[data-v-108dc9a2]{margin-left:auto;margin-right:auto;top:2.0625rem}@media(min-width:48rem){.header[data-v-108dc9a2]{flex-direction:row;justify-content:flex-start;align-items:flex-start;text-align:left}.select-all[data-v-108dc9a2]{position:relative;margin-right:.25rem}}.wrapper[data-v-e329ecdb]{display:flex;flex-direction:column;gap:.5rem;color:var(--colour-ti-secondary);font-family:var(--font-sans);font-size:var(--txt-input);line-height:var(--line-height-input);font-weight:400}.label[data-v-e329ecdb]{width:100%;font-weight:600}.help-label[data-v-e329ecdb]{display:flex;align-items:center;color:var(--colour-ti-muted);width:100%;min-height:.9375rem;font-size:.625rem;line-height:.9375rem}.help-label.invalid[data-v-e329ecdb]{gap:.25rem;border-radius:.25rem;padding:.25rem;font-size:.75rem;background-color:var(--colour-danger-soft);color:var(--colour-danger-default)}.required[data-v-e329ecdb]{color:var(--colour-ti-critical);padding-inline-start:.25rem}.tbpro-textarea[data-v-e329ecdb]{display:inline-block;position:relative;width:100%}.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb]{width:100%;min-height:5rem;resize:vertical;transition-property:none;font-family:var(--font-sans);font-size:var(--txt-input);line-height:1.5;padding:1rem .75rem;box-sizing:border-box;overflow:auto;resize:none;scrollbar-width:none;color:var(--txt-colour);background-color:var(--colour-neutral-base);border-radius:var(--border-radius);border:.0625rem solid var(--colour-neutral-border)}:is(.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb]):hover:enabled:not(:focus){border-color:var(--colour-neutral-border-intense)}:is(.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb]):active:enabled,:is(.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb]):focus:enabled{border-color:var(--colour-primary-default)}:is(.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb]):focus:enabled{outline:.0625rem solid var(--colour-primary-default)}.dirty[data-v-e329ecdb]:is(.tbpro-textarea .tbpro-textarea-element):invalid:not(:focus),.error[data-v-e329ecdb]:is(.tbpro-textarea .tbpro-textarea-element):not(:focus){border-color:var(--colour-ti-critical)}:is(.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb]):disabled{filter:grayscale(50%);cursor:not-allowed}:is(.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb])::-moz-placeholder{color:var(--colour-ti-muted)}:is(.tbpro-textarea .tbpro-textarea-element[data-v-e329ecdb])::placeholder{color:var(--colour-ti-muted)}.tbpro-textarea:has(.character-count) .tbpro-textarea-element[data-v-e329ecdb]{padding:1rem 1rem 2rem .75rem;scroll-padding-block-end:2rem}.tbpro-textarea .character-count[data-v-e329ecdb]{position:absolute;bottom:1rem;right:.75rem;pointer-events:none;font-weight:600}.dark .tbpro-textarea[data-v-e329ecdb]{background-color:var(--colour-neutral-lower)}.wrapper[data-v-1af24b4a]{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--colour-ti-secondary);font-family:var(--font-sans);font-size:var(--txt-input);line-height:var(--line-height-input);font-weight:400}.label[data-v-1af24b4a]{width:100%;font-weight:600;font-size:1rem}.small-text[data-v-1af24b4a]{--txt-input: .7384375rem}.help-label[data-v-1af24b4a]{display:flex;align-items:center;color:var(--colour-ti-muted);box-sizing:border-box;width:100%;font-size:.6875rem;line-height:.9375rem}.help-label.invalid[data-v-1af24b4a]{gap:.25rem;border-radius:.25rem;padding:.25rem;font-size:.75rem;background-color:var(--colour-danger-soft);color:var(--colour-danger-default)}.required[data-v-1af24b4a]{color:var(--colour-ti-critical);padding-inline-start:.25rem}.tbpro-input[data-v-1af24b4a]{display:inline-flex;align-items:center;gap:.25rem;width:100%;border-radius:var(--border-radius);border:.0625rem solid var(--colour-neutral-border);box-shadow:2px 2px 4px #0000000d inset;box-sizing:border-box}.tbpro-input[data-v-1af24b4a]:has(.tbpro-input-outer-prefix,.tbpro-input-outer-suffix){border-radius:var(--border-radius);overflow:hidden;gap:0}:is(.tbpro-input:has(.tbpro-input-outer-prefix,.tbpro-input-outer-suffix) .tbpro-input-wrapper) .tbpro-input-element[data-v-1af24b4a]{border-radius:0}.tbpro-input .tbpro-input-outer-prefix[data-v-1af24b4a],.tbpro-input .tbpro-input-outer-suffix[data-v-1af24b4a]{display:flex;align-items:center;justify-content:center;white-space:nowrap;background-color:var(--colour-neutral-border);padding:.5rem .75rem;align-self:stretch}.tbpro-input[data-v-1af24b4a]:hover:has(input:enabled):not(:focus-within){border-color:var(--colour-neutral-border-intense)}.tbpro-input[data-v-1af24b4a]:focus-within{border-color:var(--colour-primary-default);box-shadow:0 0 0 .0625rem var(--colour-primary-default)}.tbpro-input[data-v-1af24b4a]:has(.dirty:invalid):not(:focus-within),.tbpro-input[data-v-1af24b4a]:has(.error):not(:focus-within){border-color:var(--colour-ti-critical)}.tbpro-input .tbpro-input-wrapper[data-v-1af24b4a]{--outer-padding: .7rem;position:relative;width:100%;display:flex;padding:var(--outer-padding);gap:calc(var(--outer-padding) * .25);box-sizing:border-box}.small-input[data-v-1af24b4a]:is(.tbpro-input .tbpro-input-wrapper){--outer-padding: .125rem;--txt-input: .7384375rem}:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-prefix[data-v-1af24b4a]{align-self:center;font-size:var(--txt-input);line-height:var(--line-height-input);color:var(--colour-ti-muted);-webkit-user-select:none;-moz-user-select:none;user-select:none;text-overflow:".../";overflow:hidden;text-wrap:nowrap;z-index:1;flex-shrink:0;max-width:40%}:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-element[data-v-1af24b4a]{width:100%;transition-property:none;font-size:var(--txt-input);font-family:var(--font-sans);box-sizing:border-box;line-height:var(--line-height-input);color:var(--colour-ti-secondary);background-color:var(--colour-neutral-base);border:none;border-radius:var(--border-radius);padding:0 .125rem}:is(:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-element[data-v-1af24b4a]):disabled{filter:grayscale(50%);cursor:not-allowed}:is(:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-element[data-v-1af24b4a])::-moz-placeholder{color:var(--colour-ti-muted)}:is(:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-element[data-v-1af24b4a])::placeholder{color:var(--colour-ti-muted)}:is(:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-element[data-v-1af24b4a]):focus{outline:none}[type=time][data-v-1af24b4a]:is(:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-element)::-webkit-calendar-picker-indicator{margin-right:-.5rem;background:none}:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-suffix[data-v-1af24b4a]{position:relative;display:flex;flex-shrink:0;line-height:var(--line-height-input);color:var(--colour-ti-muted);z-index:1;cursor:pointer;align-self:center}:is(:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-suffix) .icon[data-v-1af24b4a]{stroke-width:1.25;margin:calc(-1 * var(--outer-padding)) 0}.character-count[data-v-1af24b4a]:is(:is(.tbpro-input .tbpro-input-wrapper) .tbpro-input-suffix){pointer-events:none;font-weight:600}.dark .tbpro-input-element[data-v-1af24b4a]{background-color:var(--colour-neutral-lower)}.segment-wrapper[data-v-6f16ecd8]{display:inline-flex;flex-direction:column;gap:.5rem;color:var(--colour-ti-secondary);font-family:Inter,sans-serif;font-size:1rem;line-height:var(--line-height-input);font-weight:400}.label[data-v-6f16ecd8]{width:100%;font-weight:600}.required[data-v-6f16ecd8]{color:var(--colour-ti-critical);padding-inline-start:.25rem}.segment-list[data-v-6f16ecd8]{padding:0;margin:0;display:inline-flex;list-style:none}:is(.segment-list li) .segment[data-v-6f16ecd8]{transition-duration:var(--transition-duration);transition-timing-function:var(--transition-timing-function);transition-property:color,border-color,background-color;display:flex;justify-content:center;align-items:center;border:1px solid rgba(0,0,0,.2);border-width:1px 0 1px 1px;background-color:transparent;padding:0 1rem;height:2.25rem;gap:.5rem;margin-left:-1px;cursor:pointer;box-shadow:.125rem .125rem .25rem #0000000d inset;color:var(--colour-ti-secondary)}.selected[data-v-6f16ecd8]:is(:is(.segment-list li) .segment){background-color:var(--colour-ti-secondary);color:var(--colour-neutral-base)}.selected.disabled[data-v-6f16ecd8]:is(:is(.segment-list li) .segment){background-color:var(--colour-ti-muted);color:var(--colour-neutral-base)}.disabled[data-v-6f16ecd8]:is(:is(.segment-list li) .segment){cursor:not-allowed}:is(:is(.segment-list li) .segment) .badge[data-v-6f16ecd8]{display:inline-flex;justify-content:center;align-items:center;height:1.5rem;min-width:1.5rem;border-radius:1.5rem;background-color:#1373d966;padding:0 .5rem;box-sizing:border-box;font-weight:600}:is(.segment-list li):last-child .segment[data-v-6f16ecd8]{border-top-right-radius:999px;border-bottom-right-radius:999px;border-right-width:1px}:is(.segment-list li):first-child .segment[data-v-6f16ecd8]{border-top-left-radius:999px;border-bottom-left-radius:999px}.skeleton__a11y-message[data-v-987e9bee]{position:absolute;top:auto;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;white-space:nowrap}.skeleton__hide-content[data-v-987e9bee]{visibility:hidden}.skeleton[data-v-987e9bee]{cursor:progress}.skeleton.scan[data-v-987e9bee]{background:var(--colour-ti-base-dark) linear-gradient(90deg,transparent 25%,var(--colour-user-graphite) 50%,transparent 75%);background-size:1000% 1000%}@media(prefers-reduced-motion:no-preference){.skeleton.scan[data-v-987e9bee]{animation:scan-animation-987e9bee 6s ease infinite}}.skeleton.pulse[data-v-987e9bee]{position:relative;overflow:hidden;background:var(--colour-ti-base-dark)}.skeleton.pulse[data-v-987e9bee]:after{content:"";position:absolute;top:50%;left:50%;width:.1px;height:.1px;border-radius:9999px;background-color:var(--colour-ti-base-dark)}@media(prefers-reduced-motion:no-preference){.skeleton.pulse[data-v-987e9bee]:after{animation:pulse-animation-987e9bee 3s ease infinite}}@keyframes scan-animation-987e9bee{0%{background-position:0 50%}to{background-position:100% 50%}}@keyframes pulse-animation-987e9bee{50%{box-shadow:0 0 0 0 var(--colour-user-graphite)}to{box-shadow:0 0 0 20px transparent}}.icon[data-v-dc0b4f69]{display:flex;align-items:center;justify-content:center}.body[data-v-dc0b4f69]{font-size:1rem;font-weight:400;line-height:132%;color:var(--colour-ti-secondary);flex-grow:1}.cta[data-v-dc0b4f69]{display:flex;align-items:center;justify-content:center;gap:1rem}.notice[data-v-dc0b4f69]{display:grid;grid-template-columns:auto 1fr auto;justify-content:start;align-items:center;border-radius:1rem;gap:.5rem;border:.0625rem solid;padding:1rem}.notice[data-v-dc0b4f69]:has(.cta){padding:.75rem .75rem .75rem 1rem}.info[data-v-dc0b4f69]{background-color:var(--colour-primary-soft);border-color:var(--colour-primary-default)}.success[data-v-dc0b4f69]{background-color:var(--colour-success-soft);border-color:var(--colour-success-default)}.warning[data-v-dc0b4f69]{background-color:var(--colour-warning-soft);border-color:var(--colour-warning-default)}.critical[data-v-dc0b4f69]{background-color:var(--colour-danger-soft);border-color:var(--colour-danger-default)}.v-enter-active[data-v-a1f15ce0],.v-leave-active[data-v-a1f15ce0]{transition:opacity .125s ease}.v-enter-from[data-v-a1f15ce0],.v-leave-to[data-v-a1f15ce0]{opacity:0}body.modal-active[data-v-a1f15ce0]{overflow:hidden}.overlay[data-v-a1f15ce0]{position:fixed;left:0;top:0;z-index:9999;width:100vw;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;background-color:color-mix(in srgb,var(--colour-ti-base-light) 65%,transparent)}.modal[data-v-a1f15ce0]{position:relative;width:100%;height:100%;overflow-y:auto;padding-top:5rem;box-sizing:border-box;display:flex;flex-direction:column;background-color:var(--colour-neutral-base)}.modal-close[data-v-a1f15ce0]{position:absolute;right:1.75rem;top:1.75rem;cursor:pointer;color:var(--colour-ti-muted);background-color:color-mix(in srgb,black 5%,transparent);border:0;border-radius:999px;display:flex;padding:.5rem}.dark .modal-close[data-v-a1f15ce0]>.text{filter:invert(.75)}.modal-header[data-v-a1f15ce0]{width:100%;padding:0 3rem;box-sizing:border-box;margin-block-end:1.5rem;font-family:Metropolis,sans-serif;font-size:1.5rem;font-weight:500;line-height:120%;color:var(--colour-ti-highlight)}.modal-body[data-v-a1f15ce0]{padding:0 3rem;box-sizing:border-box;margin-block-end:1.5rem;font-size:.875rem;line-height:123%;color:var(--colour-ti-secondary)}.modal-body[data-v-a1f15ce0]:last-child{margin-block-end:3rem}.modal-actions[data-v-a1f15ce0]{display:flex;justify-content:flex-end;align-items:center;gap:1rem;padding:0 3rem;box-sizing:border-box;margin-block-end:1.5rem}.modal-actions[data-v-a1f15ce0]:last-child{margin-block-end:3rem}.divider[data-v-a1f15ce0]{height:.0625rem;border-radius:unset;margin-top:auto;margin-bottom:1rem;flex-shrink:0;background:linear-gradient(to right,transparent 0%,var(--colour-neutral-border) 50%,transparent 100%)}.footer[data-v-a1f15ce0]{height:2.8125rem;width:100%;display:flex;justify-content:center;align-items:center;padding-bottom:1rem;gap:2rem;color:var(--colour-primary-pressed)}.footer[data-v-a1f15ce0] a{color:var(--colour-primary-default);font-size:.8125rem;line-height:1.5rem;text-decoration-line:none;padding-left:0;padding-right:0}:is(.footer[data-v-a1f15ce0] a):hover{text-decoration-line:underline}[data-v-a1f15ce0] #title{color:var(--colour-ti-base);font-family:Inter,sans-serif;font-weight:400;font-size:1.375rem;line-height:1.664rem}@media(min-width:48rem){.modal[data-v-a1f15ce0]{width:48rem;height:-moz-min-content;height:min-content;min-height:20vh;max-height:90vh;border-radius:1.5rem}.modal-body[data-v-a1f15ce0]{overflow-y:auto;min-height:0}.divider[data-v-a1f15ce0]{width:100%;margin:0;flex-shrink:0}.footer[data-v-a1f15ce0]{padding-bottom:0;flex-shrink:0}}.avatar[data-v-88d16720]{width:2.5rem;height:2.5rem;display:flex;justify-content:center;align-items:center;border:solid 1px var(--colour-user-blue);border-radius:100%;background-color:#0a84ff26}.avatar .img[data-v-88d16720]{width:100%;height:100%;border-radius:100%}.avatar .initials[data-v-88d16720]{font-weight:700;font-stretch:normal;font-style:normal;line-height:1.43;color:var(--colour-ti-base)}.avatar.extra-small[data-v-88d16720]{width:1.5rem;height:1.5rem}.avatar.small[data-v-88d16720]{width:2rem;height:2rem}.avatar.large[data-v-88d16720]{width:3rem;height:3rem;font-size:1.125rem}html{--divider-background-colour: #e4e4e7;--divider-border-colour: #fff}html.dark{--divider-background-colour: #3d4d67;--divider-border-colour: #242d3c}.divider[data-v-3aae491b]{box-shadow:1px 0 0 0 var(--divider-border-colour);background-color:var(--divider-background-colour);flex-shrink:0}.horizontal[data-v-3aae491b]{width:100%;height:1px}.vertical[data-v-3aae491b]{width:1px;height:100%}footer[data-v-7af050ff]{display:flex;flex-direction:column;gap:1.5rem;padding:2rem 1rem;background-image:linear-gradient(138deg,#1b2128 34%,#171b24 55%);color:#eeeef0}footer[data-v-7af050ff] a{color:#eeeef0;text-decoration:none}footer .underline[data-v-7af050ff],footer[data-v-7af050ff] a:hover{text-decoration:underline}footer .mozilla-navigation[data-v-7af050ff]{display:flex;flex-direction:column;align-items:start;gap:2rem;font-family:Inter;font-size:.75rem}:is(footer .mozilla-navigation) img[data-v-7af050ff]{height:36px}:is(footer .mozilla-navigation) ul[data-v-7af050ff]{display:flex;flex-direction:column;gap:1rem;list-style:none;margin:0;padding:0}:is(footer .mozilla-navigation) .mozilla-navigation-content[data-v-7af050ff]{display:flex;flex-direction:column;gap:1.5rem}:is(:is(footer .mozilla-navigation) .mozilla-navigation-content) ul[data-v-7af050ff]{display:grid;grid-template-columns:auto 1fr;grid-auto-flow:row;column-gap:2.25rem}@media(min-width:48rem){footer[data-v-7af050ff]{gap:2.5rem;padding:3rem 1rem 5rem}footer .mozilla-navigation[data-v-7af050ff]{flex-direction:row;gap:6rem}:is(:is(footer .mozilla-navigation) .mozilla-navigation-content) ul[data-v-7af050ff]{display:flex;flex-direction:row;gap:2.25rem}}@media(min-width:64rem){footer[data-v-7af050ff]{padding:3rem 3.5rem 5rem}}.iconOnly[data-v-b8a472ab]{gap:0}
.resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}
.vfm--fixed{position:fixed}.vfm--absolute{position:absolute}.vfm--inset{top:0;right:0;bottom:0;left:0}.vfm--overlay{z-index:-1;background-color:#00000080}.vfm--prevent-none{pointer-events:none}.vfm--prevent-auto{pointer-events:auto}.vfm--outline-none:focus{outline:none}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.vfm-fade-enter-active{animation:fade-in .3s ease}.vfm-fade-leave-active{animation:fade-out .3s ease}.vfm-bounce-back{transition-property:transform;transition-duration:.3s}.vfm-slide-up-enter-active,.vfm-slide-up-leave-active,.vfm-slide-down-enter-active,.vfm-slide-down-leave-active{transition:transform .3s ease}.vfm-slide-down-enter-from,.vfm-slide-down-leave-to{transform:translateY(100vh)!important}.vfm-slide-up-enter-from,.vfm-slide-up-leave-to{transform:translateY(-100vh)!important}.vfm-slide-right-enter-active,.vfm-slide-right-leave-active,.vfm-slide-left-enter-active,.vfm-slide-left-leave-active{transition:transform .3s ease}.vfm-slide-right-enter-from,.vfm-slide-right-leave-to{transform:translate(100vw)!important}.vfm-slide-left-enter-from,.vfm-slide-left-leave-to{transform:translate(-100vw)!important}.vfm-swipe-banner-back,.vfm-swipe-banner-forward{position:fixed;top:0;bottom:0;width:27px;z-index:10}.vfm-swipe-banner-back{left:0}.vfm-swipe-banner-forward{right:0}
/* - Metropolis -*/
/* 100 - Thin */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 100;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-Thin.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 100;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-ThinItalic.woff2') format('woff2');
}
/* 200 - Extra light */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 200;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-ExtraLight.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 200;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-ExtraLightItalic.woff2') format('woff2');
}
/* 300 - Light */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-Light.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 300;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-LightItalic.woff2') format('woff2');
}
/* 400 - Regular */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-Regular.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 400;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-RegularItalic.woff2') format('woff2');
}
/* 500 - Medium */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-Medium.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 500;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-MediumItalic.woff2') format('woff2');
}
/* 600 - Semibold */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-SemiBold.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 600;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-SemiBoldItalic.woff2') format('woff2');
}
/* 700 - Bold */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-Bold.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 700;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-BoldItalic.woff2') format('woff2');
}
/* 800 - Extra bold */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 800;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-ExtraBold.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 800;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-ExtraBoldItalic.woff2') format('woff2');
}
/* 900 - Black */
@font-face {
font-family: metropolis;
font-style: normal;
font-weight: 900;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-Black.woff2') format('woff2');
}
@font-face {
font-family: metropolis;
font-style: italic;
font-weight: 900;
font-display: swap;
src: url('../fonts/Metropolis/Metropolis-BlackItalic.woff2') format('woff2');
}
/* - Inter - */
/* 100 - Thin */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 100;
font-display: swap;
src: url('../fonts/Inter/Inter-Thin.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 100;
font-display: swap;
src: url('../fonts/Inter/Inter-ThinItalic.woff2') format('woff2');
}
/* 200 - Extra light */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 200;
font-display: swap;
src: url('../fonts/Inter/Inter-ExtraLight.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 200;
font-display: swap;
src: url('../fonts/Inter/Inter-ExtraLightItalic.woff2') format('woff2');
}
/* 300 - Light */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../fonts/Inter/Inter-Light.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 300;
font-display: swap;
src: url('../fonts/Inter/Inter-LightItalic.woff2') format('woff2');
}
/* 400 - Regular */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/Inter/Inter-Regular.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 400;
font-display: swap;
src: url('../fonts/Inter/Inter-Italic.woff2') format('woff2');
}
/* 500 - Medium */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/Inter/Inter-Medium.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 500;
font-display: swap;
src: url('../fonts/Inter/Inter-MediumItalic.woff2') format('woff2');
}
/* 600 - Semibold */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/Inter/Inter-SemiBold.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 600;
font-display: swap;
src: url('../fonts/Inter/Inter-SemiBoldItalic.woff2') format('woff2');
}
/* 700 - Bold */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/Inter/Inter-Bold.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 700;
font-display: swap;
src: url('../fonts/Inter/Inter-BoldItalic.woff2') format('woff2');
}
/* 800 - Extra bold */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 800;
font-display: swap;
src: url('../fonts/Inter/Inter-ExtraBold.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 800;
font-display: swap;
src: url('../fonts/Inter/Inter-ExtraBoldItalic.woff2') format('woff2');
}
/* 900 - Black */
@font-face {
font-family: inter;
font-style: normal;
font-weight: 900;
font-display: swap;
src: url('../fonts/Inter/Inter-Black.woff2') format('woff2');
}
@font-face {
font-family: inter;
font-style: italic;
font-weight: 900;
font-display: swap;
src: url('../fonts/Inter/Inter-BlackItalic.woff2') format('woff2');
}
/**
* @license
* Generated by Zeplin
* Copyright (C) 2026 - present Zeplin
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
:root {
--tf-android-dark-on-surface: #e5e2e3;
--tf-android-dark-surface-bright: #39393a;
--tf-android-light-warning-container: #fefae8;
--neutral-50: #f7f7f7;
--tf-android-light-tertiary: #54008e;
--tf-android-dark-success: #8ee7aa;
--tf-android-dark-error: #fca5a5;
--purple-100: #f5e8ff;
--tf-android-dark-on-info-container: #bee6ff;
--tf-android-dark-outline-variant: #44474c;
--tf-android-light-on-error-container: #7f1d1d;
--tf-android-dark-on-error-container: #fef2f2;
--tf-android-dark-inverse-primary: #006689;
--yellow-950: #423606;
--tf-android-light-warning: #713f12;
--tf-android-dark-on-info: #002e41;
--tf-android-light-error: #7f1d1d;
--red-600: #dc2626;
--tf-android-light-success-container: #f4f9f4;
--red-700: #b91c1c;
--green-200: #c0f2cf;
--tf-android-light-on-success: #fff;
--tf-android-light-on-error: #fff;
--blue-800: #175fb6;
--teal-200: #a3ece3;
--tf-android-dark-on-surface-variant: #c5c6cc;
--neutral-400: #91939f;
--tf-android-light-tertiary-container: #7b35b8;
--tf-android-light-inverse-surface: #313030;
--tf-android-dark-tertiary: #fff;
--tf-android-dark-success-container: #082b16;
--blue-50: #f0f8ff;
--tf-android-light-on-primary-container: #1373d9;
--tf-android-dark-on-warning: #411107;
--neutral-800: #4c4d58;
--tf-android-dark-on-secondary: #003352;
--purple-50: #faf5ff;
--tf-android-dark-surface-container-lowest: #0e0e0f;
--yellow-300: #fdd847;
--tf-android-dark-tertiary-container: #dcd0e6;
--yellow-100: #fef2c3;
--tf-android-light-scrim: #000;
--tf-android-light-primary-container: #1373d9;
--tf-android-dark-info-container: #262c40;
--tf-android-light-on-primary: #fff;
--yellow-600: #caa204;
--neutral-930: #262d3b;
--red-900: #7f1d1d;
--tf-android-light-on-warning-container: #713f12;
--yellow-400: #facc15;
--tf-android-light-surface-container-low: #f6f3f2;
--tf-android-dark-surface-container-high: #2a2a2b;
--user-accent-pink: #e91e63;
--tf-android-light-on-tertiary: #fff;
--tf-android-light-inverse-primary: #a9c7ff;
--tf-android-dark-outline: #8f9096;
--purple-500: #ae55f7;
--tf-android-dark-error-container: #7f1d1d;
--tf-android-light-inverse-on-surface: #f3f0ef;
--tf-android-dark-on-tertiary-container: #443c4e;
--tf-android-light-on-info: #fff;
--tf-android-light-surface-container-highest: #e5e2e1;
--neutral-0: #feffff;
--green-400: #55d37e;
--neutral-550: #3d4d67;
--neutral-200: #e4e4e7;
--neutral-700: #5e7799;
--tf-android-light-outline: #75777a;
--blue-400: #58c9ff;
--red-500: #ef4444;
--blue-500: #32aeff;
--neutral-600: #7f94ac;
--user-accent-orange: #ff8c00;
--green-100: #defae7;
--pink-500: #e247c4;
--tf-android-light-surface: #fcf8f8;
--teal-500: #25a6a0;
--tf-android-light-shadow: #000;
--user-accent-graphite: #b0b0b0;
--tf-android-light-surface-container: #f1edec;
--tf-android-light-info: #004f9b;
--red-300: #fca5a5;
--tf-android-dark-on-tertiary: #352d3e;
--orange-200: #fec18a;
--yellow-50: #fefae8;
--tf-android-light-outline-variant: #c5c6ca;
--green-950: #082b16;
--yellow-900: #713f12;
--red-800: #991b1b;
--user-accent-yellow: #f4c430;
--purple-900: #571c87;
--red-400: #f87171;
--tf-android-light-surface-dim: #dcd9d9;
--green-300: #8ee7aa;
--neutral-100: #eeeef0;
--tf-android-light-on-tertiary-container: #fff;
--tf-android-light-on-success-container: #194e2c;
--blue-700: #1373d9;
--tf-android-dark-surface-container-highest: #353436;
--tf-android-light-surface-bright: #fcf8f8;
--purple-200: #ecd5ff;
--tf-android-dark-surface-dim: #131314;
--tf-android-light-surface-container-high: #ebe7e7;
--tf-android-dark-warning-container: #423606;
--tf-android-light-on-secondary: #fff;
--orange-500: #ea7308;
--tf-android-dark-primary-container: #50c2f8;
--tf-android-dark-on-warning-container: #fee78a;
--neutral-940: #1a202c;
--tf-android-dark-secondary-container: #24a7f7;
--purple-700: #8022ce;
--tf-android-light-on-warning: #fff;
--tf-android-dark-on-error: #450a0a;
--tf-android-dark-on-primary: #003549;
--tf-android-light-primary: #004f9b;
--tf-android-dark-warning: #fee78a;
--purple-800: #6b21a8;
--tf-android-light-on-secondary-container: #fff;
--green-50: #f4f9f4;
--user-accent-red: #e53935;
--neutral-900: #26272a;
--user-accent-blue: #0a84ff;
--neutral-500: #737584;
--green-900: #194e2c;
--yellow-500: #eabd08;
--ink-700: #6e6f9b;
--ink-300: #c3cade;
--tf-android-dark-secondary: #96cdff;
--tf-android-dark-on-success: #082b16;
--tf-android-light-secondary: #003d75;
--purple-950: #3a0764;
--purple-300: #ddb4fe;
--tf-android-dark-surface-container-low: #1b1b1c;
--yellow-200: #fee78a;
--user-accent-green: #34c759;
--green-700: #1d783b;
--blue-900: #19518f;
--blue-950: #262c40;
--tf-android-light-secondary-container: #2e61a0;
--tf-android-light-success: #194e2c;
--user-accent-purple: #7753cc;
--tf-android-light-on-surface: #1c1b1b;
--tf-android-dark-on-secondary-container: #001423;
--blue-600: #1b90f5;
--tf-android-dark-on-primary-container: #002e41;
--tf-android-dark-inverse-surface: #e5e2e3;
--tf-android-dark-on-success-container: #8ee7aa;
--red-200: #fecaca;
--tf-android-dark-inverse-on-surface: #313031;
--tf-android-light-surface-container-lowest: #fff;
--pink-200: #fbd3f6;
--tf-android-dark-surface: #131314;
--tf-android-light-on-info-container: #004f9b;
--red-950: #450a0a;
--tf-android-dark-primary: #bee6ff;
--tf-android-dark-surface-container: #201f20;
--neutral-300: #d9d9de;
--tf-android-light-on-surface-variable: #45474a;
--tf-android-dark-info: #bee6ff;
--green-800: #1c5f32;
--tf-android-light-info-container: #f0f8ff;
--tf-android-light-error-container: #fef2f2;
--red-100: #fef2f2;
--neutral-950: #18181b;
}
.Mode-1 {
/* user-red */
--user-red: #e53935;
/* user-orange */
--user-orange: #ff8c00;
/* user-yellow */
--user-yellow: #f4c430;
/* user-graphite */
--user-graphite: #b0b0b0;
/* user-green */
--user-green: #34c759;
/* user-blue */
--user-blue: #0a84ff;
/* user-purple */
--user-purple: #7753cc;
/* user-pink */
--user-pink: #e91e63;
}
.light {
/* primary */
--primary: #004f9b;
/* secondary */
--secondary: #003d75;
/* tertiary */
--tertiary: #54008e;
/* onPrimary */
--on-primary: #fff;
/* primaryContainer */
--primary-container: #1373d9;
/* onPrimaryContainer */
--on-primary-container: #fff;
/* onSecondary */
--on-secondary: #fff;
/* secondaryContainer */
--secondary-container: #2e61a0;
/* onSecondaryContainer */
--on-secondary-container: #fff;
/* onTertiary */
--on-tertiary: #fff;
/* tertiaryContainer */
--tertiary-container: #7b35b8;
/* onTertiaryContainer */
--on-tertiary-container: #fff;
/* error */
--error: #7f1d1d;
/* onError */
--on-error: #fff;
/* errorContainer */
--error-container: #fef2f2;
/* onErrorContainer */
--on-error-container: #7f1d1d;
/* surfaceDim */
--surface-dim: #dcd9d9;
/* surface */
--surface: #fcf8f8;
/* surfaceBright */
--surface-bright: #fcf8f8;
/* onSurface */
--on-surface: #1c1b1b;
/* onSurfaceVariant */
--on-surface-variant: #45474a;
/* surfaceContainerLowest */
--surface-container-lowest: #fff;
/* surfaceContainerLow */
--surface-container-low: #f6f3f2;
/* surfaceContainer */
--surface-container: #f1edec;
/* surfaceContainerHigh */
--surface-container-high: #ebe7e7;
/* surfaceContainerHighest */
--surface-container-highest: #e5e2e1;
/* surfaceVariantBlue */
--surface-variant-blue: #f0f8ff;
/* inverseSurface */
--inverse-surface: #313030;
/* inverseOnSurface */
--inverse-on-surface: #f3f0ef;
/* inversePrimary */
--inverse-primary: #a9c7ff;
/* outline */
--outline: #75777a;
/* outlineVariant */
--outline-variant: #c5c6ca;
/* scrim */
--scrim: #000;
/* info */
--info: #004f9b;
/* onInfo */
--on-info: #fff;
/* infoContainer */
--info-container: #f0f8ff;
/* onInfoContainer */
--on-info-container: #004f9b;
/* success */
--success: #194e2c;
/* onSuccess */
--on-success: #fff;
/* successContainer */
--success-container: #f4f9f4;
/* onSuccessContainer */
--on-success-container: #194e2c;
/* warning */
--warning: #713f12;
/* onWarning */
--on-warning: #fff;
/* warningContainer */
--warning-container: #fefae8;
/* onWarningContainer */
--on-warning-container: #713f12;
/* neutral */
--neutral: #fff;
/* neutral-inverse */
--neutral-inverse: #000;
/* onSurfaceVariantOrange */
--on-surface-variant-orange: #ff8c00;
/* onSurfaceVariantYellow */
--on-surface-variant-yellow: #f4c430;
/* onSurfaceVariantGreen */
--on-surface-variant-green: #1d783b;
/* onSurfaceVariantRed */
--on-surface-variant-red: #e53935;
/* accents */
--accents-purple: #ae55f7;
--accents-blue: #37adf9;
--accents-green: #25a6a0;
--accents-orange: #ea7308;
--accents-pink: #e247c4;
--accents-gray: #6e6f9b;
/* critical */
--critical-default: #991b1b;
--critical-hover: #7f1d1d;
--critical-pressed: #450a0a;
--critical-soft: #fef2f2;
/* primary */
--primary-default: #1373d9;
--primary-hover: #175fb6;
--primary-pressed: #19518f;
--primary-soft: #f0f8ff;
/* secondary */
--secondary-soft: #faf5ff;
--secondary-default: #6b21a8;
--secondary-hover: #571c87;
--secondary-pressed: #3a0764;
/* success */
--success-soft: #f4f9f4;
--success-default: #1d783b;
--success-hover: #1c5f32;
--success-pressed: #194e2c;
/* surface */
--surface-base: #feffff;
--surface-lower: #f7f7f7;
--surface-raised: #feffff;
--surface-subtle: #f7f7f7;
--surface-deep: #e4e4e7;
--surface-border: #e4e4e7;
--surface-border-intense: #91939f;
/* text-icon */
--text-icon-secondary: #4c4d58;
--text-icon-base: #1a202c;
--text-icon-muted: #737584;
--text-icon-brand: #19518f;
--text-icon-highlight: #1373d9;
--text-icon-warning: #713f12;
--text-icon-critical: #dc2626;
--text-icon-success: #1d783b;
/* warning */
--warning-default: #facc15;
--warning-hover: #eabd08;
--warning-pressed: #caa204;
--warning-soft: #fefae8;
}
.dark {
/* primary */
--primary: #bee6ff;
/* secondary */
--secondary: #96cdff;
/* tertiary */
--tertiary: #fff;
/* onPrimary */
--on-primary: #003549;
/* primaryContainer */
--primary-container: #50c2f8;
/* onPrimaryContainer */
--on-primary-container: #002e41;
/* onSecondary */
--on-secondary: #003352;
/* secondaryContainer */
--secondary-container: #24a7f7;
/* onSecondaryContainer */
--on-secondary-container: #001423;
/* onTertiary */
--on-tertiary: #352d3e;
/* tertiaryContainer */
--tertiary-container: #dcd0e6;
/* onTertiaryContainer */
--on-tertiary-container: #443c4e;
/* error */
--error: #fca5a5;
/* onError */
--on-error: #450a0a;
/* errorContainer */
--error-container: #7f1d1d;
/* onErrorContainer */
--on-error-container: #fef2f2;
/* surfaceDim */
--surface-dim: #131314;
/* surface */
--surface: #131314;
/* surfaceBright */
--surface-bright: #39393a;
/* onSurface */
--on-surface: #e5e2e3;
/* onSurfaceVariant */
--on-surface-variant: #c5c6cc;
/* surfaceContainerLowest */
--surface-container-lowest: #0e0e0f;
/* surfaceContainerLow */
--surface-container-low: #1b1b1c;
/* surfaceContainer */
--surface-container: #201f20;
/* surfaceContainerHigh */
--surface-container-high: #2a2a2b;
/* surfaceContainerHighest */
--surface-container-highest: #353436;
/* surfaceVariantBlue */
--surface-variant-blue: #262c40;
/* inverseSurface */
--inverse-surface: #e5e2e3;
/* inverseOnSurface */
--inverse-on-surface: #313031;
/* inversePrimary */
--inverse-primary: #006689;
/* outline */
--outline: #8f9096;
/* outlineVariant */
--outline-variant: #44474c;
/* scrim */
--scrim: #000;
/* info */
--info: #bee6ff;
/* onInfo */
--on-info: #002e41;
/* infoContainer */
--info-container: #262c40;
/* onInfoContainer */
--on-info-container: #bee6ff;
/* success */
--success: #8ee7aa;
/* onSuccess */
--on-success: #082b16;
/* successContainer */
--success-container: #082b16;
/* onSuccessContainer */
--on-success-container: #8ee7aa;
/* warning */
--warning: #fee78a;
/* onWarning */
--on-warning: #411107;
/* warningContainer */
--warning-container: #423606;
/* onWarningContainer */
--on-warning-container: #fee78a;
/* neutral */
--neutral: #000;
/* neutral-inverse */
--neutral-inverse: #fff;
/* onSurfaceVariantOrange */
--on-surface-variant-orange: #ff8c00;
/* onSurfaceVariantYellow */
--on-surface-variant-yellow: #f4c430;
/* onSurfaceVariantGreen */
--on-surface-variant-green: #34c759;
/* onSurfaceVariantRed */
--on-surface-variant-red: #e53935;
/* accents */
--accents-purple: #8022ce;
--accents-blue: #58c9ff;
--accents-green: #a3ece3;
--accents-orange: #fec18a;
--accents-pink: #fbd3f6;
--accents-gray: #c3cade;
/* critical */
--critical-default: #fca5a5;
--critical-hover: #f87171;
--critical-pressed: #ef4444;
--critical-soft: #7f1d1d;
/* primary */
--primary-default: #58c9ff;
--primary-hover: #32aeff;
--primary-pressed: #1b90f5;
--primary-soft: #262c40;
/* secondary */
--secondary-soft: #3a0764;
--secondary-default: #f5e8ff;
--secondary-hover: #ecd5ff;
--secondary-pressed: #ddb4fe;
/* success */
--success-soft: #082b16;
--success-default: #defae7;
--success-hover: #c0f2cf;
--success-pressed: #8ee7aa;
/* surface */
--surface-base: #1a202c;
--surface-lower: #18181b;
--surface-raised: #262d3b;
--surface-subtle: #262d3b;
--surface-deep: #3d4d67;
--surface-border: #3d4d67;
--surface-border-intense: #5e7799;
/* text-icon */
--text-icon-secondary: #d9d9de;
--text-icon-base: #eeeef0;
--text-icon-muted: #7f94ac;
--text-icon-brand: #1b90f5;
--text-icon-highlight: #58c9ff;
--text-icon-warning: #fee78a;
--text-icon-critical: #ef4444;
--text-icon-success: #55d37e;
/* warning */
--warning-default: #fef2c3;
--warning-hover: #fee78a;
--warning-pressed: #fdd847;
--warning-soft: #423606;
}
.light-hc {
/* accents */
--accents-purple: #005fcc;
--accents-blue: #005fcc;
--accents-green: #005fcc;
--accents-orange: #005fcc;
--accents-pink: #005fcc;
--accents-gray: #005fcc;
/* critical */
--critical-default: #000;
--critical-hover: #37006e;
--critical-pressed: #37006e;
--critical-soft: #fff;
/* primary */
--primary-default: #000;
--primary-hover: #37006e;
--primary-pressed: #37006e;
--primary-soft: #fff;
/* secondary */
--secondary-soft: #fff;
--secondary-default: #fff;
--secondary-hover: #fff;
--secondary-pressed: #fff;
/* success */
--success-soft: #fff;
--success-default: #007a1c;
--success-hover: #c0f2cf;
--success-pressed: #007a1c;
/* surface */
--surface-base: #fefefe;
--surface-lower: #fff;
--surface-raised: #fff;
--surface-subtle: #fff;
--surface-deep: #fff;
--surface-border: #000;
--surface-border-intense: #000;
/* text-icon */
--text-icon-secondary: #000;
--text-icon-base: #000;
--text-icon-muted: #666;
--text-icon-brand: #000;
--text-icon-highlight: #00009f;
--text-icon-warning: #805900;
--text-icon-critical: #f00;
--text-icon-success: #007a1c;
/* warning */
--warning-default: #000;
--warning-hover: #37006e;
--warning-pressed: #37006e;
--warning-soft: #fff;
}
.dark-hc {
/* accents */
--accents-purple: #39f;
--accents-blue: #39f;
--accents-green: #39f;
--accents-orange: #39f;
--accents-pink: #39f;
--accents-gray: #39f;
/* critical */
--critical-default: #fff;
--critical-hover: #1aebff;
--critical-pressed: #1aebff;
--critical-soft: #000;
/* primary */
--primary-default: #fff;
--primary-hover: #1aebff;
--primary-pressed: #1aebff;
--primary-soft: #000;
/* secondary */
--secondary-soft: #000;
--secondary-default: #fff;
--secondary-hover: #fff;
--secondary-pressed: #fff;
/* success */
--success-soft: #000;
--success-default: #3f9;
--success-hover: #3f9;
--success-pressed: #3f9;
/* surface */
--surface-base: #000;
--surface-lower: #000;
--surface-raised: #000;
--surface-subtle: #000;
--surface-deep: #000;
--surface-border: #fff;
--surface-border-intense: #fff;
/* text-icon */
--text-icon-secondary: #fff;
--text-icon-base: #fff;
--text-icon-muted: #999;
--text-icon-brand: #fff;
--text-icon-highlight: #ffff01;
--text-icon-warning: #ffd700;
--text-icon-critical: #f55;
--text-icon-success: #3f9;
/* warning */
--warning-default: #fff;
--warning-hover: #1aebff;
--warning-pressed: #1aebff;
--warning-soft: #423606;
}
*, ::before, ::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-skew-x: 0;
--tw-skew-y: 0;
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness: proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: rgb(59 130 246 / 0.5);
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia: ;
--tw-contain-size: ;
--tw-contain-layout: ;
--tw-contain-paint: ;
--tw-contain-style: ;
}
::backdrop {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-skew-x: 0;
--tw-skew-y: 0;
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness: proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: rgb(59 130 246 / 0.5);
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia: ;
--tw-contain-size: ;
--tw-contain-layout: ;
--tw-contain-paint: ;
--tw-contain-style: ;
}
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/
*,
::before,
::after {
box-sizing: border-box; /* 1 */
border-width: 0; /* 2 */
border-style: solid; /* 2 */
border-color: #e5e7eb; /* 2 */
}
::before,
::after {
--tw-content: '';
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/
html,
:host {
line-height: 1.5; /* 1 */
/* 2 */
-moz-tab-size: 4; /* 3 */
-o-tab-size: 4;
tab-size: 4; /* 3 */
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
font-feature-settings: normal; /* 5 */
font-variation-settings: normal; /* 6 */
-webkit-tap-highlight-color: transparent; /* 7 */
}
/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/
body {
margin: 0; /* 1 */
line-height: inherit; /* 2 */
}
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/
hr {
height: 0; /* 1 */
color: inherit; /* 2 */
border-top-width: 1px; /* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
color: inherit;
text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
font-weight: bolder;
}
/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
font-feature-settings: normal; /* 2 */
font-variation-settings: normal; /* 3 */
font-size: 1em; /* 4 */
}
/*
Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
text-indent: 0; /* 1 */
border-color: inherit; /* 2 */
border-collapse: collapse; /* 3 */
}
/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-feature-settings: inherit; /* 1 */
font-variation-settings: inherit; /* 1 */
font-size: 100%; /* 1 */
font-weight: inherit; /* 1 */
line-height: inherit; /* 1 */
letter-spacing: inherit; /* 1 */
color: inherit; /* 1 */
margin: 0; /* 2 */
padding: 0; /* 3 */
}
/*
Remove the inheritance of text transform in Edge and Firefox.
*/
button,
select {
text-transform: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/
button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
-webkit-appearance: button; /* 1 */
background-color: transparent; /* 2 */
background-image: none; /* 2 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
outline: auto;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
box-shadow: none;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
vertical-align: baseline;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
[type='search'] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
-webkit-appearance: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/*
Add the correct display in Chrome and Safari.
*/
summary {
display: list-item;
}
/*
Removes the default spacing and border for appropriate elements.
*/
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
margin: 0;
}
fieldset {
margin: 0;
padding: 0;
}
legend {
padding: 0;
}
ol,
ul,
menu {
list-style: none;
margin: 0;
padding: 0;
}
/*
Reset default styling for dialogs.
*/
dialog {
padding: 0;
}
/*
Prevent resizing textareas horizontally by default.
*/
textarea {
resize: vertical;
}
/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/
input::-moz-placeholder, textarea::-moz-placeholder {
opacity: 1; /* 1 */
color: #9ca3af; /* 2 */
}
input::placeholder,
textarea::placeholder {
opacity: 1; /* 1 */
color: #9ca3af; /* 2 */
}
/*
Set the default cursor for buttons.
*/
button,
[role="button"] {
cursor: pointer;
}
/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
cursor: default;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: block; /* 1 */
vertical-align: middle; /* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
max-width: 100%;
height: auto;
}
/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
display: none;
}
input:where([type='text']),input:where(:not([type])),input:where([type='email']),input:where([type='url']),input:where([type='password']),input:where([type='number']),input:where([type='date']),input:where([type='datetime-local']),input:where([type='month']),input:where([type='search']),input:where([type='tel']),input:where([type='time']),input:where([type='week']),select:where([multiple]),textarea,select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #fff;
border-color: #6b7280;
border-width: 1px;
border-radius: 0px;
padding-top: 0.5rem;
padding-right: 0.75rem;
padding-bottom: 0.5rem;
padding-left: 0.75rem;
font-size: 1rem;
line-height: 1.5rem;
--tw-shadow: 0 0 #0000;
}
input:where([type='text']):focus, input:where(:not([type])):focus, input:where([type='email']):focus, input:where([type='url']):focus, input:where([type='password']):focus, input:where([type='number']):focus, input:where([type='date']):focus, input:where([type='datetime-local']):focus, input:where([type='month']):focus, input:where([type='search']):focus, input:where([type='tel']):focus, input:where([type='time']):focus, input:where([type='week']):focus, select:where([multiple]):focus, textarea:focus, select:focus {
outline: 2px solid transparent;
outline-offset: 2px;
--tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: #2563eb;
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
border-color: #2563eb;
}
input::-moz-placeholder, textarea::-moz-placeholder {
color: #6b7280;
opacity: 1;
}
input::placeholder,textarea::placeholder {
color: #6b7280;
opacity: 1;
}
::-webkit-datetime-edit-fields-wrapper {
padding: 0;
}
::-webkit-date-and-time-value {
min-height: 1.5em;
text-align: inherit;
}
::-webkit-datetime-edit {
display: inline-flex;
}
::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field {
padding-top: 0;
padding-bottom: 0;
}
select {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
background-position: right 0.5rem center;
background-repeat: no-repeat;
background-size: 1.5em 1.5em;
padding-right: 2.5rem;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
select:where([multiple]),select:where([size]:not([size="1"])) {
background-image: initial;
background-position: initial;
background-repeat: unset;
background-size: initial;
padding-right: 0.75rem;
-webkit-print-color-adjust: unset;
print-color-adjust: unset;
}
input:where([type='checkbox']),input:where([type='radio']) {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding: 0;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
display: inline-block;
vertical-align: middle;
background-origin: border-box;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
flex-shrink: 0;
height: 1rem;
width: 1rem;
color: #2563eb;
background-color: #fff;
border-color: #6b7280;
border-width: 1px;
--tw-shadow: 0 0 #0000;
}
input:where([type='checkbox']) {
border-radius: 0px;
}
input:where([type='radio']) {
border-radius: 100%;
}
input:where([type='checkbox']):focus,input:where([type='radio']):focus {
outline: 2px solid transparent;
outline-offset: 2px;
--tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
--tw-ring-offset-width: 2px;
--tw-ring-offset-color: #fff;
--tw-ring-color: #2563eb;
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
input:where([type='checkbox']):checked,input:where([type='radio']):checked {
border-color: transparent;
background-color: currentColor;
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
}
input:where([type='checkbox']):checked {
background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
}
@media (forced-colors: active) {
input:where([type='checkbox']):checked {
-webkit-appearance: auto;
-moz-appearance: auto;
appearance: auto;
}
}
input:where([type='radio']):checked {
background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
}
@media (forced-colors: active) {
input:where([type='radio']):checked {
-webkit-appearance: auto;
-moz-appearance: auto;
appearance: auto;
}
}
input:where([type='checkbox']):checked:hover,input:where([type='checkbox']):checked:focus,input:where([type='radio']):checked:hover,input:where([type='radio']):checked:focus {
border-color: transparent;
background-color: currentColor;
}
input:where([type='checkbox']):indeterminate {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");
border-color: transparent;
background-color: currentColor;
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
}
@media (forced-colors: active) {
input:where([type='checkbox']):indeterminate {
-webkit-appearance: auto;
-moz-appearance: auto;
appearance: auto;
}
}
input:where([type='checkbox']):indeterminate:hover,input:where([type='checkbox']):indeterminate:focus {
border-color: transparent;
background-color: currentColor;
}
input:where([type='file']) {
background: unset;
border-color: inherit;
border-width: 0;
border-radius: 0;
padding: 0;
font-size: unset;
line-height: inherit;
}
input:where([type='file']):focus {
outline: 1px solid ButtonText;
outline: 1px auto -webkit-focus-ring-color;
}
th {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
padding-left: 1rem;
padding-right: 1rem;
text-align: left;
font-size: 0.875rem;
line-height: 1.25rem;
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity, 1));
font-weight: 600;
}
input[type='text'],
input[type='email'],
input[type='password'],
textarea,
select {
border-radius: 0.25rem;
--tw-border-opacity: 1;
border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));
padding-top: 0.25rem;
padding-bottom: 0.25rem;
padding-left: 0.5rem;
padding-right: 0.5rem;
}
input[type='text']::-moz-placeholder, input[type='email']::-moz-placeholder, input[type='password']::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder {
--tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
input[type='text']::placeholder,
input[type='email']::placeholder,
input[type='password']::placeholder,
textarea::placeholder,
select::placeholder {
--tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
:root {
--primary-hover: #175fb6;
--primary-default: #1373d9;
--colour-neutral-900: #26272a;
--colour-neutral-base: #feffff;
--colour-neutral-lower: #f7f7f7;
--colour-neutral-lower-dark: #18181b; /* Forced dark mode colour */
--colour-neutral-border: #e4e4e7;
--colour-neutral-border-intense: #91939f;
--colour-primary-soft: #f0f8ff;
--colour-primary-default: #1373d9;
--colour-primary-hover: #175fb6;
--colour-primary-pressed: #19518f;
--colour-secondary-soft: #faf5ff;
--colour-secondary-default: #6b21a8;
--colour-secondary-hover: #571c87;
--colour-secondary-pressed: #3a0764;
--colour-success-soft: #f4f9f4;
--colour-success-default: #1d783b;
--colour-success-hover: #1c5f32;
--colour-success-pressed: #194e2c;
--colour-warning-soft: #fefae8;
--colour-warning-default: #facc15;
--colour-warning-hover: #eabd08;
--colour-warning-pressed: #caa204;
--colour-danger-soft: #fef2f2;
--colour-danger-default: #991b1b;
--colour-danger-hover: #7f1d1d;
--colour-danger-pressed: #7f1d1d;
--colour-ti-base: #1a202c;
--colour-ti-base-dark: #eeeef0; /* Forced dark mode colour */
--colour-ti-base-light: #1a202c; /* Forced light mode colour */
--colour-ti-secondary: #4c4d58;
--colour-ti-muted: #737584;
--colour-ti-highlight: #1373d9;
--colour-ti-warning: #713f12;
--colour-ti-critical: #f44336;
--colour-ti-success: #1d783b;
--colour-accent-teal: #25a6a0;
--colour-accent-blue: #58c9ff;
--accents-blue: #37adf9;
--colour-accent-purple: #ae55f7;
--colour-accent-orange: #ea7308;
--colour-accent-pink: #e247c4;
--colour-accent-gray: #6e6f9b;
--colour-apmt-soft: #f3f9fc;
--colour-apmt-primary: #008080;
--colour-apmt-primary-hover: #066769;
--colour-apmt-primary-pressed: #0a5757;
--colour-apmt-secondary: #81d4b5;
--colour-apmt-accent-1: #a3ece3;
--colour-apmt-accent-2: #03afd7;
--colour-send-soft: #fef7ec;
--colour-send-primary: #f09d38;
--colour-send-primary-hover: #f09d38;
--colour-send-primary-pressed: #f09d38;
--colour-send-primary-secondary: #aa6000;
--colour-send-primary-accent-1: #1f8ddb;
--colour-send-primary-accent-2: #1f8ddb;
--surface-border: #e4e4e7;
--color-send-muted: #737584;
--critical: #dc2626;
--text-icon-secondary: #4c4d58;
--neutral-0: #feffff;
--blue-400: #58c9ff00;
}
.absolute {
position: absolute;
}
.relative {
position: relative;
}
.block {
display: block;
}
.flex {
display: flex;
}
.hidden {
display: none;
}
.transform {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.filter {
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.transition {
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
/* Tooltip */
.v-tooltip {
--v-tooltip-arrow-size: 4px;
display: block;
font-size: 12px;
padding: 4px 8px;
color: white;
border-radius: 4px;
background: rgba(0, 0, 0, 0.8);
}
html,
body,
#app {
font-family: 'Inter', sans-serif;
background-color: #f5f5f5;
}
.btn-primary {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 8px;
padding: 18px 16px;
border-radius: 8px;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12);
background-image: linear-gradient(
to bottom,
var(--accents-blue),
var(--primary-default) 40%,
var(--primary-hover)
);
}
main {
min-height: calc(100vh - 250px - 60px);
}
/* Overlay modals */
.modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.893);
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
padding: 1rem;
}
.modal-container {
background: white;
border-radius: 24px;
max-width: 800px;
width: 100%;
max-height: 90vh;
/* overflow-y: auto; */
/* box-shadow:
0 20px 25px -5px rgba(0, 0, 0, 0.1),
0 10px 10px -5px rgba(0, 0, 0, 0.04); */
}
.modal-body {
/* margin: auto; */
padding: 20px;
/* background-color: white; */
border-radius: 8px;
}
/* components */
h1,
h2 {
font-weight: 400;
color: #3b82f6;
margin: 1.5rem 0 1rem;
line-height: 1.2;
}
h1 {
font-size: 2rem;
}
h2 {
font-size: 1.5rem;
margin: 1rem 0 0.5rem;
}
.description {
margin-bottom: 2rem;
line-height: 1.6;
color: #1f2937;
}
.font-semibold {
font-weight: 600;
}
@media (max-width: 768px) {
.modal-container {
border-radius: 16px;
max-height: 95vh;
}
.modal-header {
padding: 0rem 1.5rem 1rem;
}
.title {
font-size: 1.5rem;
}
.icon-container {
width: 64px;
height: 64px;
}
.icon {
width: 32px;
height: 32px;
}
}
.fill[data-v-611f9e03] {
fill: var(--colour-neutral-border);
stroke: var(--colour-neutral-border-intense);
}
.loading[data-v-4be0547e] {
min-height: 80px;
display: flex;
align-content: flex-start;
}
.text[data-v-c0a54125] {
font-size: 9px;
font-weight: 700;
}
.link-container[data-v-c0a54125] {
display: flex;
gap: 1rem;
}
.link-container a[data-v-c0a54125] {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
color: var(--primary-default);
text-decoration: none;
}
section[data-v-c0a54125] {
font-size: 11px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: left;
color: var(--text-icon-secondary);
}
.buttons-container[data-v-38d68ad7] {
display: flex;
flex-direction: row;
gap: 12px;
justify-content: center;
align-items: center;
max-width: 300px;
padding: 0 1rem;
}
.button-text[data-v-38d68ad7] {
font-size: 13px;
font-weight: 600;
}
.addon-version-tag[data-v-46c038cc] {
display: inline-block;
font-family: Inter, sans-serif;
font-size: 0.6875rem;
font-weight: 400;
letter-spacing: 0.02em;
/* Inherit the surrounding text color (dark footer vs. light pages) and dim
it so the tag is present but unobtrusive. */
color: currentColor;
opacity: 0.6;
}
/* Common Dashboard & Component Styles */
/* Title styles */
.title[data-v-eb342a1c] {
font-size: 24px;
font-weight: 500;
color: var(--primary-default);
}
/* Row layouts */
.row[data-v-eb342a1c] {
display: flex;
justify-content: space-between;
}
.row-grid[data-v-eb342a1c] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
}
/* Column layouts */
.left-column[data-v-eb342a1c],
.right-column[data-v-eb342a1c] {
display: flex;
flex-direction: column;
}
.left-column[data-v-eb342a1c] {
gap: 0;
}
.right-column[data-v-eb342a1c] {
gap: 1.5rem;
}
/* Content layouts */
.content-layout[data-v-eb342a1c] {
display: flex;
flex-direction: column;
gap: 32px;
min-width: 18rem;
}
.content[data-v-eb342a1c] {
display: flex;
flex-direction: column;
gap: 1rem;
border: solid 1px #e4e4e7;
border-radius: 6px;
}
/* Container styles */
.container[data-v-eb342a1c] {
display: flex;
flex-direction: column;
align-items: start;
justify-content: center;
gap: 1rem 0;
margin-top: 2rem;
}
/* Typography */
.email[data-v-eb342a1c] {
font-family: Inter;
font-size: 16px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.32;
letter-spacing: normal;
text-align: left;
color: var(--text-icon-secondary);
}
.send-storage[data-v-eb342a1c] {
font-family: Metropolis;
font-size: 20px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
line-height: 1.2;
letter-spacing: normal;
text-align: left;
color: var(--text-icon-secondary);
}
/* Heading styles */
/* h1 {
font-size: 20px;
font-weight: 500;
} */
/* h2 {
font-size: 22px;
} */
/* Status colors */
.expired[data-v-eb342a1c] {
color: var(--colour-ti-critical);
}
.active[data-v-eb342a1c] {
color: var(--colour-send-primary);
}
/* Toggle component */
.toggle[data-v-eb342a1c] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
border-radius: 6px 6px 0 0;
cursor: pointer;
gap: 1rem;
background-color: var(--colour-neutral-border);
}
/* Recovery section */
.recovery-main[data-v-eb342a1c] {
display: flex;
width: 100%;
flex-direction: column;
gap: 0.75rem;
}
.section-title[data-v-eb342a1c] {
font-family: Metropolis;
font-size: 24px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
line-height: 1.2;
letter-spacing: normal;
text-align: left;
color: #1373d9;
}
.title[data-v-eb342a1c] {
font-family: Metropolis;
font-size: 24px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
line-height: 1.2;
letter-spacing: normal;
text-align: left;
color: #1373d9;
}
.card-shadow[data-v-eb342a1c] {
box-shadow: 4px 4px 16px 0 rgba(0, 0, 0, 0.04);
}
/* Responsive design */
@media (max-width: 1024px) {
.content-layout[data-v-eb342a1c] {
display: grid;
grid-template-columns: 1fr;
}
.right-column[data-v-eb342a1c] {
order: -1;
}
.row-grid[data-v-eb342a1c] {
grid-template-columns: 1fr;
}
}
.pro-button[data-v-eb342a1c] {
min-width: 149px;
height: 44px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 8px;
padding: 10px 16px;
border-radius: 8px;
border: none;
cursor: pointer;
font-family: inherit;
font-size: 14px;
font-weight: 500;
color: white;
transition: all 0.2s ease;
}
.pro-button--primary[data-v-eb342a1c] {
box-shadow: 0px 4px 0 rgba(0, 0, 0, 0.12);
background-image: linear-gradient(
to bottom,
#37adf9 -20%,
#1373d9 20%,
#175fb6 80%
);
}
.pro-button--primary[data-v-eb342a1c]:hover {
transform: translateY(1px);
box-shadow: 0px 3px 0 rgba(0, 0, 0, 0.12);
}
.pro-button--primary[data-v-eb342a1c]:active {
transform: translateY(2px);
box-shadow: 0px 2px 0 rgba(0, 0, 0, 0.12);
}
.pro-button--secondary[data-v-eb342a1c] {
min-width: auto;
background: transparent;
box-shadow: none;
color: #175fb6;
font-weight: normal;
line-height: 1.23;
text-shadow: 0.5px 0.5px 0 rgba(255, 255, 255, 0.1);
border-style: solid;
border-width: 1px;
}
.pro-button--secondary[data-v-eb342a1c]:hover {
opacity: 0.85;
}
.pro-button--secondary[data-v-eb342a1c]:active {
opacity: 0.7;
}
.admin-container[data-v-9d479c00] {
width: 100%;
}
.main-title[data-v-9d479c00] {
font-size: 1.5rem;
font-weight: 500;
color: #333;
margin: 0 0 1.5rem 0;
}
.toggle-group[data-v-9d479c00] {
display: flex;
align-items: center;
gap: 1.5rem;
margin-bottom: 1.5rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid #e5e5e5;
}
.toggle[data-v-9d479c00] {
display: flex;
align-items: center;
cursor: pointer;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.toggle-input[data-v-9d479c00] {
opacity: 0;
width: 0;
height: 0;
position: absolute;
}
.toggle-slider[data-v-9d479c00] {
width: 40px;
height: 22px;
background: #cbd5e1;
border-radius: 22px;
position: relative;
transition: background 0.2s;
margin-right: 0.75rem;
}
.toggle-input:checked + .toggle-slider[data-v-9d479c00] {
background: #4285f4;
}
.toggle-slider[data-v-9d479c00]::before {
content: '';
position: absolute;
left: 3px;
top: 3px;
width: 16px;
height: 16px;
background: #fff;
border-radius: 50%;
transition: transform 0.2s;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}
.toggle-input:checked + .toggle-slider[data-v-9d479c00]::before {
transform: translateX(18px);
}
.toggle-label[data-v-9d479c00] {
font-size: 0.9375rem;
color: #333;
font-weight: 500;
}
.service-section[data-v-9d479c00] {
margin-top: 1.5rem;
}
.section-title[data-v-9d479c00] {
font-size: 1.25rem;
font-weight: 500;
color: #333;
margin: 0 0 1rem 0;
}
.info-text[data-v-9d479c00] {
color: #666;
font-size: 0.9375rem;
line-height: 1.6;
margin: 0;
}
.content[data-v-45c3ae9c] {
display: flex;
flex-direction: column;
align-items: start;
justify-content: center;
max-width: 700px;
margin: 0 auto;
width: 100%;
padding: 1rem;
max-width: 52rem;
}
.login-section[data-v-45c3ae9c] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.header-section[data-v-45c3ae9c] {
margin-bottom: 0.5rem;
}
.description[data-v-45c3ae9c] {
color: #333;
font-size: 16px;
line-height: 1.6;
margin: 1rem 0 0 0;
}