/*! normalize.css v2.1.0 | MIT License | git.io/normalize */

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined in IE 8/9.
 */


article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */

audio,
canvas,
video {
    display: inline-block;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address styling not present in IE 8/9.
 */

[hidden] {
    display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-family: sans-serif; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    -ms-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
    margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */

a:focus {
    outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
    outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */

abbr[title] {
    border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */

b,
strong {
    font-weight: bold;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */

dfn {
    font-style: italic;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    height: 0;
}

/**
 * Address styling not present in IE 8/9.
 */

mark {
    background: #ff0;
    color: #000;
}

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */

code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */

pre {
    white-space: pre-wrap;
}

/**
 * Set consistent quote types.
 */

q {
    quotes: "\201C" "\201D" "\2018" "\2019";
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9.
 */

img {
    border: 0;
}

/**
 * Correct overflow displayed oddly in IE 9.
 */

svg:not(:root) {
    overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari 5.
 */

figure {
    margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

legend {
    border: 0; /* 1 */
    padding: 0; /* 2 */
}

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */

button,
input,
select,
textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 2 */
    margin: 0; /* 3 */
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

button,
input {
    line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */

button,
select {
    text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
    cursor: default;
}

/**
 * 1. Address box sizing set to `content-box` in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 */

input[type="checkbox"],
input[type="radio"] {
    -webkit-box-sizing: border-box;
            box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */

textarea {
    overflow: auto; /* 1 */
    vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
    border-collapse: collapse;
    border-spacing: 0;
}
/***
Spectrum Colorpicker v1.4.1
https://github.com/bgrins/spectrum
Author: Brian Grinstead
License: MIT
***/


.sp-container {
    position:absolute;
    top:0;
    left:0;
    display:inline-block;
    *display: inline;
    *zoom: 1;
    /* https://github.com/bgrins/spectrum/issues/40 */
    z-index: 9999994;
    overflow: hidden;
}
.sp-container.sp-flat {
    position: relative;
}

/* Fix for * { box-sizing: border-box; } */
.sp-container,
.sp-container * {
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
}

/* http://ansciath.tumblr.com/post/7347495869/css-aspect-ratio */
.sp-top {
  position:relative;
  width: 100%;
  display:inline-block;
}
.sp-top-inner {
   position:absolute;
   top:0;
   left:0;
   bottom:0;
   right:0;
}
.sp-color {
    position: absolute;
    top:0;
    left:0;
    bottom:0;
    right:20%;
}
.sp-hue {
    position: absolute;
    top:0;
    right:0;
    bottom:0;
    left:84%;
    height: 100%;
}

.sp-clear-enabled .sp-hue {
    top:33px;
    height: 77.5%;
}

.sp-fill {
    padding-top: 80%;
}
.sp-sat, .sp-val {
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
}

.sp-alpha-enabled .sp-top {
    margin-bottom: 18px;
}
.sp-alpha-enabled .sp-alpha {
    display: block;
}
.sp-alpha-handle {
    position:absolute;
    top:-4px;
    bottom: -4px;
    width: 8px;
    margin-left: -3px;
    left: 50%;
    cursor: pointer;
    background: rgba( 255, 255, 255, 0.8 );
    border: 1px solid rgba( 0, 0, 0, 0.8 );
    border-radius: 4px;
}
.sp-alpha {
    display: none;
    position: absolute;
    bottom: -14px;
    right: 0;
    left: 0;
    height: 8px;
}

.sp-clear {
    display: none;
}

.sp-clear.sp-clear-display {
    background-position: center;
}

.sp-clear-enabled .sp-clear {
    display: block;
    position:absolute;
    top:0px;
    right:0;
    bottom:0;
    left:84%;
    height: 28px;
}

/* Don't allow text selection */
.sp-container, .sp-replacer, .sp-preview, .sp-dragger, .sp-slider, .sp-alpha, .sp-clear, .sp-alpha-handle, .sp-container.sp-dragging .sp-input, .sp-container button  {
    -webkit-user-select:none;
    -moz-user-select: -moz-none;
    -o-user-select:none;
    -ms-user-select: none;
        user-select: none;
}

.sp-container.sp-input-disabled .sp-input-container {
    display: none;
}
.sp-container.sp-buttons-disabled .sp-button-container {
    display: none;
}
.sp-container.sp-palette-buttons-disabled .sp-palette-button-container {
    display: none;
}
.sp-palette-only .sp-picker-container {
    display: none;
}
.sp-palette-disabled .sp-palette-container {
    display: none;
}
.sp-selection-palette-disabled .sp-palette-row-selection {
    display: none;
}

.sp-initial-disabled .sp-initial {
    display: none;
}


/* Gradients for hue, saturation and value instead of images.  Not pretty... but it works */
.sp-sat {
    background-image: -webkit-gradient(linear, left top, right top, from(#fff), to(rgba(204, 154, 129, 0)));
    background-image: linear-gradient(to right, #fff, rgba(204, 154, 129, 0));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr=#FFFFFFFF, endColorstr=#00CC9A81)";
    filter : progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr='#FFFFFFFF', endColorstr='#00CC9A81');
}
.sp-val {
    background-image: -webkit-gradient(linear, left bottom, left top, from(#000), to(rgba(204, 154, 129, 0)));
    background-image: linear-gradient(to top, #000, rgba(204, 154, 129, 0));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00CC9A81, endColorstr=#FF000000)";
    filter : progid:DXImageTransform.Microsoft.gradient(startColorstr='#00CC9A81', endColorstr='#FF000000');
}

.sp-hue {
    background: -webkit-gradient( linear, left top, left bottom, from(#ff0000), color-stop(17%, #ffff00), color-stop(33%, #00ff00), color-stop(50%, #00ffff), color-stop(67%, #0000ff), color-stop(83%, #ff00ff), to(#ff0000) );
    background: linear-gradient( to bottom, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100% );
}

/* IE filters do not support multiple color stops.
   Generate 6 divs, line them up, and do two color gradients for each.
   Yes, really.
 */
.sp-1 {
    height:17%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0000', endColorstr='#ffff00');
}
.sp-2 {
    height:16%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff00', endColorstr='#00ff00');
}
.sp-3 {
    height:17%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ff00', endColorstr='#00ffff');
}
.sp-4 {
    height:17%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffff', endColorstr='#0000ff');
}
.sp-5 {
    height:16%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0000ff', endColorstr='#ff00ff');
}
.sp-6 {
    height:17%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff00ff', endColorstr='#ff0000');
}

.sp-hidden {
    display: none !important;
}

/* Clearfix hack */
.sp-cf:before, .sp-cf:after { content: ""; display: table; }
.sp-cf:after { clear: both; }
.sp-cf { *zoom: 1; }

/* Mobile devices, make hue slider bigger so it is easier to slide */
@media (max-device-width: 480px) {
    .sp-color { right: 40%; }
    .sp-hue { left: 63%; }
    .sp-fill { padding-top: 60%; }
}
.sp-dragger {
   border-radius: 14px;
   height: 14px;
   width: 14px;
   margin: 4px 0 0 4px;
   border: 1px solid rgba( 0, 0, 0, 0.8 );
   background: rgba( 255, 255, 255, 0.3 );
   cursor: pointer;
   position:absolute;
   top:0;
   left: 0;
}
.sp-slider {
    position: absolute;
    top:0;
    cursor:pointer;
    height: 6px;
    left: -3px;
    right: -3px;
    margin-top: 2px;
    background: rgba( 255, 255, 255, 0.8 );
    border: 1px solid rgba( 0, 0, 0, 0.8 );
    border-radius: 4px;
}

/*
Theme authors:
Here are the basic themeable display options (colors, fonts, global widths).
See http://bgrins.github.io/spectrum/themes/ for instructions.
*/

.sp-container {
    border-radius: 0;
    background-color: #ECECEC;
    border: solid 1px #f0c49B;
    padding: 0;
}
.sp-container, .sp-container button, .sp-container input, .sp-color, .sp-hue, .sp-clear {
    font: normal 12px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.sp-top {
    margin-bottom: 3px;
}
.sp-clear {
    border: solid 1px rgba( 0, 0, 0, 0.2 );
}

/* Input */
.sp-input-container {
    float:right;
    width: 100px;
    margin-bottom: 4px;
}
.sp-initial-disabled  .sp-input-container {
    width: 100%;
}
.sp-input {
   font-size: 12px !important;
   padding: 4px;
   margin: 0;
   width: 100%;
   background: #fff;
   border: 1px solid #ccc;
   color: #222;
}
.sp-input:focus  {
    border: 1px solid #1baee1;
    outline: 0;
}
.sp-input.sp-validation-error {
    border: 1px solid red;
    background: #fdd;
}
.sp-picker-container , .sp-palette-container {
    float:left;
    position: relative;
    padding: 10px;
    padding-bottom: 300px;
    margin-bottom: -290px;
}
.sp-picker-container {
    width: 172px;
    border-left: solid 1px #fff;
}

/* Palettes */
.sp-palette-container {
    border-right: solid 1px #ccc;
}

.sp-palette-only .sp-palette-container {
    border: 0;
}

.sp-palette .sp-thumb-el {
    display: block;
    position:relative;
    float:left;
    width: 24px;
    height: 15px;
    margin: 3px;
    cursor: pointer;
    border: solid 2px #ccc;
}
.sp-palette .sp-thumb-el:hover, .sp-palette .sp-thumb-el.sp-thumb-active {
    border-color: #888;
}
.sp-thumb-el {
    position:relative;
}

/* Initial */
.sp-initial {
    float: left;
}
.sp-initial span {
    width: 30px;
    height: 25px;
    border:none;
    display:block;
    float:left;
    margin:0;
}

.sp-initial .sp-clear-display {
    background-position: center;
}

/* Buttons */
.sp-palette-button-container,
.sp-button-container {
    float: right;
}

/* Replacer (the little preview div that shows up instead of the <input>) */
.sp-replacer {
    margin:0;
    overflow:hidden;
    cursor:pointer;
    padding: 4px;
    display:inline-block;
    *zoom: 1;
    *display: inline;
    border: solid 1px #91765d;
    background: #eee;
    color: #333;
    vertical-align: middle;
}
.sp-replacer:hover, .sp-replacer.sp-active {
    border-color: #F0C49B;
    color: #111;
}
.sp-replacer.sp-disabled {
    cursor:default;
    border-color: silver;
    color: silver;
}
.sp-dd {
    padding: 2px 0;
    height: 16px;
    line-height: 16px;
    float:left;
    font-size:10px;
}
.sp-preview {
    position:relative;
    width:25px;
    height: 20px;
    border: solid 1px #222;
    margin-right: 5px;
    float:left;
    z-index: 0;
}

.sp-palette {
    *width: 220px;
    max-width: 220px;
}
.sp-palette .sp-thumb-el {
    width:16px;
    height: 16px;
    margin:2px 1px;
    border: solid 1px #d0d0d0;
}

.sp-container {
    padding-bottom:0;
}


/* Buttons: http://hellohappy.org/css3-buttons/ */
.sp-container button {
  background-color: #eeeeee;
  border: 1px solid #ccc;
  outline: 0;
  border-radius: 2px;
  color: #333;
  font-size: 14px;
  line-height: 1;
  padding: 5px 7px;
  text-align: center;
  vertical-align: middle;
}
.sp-container button:hover {
    border: 1px solid #888;
    cursor: pointer;
}
.sp-container button:active {
    border: 1px solid #333;
}
.sp-cancel {
    font-size: 11px;
    color: #d93f3f !important;
    margin:0;
    padding:2px;
    margin-right: 5px;
    vertical-align: middle;
    text-decoration:none;

}
.sp-cancel:hover {
    color: #d93f3f !important;
    text-decoration: underline;
}

.sp-container button {
    background: transparent;
    font-size: 12px;
    margin-top: 10px;
}

.sp-container button + button {
    margin-left: 6px;
}


.sp-palette span:hover, .sp-palette span.sp-thumb-active {
    border-color: #000;
}

.sp-preview, .sp-alpha, .sp-thumb-el {
    position:relative;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==);
}
.sp-preview-inner, .sp-alpha-inner, .sp-thumb-inner {
    display:block;
    position:absolute;
    top:0;left:0;bottom:0;right:0;
}

.sp-palette .sp-thumb-inner {
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.sp-palette .sp-thumb-light.sp-thumb-active .sp-thumb-inner {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIVJREFUeNpiYBhsgJFMffxAXABlN5JruT4Q3wfi/0DsT64h8UD8HmpIPCWG/KemIfOJCUB+Aoacx6EGBZyHBqI+WsDCwuQ9mhxeg2A210Ntfo8klk9sOMijaURm7yc1UP2RNCMbKE9ODK1HM6iegYLkfx8pligC9lCD7KmRof0ZhjQACDAAceovrtpVBRkAAAAASUVORK5CYII=);
}

.sp-palette .sp-thumb-dark.sp-thumb-active .sp-thumb-inner {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAMdJREFUOE+tkgsNwzAMRMugEAahEAahEAZhEAqlEAZhEAohEAYh81X2dIm8fKpEspLGvudPOsUYpxE2BIJCroJmEW9qJ+MKaBFhEMNabSy9oIcIPwrB+afvAUFoK4H0tMaQ3XtlrggDhOVVMuT4E5MMG0FBbCEYzjYT7OxLEvIHQLY2zWwQ3D+9luyOQTfKDiFD3iUIfPk8VqrKjgAiSfGFPecrg6HN6m/iBcwiDAo7WiBeawa+Kwh7tZoSCGLMqwlSAzVDhoK+6vH4G0P5wdkAAAAASUVORK5CYII=);
}

.sp-clear-display {
    background-repeat:no-repeat;
    background-position: center;
    background-image: url(data:image/gif;base64,R0lGODlhFAAUAPcAAAAAAJmZmZ2dnZ6enqKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq/Hx8fLy8vT09PX19ff39/j4+Pn5+fr6+vv7+wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAP8ALAAAAAAUABQAAAihAP9FoPCvoMGDBy08+EdhQAIJCCMybCDAAYUEARBAlFiQQoMABQhKUJBxY0SPICEYHBnggEmDKAuoPMjS5cGYMxHW3IiT478JJA8M/CjTZ0GgLRekNGpwAsYABHIypcAgQMsITDtWJYBR6NSqMico9cqR6tKfY7GeBCuVwlipDNmefAtTrkSzB1RaIAoXodsABiZAEFB06gIBWC1mLVgBa0AAOw==);
}
/*
 * Ladda
 * http://lab.hakim.se/ladda
 * MIT licensed
 *
 * Copyright (C) 2013 Hakim El Hattab, http://hakim.se
 */
.ladda-button{position:relative}.ladda-button .ladda-spinner{position:absolute;z-index:2;display:inline-block;width:32px;height:32px;top:50%;margin-top:-16px;opacity:0;pointer-events:none}.ladda-button .ladda-label{position:relative;z-index:3}.ladda-button .ladda-progress{position:absolute;width:0;height:100%;left:0;top:0;background:rgba(0,0,0,0.2);visibility:hidden;opacity:0;-webkit-transition:0.1s linear all !important;transition:0.1s linear all !important}.ladda-button[data-loading] .ladda-progress{opacity:1;visibility:visible}.ladda-button,.ladda-button .ladda-spinner,.ladda-button .ladda-label{-webkit-transition:0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;transition:0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important}.ladda-button[data-style=zoom-in],.ladda-button[data-style=zoom-in] .ladda-spinner,.ladda-button[data-style=zoom-in] .ladda-label,.ladda-button[data-style=zoom-out],.ladda-button[data-style=zoom-out] .ladda-spinner,.ladda-button[data-style=zoom-out] .ladda-label{-webkit-transition:0.3s ease all !important;transition:0.3s ease all !important}.ladda-button[data-style=expand-right] .ladda-spinner{right:14px}.ladda-button[data-style=expand-right][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-right][data-size="xs"] .ladda-spinner{right:4px}.ladda-button[data-style=expand-right][data-loading]{padding-right:56px}.ladda-button[data-style=expand-right][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=expand-right][data-loading][data-size="s"],.ladda-button[data-style=expand-right][data-loading][data-size="xs"]{padding-right:40px}.ladda-button[data-style=expand-left] .ladda-spinner{left:14px}.ladda-button[data-style=expand-left][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-left][data-size="xs"] .ladda-spinner{left:4px}.ladda-button[data-style=expand-left][data-loading]{padding-left:56px}.ladda-button[data-style=expand-left][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=expand-left][data-loading][data-size="s"],.ladda-button[data-style=expand-left][data-loading][data-size="xs"]{padding-left:40px}.ladda-button[data-style=expand-up]{overflow:hidden}.ladda-button[data-style=expand-up] .ladda-spinner{top:-32px;left:50%;margin-left:-16px}.ladda-button[data-style=expand-up][data-loading]{padding-top:54px}.ladda-button[data-style=expand-up][data-loading] .ladda-spinner{opacity:1;top:14px;margin-top:0}.ladda-button[data-style=expand-up][data-loading][data-size="s"],.ladda-button[data-style=expand-up][data-loading][data-size="xs"]{padding-top:32px}.ladda-button[data-style=expand-up][data-loading][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-up][data-loading][data-size="xs"] .ladda-spinner{top:4px}.ladda-button[data-style=expand-down]{overflow:hidden}.ladda-button[data-style=expand-down] .ladda-spinner{top:62px;left:50%;margin-left:-16px}.ladda-button[data-style=expand-down][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-down][data-size="xs"] .ladda-spinner{top:40px}.ladda-button[data-style=expand-down][data-loading]{padding-bottom:54px}.ladda-button[data-style=expand-down][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=expand-down][data-loading][data-size="s"],.ladda-button[data-style=expand-down][data-loading][data-size="xs"]{padding-bottom:32px}.ladda-button[data-style=slide-left]{overflow:hidden}.ladda-button[data-style=slide-left] .ladda-label{position:relative}.ladda-button[data-style=slide-left] .ladda-spinner{left:100%;margin-left:-16px}.ladda-button[data-style=slide-left][data-loading] .ladda-label{opacity:0;left:-100%}.ladda-button[data-style=slide-left][data-loading] .ladda-spinner{opacity:1;left:50%}.ladda-button[data-style=slide-right]{overflow:hidden}.ladda-button[data-style=slide-right] .ladda-label{position:relative}.ladda-button[data-style=slide-right] .ladda-spinner{right:100%;margin-left:-16px}.ladda-button[data-style=slide-right][data-loading] .ladda-label{opacity:0;left:100%}.ladda-button[data-style=slide-right][data-loading] .ladda-spinner{opacity:1;left:50%}.ladda-button[data-style=slide-up]{overflow:hidden}.ladda-button[data-style=slide-up] .ladda-label{position:relative}.ladda-button[data-style=slide-up] .ladda-spinner{left:50%;margin-left:-16px;margin-top:1em}.ladda-button[data-style=slide-up][data-loading] .ladda-label{opacity:0;top:-1em}.ladda-button[data-style=slide-up][data-loading] .ladda-spinner{opacity:1;margin-top:-16px}.ladda-button[data-style=slide-down]{overflow:hidden}.ladda-button[data-style=slide-down] .ladda-label{position:relative}.ladda-button[data-style=slide-down] .ladda-spinner{left:50%;margin-left:-16px;margin-top:-2em}.ladda-button[data-style=slide-down][data-loading] .ladda-label{opacity:0;top:1em}.ladda-button[data-style=slide-down][data-loading] .ladda-spinner{opacity:1;margin-top:-16px}.ladda-button[data-style=zoom-out]{overflow:hidden}.ladda-button[data-style=zoom-out] .ladda-spinner{left:50%;margin-left:-16px;-webkit-transform:scale(2.5);transform:scale(2.5)}.ladda-button[data-style=zoom-out] .ladda-label{position:relative;display:inline-block}.ladda-button[data-style=zoom-out][data-loading] .ladda-label{opacity:0;-webkit-transform:scale(0.5);transform:scale(0.5)}.ladda-button[data-style=zoom-out][data-loading] .ladda-spinner{opacity:1;-webkit-transform:none;transform:none}.ladda-button[data-style=zoom-in]{overflow:hidden}.ladda-button[data-style=zoom-in] .ladda-spinner{left:50%;margin-left:-16px;-webkit-transform:scale(0.2);transform:scale(0.2)}.ladda-button[data-style=zoom-in] .ladda-label{position:relative;display:inline-block}.ladda-button[data-style=zoom-in][data-loading] .ladda-label{opacity:0;-webkit-transform:scale(2.2);transform:scale(2.2)}.ladda-button[data-style=zoom-in][data-loading] .ladda-spinner{opacity:1;-webkit-transform:none;transform:none}.ladda-button[data-style=contract]{overflow:hidden;width:100px}.ladda-button[data-style=contract] .ladda-spinner{left:50%;margin-left:-16px}.ladda-button[data-style=contract][data-loading]{border-radius:50%;width:52px}.ladda-button[data-style=contract][data-loading] .ladda-label{opacity:0}.ladda-button[data-style=contract][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=contract-overlay]{overflow:hidden;width:100px;-webkit-box-shadow:0px 0px 0px 3000px rgba(0,0,0,0);box-shadow:0px 0px 0px 3000px rgba(0,0,0,0)}.ladda-button[data-style=contract-overlay] .ladda-spinner{left:50%;margin-left:-16px}.ladda-button[data-style=contract-overlay][data-loading]{border-radius:50%;width:52px;-webkit-box-shadow:0px 0px 0px 3000px rgba(0,0,0,0.8);box-shadow:0px 0px 0px 3000px rgba(0,0,0,0.8)}.ladda-button[data-style=contract-overlay][data-loading] .ladda-label{opacity:0}.ladda-button[data-style=contract-overlay][data-loading] .ladda-spinner{opacity:1}


 .ladda-button[data-style=zoom-in],
 .ladda-button[data-style=zoom-in] .ladda-spinner,
 .ladda-button[data-style=zoom-in] .ladda-label,
 .ladda-button[data-style=zoom-out],
 .ladda-button[data-style=zoom-out] .ladda-spinner,
 .ladda-button[data-style=zoom-out] .ladda-label,
 .ladda-button[data-style=expand-right],
 .ladda-button[data-style=expand-right] .ladda-spinner,
 .ladda-button[data-style=expand-right] .ladda-label {
  -webkit-transition: 0.3s opacity ease,
              0.3s visibility ease,
              0.3s padding-right ease,
              0.3s -webkit-transform ease !important;
  transition: 0.3s opacity ease,
              0.3s visibility ease,
              0.3s padding-right ease,
              0.3s -webkit-transform ease !important;
  transition: 0.3s opacity ease,
              0.3s visibility ease,
              0.3s transform ease,
              0.3s padding-right ease !important;
  transition: 0.3s opacity ease,
              0.3s visibility ease,
              0.3s transform ease,
              0.3s padding-right ease,
              0.3s -webkit-transform ease !important;
 }
/**
 * Theme entry point.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
/**
 * Primitive color scales.
 *
 * Gray and accent ramps are the shared foundation for both
 * light and dark mode. Semantic tokens should map to these
 * values instead of introducing new neutral or accent colors.
 */
/**
 * Documentation page tokens.
 */
:root {
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html {
  color-scheme: light; }

html.dark-theme {
  color-scheme: dark;
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html.light-theme {
  color-scheme: light;
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.dark-theme:not(html) {
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.light-theme:not(html) {
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.inverse-theme:not(html) {
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html.dark-theme .inverse-theme,
.dark-theme:not(html) .inverse-theme {
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.light-theme:not(html) .inverse-theme {
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html.docs {
  --docs-gap: var(--space-6);
  --docs-gap-lg: var(--space-8);
  --docs-padding: var(--space-6);
  --docs-outdent: calc(var(--docs-padding) * -1);
  --docs-radius: calc(var(--radius-6) + var(--radius-2));
  --docs-radius-lg: calc(var(--radius-6) + var(--space-5));
  --docs-radius-inner: calc(var(--docs-radius-lg) - 6px);
  --docs-radius-inner-2: calc(var(--docs-radius-lg) - 12px);
  --docs-radius-card-inner: calc(var(--docs-radius) - 6px);
  --docs-text: var(--color-text);
  --docs-text-muted: var(--color-text-muted);
  --docs-text-subtle: var(--color-text-subtle);
  --docs-heading-muted: var(--color-text-subtle);
  --docs-border: var(--border-strong);
  --docs-border-soft: var(--border-default);
  --docs-border-strong: var(--border-stronger);
  --docs-inline-bg: var(--surface-hover);
  --docs-table-header-bg: var(--surface-panel);
  --docs-code-bg: var(--surface-code);
  --docs-code-border: var(--border-code);
  --docs-code-text: var(--color-text-code);
  --docs-code-label: var(--color-text-code-muted);
  --docs-surface: var(--surface-panel);
  --docs-surface-subtle: var(--surface-canvas);
  --docs-tag-bg: var(--surface-panel-alt);
  --docs-tag-fg: var(--color-text-secondary);
  --docs-method-get-bg: var(--status-success-surface);
  --docs-method-get-fg: var(--status-success-text);
  --docs-method-post-bg: var(--status-info-surface);
  --docs-method-post-fg: var(--status-info-text);
  --docs-method-mcp-bg: var(--status-warning-surface);
  --docs-method-mcp-fg: var(--status-warning-text); }
/**
 * Mode-agnostic design tokens.
 */
:root {
  --font-size-edit-ui: 12px;
  --radius-1: 2px;
  --radius-2: 4px;
  --radius-3: 6px;
  --radius-4: 8px;
  --radius-5: 12px;
  --radius-6: 16px;
  --radius-full: 9999px;
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 8px;
  --space-5: 12px;
  --space-6: 16px;
  --space-7: 24px;
  --space-8: 32px;
  --space-9: 40px;
  --minus-space-1: -2px;
  --minus-space-2: -4px;
  --minus-space-3: -6px;
  --minus-space-4: -8px;
  --minus-space-5: -12px;
  --minus-space-6: -16px;
  --minus-space-7: -24px;
  --minus-space-8: -32px;
  --minus-space-9: -40px;
  --button-size-1: 20px;
  --button-size-2: 24px;
  --button-size-3: 28px;
  --button-size-4: 32px;
  --button-size-5: 36px;
  --button-size-6: 40px;
  --button-size-7: 48px;
  --button-size-8: 56px;
  --button-size-9: 64px;
  --button-radius: var(--radius-4);
  --nav-link-radius: var(--radius-4);
  --section-padding: var(--space-9);
  --section-margin: var(--space-9);
  --section-radius: var(--radius-4);
  --popover-radius: var(--radius-4);
  --popup-radius: var(--radius-5);
  --popup-inner-radius: var(--radius-4);
  --drawer-item-size: 46px;
  --drawer-menu-width: var( --drawer-item-size );
  --drawer-tool-width: 300px;
  --page-inset-right: var( --drawer-menu-width );
  --page-padding: var(--space-6);
  --site-max-width: 1440px;
  --app-max-width: 1920px;
  --page-max-width: var(--site-max-width);
  --header-height: 70px;
  --header-padding: var(--space-4);
  --tray-height: 49px;
  --tray-padding: 10px;
  --app-nav-width: 340px;
  --app-nav-padding: var(--page-padding);
  --app-nav-item-padding: var(--space-5);
  --app-nav-radius: var(--button-radius);
  --form-field-padding: var(--space-5);
  --form-field-radius: var(--radius-4);
  --form-field-height: var(--button-size-6);
  --checkbox-radius: var(--radius-2);
  --card-radius: var(--radius-4); }
@-webkit-keyframes wobble {
  0% {
    -webkit-transform: none;
            transform: none; }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@keyframes wobble {
  0% {
    -webkit-transform: none;
            transform: none; }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@-webkit-keyframes bounce-in {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3); }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1); }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
            transform: scale3d(0.9, 0.9, 0.9); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03); }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
            transform: scale3d(0.97, 0.97, 0.97); }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1); } }
@keyframes bounce-in {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3); }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1); }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
            transform: scale3d(0.9, 0.9, 0.9); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03); }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
            transform: scale3d(0.97, 0.97, 0.97); }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1); } }
@-webkit-keyframes scale-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0); }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1); } }
@keyframes scale-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0); }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1); } }
@-webkit-keyframes scale-in-medium {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
            transform: scale(0.5); }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1); } }
@keyframes scale-in-medium {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
            transform: scale(0.5); }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1); } }
@-webkit-keyframes spin-rectangle-to-circle {
  50% {
    border-radius: 50%;
    -webkit-transform: scale(0.5) rotate(360deg);
            transform: scale(0.5) rotate(360deg); }
  100% {
    -webkit-transform: scale(1) rotate(720deg);
            transform: scale(1) rotate(720deg); } }
@keyframes spin-rectangle-to-circle {
  50% {
    border-radius: 50%;
    -webkit-transform: scale(0.5) rotate(360deg);
            transform: scale(0.5) rotate(360deg); }
  100% {
    -webkit-transform: scale(1) rotate(720deg);
            transform: scale(1) rotate(720deg); } }
@-webkit-keyframes float-light {
  0% {
    -webkit-transform: translate(0, 0px);
            transform: translate(0, 0px); }
  65% {
    -webkit-transform: translate(0, -4px);
            transform: translate(0, -4px); }
  100% {
    -webkit-transform: translate(0, 0px);
            transform: translate(0, 0px); } }
@keyframes float-light {
  0% {
    -webkit-transform: translate(0, 0px);
            transform: translate(0, 0px); }
  65% {
    -webkit-transform: translate(0, -4px);
            transform: translate(0, -4px); }
  100% {
    -webkit-transform: translate(0, 0px);
            transform: translate(0, 0px); } }
@-webkit-keyframes flash-opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes flash-opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes pulse-opacity {
  0% {
    opacity: 0; }
  25% {
    opacity: 1; }
  50% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@keyframes pulse-opacity {
  0% {
    opacity: 0; }
  25% {
    opacity: 1; }
  50% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@-webkit-keyframes pulse-semi-opacity {
  0% {
    opacity: 0.1; }
  25% {
    opacity: 1; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0.1; } }
@keyframes pulse-semi-opacity {
  0% {
    opacity: 0.1; }
  25% {
    opacity: 1; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0.1; } }
@-webkit-keyframes small-bounce {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
@keyframes small-bounce {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
@-webkit-keyframes medium-bounce {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(1.25);
            transform: scale(1.25); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
@keyframes medium-bounce {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(1.25);
            transform: scale(1.25); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
@-webkit-keyframes slide-down-100 {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@keyframes slide-down-100 {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@-webkit-keyframes header-intro {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px); }
  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none; } }
@keyframes header-intro {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px); }
  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none; } }
@-webkit-keyframes slide-up-100 {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@keyframes slide-up-100 {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@-webkit-keyframes slide-and-scale-up {
  0% {
    -webkit-transform: scale(0.5) translateY(100%);
            transform: scale(0.5) translateY(100%); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@keyframes slide-and-scale-up {
  0% {
    -webkit-transform: scale(0.5) translateY(100%);
            transform: scale(0.5) translateY(100%); }
  100% {
    -webkit-transform: none;
            transform: none; } }
@-webkit-keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-webkit-keyframes fade-to-25 {
  0% {
    opacity: 1; }
  100% {
    opacity: 0.25; } }
@keyframes fade-to-25 {
  0% {
    opacity: 1; }
  100% {
    opacity: 0.25; } }
@-webkit-keyframes tag-intro {
  0% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    opacity: 0; }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1; } }
@keyframes tag-intro {
  0% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    opacity: 0; }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1; } }
@-webkit-keyframes tag-pulse {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(0.93);
            transform: scale(0.93); }
  50% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
@keyframes tag-pulse {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(0.93);
            transform: scale(0.93); }
  50% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
.CodeMirror {
  height: 100% !important;
  font-size: 14px;
  line-height: 1.2; }

.cm-s-seti .CodeMirror-selected {
  background: rgba(255, 255, 255, 0.1); }
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-ai-completion-button.button {
  position: absolute;
  bottom: 6px;
  right: 6px;
  background: linear-gradient(135deg, #226ede 0%, #7b00ff 100%);
  color: #fff;
  opacity: 0.8; }
  .sl-ai-completion-button.button:hover, .sl-ai-completion-button.button:active, .sl-ai-completion-button.button[disabled], .sl-ai-completion-button.button[disabled]:hover {
    color: #fff;
    background: linear-gradient(135deg, #226ede 0%, #7b00ff 100%);
    opacity: 1; }
  .sl-ai-completion-button.button.hidden {
    opacity: 0;
    visibility: hidden; }
  .sl-ai-completion-button.button.small {
    font-size: 1em;
    padding: 4px 6px; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
button.sl-ai-usage-meter {
  width: 2em;
  height: 2em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #000;
  font-size: 14px;
  border-radius: var(--radius-2); }
  button.sl-ai-usage-meter svg {
    width: 1.15em;
    height: 1.15em;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  button.sl-ai-usage-meter:hover, button.sl-ai-usage-meter:active, button.sl-ai-usage-meter[disabled], button.sl-ai-usage-meter[disabled]:hover {
    color: #fff;
    background: linear-gradient(135deg, #226ede 0%, #7b00ff 100%); }
    button.sl-ai-usage-meter:hover svg, button.sl-ai-usage-meter:active svg, button.sl-ai-usage-meter[disabled] svg, button.sl-ai-usage-meter[disabled]:hover svg {
      color: #fff; }
  button.sl-ai-usage-meter.out-of-requests {
    color: #d4cf16; }
/**
 * Annotation mode used for freehand drawing in different contexts.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-annotator-canvas-wrapper {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 8;
  cursor: url(//staging.slides.com/assets/cursors/pen-28720961e7eb4859ad77c5e77d853057954691a18ed7a870099b37cc4ced9bd4.svg) 0 21, auto; }

.sl-annotator-canvas {
  position: absolute;
  top: 0;
  left: 0;
  overflow: visible !important;
  -webkit-transform-origin: top left;
          transform-origin: top left;
  pointer-events: none; }

.sl-annotator-drawing {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  pointer-events: none;
  overflow: visible !important; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.app-nav {
  --app-nav-section-padding-y: var(--space-4);
  --app-nav-section-inset: var(--space-6);
  position: sticky;
  top: 0px;
  overflow: hidden;
  width: var(--app-nav-width);
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding: var(--app-nav-padding);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-size: calc(var(--font-size-edit-ui) + 1px);
  color: var(--color-nav-link); }

.app-nav:after {
  content: '';
  display: block;
  position: absolute;
  width: 1px;
  background: var(--border-section);
  top: 0;
  bottom: 0;
  right: 0; }

.app-nav-header {
  padding-bottom: var(--app-nav-padding);
  border-bottom: 1px solid var(--border-section); }

.app-nav-section {
  position: relative;
  padding: var(--app-nav-section-padding-y) 0;
  font-weight: 500; }

.app-nav-section:first-child {
  padding-top: 0; }

.app-nav-section.hidden {
  display: none; }

.app-nav-section + .app-nav-section:before {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 1px;
  background: var(--border-section);
  top: 0; }

.app-nav-section + .app-nav-section {
  margin-top: -1px; }

.app-nav-section[data-tab-id="team"],
.app-nav-section[data-tab-id="personal"] {
  overflow: auto;
  margin: 0 calc( var(--app-nav-section-inset) * -1 );
  padding-top: var(--app-nav-padding);
  padding-left: var(--app-nav-section-inset);
  padding-right: var(--app-nav-section-inset); }
  .app-nav-section[data-tab-id="team"]:before,
  .app-nav-section[data-tab-id="personal"]:before {
    width: calc(100% - ( var(--app-nav-section-inset) * 2 )); }

.app-nav-toggle {
  margin-left: calc( var(--app-nav-item-padding) * -0.75 );
  margin-right: calc( var(--app-nav-item-padding) * -0.75 ); }

.app-nav-divider {
  width: 100%;
  height: 1px;
  background: var(--border-section);
  margin: var(--app-nav-padding) 0; }

.app-nav-divider.flush-bottom {
  margin-bottom: 0; }

.app-nav-item,
.app-nav-toggle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  padding: calc( var(--app-nav-item-padding) / 2 );
  width: 100%;
  line-height: 1.4;
  color: var(--color-nav-link);
  border-radius: var(--app-nav-radius);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-align: left;
  vertical-align: top;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
  font-weight: inherit;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .app-nav-item .label,
  .app-nav-toggle .label {
    padding: calc( var(--app-nav-item-padding) / 2 ); }

.app-nav-item:focus {
  outline: 1px solid var(--color-accent); }

.app-nav-item:hover {
  color: var(--color-nav-link-hover);
  background: var(--surface-nav-link-hover); }

.app-nav-tab,
.app-nav-link {
  cursor: pointer; }

.app-nav-item.selected {
  color: var(--color-nav-link-selected);
  background-color: var(--surface-nav-link-selected); }

.app-nav-item > .icon {
  font-size: 1.25em;
  margin: 0 calc( var(--app-nav-item-padding) / 2 ) 0 auto; }

.app-nav-search {
  padding: 0 calc( var(--app-nav-item-padding) / 2 ) 0 0; }

.app-nav-search:focus-within {
  outline: 1px solid var(--color-accent); }

.app-nav-search-input {
  width: 100%;
  border: 0;
  outline: 0;
  padding: var(--app-nav-item-padding);
  background: transparent;
  color: var(--color-text); }

.app-nav-search-input::-webkit-input-placeholder {
  color: var(--color-text-muted); }

.app-nav-search-input::-moz-placeholder {
  color: var(--color-text-muted); }

.app-nav-search-input:-ms-input-placeholder {
  color: var(--color-text-muted); }

.app-nav-search-input::-ms-input-placeholder {
  color: var(--color-text-muted); }

.app-nav-search-input::placeholder {
  color: var(--color-text-muted); }

.app-nav-search .icon {
  color: var(--color-text-muted); }

.app-nav-toggle {
  display: none; }

.app-nav-toggle .icon {
  margin-left: var(--space-5); }

.app-nav:not(.open) .app-nav-toggle .label-opened,
.app-nav:not(.open) .app-nav-toggle .icon-opened {
  display: none; }

.app-nav.open .app-nav-toggle .label-closed,
.app-nav.open .app-nav-toggle .icon-closed {
  display: none; }

@media screen and (max-width: 940px) {
  .app-nav-toggle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }

  .app-nav {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-bottom: calc( var(--app-nav-padding) / 2 ); }

  .app-nav-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: calc( var(--app-nav-item-padding) * -1 ) !important;
    margin-right: calc( var(--app-nav-item-padding) * -1 ) !important; }

  .app-nav:not(.open) {
    height: auto; }

  .app-nav:not(.open) .app-nav-section,
  .app-nav:not(.open) .global-footer {
    display: none; }

  .app-nav.open {
    position: relative;
    max-height: none;
    overflow: visible; }

  .app-nav.open + .content-wrapper {
    display: none; } }
/**
 * Autocomplete dropdown for form inputs.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-autocomplete {
  position: fixed;
  max-height: 200px;
  z-index: 402;
  border-radius: var(--popover-radius);
  background-color: #fff;
  overflow: auto;
  -webkit-box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
          box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2); }

.sl-autocomplete.light-grey {
  background-color: #f5f5f5; }

.sl-autocomplete-item {
  padding: 8px 10px;
  font-size: 13px;
  color: #252525;
  margin: 0;
  cursor: pointer; }
  .sl-autocomplete-item .label,
  .sl-autocomplete-item .description {
    opacity: 0.7; }
  .sl-autocomplete-item .value {
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 2px 0; }
  .sl-autocomplete-item .label + .value,
  .sl-autocomplete-item .value + .description {
    margin-top: 2px; }
  .sl-autocomplete-item:first-child {
    border-top-left-radius: var(--popover-radius);
    border-top-right-radius: var(--popover-radius); }
  .sl-autocomplete-item:last-child {
    border-bottom-left-radius: var(--popover-radius);
    border-bottom-right-radius: var(--popover-radius); }

.sl-autocomplete-item:hover {
  background-color: #d3e2f9; }

.sl-autocomplete-item.focus {
  background-color: #226ede;
  color: #fff; }

.sl-autocomplete-fonts {
  max-height: 300px; }

.sl-autocomplete-fonts .value {
  font-size: 16px; }

.sl-autocomplete-fonts .description {
  font-size: 11px; }
/**
 * Inline badges / status pills (semantic variants, theme-aware).
 * Use with: <span class="sl-badge sl-badge-success">Label</span>
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-badge {
  --badge-size: var(--button-size-3);
  --badge-bg: var(--surface-tint-1);
  --badge-fg: var(--color-text-secondary);
  --badge-border: transparent;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--space-2);
  max-width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0 var(--space-5);
  height: var(--badge-size);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.3;
  text-transform: none;
  color: var(--badge-fg);
  background-color: var(--badge-bg);
  border: 1px solid var(--badge-border);
  border-radius: var(--radius-full);
  white-space: nowrap;
  vertical-align: middle;
  -ms-flex-negative: 0;
      flex-shrink: 0; }
  .sl-badge .icon {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    font-size: 1em;
    line-height: 1;
    opacity: 0.92; }

.sl-badge.sl-badge-s {
  --badge-size: var(--button-size-1);
  font-size: 0.75rem;
  font-weight: 600;
  gap: var(--space-1); }

.sl-badge.sl-badge-neutral {
  --badge-bg: var(--surface-tint-1);
  --badge-fg: var(--color-text-secondary);
  --badge-border: transparent; }

.sl-badge.sl-badge-outline {
  --badge-bg: transparent;
  --badge-fg: var(--color-text-secondary);
  --badge-border: var(--border-default); }

.sl-badge.sl-badge-outline.sl-badge-neutral {
  --badge-bg: transparent;
  --badge-fg: var(--color-text-secondary);
  --badge-border: var(--border-default); }

.sl-badge.sl-badge-outline.sl-badge-success {
  --badge-bg: transparent;
  --badge-fg: var(--status-success-text);
  --badge-border: color-mix(in srgb, var(--status-success-text) 42%, var(--border-default)); }

.sl-badge.sl-badge-outline.sl-badge-info {
  --badge-bg: transparent;
  --badge-fg: var(--status-info-text);
  --badge-border: color-mix(in srgb, var(--status-info-text) 42%, var(--border-default)); }

.sl-badge.sl-badge-outline.sl-badge-warning {
  --badge-bg: transparent;
  --badge-fg: var(--status-warning-text);
  --badge-border: color-mix(in srgb, var(--status-warning-text) 42%, var(--border-default)); }

.sl-badge.sl-badge-outline.sl-badge-danger {
  --badge-bg: transparent;
  --badge-fg: var(--color-danger);
  --badge-border: color-mix(in srgb, var(--color-danger) 42%, var(--border-default)); }

.sl-badge.sl-badge-outline.sl-badge-accent {
  --badge-bg: transparent;
  --badge-fg: var(--color-accent);
  --badge-border: color-mix(in srgb, var(--color-accent) 45%, var(--border-default)); }

.sl-badge.sl-badge-success {
  --badge-bg: var(--status-success-surface);
  --badge-fg: var(--status-success-text);
  --badge-border: transparent; }

.sl-badge.sl-badge-info {
  --badge-bg: var(--status-info-surface);
  --badge-fg: var(--status-info-text);
  --badge-border: transparent; }

.sl-badge.sl-badge-warning {
  --badge-bg: var(--status-warning-surface);
  --badge-fg: var(--status-warning-text);
  --badge-border: transparent; }

.sl-badge.sl-badge-danger {
  --badge-bg: color-mix(in srgb, var(--color-danger) 16%, var(--surface-canvas));
  --badge-fg: var(--color-danger);
  --badge-border: transparent; }

.sl-badge.sl-badge-accent {
  --badge-bg: var(--color-accent);
  --badge-fg: var(--color-accent-fg);
  --badge-border: transparent; }
/**
 * Button styles.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.button {
  --button-size: var(--button-size-3);
  --button-padding: var(--space-5);
  --button-color: var(--button-neutral-text);
  --button-color-hover: var(--button-color);
  --button-color-active: var(--button-color);
  --button-background: var(--button-neutral-surface);
  --button-background-hover: var(--button-neutral-surface-hover);
  --button-background-active: var(--button-neutral-surface-active);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: var(--button-color);
  text-decoration: none;
  font-family: var(--font-sans);
  font-weight: var(--button-weight);
  font-size: inherit;
  line-height: 1;
  height: var(--button-size);
  padding: 0 var(--button-padding);
  outline: 0;
  border: 0;
  border-radius: var(--button-radius);
  background: var(--button-background);
  cursor: pointer;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.button.icon,
.button.icon-button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: var(--button-size);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0; }

.button .icon {
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.button.hover-only {
  cursor: default; }

.button.rounded {
  border-radius: 100px; }

.button.center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }

.ua-safari a.button[type="submit"],
.ua-safari .button.ladda-button[type="submit"] {
  -webkit-transition: none !important;
  transition: none !important; }

.button .sl-keyboard-shortcut {
  opacity: 0.6; }

.button * .sl-keyboard-shortcut {
  margin-left: var(--space-4); }

.button .sl-keyboard-shortcut .enter-key {
  position: relative;
  top: 1px; }

.button:focus {
  outline: 1px solid var(--color-accent);
  outline-offset: 4px; }

.button:hover {
  color: var(--button-color-hover);
  background: var(--button-background-hover); }

.button:active {
  color: var(--button-color-active);
  background: var(--button-background-active); }

.button.negative {
  --button-color: #fff;
  --button-color-hover: #fff;
  --button-color-active: #fff;
  --button-background: var(--color-danger);
  --button-background-hover: var(--color-danger-hover);
  --button-background-active: var(--color-danger-active); }

.button.blue,
.button.primary,
.button.positive {
  --button-color: var(--button-primary-text);
  --button-color-hover: var(--button-primary-text);
  --button-color-active: var(--button-primary-text);
  --button-background: var(--button-primary-surface);
  --button-background-hover: var(--button-primary-surface-hover);
  --button-background-active: var(--button-primary-surface-active); }

.button.soft {
  --button-color: var(--button-neutral-soft-text);
  --button-color-hover: var(--button-neutral-soft-text);
  --button-color-active: var(--button-neutral-soft-text);
  --button-background: var(--button-neutral-soft-surface);
  --button-background-hover: var(--button-neutral-soft-surface-hover);
  --button-background-active: var(--button-neutral-soft-surface-active); }

.button.strong {
  --button-color: var(--button-strong-text);
  --button-color-hover: var(--button-strong-text);
  --button-color-active: var(--button-strong-text);
  --button-background: var(--button-strong-surface);
  --button-background-hover: var(--button-strong-surface-hover);
  --button-background-active: var(--button-strong-surface-active); }

.button.ghost:not(:hover) {
  --button-color: inherit;
  --button-background: transparent; }

.button.ghost:hover {
  --button-background-hover: var(--button-background); }

.button.xs,
.sl-select.xs,
.sl-checkbox.xs label {
  --button-size: var(--button-size-1);
  font-size: 0.8em; }

.button.s,
.sl-select.s,
.sl-checkbox.s label {
  --button-size: var(--button-size-2);
  font-size: 0.8em; }

.button.m,
.sl-select.m,
.sl-checkbox.m label {
  --button-size: var(--button-size-3); }

.button.l,
.sl-select.l,
.sl-checkbox.l label {
  --button-size: var(--button-size-4); }

.button.xl,
.sl-select.xl,
.sl-checkbox.xl label {
  --button-size: var(--button-size-6);
  --button-padding: var(--space-6);
  font-weight: 600;
  -webkit-font-smoothing: antialiased; }

.button.input-aligned {
  --button-size: var(--button-size-6); }

.button.xxl,
.sl-select.xxl,
.sl-checkbox.xxl label {
  --button-size: var(--button-size-9);
  --button-padding: var(--space-6);
  font-size: 1.8em;
  border-radius: calc(var(--button-radius) * 2);
  font-weight: 600;
  -webkit-font-smoothing: antialiased; }

.button.outline {
  --button-color: var(--color-text);
  --button-color-hover: var(--color-text-strong);
  --button-color-active: var(--color-text-strong);
  --button-background: transparent;
  --button-background-hover: transparent;
  --button-background-active: transparent;
  border: 2px solid var(--button-outline-border);
  border-width: 2px;
  -webkit-transition: none !important;
  transition: none !important; }
  .button.outline.thin {
    border-width: 1px; }
  .button.outline:hover {
    background: transparent;
    border-color: var(--button-outline-border-hover); }
  .button.outline:active {
    border-color: var(--button-outline-border-hover); }
  .button.outline.primary {
    --button-color: inherit;
    --button-color-hover: inherit;
    --button-color-active: inherit;
    --button-outline-border: var(--button-primary-surface);
    --button-outline-border-hover: var(--button-primary-surface-hover); }
  .button.outline.negative {
    --button-color: inherit;
    --button-color-hover: inherit;
    --button-color-active: inherit;
    --button-outline-border: var(--color-danger);
    --button-outline-border-hover: var(--color-danger-hover); }
  .button.outline.white {
    --button-color: #fff;
    --button-color-hover: #fff;
    --button-color-active: #fff;
    --button-outline-border: rgba(255, 255, 255, 0.5);
    --button-outline-border-hover: rgba(255, 255, 255, 1); }
  .button.outline.disabled, .button.outline.disabled:hover, .button.outline[disabled], .button.outline[disabled]:hover {
    background: transparent;
    color: var(--color-text-muted);
    border-color: var(--button-outline-border-disabled);
    text-shadow: none; }

.button.black-5,
.sl-select.black-5 {
  --button-color: var(--button-overlay-subtle-text);
  --button-background: var(--button-overlay-neutral-5);
  --button-background-hover: var(--button-overlay-neutral-10);
  --button-background-active: var(--button-overlay-neutral-10);
  --sl-select-color: var(--button-overlay-subtle-text);
  --sl-select-color-hover: var(--button-overlay-subtle-text);
  --sl-select-surface: var(--button-overlay-neutral-5); }

.button.black-10,
.sl-select.black-10 {
  --button-color: var(--button-overlay-subtle-text);
  --button-background: var(--button-overlay-neutral-10);
  --button-background-hover: var(--button-overlay-neutral-10-hover);
  --button-background-active: var(--button-overlay-neutral-10-hover);
  --sl-select-color: var(--button-overlay-subtle-text);
  --sl-select-color-hover: var(--button-overlay-subtle-text);
  --sl-select-surface: var(--button-overlay-neutral-10); }

.button.black-30,
.sl-select.black-30 {
  --button-color: var(--button-overlay-strong-text);
  --button-background: var(--button-overlay-neutral-30);
  --button-background-hover: var(--button-overlay-neutral-30-hover);
  --button-background-active: var(--button-overlay-neutral-30-hover);
  --sl-select-color: var(--button-overlay-strong-text);
  --sl-select-color-hover: var(--button-overlay-strong-text);
  --sl-select-surface: var(--button-overlay-neutral-30); }

.button.black-60,
.sl-select.black-60 {
  --button-color: var(--button-overlay-strong-text);
  --button-background: var(--button-overlay-neutral-60);
  --button-background-hover: var(--button-overlay-neutral-60-hover);
  --button-background-active: var(--button-overlay-neutral-60-hover);
  --sl-select-color: var(--button-overlay-strong-text);
  --sl-select-color-hover: var(--button-overlay-strong-text);
  --sl-select-surface: var(--button-overlay-neutral-60); }

.button.disabled,
.button.disabled:hover,
.button[disabled],
.button[disabled]:hover {
  --button-color: var(--button-disabled-text);
  --button-background: var(--button-disabled-surface);
  --button-background-hover: var(--button-disabled-surface);
  --button-background-active: var(--button-disabled-surface);
  color: var(--button-color);
  background: var(--button-background);
  cursor: default; }

.touch .button {
  -webkit-transition: none;
  transition: none; }

/****************************************************
 * SLIDES DROPDOWN
 ****************************************************/
.sl-select {
  --arrow-width: 14px;
  --button-size: var(--button-size-6);
  --button-padding: var(--space-5);
  --sl-select-surface: var(--surface-panel);
  --sl-select-border: var(--border-default);
  --sl-select-border-hover: var(--border-strong);
  --sl-select-color: var(--color-text);
  --sl-select-color-hover: var(--color-text-strong);
  --sl-select-radius: var(--form-field-radius);
  position: relative;
  height: var(--button-size);
  color: var(--sl-select-color);
  padding-left: var(--button-padding);
  padding-right: calc(var(--button-padding) + var(--arrow-width));
  border: 1px solid var(--sl-select-border);
  border-radius: var(--sl-select-radius);
  -webkit-box-shadow: 0;
          box-shadow: 0;
  cursor: pointer;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transition: none;
  transition: none;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PHBhdGggZmlsbD0iY3VycmVudENvbG9yIiBkPSJNNC41MTYgNy41NDhjLjQzNi0uNDQ2IDEuMDQzLS40ODEgMS41NzYgMEwxMCAxMS4yOTVsMy45MDgtMy43NDdjLjUzMy0uNDgxIDEuMTQxLS40NDYgMS41NzQgMCAuNDM2LjQ0NS40MDggMS4xOTcgMCAxLjYxNS0uNDA2LjQxOC00LjY5NSA0LjUwMi00LjY5NSA0LjUwMmExLjA5NSAxLjA5NSAwIDAgMS0xLjU3NiAwUzQuOTI0IDkuNTgxIDQuNTE2IDkuMTYzcy0uNDM2LTEuMTcgMC0xLjYxNXoiLz48L3N2Zz4=);
  background-repeat: no-repeat;
  background-position: right center;
  background-position: right 0.5em center;
  background-size: 16px 16px;
  background-color: var(--sl-select-surface);
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .sl-select:hover {
    color: var(--sl-select-color-hover);
    border-color: var(--sl-select-border-hover);
    background-color: var(--surface-hover); }
  .sl-select:focus {
    outline: 1px solid var(--color-accent);
    outline-offset: 4px; }
  .sl-select.white {
    color: #eee;
    border-color: rgba(255, 255, 255, 0.6);
    background-color: transparent; }
    .sl-select.white:hover {
      color: #fff;
      border-color: #fff; }
  .sl-select.thick {
    border-width: 2px; }

.dark-theme .sl-select {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTQuNTE2IDcuNTQ4Yy40MzYtLjQ0NiAxLjA0My0uNDgxIDEuNTc2IDBMMTAgMTEuMjk1bDMuOTA4LTMuNzQ3Yy41MzMtLjQ4MSAxLjE0MS0uNDQ2IDEuNTc0IDAgLjQzNi40NDUuNDA4IDEuMTk3IDAgMS42MTUtLjQwNi40MTgtNC42OTUgNC41MDItNC42OTUgNC41MDJhMS4wOTUgMS4wOTUgMCAwIDEtMS41NzYgMFM0LjkyNCA5LjU4MSA0LjUxNiA5LjE2M3MtLjQzNi0xLjE3IDAtMS42MTV6Ii8+PC9zdmc+); }

.sl-select[disabled] {
  cursor: default;
  opacity: 0.5;
  pointer-events: none;
  background-image: none; }

.sl-select.no-arrow {
  background-image: none;
  padding-right: var(--button-padding); }

/****************************************************
 * SLIDES CHECKBOX
 ****************************************************/
.sl-checkbox {
  --button-size: var(--button-size-6);
  --button-padding: var(--space-5);
  --sl-checkbox-border: var(--form-field-border);
  --sl-checkbox-border-hover: var(--form-field-border-hover);
  --sl-checkbox-border-checked: var(--form-field-border-checked);
  --sl-checkbox-border-active: var(--form-field-border-active);
  --sl-checkbox-color: var(--color-text);
  --sl-checkbox-color-active: var(--color-text-strong);
  --sl-checkbox-radius: var(--radius-3);
  --sl-checkbox-mark-radius: var(--radius-2);
  --sl-checkbox-mark-surface: var(--surface-panel);
  position: relative;
  line-height: 1.6; }
  .sl-checkbox input {
    position: absolute;
    opacity: 0; }
  .sl-checkbox.outline label {
    border: 1px solid var(--sl-checkbox-border); }
  .sl-checkbox label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: var(--space-2);
    position: relative;
    width: 100%;
    padding: var(--space-4) var(--button-padding);
    color: var(--sl-checkbox-color);
    cursor: pointer;
    border-radius: var(--sl-checkbox-radius);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
    .sl-checkbox label:before {
      content: "\e91b";
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      position: relative;
      width: 0.9em;
      height: 0.9em;
      margin-right: var(--space-2);
      border: 1px solid var(--sl-checkbox-border);
      border-radius: var(--sl-checkbox-mark-radius);
      font-size: 1.1em;
      font-family: "slides";
      line-height: 1;
      color: transparent;
      top: 0.2em;
      background: var(--sl-checkbox-mark-surface); }
    .sl-checkbox label:hover {
      color: var(--sl-checkbox-color-active);
      border-color: var(--sl-checkbox-border-hover); }
      .sl-checkbox label:hover:before {
        border-color: var(--sl-checkbox-border-hover); }
  .sl-checkbox input:checked + label {
    color: var(--sl-checkbox-color-active);
    border-color: var(--sl-checkbox-border-checked); }
    .sl-checkbox input:checked + label:before {
      border-color: transparent;
      background: transparent;
      color: inherit; }
  .sl-checkbox input:focus + label {
    outline: 1px solid var(--color-accent);
    outline-offset: 4px; }
  .sl-checkbox input:disabled {
    pointer-events: none; }
  .sl-checkbox input:disabled + label {
    cursor: default;
    opacity: 0.5;
    pointer-events: none;
    background-image: none; }
  .sl-checkbox .inline-text-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    font-weight: 500; }
  .sl-checkbox .inline-description {
    display: block;
    color: inherit;
    font-weight: normal;
    opacity: 0.7; }
  .sl-checkbox .inline-description a {
    text-decoration: underline; }

.sl-checkbox.flush-left label {
  padding-left: 0; }

.sl-checkbox.white label {
  color: #fff; }
.sl-checkbox.white input:checked + label {
  color: #fff; }
  .sl-checkbox.white input:checked + label:before {
    border-color: transparent; }
.sl-checkbox.white.outline label {
  border: 1px solid rgba(255, 255, 255, 0.1); }
  .sl-checkbox.white.outline label:hover {
    border-color: rgba(255, 255, 255, 0.4); }
.sl-checkbox.white.outline input:checked + label {
  border-color: rgba(255, 255, 255, 0.4); }

.sl-checkbox-stack {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }

.sl-checkbox-box {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer; }

.sl-checkbox-box input {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 1em;
  height: 1em;
  margin: 0;
  border: 1px solid var(--border-default);
  border-radius: var(--checkbox-radius);
  background-color: var(--surface-panel);
  cursor: pointer;
  position: relative; }
  .sl-checkbox-box input:checked::before {
    content: '\e91b';
    font-family: 'slides';
    font-size: 0.75em;
    line-height: 1;
    color: var(--color-text-strong); }

.sl-checkbox-box:hover input {
  border-color: var(--border-strong); }
@charset "UTF-8";
/**
 * Styles for the collaboration component.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-collab {
  height: 100%;
  display: none; }

.sl-collab.visible {
  display: block; }

.sl-collab *,
.sl-collab-handover * {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.sl-collab-inner {
  position: absolute;
  width: var(--drawer-tool-width);
  height: 100%;
  top: 0;
  left: 0;
  color: var(--color-text-strong);
  text-align: left;
  font-size: var(--font-size-edit-ui);
  z-index: 0; }

.sl-collab-inner:after {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  left: 100%;
  top: 0;
  background-color: var(--surface-panel-alt); }

.sl-collab-overlay {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: var(--surface-panel-alt);
  color: var(--color-text-strong);
  text-align: center; }

.sl-collab-overlay.visible {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.sl-collab-overlay-inner {
  margin: auto;
  padding-bottom: 30px; }
  .sl-collab-overlay-inner .exclamation {
    width: 34px;
    height: 34px;
    line-height: 32px;
    margin: 0 auto 1em auto;
    border-radius: 34px;
    font-size: 22px;
    font-weight: bold;
    background-color: #d04232;
    color: #000; }
  .sl-collab-overlay-inner .message {
    margin: 0 0 2em 0; }

.sl-collab-overlay-inner.flash {
  -webkit-animation: flash-opacity 0.5s 1 ease;
          animation: flash-opacity 0.5s 1 ease; }

.sl-collab.disconnected .disable-when-disconnected {
  opacity: 0.5;
  pointer-events: none; }

.sl-collab-users {
  --collab-surface: var(--surface-panel);
  position: relative;
  width: 100%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  overflow: auto;
  z-index: 1; }

.sl-collab-users-list {
  -webkit-transition: height 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: height 0.4s cubic-bezier(0.23, 1, 0.32, 1); }

.sl-collab-observers {
  display: block;
  position: absolute;
  left: 5px;
  right: 5px;
  z-index: 0;
  border: 1px solid #1cef96;
  border-radius: 30px;
  border-top-left-radius: 0;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  -webkit-box-shadow: 0 0 0px 1px #14ca7b, 0 0 0px 1px #14ca7b inset;
          box-shadow: 0 0 0px 1px #14ca7b, 0 0 0px 1px #14ca7b inset;
  -webkit-transition: height 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.2s ease, opacity 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: height 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.2s ease, opacity 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: height 0.4s cubic-bezier(0.23, 1, 0.32, 1), transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.2s ease, opacity 0.2s ease;
  transition: height 0.4s cubic-bezier(0.23, 1, 0.32, 1), transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.2s ease, opacity 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1); }

.sl-collab-observers.visible {
  visibility: visible;
  opacity: 1; }

.sl-collab-observers > .icon {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 14px;
  left: -5px;
  top: -5px;
  background-color: #1cef96;
  color: #000;
  font-size: 12px;
  pointer-events: auto; }

.sl-collab-users-invite {
  position: absolute;
  display: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  top: 0;
  left: calc( ( var( --drawer-menu-width ) - var( --secondary-button-size ) ) / 2 );
  width: var(--secondary-button-size);
  height: var(--secondary-button-size);
  border-radius: var(--secondary-button-size);
  margin: 0;
  font-size: 14px;
  cursor: pointer;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.2s ease, visibility 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: opacity 0.2s ease, visibility 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1); }
  .sl-collab-users-invite:hover {
    opacity: 1;
    background: var(--surface-hover-strong); }

.sl-collab-user {
  position: absolute;
  top: 0;
  left: calc( ( var( --drawer-menu-width ) - 28px ) / 2 );
  width: 28px;
  height: 28px;
  line-height: 28px;
  border-radius: 28px;
  border: 2px solid transparent;
  background-color: #fff;
  font-size: 16px;
  visibility: hidden;
  opacity: 0;
  z-index: 2;
  -webkit-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1); }
  .sl-collab-user .picture {
    width: 100%;
    height: 100%;
    border-radius: 28px;
    background-size: cover; }
  .sl-collab-user.intro-animation .picture {
    -webkit-animation: bounce-in 0.8s;
            animation: bounce-in 0.8s; }

.sl-collab-user.online {
  visibility: visible;
  opacity: 1;
  z-index: 3; }
  .sl-collab-user.online .picture {
    -webkit-animation: bounce-in 0.8s;
            animation: bounce-in 0.8s; }

.sl-collab-user:not(.online) {
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%); }

.sl-collab-user.online:after {
  content: '';
  display: block;
  position: absolute;
  width: 10px;
  height: 10px;
  bottom: -7px;
  left: -7px;
  border-radius: 10px;
  background-color: #1cef96;
  border: 2px solid var(--collab-surface);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  opacity: 0; }

.sl-collab-user.online.idle:after {
  background-color: #f0cd21; }

.sl-collab-observers.visible + .sl-collab-user:after {
  opacity: 0; }

.sl-collab-users.admin .sl-collab-user {
  cursor: pointer; }

.sl-collab-users.admin .sl-collab-users-invite {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

html.decks.review .sl-collab-user:after,
[data-drawer="collaboration"] .sl-collab-user:after {
  opacity: 1; }
html.decks.review .sl-collab-user,
[data-drawer="collaboration"] .sl-collab-user {
  border-color: var(--surface-hover-strongest); }
html.decks.review .sl-collab-user,
html.decks.review .sl-collab-users-invite,
[data-drawer="collaboration"] .sl-collab-user,
[data-drawer="collaboration"] .sl-collab-users-invite {
  visibility: visible;
  opacity: 1; }

.sl-collab:hover .sl-collab-users-invite {
  visibility: visible;
  opacity: 1; }

.sl-collab-tooltip-status {
  padding: 1px 6px;
  margin: -1px 0 -1px 8px;
  border-radius: 8px; }

.sl-collab-tooltip-status[data-status="disconnected"] {
  background-color: #888; }
  .sl-collab-tooltip-status[data-status="disconnected"]:after {
    content: "offline"; }

.sl-collab-tooltip-status[data-status="viewing"] {
  background-color: #1cef96;
  color: #000; }
  .sl-collab-tooltip-status[data-status="viewing"]:after {
    content: "online"; }

.sl-collab-tooltip-status[data-status="idle"] {
  background-color: #e4c52d;
  color: #000; }
  .sl-collab-tooltip-status[data-status="idle"]:after {
    content: "idle"; }

.sl-collab-invite-form,
.sl-collab-edit-form {
  width: 400px; }
  .sl-collab-invite-form .invite-email,
  .sl-collab-invite-form .role-selector,
  .sl-collab-edit-form .invite-email,
  .sl-collab-edit-form .role-selector {
    display: block;
    width: 100%;
    margin-bottom: 15px; }
  .sl-collab-invite-form .invite-email,
  .sl-collab-edit-form .invite-email {
    background-color: #fff; }
  .sl-collab-invite-form .invite-options,
  .sl-collab-edit-form .invite-options {
    width: 100%;
    margin-bottom: 15px;
    white-space: normal;
    line-height: 1.4;
    color: #666;
    border-radius: var(--radius-2);
    border: 1px dashed #ddd;
    padding: 10px; }
    .sl-collab-invite-form .invite-options :first-child,
    .sl-collab-edit-form .invite-options :first-child {
      margin-top: 0 !important; }
    .sl-collab-invite-form .invite-options :last-child,
    .sl-collab-edit-form .invite-options :last-child {
      margin-bottom: 0 !important; }
    .sl-collab-invite-form .invite-options .semibold,
    .sl-collab-edit-form .invite-options .semibold {
      font-weight: 500; }
    .sl-collab-invite-form .invite-options .sl-checkbox,
    .sl-collab-edit-form .invite-options .sl-checkbox {
      font-size: inherit !important; }
  .sl-collab-invite-form .invite-options:empty,
  .sl-collab-edit-form .invite-options:empty {
    display: none; }
  .sl-collab-invite-form .invite-options.disabled,
  .sl-collab-edit-form .invite-options.disabled {
    opacity: 0.5;
    pointer-events: none; }
  .sl-collab-invite-form .invite-options.hidden,
  .sl-collab-edit-form .invite-options.hidden {
    display: none; }

.sl-collab-body {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  line-height: 1.4; }

.sl-collab-page {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
  .sl-collab-page ::-webkit-scrollbar {
    width: 10px; }
  .sl-collab-page ::-webkit-scrollbar-thumb:vertical {
    min-height: 16px;
    border: 3px solid rgba(0, 0, 0, 0);
    border-radius: 8px;
    background-color: rgba(100, 100, 100, 0.15);
    background-clip: padding-box; }
  .sl-collab-page ::-webkit-scrollbar-thumb:vertical:hover,
  .sl-collab-page ::-webkit-scrollbar-thumb:vertical:active {
    background-color: rgba(100, 100, 100, 0.6); }

.sl-collab-page-header {
  position: relative;
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.sl-collab-page-body {
  position: relative;
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch; }

.sl-collab-page-footer {
  position: relative;
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.sl-collab-comments {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end; }

.sl-collab-comments-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1px;
  width: 100%;
  height: var(--drawer-item-size);
  margin-bottom: auto;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  border-bottom: 1px solid var(--border-default); }
  .sl-collab-comments-header .header-tab {
    width: 100%;
    padding: 0 20px;
    text-align: center;
    line-height: var(--drawer-menu-width);
    cursor: pointer;
    white-space: nowrap;
    color: var(--color-text-muted); }
  .sl-collab-comments-header .header-tab:hover,
  .sl-collab-comments-header .header-tab.selected {
    background-color: var(--surface-hover);
    color: var(--color-text-strong); }
  .sl-collab-comments-header .header-tab .value {
    opacity: 0.5; }

.sl-collab-comment-thread {
  display: none;
  overflow: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  max-height: 100%;
  -webkit-overflow-scrolling: touch; }
  .sl-collab-comment-thread.visible {
    display: block; }
  .sl-collab-comment-thread.empty {
    height: 100%; }
  .sl-collab-comment-thread .placeholder {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    height: 100%;
    padding: 15px;
    text-align: center;
    color: var(--color-text-muted); }
  .sl-collab-comment-thread .placeholder .icon {
    font-size: 22px; }
  .sl-collab-comment-thread .placeholder .error {
    color: red; }
  .sl-collab-comment-thread .load-more-button {
    display: none;
    margin: 24px auto;
    text-decoration: underline;
    font-size: 13px; }
  .sl-collab-comment-thread .load-more-button[disabled] {
    text-decoration: none;
    color: #aaa; }
  .sl-collab-comment-thread .load-more-button.visible {
    display: block; }

.sl-collab-comment {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding: 10px 20px 10px 10px;
  font-size: var(--font-size-edit-ui); }
  .sl-collab-comment .comment-sidebar {
    float: left;
    margin-right: 6px; }
    .sl-collab-comment .comment-sidebar .button,
    .sl-collab-comment .comment-sidebar .avatar {
      display: block;
      width: 20px;
      height: 20px;
      line-height: 20px;
      padding: 0;
      color: #fff;
      border-radius: 2px;
      text-align: center;
      background-color: transparent; }
    .sl-collab-comment .comment-sidebar .avatar {
      margin-bottom: 3px;
      background-color: #f5f5f5;
      background-size: cover;
      background-position: 50% 50%;
      border-radius: 20px;
      -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4) inset;
              box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4) inset;
      cursor: default; }
    .sl-collab-comment .comment-sidebar .button {
      display: none;
      color: var(--color-text-secondary);
      font-size: 12px; }
    .sl-collab-comment .comment-sidebar .button:hover {
      color: var(--color-text-strong); }
    .sl-collab-comment .comment-sidebar .button.focus,
    .sl-collab-comment .comment-sidebar .button.popover-anchor {
      color: var(--color-text-strong);
      display: block; }
  .sl-collab-comment:hover .comment-sidebar .button {
    display: block; }
  .sl-collab-comment .comment-body {
    padding-left: 26px; }
  .sl-collab-comment .comment-body-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 5px; }
  .sl-collab-comment .author {
    cursor: default;
    font-weight: 700;
    max-width: 100%;
    margin-right: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  .sl-collab-comment .meta {
    color: var(--color-text-muted);
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .sl-collab-comment .meta-slide-number {
    padding: 0;
    color: var(--color-text-muted); }
  .sl-collab-comment .meta-slide-number:hover {
    color: var(--color-text-strong); }
  .sl-collab-comment .meta-time {
    cursor: default; }
  .sl-collab-comment .meta-slide-number + .meta-time:before {
    content: '–';
    margin: 0 3px; }
  .sl-collab-comment .message {
    margin: 0;
    white-space: pre-wrap;
    word-wrap: break-word;
    line-height: 1.5; }
  .sl-collab-comment .retry {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-top: 2px solid red;
    padding: 10px;
    margin-top: 10px;
    background-color: rgba(255, 255, 255, 0.8); }

.sl-collab-comment-thread.overflowing .sl-collab-comment {
  padding-right: 10px; }

.sl-collab-comment[data-state="saving"] .author,
.sl-collab-comment[data-state="saving"] .message,
.sl-collab-comment[data-state="failed"] .author,
.sl-collab-comment[data-state="failed"] .message {
  color: var(--color-text-muted); }

.sl-collab-comment[data-state="failed"] {
  background-color: #FFEFEF; }

.sl-collab-comment-form {
  padding: 0 8px 8px 8px;
  position: relative; }

.sl-collab-comment-form .comment-input {
  width: 100%;
  resize: none;
  font-size: var(--font-size-edit-ui);
  border-radius: var(--radius-3);
  background-color: var(--surface-hover);
  padding: 8px 10px;
  color: var(--color-text-strong);
  border: 0; }
  .sl-collab-comment-form .comment-input::-webkit-input-placeholder {
    color: var(--color-text-muted); }
  .sl-collab-comment-form .comment-input::-moz-placeholder {
    color: var(--color-text-muted); }
  .sl-collab-comment-form .comment-input:-ms-input-placeholder {
    color: var(--color-text-muted); }
  .sl-collab-comment-form .comment-input::-ms-input-placeholder {
    color: var(--color-text-muted); }
  .sl-collab-comment-form .comment-input::placeholder {
    color: var(--color-text-muted); }
  .sl-collab-comment-form .comment-input:hover, .sl-collab-comment-form .comment-input:focus-within {
    background-color: var(--surface-hover);
    -webkit-box-shadow: 0 0 0 1px var(--surface-hover-strong) inset;
            box-shadow: 0 0 0 1px var(--surface-hover-strong) inset; }
  .sl-collab-comment-form .comment-input:focus-within {
    -webkit-box-shadow: 0 0 0 1px var(--color-accent) inset;
            box-shadow: 0 0 0 1px var(--color-accent) inset; }

.sl-collab-comment-form .comment-status,
.sl-collab-comment-form .comment-submit {
  padding: 2px 0;
  border: 1px solid transparent;
  cursor: default;
  font-size: 11px;
  color: var(--color-text-muted); }

.sl-collab-comment-form .comment-submit {
  position: absolute;
  bottom: 14px;
  right: 14px;
  padding: 2px 4px;
  visibility: hidden;
  cursor: pointer;
  border-radius: var(--radius-2);
  outline: 0;
  outline-offset: 1px;
  background-color: var(--surface-inverse);
  color: var(--color-text-inverse);
  font-weight: 500;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .sl-collab-comment-form .comment-submit:focus {
    outline: 1px solid #226ede; }

.sl-collab-comment-form .comment-status {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: 22px;
  color: var(--color-text-subtle); }

.sl-collab-comment-form .comment-length.max-length-exceeded {
  color: #d04232;
  font-weight: 500; }

.sl-collab-comment-form :invalid,
.sl-collab-comment-form :-moz-ui-invalid {
  outline: 0;
  box-shadow: none; }

.sl-collab-comment-form .comment-input[required]:valid + .comment-submit {
  visibility: visible; }

.sl-collab-handover {
  position: absolute;
  top: var(--space-4);
  left: var(--space-4);
  z-index: 90; }
  .sl-collab-handover .handover-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .sl-collab-handover .handover-controls-button {
    display: inline-block;
    height: 44px;
    color: var(--color-text-strong);
    border-radius: var(--button-radius);
    background: var(--surface-glass);
    backdrop-filter: var(--glass-filter);
    vertical-align: top;
    cursor: pointer;
    margin-right: var(--space-4); }
    .sl-collab-handover .handover-controls-button > .label, .sl-collab-handover .handover-controls-button > .icon {
      line-height: 44px;
      vertical-align: middle; }
    .sl-collab-handover .handover-controls-button > .label {
      font-size: 14px;
      margin-left: 16px;
      margin-right: 12px; }
    .sl-collab-handover .handover-controls-button > .icon {
      position: relative;
      font-size: 14px;
      margin-right: 16px; }
    .sl-collab-handover .handover-controls-button:hover {
      background: var(--surface-glass-hover); }
  .sl-collab-handover .edit-button-wrapper {
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease; }
  .sl-collab-handover .edit-button-wrapper.visible {
    visibility: visible;
    opacity: 1;
    -webkit-transform: none;
            transform: none; }
  .sl-collab-handover .edit-button-wrapper:hover .user,
  .sl-collab-handover .edit-button-wrapper:hover .edit-button {
    background: var(--surface-glass-hover); }
  .sl-collab-handover .user {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 44px;
    max-width: 300px;
    margin-left: 6px;
    padding: 0 16px 0 0px;
    border-radius: 44px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 12px;
    color: var(--color-text-strong);
    background: var(--surface-glass);
    backdrop-filter: var(--glass-filter);
    -webkit-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
    -webkit-animation: bounce-in 0.8s;
            animation: bounce-in 0.8s; }
  .sl-collab-handover .user.idle .user-description {
    opacity: 0.6; }
  .sl-collab-handover .user-avatar {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 44px;
    margin-left: 2px;
    margin-right: 8px;
    background-size: cover;
    background-position: 50% 50%;
    -webkit-animation: bounce-in 0.8s;
            animation: bounce-in 0.8s;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .sl-collab-handover .user-description {
    line-height: 1.4; }
  .sl-collab-handover .username {
    font-weight: bold;
    word-break: break-word;
    -ms-hyphens: auto;
        hyphens: auto; }
  .sl-collab-handover .user-slide {
    display: none;
    text-decoration: underline; }
  .sl-collab-handover .user-slide.visible {
    display: inline-block; }
  .sl-collab-handover .user-slide:hover {
    color: #226ede; }

.sl-collab-notifications {
  position: absolute;
  width: 300px;
  top: 10px;
  right: calc( var( --page-inset-right ) + 10px );
  z-index: 410;
  -webkit-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1); }

.sl-collab-notification {
  width: 100%;
  position: absolute;
  max-height: 108px;
  padding: 12px;
  color: var(--color-text-strong);
  background-color: var(--surface-panel);
  border-radius: var(--popover-radius);
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0.02em;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  border: 1px solid var(--border-default);
  cursor: default; }
  .sl-collab-notification .dismiss {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    padding: 3px 6px;
    font-size: 12px;
    color: var(--color-text-muted);
    background-color: var(--surface-panel);
    cursor: pointer; }
  .sl-collab-notification .status-icon,
  .sl-collab-notification .status-picture {
    display: inline-block;
    width: 26px;
    height: 26px;
    line-height: 26px;
    border-radius: 26px;
    margin: -4px;
    font-size: 12px;
    background-color: var(--surface-hover);
    vertical-align: top; }
  .sl-collab-notification .status-icon {
    text-align: center;
    color: #fff; }
  .sl-collab-notification .status-picture {
    background-size: cover;
    background-position: center; }
  .sl-collab-notification .message {
    display: inline-block;
    width: 250px;
    padding-left: 12px;
    vertical-align: top; }
  .sl-collab-notification .button.has-countdown {
    position: relative; }
  .sl-collab-notification .button.has-countdown .countdown {
    position: absolute;
    height: 4px;
    width: 100%;
    bottom: 0;
    left: 0;
    border-radius: var(--button-radius);
    -webkit-transform-origin: 0 0;
            transform-origin: 0 0;
    background-color: #226ede;
    -webkit-transform: scaleX(0);
            transform: scaleX(0); }
  .sl-collab-notification .button.half-width {
    width: 48%; }
  .sl-collab-notification .button.half-width + .button.half-width {
    float: right; }
  .sl-collab-notification p:first-child {
    margin-top: 0; }
  .sl-collab-notification .slide-number {
    color: var(--color-text-muted);
    float: right; }

.sl-collab-notification.multiline .status-icon,
.sl-collab-notification.multiline .status-picture {
  margin-top: 0;
  margin-bottom: 0; }

.sl-collab-notification:hover .dismiss {
  display: block; }

.sl-collab-notification.show {
  opacity: 1;
  -webkit-transform: none;
          transform: none; }

.sl-collab-notification.hide {
  opacity: 0; }

.sl-collab-notification:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 12px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(var(--surface-panel-rgb), 0)), color-stop(50%, rgba(var(--surface-panel-rgb), 0.75)), to(var(--surface-panel)));
  background: linear-gradient(to bottom, rgba(var(--surface-panel-rgb), 0) 0%, rgba(var(--surface-panel-rgb), 0.75) 50%, var(--surface-panel) 100%); }

@media screen and (max-width: 400px) {
  .sl-collab-notification {
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); }

  .sl-collab-handover .user {
    max-width: 180px; }

  .sl-collab-handover .user-slide {
    display: none !important; } }
/**
 * Context menu component (for right-clicks).
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-context-menu {
  --inner-border-radius: calc(var(--popover-radius) - var(--radius-1));
  position: absolute;
  display: none;
  top: 0;
  left: 0;
  padding: 2px;
  background: var(--surface-overlay);
  border: 1px solid var(--border-overlay);
  color: var(--color-overlay);
  text-align: left;
  border-radius: var(--popover-radius);
  white-space: nowrap;
  font-size: 12px;
  z-index: 10000;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  .sl-context-menu.visible {
    display: block; }
  .sl-context-menu .sl-context-menu-list {
    position: relative;
    z-index: 2; }
  .sl-context-menu .sl-context-menu-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 0 10px;
    height: 2.6em;
    line-height: 2.6em;
    color: var(--color-overlay);
    cursor: pointer; }
  .sl-context-menu .sl-context-menu-item:hover {
    background-color: var(--surface-hover); }
  .sl-context-menu .sl-context-menu-item:active {
    background-color: var(--surface-hover-strong); }
  .sl-context-menu .sl-context-menu-item.focus {
    outline: 1px solid #226ede;
    outline-offset: 2px; }
  .sl-context-menu .sl-context-menu-item.hidden {
    display: none; }
  .sl-context-menu .sl-context-menu-divider {
    width: 100%;
    height: 1px;
    margin: 2px 0;
    background: var(--border-overlay-divider); }
  .sl-context-menu .sl-context-menu-item.hidden + .sl-context-menu-divider {
    display: none; }
  .sl-context-menu .sl-context-menu-item .label {
    line-height: inherit; }
  .sl-context-menu .sl-context-menu-item .icon {
    line-height: inherit;
    width: 1.4em;
    margin-left: 30px;
    font-size: 1.2em;
    text-align: center; }
  .sl-context-menu .sl-context-menu-item .shortcut {
    margin-left: 30px;
    color: var(--color-text-muted);
    letter-spacing: 2px; }
  .sl-context-menu .sl-context-menu-arrow {
    position: absolute; }
  .sl-context-menu .sl-context-menu-item:first-child {
    border-radius: var(--inner-border-radius) var(--inner-border-radius) 0 0; }
  .sl-context-menu .sl-context-menu-item:last-child {
    border-radius: 0 0 var(--inner-border-radius) var(--inner-border-radius); }
  .sl-context-menu[data-alignment=l] .sl-context-menu-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-right-width: 0;
    border-left-color: var(--surface-overlay); }
  .sl-context-menu[data-alignment=r] .sl-context-menu-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-left-width: 0;
    border-right-color: var(--surface-overlay); }
/**
 * Image cropping component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-cropper {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  visibility: hidden;
  z-index: 401;
  background-color: rgba(0, 0, 0, 0.7);
  font-size: 10px;
  overflow: auto; }
  .sl-cropper .sl-cropper-inner {
    position: relative;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0; }
  .sl-cropper .sl-cropper-image {
    position: absolute;
    z-index: 1;
    width: 100%; }
  .sl-cropper .sl-cropper-overlay {
    position: absolute;
    z-index: 2;
    pointer-events: none; }
  .sl-cropper .anchor-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border: 1px dashed rgba(255, 255, 255, 0.5);
    z-index: 3;
    cursor: move; }
  .sl-cropper .anchor {
    position: absolute;
    width: 1em;
    height: 1em;
    pointer-events: all;
    visibility: hidden; }
  .sl-cropper .anchor-point {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #226ede;
    border: 1px solid #fff;
    border-radius: 50%;
    z-index: 2; }
  .sl-cropper .anchor[data-direction=n] {
    left: 10px;
    right: 10px;
    bottom: 100%;
    width: auto;
    margin-bottom: -0.4em;
    cursor: ns-resize; }
  .sl-cropper .anchor[data-direction=e] {
    top: 10px;
    bottom: 10px;
    left: 100%;
    height: auto;
    margin-left: -0.4em;
    cursor: ew-resize; }
  .sl-cropper .anchor[data-direction=s] {
    left: 10px;
    right: 10px;
    top: 100%;
    width: auto;
    margin-top: -0.4em;
    cursor: ns-resize; }
  .sl-cropper .anchor[data-direction=w] {
    top: 10px;
    bottom: 10px;
    right: 100%;
    height: auto;
    margin-right: -0.4em;
    cursor: ew-resize; }
  .sl-cropper .anchor[data-direction=nw] {
    right: 100%;
    bottom: 100%;
    margin-right: -0.4em;
    margin-bottom: -0.4em;
    cursor: nw-resize; }
  .sl-cropper .anchor[data-direction=ne] {
    left: 100%;
    bottom: 100%;
    margin-left: -0.4em;
    margin-bottom: -0.4em;
    cursor: ne-resize; }
  .sl-cropper .anchor[data-direction=se] {
    left: 100%;
    top: 100%;
    margin-left: -0.4em;
    margin-top: -0.4em;
    cursor: se-resize; }
  .sl-cropper .anchor[data-direction=sw] {
    right: 100%;
    top: 100%;
    margin-right: -0.4em;
    margin-top: -0.4em;
    cursor: sw-resize; }
  .sl-cropper.visible {
    visibility: inherit; }
    .sl-cropper.visible .anchor {
      visibility: inherit; }

.sl-editor.is-editing.touch-editor .sl-cropper {
  font-size: 15px; }
  .sl-editor.is-editing.touch-editor .sl-cropper .anchor:before {
    content: '';
    position: absolute;
    left: -0.5em;
    top: -0.5em;
    width: 2em;
    height: 2em; }
.cta-button {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: var(--button-size-7);
  padding: 0 var(--space-7);
  border-radius: var(--radius-full);
  color: var(--button-strong-text);
  font-size: var(--marketing-font-size-cta, 18px);
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  isolation: isolate;
  gap: var(--space-2); }

.cta-button-background {
  position: absolute;
  inset: 0;
  border: 1px solid transparent;
  border-radius: inherit;
  background: var(--button-strong-surface);
  -webkit-transition: background 0.3s ease, -webkit-transform 0.3s var(--ease-out-back);
  transition: background 0.3s ease, -webkit-transform 0.3s var(--ease-out-back);
  transition: background 0.3s ease, transform 0.3s var(--ease-out-back);
  transition: background 0.3s ease, transform 0.3s var(--ease-out-back), -webkit-transform 0.3s var(--ease-out-back);
  z-index: 0; }

.cta-button-label {
  position: relative;
  z-index: 1;
  -webkit-transition: -webkit-transform 0.2s ease;
  transition: -webkit-transform 0.2s ease;
  transition: transform 0.2s ease;
  transition: transform 0.2s ease, -webkit-transform 0.2s ease; }

.cta-button-arrow {
  position: relative;
  z-index: 1;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 32px;
  height: 32px;
  margin-left: 10px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  overflow: visible;
  color: currentColor; }

.cta-button-arrow-disc {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: var(--color-spot-1);
  opacity: 0;
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
  -webkit-transition: opacity 0.2s ease, -webkit-transform 0.3s var(--ease-out-back);
  transition: opacity 0.2s ease, -webkit-transform 0.3s var(--ease-out-back);
  transition: opacity 0.2s ease, transform 0.3s var(--ease-out-back);
  transition: opacity 0.2s ease, transform 0.3s var(--ease-out-back), -webkit-transform 0.3s var(--ease-out-back); }

.cta-button-arrow svg {
  position: relative;
  z-index: 1;
  width: 48px;
  height: 24px;
  overflow: visible; }

.cta-button-arrow path {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round; }

.cta-button .arrow-tail-path {
  stroke-dasharray: 0.58 1;
  stroke-dashoffset: -0.52;
  -webkit-transition: stroke-dasharray 0.2s ease, stroke-dashoffset 0.2s ease;
  transition: stroke-dasharray 0.2s ease, stroke-dashoffset 0.2s ease; }

.cta-button-has-arrow {
  padding-right: 12px; }

.cta-button:not(.disabled):hover {
  color: currentColor; }

.cta-button-strong:not(.disabled):hover {
  color: var(--button-strong-text); }

.cta-button:not(.disabled):hover .cta-button-background {
  background: var(--button-strong-surface-hover);
  -webkit-transform: scale(1.03, 1.08);
          transform: scale(1.03, 1.08); }

.cta-button:not(.disabled):active .cta-button-background {
  -webkit-transform: scale(1);
          transform: scale(1); }

.cta-button-has-arrow:not(.disabled):hover .cta-button-label {
  -webkit-transform: translateX(-8px);
          transform: translateX(-8px); }

.cta-button-has-arrow:not(.disabled):hover .cta-button-arrow-disc {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1); }

.cta-button-has-arrow:not(.disabled):hover .arrow-tail-path {
  stroke-dasharray: 1 1;
  stroke-dashoffset: -0.05; }

.cta-button-secondary {
  color: var(--color-text-strong); }

.cta-button-secondary .cta-button-background {
  background: var(--surface-hover-subtle); }

.cta-button-secondary:not(.disabled):hover .cta-button-background {
  background: var(--surface-hover); }

.cta-button.disabled {
  pointer-events: none;
  cursor: default;
  padding: 0 var(--space-7); }

.cta-button.disabled .cta-button-label {
  opacity: 0.8; }

.cta-button.disabled .cta-button-arrow {
  display: none; }

.cta-button.disabled .cta-button-background {
  opacity: 0.4; }
/**
 * Deck filters (sort & search)
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.deck-filters {
  --deck-filters-gap: calc( var(--space-5) + var(--space-1) );
  --deck-filters-pill-radius: var(--radius-full);
  --deck-filters-pill-padding-y: var(--space-1);
  --deck-filters-pill-padding-x: var(--space-3);
  --deck-filters-clear-padding-y: calc( var(--space-2) + var(--space-1) );
  --deck-filters-clear-padding-x: var(--space-2);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  gap: var(--space-5);
  color: var(--color-text-subtle); }
  .deck-filters .deck-filters-options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--space-5); }
  .deck-filters .deck-filters-options > * {
    line-height: 1.5; }
  .deck-filters .deck-filters-sort,
  .deck-filters .deck-filters-search[type="text"],
  .deck-filters .deck-filters-tag-filter {
    padding: 0;
    border: 0;
    gap: var(--space-1); }
  .deck-filters .deck-filters-sort,
  .deck-filters .deck-filters-tag-filter,
  .deck-filters .deck-filters-search-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: currentColor;
    height: var(--button-size-4); }
    .deck-filters .deck-filters-sort:hover,
    .deck-filters .deck-filters-tag-filter:hover,
    .deck-filters .deck-filters-search-wrapper:hover {
      color: var(--color-text-strong); }
  .deck-filters .button .icon,
  .deck-filters .button .label,
  .deck-filters .deck-filters-search,
  .deck-filters .deck-filters-search-icon {
    color: currentColor; }
  .deck-filters .icon {
    font-size: var(--space-6); }
  .deck-filters .button .icon {
    margin-right: var(--space-2); }
  .deck-filters .deck-filters-tag-filter {
    padding: var(--deck-filters-pill-padding-y) var(--deck-filters-pill-padding-x);
    border-radius: var(--deck-filters-pill-radius); }
  .deck-filters .deck-filters-tag-filter .icon {
    font-size: var(--font-size-edit-ui); }
  .deck-filters .deck-filters-tag-filter.is-set {
    color: var(--color-text-inverse);
    border-color: var(--color-accent);
    background-color: var(--color-accent); }
  .deck-filters .deck-filters-search-wrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  .deck-filters input[type="text"].deck-filters-search {
    background-color: transparent;
    max-width: 100%;
    padding-left: var(--space-2);
    border: 1px solid transparent;
    border-radius: var(--deck-filters-pill-radius);
    line-height: 1.6;
    height: var(--button-size-3); }
    .deck-filters input[type="text"].deck-filters-search::-webkit-input-placeholder {
      color: var(--color-text-subtle); }
    .deck-filters input[type="text"].deck-filters-search::-moz-placeholder {
      color: var(--color-text-subtle); }
    .deck-filters input[type="text"].deck-filters-search:-ms-input-placeholder {
      color: var(--color-text-subtle); }
    .deck-filters input[type="text"].deck-filters-search::-ms-input-placeholder {
      color: var(--color-text-subtle); }
    .deck-filters input[type="text"].deck-filters-search::placeholder {
      color: var(--color-text-subtle); }
  .deck-filters input[type="text"].deck-filters-search:hover::-webkit-input-placeholder {
    color: var(--color-text-strong); }
  .deck-filters input[type="text"].deck-filters-search:hover::-moz-placeholder {
    color: var(--color-text-strong); }
  .deck-filters input[type="text"].deck-filters-search:hover:-ms-input-placeholder {
    color: var(--color-text-strong); }
  .deck-filters input[type="text"].deck-filters-search:hover::-ms-input-placeholder {
    color: var(--color-text-strong); }
  .deck-filters input[type="text"].deck-filters-search:hover::placeholder {
    color: var(--color-text-strong); }
  .deck-filters input[type="text"].deck-filters-search:valid,
  .deck-filters input[type="text"].deck-filters-search:focus {
    background-color: transparent;
    width: 200px;
    padding-right: calc( var(--button-size-1) - var(--space-1) );
    color: var(--color-text-strong); }
  .deck-filters input[type="text"].deck-filters-search:valid {
    border-color: var(--border-default);
    border-radius: var(--deck-filters-pill-radius); }
  .deck-filters .deck-filters-search:invalid {
    -webkit-box-shadow: none;
            box-shadow: none; }
  .deck-filters .deck-filters-search:focus {
    border-color: var(--color-accent); }
  .deck-filters .deck-filters-search-clear {
    display: none;
    position: absolute;
    right: var(--space-2);
    cursor: pointer;
    padding: var(--deck-filters-clear-padding-y) var(--deck-filters-clear-padding-x);
    font-size: var(--font-size-edit-ui);
    color: currentColor; }
    .deck-filters .deck-filters-search-clear:hover {
      color: currentColor; }
  .deck-filters .deck-filters-search:valid ~ .deck-filters-search-clear {
    display: inline-block; }
  .deck-filters .deck-filters-search:valid ~ .deck-filters-search-icon {
    display: none; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-deck-size-preview {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  overflow: visible;
  max-height: 25px;
  -webkit-transition: max-height 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0.1s;
  transition: max-height 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0.1s; }
  .sl-deck-size-preview .toggle {
    position: absolute;
    display: block;
    margin: 0 0 6px 0;
    padding: 0;
    color: var(--color-text-secondary);
    cursor: pointer;
    white-space: nowrap;
    text-align: left; }
    .sl-deck-size-preview .toggle .icon {
      vertical-align: middle;
      margin-left: 6px;
      opacity: 0.8; }
  .sl-deck-size-preview .toggle:hover {
    color: var(--color-text-strong); }
  .sl-deck-size-preview .toggle:focus {
    outline: 1px solid var(--color-accent); }
  .sl-deck-size-preview .toggle:before {
    display: inline-block;
    content: 'Preview size and margin'; }
  .sl-deck-size-preview .previews {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 2;
        -ms-flex-positive: 2;
            flex-grow: 2;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    pointer-events: none; }
  .sl-deck-size-preview .sl-webbrowser {
    font-size: 9px;
    opacity: 0;
    -webkit-transition: all 0.2s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0s cubic-bezier(0.23, 1, 0.32, 1) 0.6s;
    transition: all 0.2s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0s cubic-bezier(0.23, 1, 0.32, 1) 0.6s;
    transition: all 0.2s cubic-bezier(0.23, 1, 0.32, 1), transform 0s cubic-bezier(0.23, 1, 0.32, 1) 0.6s;
    transition: all 0.2s cubic-bezier(0.23, 1, 0.32, 1), transform 0s cubic-bezier(0.23, 1, 0.32, 1) 0.6s, -webkit-transform 0s cubic-bezier(0.23, 1, 0.32, 1) 0.6s; }
  .sl-deck-size-preview .sl-webbrowser.wide {
    width: 214px;
    -webkit-transform: translateX(40px);
            transform: translateX(40px); }
  .sl-deck-size-preview .sl-webbrowser.tall {
    width: 96px;
    -webkit-transform: translateX(80px);
            transform: translateX(80px); }
  .sl-deck-size-preview .sl-webbrowser + .sl-webbrowser {
    margin-left: 15px; }
  .sl-deck-size-preview .sl-webbrowser-content {
    height: 116px; }
  .sl-deck-size-preview .sl-webbrowser-slide-background {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(//staging.slides.com/assets/transparent-pattern-10x10-4247fbb3404ba2647f24a2a1fdbb502b761af61897b544fa21b4035d6f023ad6.png);
    background-repeat: repeat;
    opacity: 0.5; }
  .sl-deck-size-preview .sl-webbrowser-slide-margin {
    display: none; }
  .sl-deck-size-preview .sl-webbrowser-slide,
  .sl-deck-size-preview .sl-webbrowser-slide-margin {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }
  .sl-deck-size-preview .sl-webbrowser-slide-margin {
    border: 0px solid #f3cea5; }
  .sl-deck-size-preview .sl-webbrowser-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background: #226ede;
    overflow: hidden;
    border-radius: 4px; }
  .sl-deck-size-preview .sl-webbrowser-slide-label {
    font-size: 11px;
    margin: auto;
    text-align: center;
    cursor: default;
    color: #fff;
    white-space: pre; }
  .sl-deck-size-preview .sl-webbrowser-slide-background:hover ~ .sl-webbrowser-slide,
  .sl-deck-size-preview .sl-webbrowser-slide-background:hover ~ .sl-webbrowser-slide-margin,
  .sl-deck-size-preview .sl-webbrowser-slide-margin:hover ~ .sl-webbrowser-slide {
    opacity: 0.5; }
  .sl-deck-size-preview[data-state="expanded"] {
    max-height: 150px;
    -webkit-transition: max-height 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    transition: max-height 0.5s cubic-bezier(0.23, 1, 0.32, 1); }
    .sl-deck-size-preview[data-state="expanded"] .toggle {
      margin-bottom: 10px; }
    .sl-deck-size-preview[data-state="expanded"] .toggle:before {
      content: 'Hide preview'; }
    .sl-deck-size-preview[data-state="expanded"] .toggle .icon {
      display: none; }
    .sl-deck-size-preview[data-state="expanded"] .previews {
      pointer-events: auto; }
    .sl-deck-size-preview[data-state="expanded"] .sl-webbrowser {
      -webkit-transform: none;
              transform: none;
      opacity: 1;
      -webkit-transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0.05s;
      transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0.05s; }
    .sl-deck-size-preview[data-state="expanded"] .sl-webbrowser.tall {
      -webkit-transition-duration: 0.6s;
              transition-duration: 0.6s; }
/**
 * Component used to display a list of decks.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.deck-list {
  text-align: center;
  max-width: 1250px;
  margin: 0;
  text-align: left; }
  .deck-list .deck-list-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between; }
  .deck-list .carousel {
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    grid-gap: 10px;
    width: 100%;
    padding: 10px 0;
    margin-top: -10px; }
    @media screen and (max-width: 1160px) {
      .deck-list .carousel {
        white-space: normal; } }
    .deck-list .carousel > li {
      display: inline-block;
      position: relative;
      vertical-align: top; }
  .deck-list .sl-deck-thumbnail {
    width: 100%;
    margin: 0; }
  .deck-list .sl-deck-thumbnail .deck-thumb {
    aspect-ratio: 1 / 1;
    min-height: 250px; }
  .deck-list .sl-deck-thumbnail .deck-thumb,
  .deck-list .sl-deck-thumbnail .deck-thumb-image {
    width: 100%;
    height: auto; }
  .deck-list.multiline .carousel {
    overflow: visible; }

.deck-list .deck-pagination {
  display: block;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  float: right; }
  .deck-list .deck-pagination button:first-of-type {
    margin-left: 10px; }
  .deck-list .deck-pagination button {
    font-size: 14px;
    margin-left: 4px; }

.deck-list-placeholder {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  aspect-ratio: 1 / 1;
  min-height: 250px; }
/**
 * Deck sharing component re-used across the app.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-popup[data-id="decksharer"] .sl-popup-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.sl-popup[data-id="decksharer"][data-content-state="loading"] .sl-popup-body,
.sl-popup[data-id="decksharer"][data-content-state="placeholder"] .sl-popup-body {
  min-height: 460px; }

.decksharer-share-options .split-units .unit,
.decksharer-token-options .split-units .unit {
  display: inline-block;
  width: 48%;
  margin: 0; }
.decksharer-share-options .split-units .unit + .unit,
.decksharer-token-options .split-units .unit + .unit {
  margin-left: 4%; }

.decksharer-share-warning {
  margin: 20px !important;
  padding: 20px;
  background-color: #FFFAD5;
  color: #555; }

.decksharer-share-options {
  width: 100%;
  margin: 20px 0; }
  .decksharer-share-options .decksharer-share-options-tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0 20px; }
  .decksharer-share-options .decksharer-share-options-tab {
    display: inline-block;
    position: relative;
    width: 32%;
    padding: 15px;
    border: 1px solid var(--border-default);
    border-bottom: 0;
    cursor: pointer;
    background-color: #fff;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    top: 1px;
    text-align: center;
    color: #777;
    margin-right: -1px;
    -webkit-transition: top 0.2s ease;
    transition: top 0.2s ease;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .decksharer-share-options .decksharer-share-options-tab:first-child {
    border-top-left-radius: var(--button-radius); }
  .decksharer-share-options .decksharer-share-options-tab:last-child {
    border-top-right-radius: var(--button-radius); }
  .decksharer-share-options .decksharer-share-options-tab:not(.is-selected):hover {
    background-color: #fafafa;
    z-index: 1;
    color: inherit; }
  .decksharer-share-options .decksharer-share-options-tab.is-selected {
    cursor: default;
    color: inherit;
    z-index: 4; }
  .decksharer-share-options .decksharer-share-options-pages {
    position: relative;
    z-index: 1;
    padding: 20px;
    border-top: 1px solid #ddd; }
  .decksharer-share-options .decksharer-share-options-page {
    display: none;
    position: relative; }
    .decksharer-share-options .decksharer-share-options-page label {
      display: block;
      margin-bottom: 10px; }
    .decksharer-share-options .decksharer-share-options-page .unit:last-child {
      margin-bottom: 0; }
  .decksharer-share-options .decksharer-share-options-page.is-selected {
    display: block; }
  .decksharer-share-options .decksharer-share-options-page[data-id="link"] input,
  .decksharer-share-options .decksharer-share-options-page[data-id="link"] .input-field {
    width: 100%; }
  .decksharer-share-options .decksharer-share-options-page[data-id="link"] .fullscreen-unit {
    margin-top: 0; }
  .decksharer-share-options .decksharer-share-options-page[data-id="link"] .half-units .unit {
    display: inline-block;
    width: 50%;
    margin: 0;
    vertical-align: top; }
  .decksharer-share-options .decksharer-share-options-page[data-id="link"] .half-units .unit:first-child {
    padding-right: 10px; }
  .decksharer-share-options .decksharer-share-options-page[data-id="link"] .half-units .unit:last-child {
    padding-left: 10px; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    justif-content: stretch;
    margin-bottom: 15px; }
    .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-options .unit {
      display: inline-block;
      vertical-align: top;
      margin: 0; }
    .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-options .unit + .unit {
      margin-left: 15px; }
    .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-options .unit.footer-style {
      width: 100%; }
    .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-options p {
      margin-top: 15px; }
    .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-options input {
      width: 100px;
      min-width: auto; }
    .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-options select {
      width: 100%;
      font-weight: normal; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-output-wrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-output {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-actions {
    -ms-flex-negative: 1;
        flex-shrink: 1;
    width: 50px;
    margin-left: 5px; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-actions .button {
    margin-bottom: 5px;
    font-size: 16.8px;
    height: 37px;
    width: 100%; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-extra-options input[type="text"] {
    width: 100%; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-upgrade-promotion {
    margin-top: 20px;
    padding: 10px;
    opacity: 0.6;
    width: 100%;
    line-height: 1.4;
    font-size: 12px; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .embed-upgrade-promotion:hover {
    opacity: 1; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] .sl-checkbox {
    margin: 0 0 10px 0; }
  .decksharer-share-options .decksharer-share-options-page[data-id="embed"] textarea {
    height: 80px;
    width: 100%;
    padding: 4px;
    resize: none;
    font-size: 12px;
    min-width: auto; }
  .decksharer-share-options .decksharer-share-options-page[data-id="email"] input {
    width: 100%; }
  .decksharer-share-options .decksharer-share-options-page[data-id="email"] .submit-wrapper {
    text-align: right; }
  .decksharer-share-options .decksharer-share-options-page[data-id="email"] .email-success {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(255, 255, 255, 0.85);
    text-align: center;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease; }
  .decksharer-share-options .decksharer-share-options-page[data-id="email"] .email-success-icon {
    color: #40cb90;
    font-size: 100px;
    margin: 110px 0 20px 0;
    -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -webkit-transform: translateY(30px) scale(0.6);
            transform: translateY(30px) scale(0.6);
    opacity: 0; }
  .decksharer-share-options .decksharer-share-options-page[data-id="email"] .email-success-description {
    color: #555;
    font-size: 1.2em;
    -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
    opacity: 0; }
  .decksharer-share-options .decksharer-share-options-page[data-id="email"] .email-success.visible {
    opacity: 1;
    visibility: visible; }
    .decksharer-share-options .decksharer-share-options-page[data-id="email"] .email-success.visible .email-success-icon,
    .decksharer-share-options .decksharer-share-options-page[data-id="email"] .email-success.visible .email-success-description {
      -webkit-transform: none;
              transform: none;
      opacity: 1; }

.decksharer-token-list {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-bottom-left-radius: var(--nav-link-radius);
  padding-bottom: var(--space-4);
  z-index: 2; }
  .decksharer-token-list .decksharer-token-list-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: var(--space-1); }
  .decksharer-token-list .decksharer-token-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: var(--surface-nav-link);
    border-radius: var(--nav-link-radius);
    color: var(--color-nav-link);
    position: relative;
    padding: var(--space-6) var(--space-4);
    min-height: var(--button-size-9);
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
    .decksharer-token-list .decksharer-token-list-item:hover {
      background: var(--surface-nav-link-hover);
      color: var(--color-nav-link-hover); }
    .decksharer-token-list .decksharer-token-list-item:hover .meta {
      color: var(--color-nav-link-hover); }
  .decksharer-token-list .decksharer-token-list-item.is-selected {
    background: var(--surface-nav-link-selected);
    color: var(--color-nav-link-selected);
    cursor: default; }
  .decksharer-token-list .decksharer-token-list-item .label {
    display: block;
    word-break: break-word;
    margin-bottom: 5px; }
  .decksharer-token-list .decksharer-token-list-item .meta {
    color: var(--color-text-muted);
    font-size: 0.9em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: var(--space-3); }
  .decksharer-token-list .decksharer-token-list-item .meta-data {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
    .decksharer-token-list .decksharer-token-list-item .meta-data .icon {
      margin-right: 5px; }
  .decksharer-token-list .decksharer-token-list-item .expiry {
    display: none; }
  .decksharer-token-list .decksharer-token-list-item .delete {
    display: block;
    margin-left: auto;
    color: currentColor;
    opacity: 0;
    cursor: pointer; }
    .decksharer-token-list .decksharer-token-list-item .delete:hover {
      color: var(--color-text); }
  .decksharer-token-list .decksharer-token-list-item:hover .delete {
    opacity: 1; }
  .decksharer-token-list .decksharer-token-list-item.has-expiry .expiry {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .decksharer-token-list .decksharer-token-list-item.has-expired {
    color: var(--color-text-muted); }
  .decksharer-token-list .decksharer-token-list-create {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    border-radius: var(--nav-link-radius);
    padding: 0 var(--space-4);
    min-height: var(--button-size-9);
    cursor: pointer;
    color: var(--color-text-muted);
    margin-top: var(--space-1);
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
    .decksharer-token-list .decksharer-token-list-create:hover {
      background: var(--surface-nav-link-hover);
      color: var(--color-text); }
  .decksharer-token-list .decksharer-token-list-create .ladda-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%; }

.decksharer-token-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  overflow: auto;
  overflow-x: hidden;
  -webkit-transition: all 0.2s ease 0.1s;
  transition: all 0.2s ease 0.1s;
  background-color: #fff; }
  .decksharer-token-options .decksharer-token-options-inner {
    margin: 20px; }
  .decksharer-token-options .decksharer-token-options-inner .input-field {
    width: 100%; }
  .decksharer-token-options .decksharer-token-options-inner .optional-label {
    margin-left: 6px;
    opacity: 0.5; }
  .decksharer-token-options .decksharer-share-options {
    padding-top: 20px; }
  .decksharer-token-options .decksharer-token-options-inner > :last-child {
    margin-bottom: 0 !important; }
  .decksharer-token-options .decksharer-token-options-inner > .unit {
    margin-bottom: 10px; }
  .decksharer-token-options .link-type-unit .link-type-options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .decksharer-token-options .link-type-unit .link-type-radio {
    width: 50%;
    margin: 0 0 0 10px; }
  .decksharer-token-options .link-type-unit .link-type-radio:first-of-type {
    margin: 0; }
  .decksharer-token-options.hidden {
    opacity: 0;
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease; }

.decksharer-token-options.embed-only .decksharer-share-options-tabs,
.decksharer-token-options.embed-only .notification-unit {
  display: none; }

.decksharer-placeholder {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  padding: 20px 80px;
  background-color: #fff;
  color: #666;
  z-index: 10; }
  .decksharer-placeholder .decksharer-placeholder-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 530px;
    margin: auto;
    padding-bottom: 50px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start; }
  .decksharer-placeholder .decksharer-placeholder-inner .spinner {
    margin: 0; }
  .decksharer-placeholder .left {
    margin-right: 10px; }
  .decksharer-placeholder .right {
    margin-left: 20px;
    padding-left: 20px; }
  .decksharer-placeholder .center {
    text-align: center; }
  .decksharer-placeholder .lock-icon {
    font-size: 60px;
    color: #ddd; }
  .decksharer-placeholder h3 {
    font-weight: 600 !important; }
  .decksharer-placeholder p {
    font-size: 1.1em;
    line-height: 1.5;
    margin: 0.75em 0; }
  .decksharer-placeholder .button {
    margin-top: 10px; }
  .decksharer-placeholder .button + .button {
    margin-left: 8px; }
  .decksharer-placeholder.hidden {
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease; }

@media (max-width: 768px) {
  .sl-popup[data-id="decksharer"] .sl-popup-body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; } }
/**
 * Styles for presentation thumbnails.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-deck-thumbnail {
  --deck-thumbnail-details-height: calc( var(--button-size-8) + var(--space-7) );
  --deck-thumbnail-border: var(--border-section);
  --deck-thumbnail-radius: var(--radius-4);
  --deck-thumbnail-surface: var(--surface-section);
  --deck-thumbnail-surface-muted: var(--surface-panel);
  --deck-thumbnail-text: var(--color-text);
  --deck-thumbnail-text-muted: var(--color-text-subtle);
  --deck-thumbnail-button-width: var(--button-size-5);
  --deck-thumbnail-button-height: var(--button-size-4);
  position: relative;
  white-space: normal;
  border-bottom: 0;
  height: auto;
  padding-bottom: var(--deck-thumbnail-details-height);
  -webkit-transition: -webkit-transform 0.15s ease;
  transition: -webkit-transform 0.15s ease;
  transition: transform 0.15s ease;
  transition: transform 0.15s ease, -webkit-transform 0.15s ease; }
  .sl-deck-thumbnail .deck-thumb {
    display: block;
    position: relative;
    width: 250px;
    height: 250px;
    margin: auto;
    background-color: var(--deck-thumbnail-surface-muted);
    border-top-left-radius: var(--deck-thumbnail-radius);
    border-top-right-radius: var(--deck-thumbnail-radius);
    overflow: hidden; }
  .sl-deck-thumbnail .deck-preview,
  .sl-deck-thumbnail .deck-thumb-image {
    display: block;
    position: relative;
    width: 250px;
    height: 250px;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    -o-object-fit: contain;
       object-fit: contain;
    border-top-left-radius: var(--deck-thumbnail-radius);
    border-top-right-radius: var(--deck-thumbnail-radius); }
  .sl-deck-thumbnail .deck-thumb-image:not([src]) {
    visibility: hidden; }
  .sl-deck-thumbnail .deck-link {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: block;
    z-index: 1;
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--deck-thumbnail-border);
    border-radius: var(--deck-thumbnail-radius);
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease; }
  .sl-deck-thumbnail .deck-details {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    min-height: var(--deck-thumbnail-details-height);
    padding: calc( var(--space-4) + var(--space-1) ) calc( var(--space-4) + var(--space-1) ) var(--space-4);
    text-align: left;
    border-top: 1px solid var(--deck-thumbnail-border);
    font-size: 0.875em;
    line-height: 1.5;
    background: var(--deck-thumbnail-surface);
    border-bottom-left-radius: var(--deck-thumbnail-radius);
    border-bottom-right-radius: var(--deck-thumbnail-radius); }
    .sl-deck-thumbnail .deck-details .top,
    .sl-deck-thumbnail .deck-details .bottom {
      position: relative; }
    .sl-deck-thumbnail .deck-details .author {
      position: relative;
      opacity: 1;
      color: var(--deck-thumbnail-text);
      z-index: 2;
      -webkit-box-flex: 1;
          -ms-flex-positive: 1;
              flex-grow: 1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }
      .sl-deck-thumbnail .deck-details .author .picture {
        display: inline-block;
        position: relative;
        width: 20px;
        height: 20px;
        margin-right: var(--space-3);
        vertical-align: top;
        background-size: cover;
        background-repeat: no-repeat; }
    .sl-deck-thumbnail .deck-details .bottom {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      padding-top: var(--space-5);
      margin-top: var(--space-4);
      border-top: 1px solid var(--deck-thumbnail-border); }
    .sl-deck-thumbnail .deck-details .bottom.seamless {
      padding-top: 0;
      border-top: 0; }
      .sl-deck-thumbnail .deck-details .bottom.seamless .stats {
        color: var(--deck-thumbnail-text-muted); }
    .sl-deck-thumbnail .deck-details .stats {
      color: var(--deck-thumbnail-text);
      background: var(--deck-thumbnail-surface);
      cursor: default;
      -ms-flex-negative: 0;
          flex-shrink: 0; }
      .sl-deck-thumbnail .deck-details .stats > div {
        display: inline-block; }
      .sl-deck-thumbnail .deck-details .stats .icon {
        margin-left: var(--space-1); }
    .sl-deck-thumbnail .deck-details .title {
      display: block;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }
    .sl-deck-thumbnail .deck-details .team {
      opacity: 0.6; }
    .sl-deck-thumbnail .deck-details .bottom .button {
      position: relative;
      z-index: 2;
      margin-left: auto; }
    .sl-deck-thumbnail .deck-details .bottom .button .icon {
      vertical-align: middle; }
  .sl-deck-thumbnail .deck-preview-controls {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none; }
    .sl-deck-thumbnail .deck-preview-controls button {
      padding: 0;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      width: var(--deck-thumbnail-button-width);
      height: var(--deck-thumbnail-button-height); }
  .sl-deck-thumbnail .deck-preview-controls .fullscreen-button,
  .sl-deck-thumbnail .deck-preview-controls .open-deck-button {
    margin-right: 8px; }
  .sl-deck-thumbnail .show-in-preview,
  .sl-deck-thumbnail .show-in-fullscreen {
    display: none; }
  .sl-deck-thumbnail[data-context="template"] .deck-preview-controls .open-deck-button, .sl-deck-thumbnail[data-context="template-blank"] .deck-preview-controls .open-deck-button {
    display: none; }
  .sl-deck-thumbnail:not([data-context="template"]) .deck-preview-controls .fullscreen-button {
    display: none; }
  .sl-deck-thumbnail:not([data-state="preview"]):hover:not(.no-float) {
    -webkit-transform: translateY(-4px);
            transform: translateY(-4px); }
    .sl-deck-thumbnail:not([data-state="preview"]):hover:not(.no-float) .deck-link {
      border-color: var(--border-strong);
      -webkit-box-shadow: var(--shadow-section);
              box-shadow: var(--shadow-section); }
  .sl-deck-thumbnail:not([data-state="preview"]):hover .deck-preview-controls {
    display: block; }
  .sl-deck-thumbnail:not([data-state="preview"]):hover .deck-details .title {
    white-space: normal; }

.sl-deck-thumbnail.auto-width .deck-thumb,
.sl-deck-thumbnail.auto-width .deck-thumb-image {
  width: 100%;
  height: auto; }

.sl-deck-thumbnail[data-state="preview"] {
  pointer-events: none; }
  .sl-deck-thumbnail[data-state="preview"] .deck-details {
    pointer-events: none; }
  .sl-deck-thumbnail[data-state="preview"] .deck-preview-controls {
    display: block; }
  .sl-deck-thumbnail[data-state="preview"] .deck-thumb,
  .sl-deck-thumbnail[data-state="preview"] .deck-details .button,
  .sl-deck-thumbnail[data-state="preview"] .deck-preview-controls {
    pointer-events: auto; }
  .sl-deck-thumbnail[data-state="preview"] .hide-in-preview {
    display: none; }
  .sl-deck-thumbnail[data-state="preview"] .show-in-preview {
    display: inline-block; }
  .sl-deck-thumbnail[data-state="preview"] .deck-preview {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0; }
    .sl-deck-thumbnail[data-state="preview"] .deck-preview iframe {
      display: block;
      width: 100%;
      height: 100%;
      border: 0; }
  .sl-deck-thumbnail[data-state="preview"] .deck-preloader {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(var(--surface-canvas-rgb), 0.95);
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease;
    opacity: 0;
    -webkit-animation: fade-in 0.2s;
            animation: fade-in 0.2s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards; }

.sl-deck-thumbnail[data-state="preview"]:-webkit-full-screen:not(.has-deck-details) {
  padding-bottom: 0; }

.sl-deck-thumbnail[data-state="preview"]:-ms-fullscreen:not(.has-deck-details) {
  padding-bottom: 0; }

.sl-deck-thumbnail[data-state="preview"]:fullscreen:not(.has-deck-details) {
  padding-bottom: 0; }
.sl-deck-thumbnail[data-state="preview"]:-webkit-full-screen .deck-preview-controls {
  font-size: 1.25rem;
  top: 1rem;
  right: 1rem; }
.sl-deck-thumbnail[data-state="preview"]:-ms-fullscreen .deck-preview-controls {
  font-size: 1.25rem;
  top: 1rem;
  right: 1rem; }
.sl-deck-thumbnail[data-state="preview"]:fullscreen .deck-preview-controls {
  font-size: 1.25rem;
  top: 1rem;
  right: 1rem; }
.sl-deck-thumbnail[data-state="preview"]:-webkit-full-screen .deck-thumb {
  width: 100%;
  height: 100%; }
.sl-deck-thumbnail[data-state="preview"]:-ms-fullscreen .deck-thumb {
  width: 100%;
  height: 100%; }
.sl-deck-thumbnail[data-state="preview"]:fullscreen .deck-thumb {
  width: 100%;
  height: 100%; }
.sl-deck-thumbnail[data-state="preview"]:-webkit-full-screen .hide-in-fullscreen {
  display: none; }
.sl-deck-thumbnail[data-state="preview"]:-ms-fullscreen .hide-in-fullscreen {
  display: none; }
.sl-deck-thumbnail[data-state="preview"]:fullscreen .hide-in-fullscreen {
  display: none; }
.sl-deck-thumbnail[data-state="preview"]:-webkit-full-screen .show-in-fullscreen {
  display: inline-block; }
.sl-deck-thumbnail[data-state="preview"]:-ms-fullscreen .show-in-fullscreen {
  display: inline-block; }
.sl-deck-thumbnail[data-state="preview"]:fullscreen .show-in-fullscreen {
  display: inline-block; }
.sl-deck-thumbnail[data-state="preview"]:-webkit-full-screen .select-button {
  background-color: var(--color-accent);
  color: var(--color-text-inverse); }
.sl-deck-thumbnail[data-state="preview"]:-ms-fullscreen .select-button {
  background-color: var(--color-accent);
  color: var(--color-text-inverse); }
.sl-deck-thumbnail[data-state="preview"]:fullscreen .select-button {
  background-color: var(--color-accent);
  color: var(--color-text-inverse); }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-drawer {
  --secondary-button-size: calc( var( --drawer-menu-width ) * 0.75 );
  --drawer-spacing: var(--space-4);
  --drawer-margin: var(--space-4);
  --drawer-offcreen-offset: 2px;
  --drawer-indent-width: 20px; }

.sl-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: var(--drawer-menu-width);
  height: 100%;
  color: var(--color-text-strong);
  z-index: 100;
  font-size: var(--font-size-edit-ui);
  -webkit-transform: none;
          transform: none;
  -webkit-transition: visibility 0.25s ease, -webkit-transform 0.25s ease;
  transition: visibility 0.25s ease, -webkit-transform 0.25s ease;
  transition: visibility 0.25s ease, transform 0.25s ease;
  transition: visibility 0.25s ease, transform 0.25s ease, -webkit-transform 0.25s ease; }

.sl-drawer-expand-button {
  position: absolute;
  top: var(--space-4);
  right: calc( 100% + var(--space-4) + var(--drawer-offcreen-offset) );
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease; }

.sl-drawer-menu {
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
  z-index: 2;
  width: var(--drawer-menu-width);
  height: 100%;
  background-color: var(--editor-panel-1-bg);
  -webkit-box-shadow: -1px 0 0 var(--panel-divider-color);
          box-shadow: -1px 0 0 var(--panel-divider-color);
  overflow-y: auto; }

.sl-drawer-menu-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom: 4px; }

.sl-drawer-menu-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
  width: var(--drawer-menu-width);
  height: var(--drawer-menu-width);
  cursor: pointer;
  font-size: 16px; }
  .sl-drawer-menu-item.active {
    background-color: var(--surface-inverse);
    color: var(--inverse-text); }
  .sl-drawer-menu-item.expandable {
    height: auto; }

.sl-drawer-secondary-option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--secondary-button-size);
  height: var(--secondary-button-size);
  border-radius: var(--secondary-button-size);
  list-style: none;
  color: var(--color-text-strong);
  cursor: pointer; }
  .sl-drawer-secondary-option:hover {
    color: var(--color-text-strong);
    background: var(--surface-hover-strong); }
  .sl-drawer-secondary-option.is-set {
    color: var(--color-text-strong);
    background: var(--surface-hover-stronger); }
  .sl-drawer-secondary-option .icon {
    position: relative; }
  .sl-drawer-secondary-option svg {
    width: 36px;
    height: 36px; }

.sl-drawer-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: var(--space-4);
  margin-top: auto; }

.sl-drawer-footer .icon {
  font-size: 16px; }

.sl-drawer-auto-hide .icon {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }

.auto-hide-drawer .sl-drawer-auto-hide .icon {
  -webkit-transform: none;
          transform: none; }

.sl-drawer-menu-items:not(:last-child),
.sl-drawer-menu-items > *:not(:last-child) {
  border-bottom: 1px solid var(--panel-divider-color); }

.sl-drawer-menu-item .notification-count {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 16px;
  bottom: 4px;
  left: 4px;
  background-color: var(--color-accent);
  color: #fff;
  font-size: 10px;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  z-index: 3; }

.sl-drawer-tab {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: var(--drawer-menu-width);
  height: var(--drawer-menu-width); }
  .sl-drawer-tab .i-ai,
  .sl-drawer-tab .i-chevron-right {
    font-size: 18px; }
  .sl-drawer-tab:hover {
    background-color: var(--surface-hover-strong); }
  .sl-drawer-tab .expand-icon,
  .sl-drawer-tab .collapse-icon {
    position: absolute;
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease; }

.sl-drawer-menu-item.active .sl-drawer-tab:hover {
  background-color: transparent; }
.sl-drawer-menu-item.active .sl-drawer-tab:hover:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: var(--secondary-button-size);
  height: var(--secondary-button-size);
  border-radius: var(--secondary-button-size);
  background-color: var(--surface-hover-strong); }
.sl-drawer-menu-item .collapse-icon, .sl-drawer-menu-item.active .sl-drawer-tab:hover .expand-icon {
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
  opacity: 0; }
.sl-drawer-menu-item.active .sl-drawer-tab:hover .collapse-icon {
  -webkit-transform: none;
          transform: none;
  opacity: 1; }

.sl-drawer-tab-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 4px;
  overflow: hidden;
  font-size: 14px;
  opacity: 0;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease; }

.sl-drawer-tab-option {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--secondary-button-size);
  height: var(--secondary-button-size);
  border-radius: var(--secondary-button-size); }
  .sl-drawer-tab-option:hover {
    opacity: 1;
    background: var(--surface-hover-strong); }

.sl-drawer-menu-item:not(.active) .sl-drawer-tab-options {
  max-height: 0 !important; }

.sl-drawer-menu-item.expandable.active .sl-drawer-tab:before {
  content: '';
  position: absolute;
  top: 100%;
  left: 15%;
  width: 70%;
  height: 1px;
  background-color: var(--panel-divider-color); }

.sl-drawer-menu-item.active .sl-drawer-tab-options {
  opacity: 1;
  margin: 6px 0; }

.sl-drawer-tools {
  position: absolute;
  width: var(--drawer-tool-width);
  height: 100%;
  visibility: hidden;
  background-color: var(--editor-panel-2-bg);
  -webkit-box-shadow: -1px 0 0 var(--border-subtle);
          box-shadow: -1px 0 0 var(--border-subtle);
  -webkit-transform: none;
          transform: none; }

[data-drawer] .sl-drawer-tools {
  -webkit-transform: translateX(calc( var( --drawer-tool-width ) * -1 ));
          transform: translateX(calc( var( --drawer-tool-width ) * -1 ));
  visibility: visible; }

[data-drawer] .sl-drawer-menu {
  -webkit-box-shadow: -1px 0px 0px 0px var(--panel-divider-color);
          box-shadow: -1px 0px 0px 0px var(--panel-divider-color); }

.sl-drawer-tool-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0 var(--space-6);
  color: var(--color-text-strong);
  height: var(--drawer-item-size);
  -webkit-box-shadow: 0 1px 0 var(--border-default);
          box-shadow: 0 1px 0 var(--border-default); }

.sl-drawer-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: var(--drawer-spacing);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-3);
  background-color: var(--surface-raised);
  color: var(--color-text-muted);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer; }
  .sl-drawer-button.icon {
    padding: var(--space-2); }
  .sl-drawer-button.ghost {
    background-color: transparent; }
  .sl-drawer-button:hover, .sl-drawer-button.active {
    background-color: var(--surface-inverse);
    color: var(--color-text-inverse); }

.sl-drawer-list {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: var(--space-4);
  padding-bottom: var(--space-6);
  gap: 1px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  overflow: auto; }

.sl-drawer-item {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: var(--space-4);
  padding: var(--drawer-spacing);
  padding-left: calc(var(--drawer-spacing) + var(--depth) * var(--drawer-indent-width) - var(--space-3));
  cursor: pointer;
  color: var(--color-text-strong);
  border-radius: var(--radius-2);
  -webkit-tap-highlight-color: transparent; }
  .sl-drawer-item.is-focused .sl-drawer-item-icon, .sl-drawer-item.is-selected .sl-drawer-item-icon {
    color: var(--color-text-strong); }

.sl-drawer-item svg {
  overflow: visible;
  max-height: var(--space-6); }
  .sl-drawer-item svg path, .sl-drawer-item svg rect, .sl-drawer-item svg circle, .sl-drawer-item svg ellipse, .sl-drawer-item svg polygon, .sl-drawer-item svg line, .sl-drawer-item svg polyline, .sl-drawer-item svg polygon {
    stroke: white;
    stroke-width: 1px; }
  .sl-drawer-item svg .shape-element {
    stroke-width: 2px; }

.sl-drawer-item .sl-drawer-item-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--space-7);
  height: var(--space-7);
  margin: var(--minus-space-1);
  color: var(--color-text-muted);
  font-size: 12px; }

.is-editing.auto-hide-drawer:not([data-drawer]) .sl-drawer:before {
  height: 40vh; }

.auto-hide-drawer:not([data-drawer]),
[data-mode="preview"]:not([data-drawer]) {
  --page-inset-right: 0px; }
  .auto-hide-drawer:not([data-drawer]) .sl-drawer,
  [data-mode="preview"]:not([data-drawer]) .sl-drawer {
    -webkit-transform: translateX(calc( var( --drawer-menu-width ) + var(--drawer-offcreen-offset) ));
            transform: translateX(calc( var( --drawer-menu-width ) + var(--drawer-offcreen-offset) )); }
  .auto-hide-drawer:not([data-drawer]) .sl-drawer-expand-button,
  [data-mode="preview"]:not([data-drawer]) .sl-drawer-expand-button {
    opacity: 1;
    visibility: visible; }
  .auto-hide-drawer:not([data-drawer]) .sl-drawer:before,
  [data-mode="preview"]:not([data-drawer]) .sl-drawer:before {
    content: '';
    position: absolute;
    top: 0;
    right: 100%;
    width: var(--drawer-menu-width);
    height: 70vh;
    z-index: 0; }
  .auto-hide-drawer:not([data-drawer]) .sl-drawer:hover:after,
  [data-mode="preview"]:not([data-drawer]) .sl-drawer:hover:after {
    content: '';
    position: absolute;
    top: 0;
    right: 100%;
    width: 14px;
    height: 100vh;
    z-index: 0; }
  .auto-hide-drawer:not([data-drawer]) .sl-drawer-menu:before,
  [data-mode="preview"]:not([data-drawer]) .sl-drawer-menu:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    -webkit-transition: all 0.1875s linear;
    transition: all 0.1875s linear; }
  .auto-hide-drawer:not([data-drawer]) .sl-drawer:hover,
  .auto-hide-drawer:not([data-drawer]) .sl-drawer:has(.popover-anchor),
  [data-mode="preview"]:not([data-drawer]) .sl-drawer:hover,
  [data-mode="preview"]:not([data-drawer]) .sl-drawer:has(.popover-anchor) {
    -webkit-transform: none !important;
            transform: none !important; }
    .auto-hide-drawer:not([data-drawer]) .sl-drawer:hover .sl-drawer-expand-button,
    .auto-hide-drawer:not([data-drawer]) .sl-drawer:hover .sl-drawer-expand-button,
    .auto-hide-drawer:not([data-drawer]) .sl-drawer:has(.popover-anchor) .sl-drawer-expand-button,
    .auto-hide-drawer:not([data-drawer]) .sl-drawer:has(.popover-anchor) .sl-drawer-expand-button,
    [data-mode="preview"]:not([data-drawer]) .sl-drawer:hover .sl-drawer-expand-button,
    [data-mode="preview"]:not([data-drawer]) .sl-drawer:hover .sl-drawer-expand-button,
    [data-mode="preview"]:not([data-drawer]) .sl-drawer:has(.popover-anchor) .sl-drawer-expand-button,
    [data-mode="preview"]:not([data-drawer]) .sl-drawer:has(.popover-anchor) .sl-drawer-expand-button {
      opacity: 0;
      visibility: hidden; }
    .auto-hide-drawer:not([data-drawer]) .sl-drawer:hover .sl-drawer-menu:before,
    .auto-hide-drawer:not([data-drawer]) .sl-drawer:has(.popover-anchor) .sl-drawer-menu:before,
    [data-mode="preview"]:not([data-drawer]) .sl-drawer:hover .sl-drawer-menu:before,
    [data-mode="preview"]:not([data-drawer]) .sl-drawer:has(.popover-anchor) .sl-drawer-menu:before {
      opacity: 0;
      visibility: hidden; }

.auto-hide-drawer:not([data-drawer]):has(.sl-drawer:hover, .sl-drawer-menu .popover-anchor) {
  --overlay-button-inset-right: calc( var( --drawer-menu-width ) * -1 ); }
/**
 * Site-wide footer.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.global-footer {
  --footer-link-padding-y: var(--space-4);
  --footer-link-padding-x: var(--space-4);
  --footer-link-radius: var(--radius-3);
  --footer-padding-y: var(--section-padding);
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: var(--page-padding);
  padding-bottom: calc(var(--footer-padding-y) * 1.5);
  margin-bottom: 0px;
  clear: both;
  color: var(--color-text-muted);
  font-size: 14px;
  max-width: var(--page-max-width);
  text-align: center;
  line-height: 1.3em; }
  .global-footer .global-footer-links {
    margin: 0 calc( var(--footer-link-padding-x) * -1 ); }
  .global-footer:before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    border-top: 1px solid var(--border-section);
    margin-bottom: var(--footer-padding-y); }
  .global-footer .global-footer-links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-bottom: var(--footer-padding-y);
    gap: 2em; }
  .global-footer .link-group {
    display: inline-block;
    text-align: left;
    vertical-align: top;
    width: 100%;
    margin: 0;
    max-width: 200px; }
    .global-footer .link-group h4, .global-footer .link-group a, .global-footer .link-group span {
      display: block;
      padding: var(--footer-link-padding-y) var(--footer-link-padding-x);
      font-size: inherit; }
    .global-footer .link-group h4 {
      color: var(--color-text-secondary);
      margin-bottom: 15px; }
  .global-footer small {
    display: block;
    margin-top: var(--space-4);
    font-size: 15px; }
  .global-footer a {
    position: relative;
    border-radius: var(--footer-link-radius);
    color: var(--color-text-muted);
    -webkit-transition: none;
    transition: none; }
    .global-footer a:hover {
      color: var(--color-text-strong);
      background-color: var(--surface-hover); }
    .global-footer a:active {
      top: 1px; }
  .global-footer button {
    position: relative;
    border-radius: var(--footer-link-radius);
    color: var(--color-text-muted); }
  .global-footer button:hover {
    color: var(--color-text-strong);
    background-color: var(--surface-hover); }
  .global-footer button:active {
    top: 1px; }
  .global-footer span {
    padding: var(--space-1) var(--space-3); }
  .global-footer h4 {
    font-weight: 500; }
  .global-footer .global-footer-bottom {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: var(--footer-padding-y);
    padding-top: var(--footer-padding-y);
    border-top: 1px solid var(--border-section); }
  .global-footer .social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-left: calc( var(--footer-link-padding-x) * -1 ); }
  .global-footer .social a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: var(--button-size-4);
    height: var(--button-size-4);
    font-size: 0.75em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
  .global-footer .social svg {
    width: var(--button-size-1);
    height: var(--button-size-1); }
  .global-footer .social .twitter-link:hover {
    background-color: #000;
    color: #fff; }
  .global-footer .social .facebook-link:hover {
    background-color: #3b5998;
    color: #fff; }
  .global-footer .legal {
    --footer-link-padding-x: var(--space-5);
    --footer-legal-item-height: var(--button-size-4);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    color: var(--color-text-muted);
    font-size: 13px;
    border-top: 0;
    text-align: right;
    line-height: 1.5; }
  .global-footer .legal a,
  .global-footer .legal button,
  .global-footer .legal span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: var(--footer-legal-item-height);
    padding: 0 var(--footer-link-padding-x); }
  .global-footer .theme-mode-footer-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border: 0;
    background: transparent;
    font: inherit;
    cursor: pointer;
    line-height: 1; }
  .global-footer .theme-mode-cycle-button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border: 0;
    background: transparent;
    font: inherit;
    cursor: pointer;
    line-height: 1; }
  .global-footer .theme-mode-cycle-button:focus-visible {
    outline: 1px solid #226ede;
    outline-offset: 2px; }
  @media screen and (max-width: 1000px) {
    .global-footer .link-group {
      margin-left: 0;
      margin-right: 0; } }
  @media screen and (max-width: 700px) {
    .global-footer {
      margin-top: var(--section-margin); }
      .global-footer .global-footer-links {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
      .global-footer .link-group {
        margin-left: 0;
        margin-right: 0; }
        .global-footer .link-group h4 {
          margin-bottom: 8px; } }

.global-footer-minimal {
  line-height: 1.6; }
  .global-footer-minimal .legal {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
  .global-footer-minimal .legal a,
  .global-footer-minimal .legal button,
  .global-footer-minimal .legal span {
    margin: 0 -2px; }

html.deck-dashboard .container > .global-footer {
  display: none; }

.app-nav .global-footer {
  --footer-padding-y: var(--space-6);
  display: block;
  margin-top: auto;
  padding: calc( var(--space-6) + var(--space-2) ) 0 0 0;
  width: 100%;
  border-top: 0; }

.app-nav .global-footer .legal {
  font-size: 12px;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start; }
/**
 * Site-wide form styles.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.input-field,
form textarea, .sl-form textarea,
form input[type=text], .sl-form input[type=text],
form input[type=number], .sl-form input[type=number],
form input[type=email], .sl-form input[type=email],
form input[type=search], .sl-form input[type=search],
form input[type=password], .sl-form input[type=password] {
  --button-size: var(--button-size-6);
  border: 1px solid var(--form-field-border);
  border-radius: var(--form-field-radius);
  background: var(--form-field-surface);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: var(--form-field-text);
  -webkit-appearance: none; }
  .input-field::-webkit-input-placeholder, form textarea::-webkit-input-placeholder, .sl-form textarea::-webkit-input-placeholder, form input[type=text]::-webkit-input-placeholder, .sl-form input[type=text]::-webkit-input-placeholder, form input[type=number]::-webkit-input-placeholder, .sl-form input[type=number]::-webkit-input-placeholder, form input[type=email]::-webkit-input-placeholder, .sl-form input[type=email]::-webkit-input-placeholder, form input[type=search]::-webkit-input-placeholder, .sl-form input[type=search]::-webkit-input-placeholder, form input[type=password]::-webkit-input-placeholder, .sl-form input[type=password]::-webkit-input-placeholder {
    color: var(--form-field-text-muted); }
  .input-field::-moz-placeholder, form textarea::-moz-placeholder, .sl-form textarea::-moz-placeholder, form input[type=text]::-moz-placeholder, .sl-form input[type=text]::-moz-placeholder, form input[type=number]::-moz-placeholder, .sl-form input[type=number]::-moz-placeholder, form input[type=email]::-moz-placeholder, .sl-form input[type=email]::-moz-placeholder, form input[type=search]::-moz-placeholder, .sl-form input[type=search]::-moz-placeholder, form input[type=password]::-moz-placeholder, .sl-form input[type=password]::-moz-placeholder {
    color: var(--form-field-text-muted); }
  .input-field:-ms-input-placeholder, form textarea:-ms-input-placeholder, .sl-form textarea:-ms-input-placeholder, form input[type=text]:-ms-input-placeholder, .sl-form input[type=text]:-ms-input-placeholder, form input[type=number]:-ms-input-placeholder, .sl-form input[type=number]:-ms-input-placeholder, form input[type=email]:-ms-input-placeholder, .sl-form input[type=email]:-ms-input-placeholder, form input[type=search]:-ms-input-placeholder, .sl-form input[type=search]:-ms-input-placeholder, form input[type=password]:-ms-input-placeholder, .sl-form input[type=password]:-ms-input-placeholder {
    color: var(--form-field-text-muted); }
  .input-field::-ms-input-placeholder, form textarea::-ms-input-placeholder, .sl-form textarea::-ms-input-placeholder, form input[type=text]::-ms-input-placeholder, .sl-form input[type=text]::-ms-input-placeholder, form input[type=number]::-ms-input-placeholder, .sl-form input[type=number]::-ms-input-placeholder, form input[type=email]::-ms-input-placeholder, .sl-form input[type=email]::-ms-input-placeholder, form input[type=search]::-ms-input-placeholder, .sl-form input[type=search]::-ms-input-placeholder, form input[type=password]::-ms-input-placeholder, .sl-form input[type=password]::-ms-input-placeholder {
    color: var(--form-field-text-muted); }
  .input-field::placeholder,
  form textarea::placeholder, .sl-form textarea::placeholder,
  form input[type=text]::placeholder, .sl-form input[type=text]::placeholder,
  form input[type=number]::placeholder, .sl-form input[type=number]::placeholder,
  form input[type=email]::placeholder, .sl-form input[type=email]::placeholder,
  form input[type=search]::placeholder, .sl-form input[type=search]::placeholder,
  form input[type=password]::placeholder, .sl-form input[type=password]::placeholder {
    color: var(--form-field-text-muted); }
  .input-field:hover,
  form textarea:hover, .sl-form textarea:hover,
  form input[type=text]:hover, .sl-form input[type=text]:hover,
  form input[type=number]:hover, .sl-form input[type=number]:hover,
  form input[type=email]:hover, .sl-form input[type=email]:hover,
  form input[type=search]:hover, .sl-form input[type=search]:hover,
  form input[type=password]:hover, .sl-form input[type=password]:hover {
    border-color: var(--form-field-border-hover); }
  .input-field:focus,
  form textarea:focus, .sl-form textarea:focus,
  form input[type=text]:focus, .sl-form input[type=text]:focus,
  form input[type=number]:focus, .sl-form input[type=number]:focus,
  form input[type=email]:focus, .sl-form input[type=email]:focus,
  form input[type=search]:focus, .sl-form input[type=search]:focus,
  form input[type=password]:focus, .sl-form input[type=password]:focus {
    background: var(--form-field-surface-focus);
    border-color: var(--form-field-border-active);
    -webkit-box-shadow: none;
            box-shadow: none;
    outline: 0; }
  .input-field[readonly]:focus,
  form textarea[readonly]:focus, .sl-form textarea[readonly]:focus,
  form input[type=text][readonly]:focus, .sl-form input[type=text][readonly]:focus,
  form input[type=number][readonly]:focus, .sl-form input[type=number][readonly]:focus,
  form input[type=email][readonly]:focus, .sl-form input[type=email][readonly]:focus,
  form input[type=search][readonly]:focus, .sl-form input[type=search][readonly]:focus,
  form input[type=password][readonly]:focus, .sl-form input[type=password][readonly]:focus {
    background: var(--form-field-surface); }

.input-field:not(textarea),
form input[type=text], .sl-form input[type=text],
form input[type=number], .sl-form input[type=number],
form input[type=email], .sl-form input[type=email],
form input[type=search], .sl-form input[type=search],
form input[type=password], .sl-form input[type=password] {
  height: var(--button-size);
  padding: 0 var(--form-field-padding); }
  .input-field:not(textarea).xs,
  form input[type=text].xs, .sl-form input[type=text].xs,
  form input[type=number].xs, .sl-form input[type=number].xs,
  form input[type=email].xs, .sl-form input[type=email].xs,
  form input[type=search].xs, .sl-form input[type=search].xs,
  form input[type=password].xs, .sl-form input[type=password].xs {
    --button-size: var(--button-size-1); }
  .input-field:not(textarea).s,
  form input[type=text].s, .sl-form input[type=text].s,
  form input[type=number].s, .sl-form input[type=number].s,
  form input[type=email].s, .sl-form input[type=email].s,
  form input[type=search].s, .sl-form input[type=search].s,
  form input[type=password].s, .sl-form input[type=password].s {
    --button-size: var(--button-size-2);
    font-size: 0.8em; }
  .input-field:not(textarea).m,
  form input[type=text].m, .sl-form input[type=text].m,
  form input[type=number].m, .sl-form input[type=number].m,
  form input[type=email].m, .sl-form input[type=email].m,
  form input[type=search].m, .sl-form input[type=search].m,
  form input[type=password].m, .sl-form input[type=password].m {
    --button-size: var(--button-size-3); }
  .input-field:not(textarea).l,
  form input[type=text].l, .sl-form input[type=text].l,
  form input[type=number].l, .sl-form input[type=number].l,
  form input[type=email].l, .sl-form input[type=email].l,
  form input[type=search].l, .sl-form input[type=search].l,
  form input[type=password].l, .sl-form input[type=password].l {
    --button-size: var(--button-size-4);
    font-size: 1em; }
  .input-field:not(textarea).xl,
  form input[type=text].xl, .sl-form input[type=text].xl,
  form input[type=number].xl, .sl-form input[type=number].xl,
  form input[type=email].xl, .sl-form input[type=email].xl,
  form input[type=search].xl, .sl-form input[type=search].xl,
  form input[type=password].xl, .sl-form input[type=password].xl {
    --button-size: var(--button-size-7);
    padding: 0 var(--space-6);
    font-size: 1.2em; }

textarea.input-field,
form textarea,
.sl-form textarea {
  padding: var(--form-field-padding); }

form textarea,
.sl-form textarea {
  font-size: 0.9em;
  line-height: 1.4em; }

form,
.sl-form {
  --form-status-success-surface: var(--status-success-surface);
  --form-status-success-text: var(--status-success-text);
  --form-status-warning-surface: var(--status-warning-surface);
  --form-status-warning-text: var(--status-warning-text);
  --form-unit-margin-top: var(--space-6);
  --form-unit-margin-bottom: calc( var(--space-8) - var(--space-1) );
  --form-description-gap: var(--space-4);
  --form-actions-gap: var(--space-4);
  --form-divider-color: var(--border-subtle); }
  form .unit,
  .sl-form .unit {
    display: block;
    position: relative;
    margin: var(--form-unit-margin-top) 0 var(--form-unit-margin-bottom) 0; }
    form .unit:first-child,
    .sl-form .unit:first-child {
      margin-top: 0; }
  form .form-label,
  form .unit label,
  .sl-form .form-label,
  .sl-form .unit label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: var(--space-2);
    font-weight: 500; }
  form .sl-checkbox label,
  form .sl-datepicker label,
  .sl-form .sl-checkbox label,
  .sl-form .sl-datepicker label {
    font-weight: 400; }
  form .unit .unit-description,
  .sl-form .unit .unit-description {
    margin-top: 0;
    font-size: 13px;
    color: var(--form-field-text-muted); }
  form .unit input + .unit-description,
  .sl-form .unit input + .unit-description {
    margin-top: var(--form-description-gap); }
  form .unit .deprecation-warning,
  .sl-form .unit .deprecation-warning {
    margin: 1em 0;
    color: var(--form-status-warning-text);
    background: var(--form-status-warning-surface);
    padding: var(--space-4);
    border-radius: var(--radius-3); }
  form .unit textarea,
  .sl-form .unit textarea {
    width: 100%;
    resize: none; }
  form .unit.hidden,
  .sl-form .unit.hidden {
    display: none; }
  form .unit.checkbox label,
  .sl-form .unit.checkbox label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: var(--space-4);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
  form .unit-divider,
  .sl-form .unit-divider {
    margin: 2em 0;
    height: 1px;
    background-color: var(--form-divider-color); }
  form .unit.text.label-placeholder input,
  .sl-form .unit.text.label-placeholder input {
    --button-size: var(--button-size-6);
    padding: calc( var(--form-field-padding) * 1.7 ) var(--form-field-padding) calc( var(--form-field-padding) * 0.3 ) var(--form-field-padding); }
  form .unit.text.label-placeholder label,
  .sl-form .unit.text.label-placeholder label {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 60%;
    opacity: 0.5;
    font-size: 0.6em;
    font-weight: 500;
    padding: 0 var(--form-field-padding);
    -webkit-transition: all 0.15s cubic-bezier(0.3, 0.9, 0.135, 1);
    transition: all 0.15s cubic-bezier(0.3, 0.9, 0.135, 1);
    pointer-events: none; }
  form .unit.text.label-placeholder input:invalid:not(.is-autofilled),
  .sl-form .unit.text.label-placeholder input:invalid:not(.is-autofilled) {
    padding: 0 var(--form-field-padding);
    outline: 0;
    -webkit-box-shadow: none;
            box-shadow: none; }
  form .unit.text.label-placeholder input:invalid:not(.is-autofilled) + label,
  .sl-form .unit.text.label-placeholder input:invalid:not(.is-autofilled) + label {
    font-size: 1em;
    font-weight: 400;
    height: 100%; }
  form .unit.text .prefix.http,
  .sl-form .unit.text .prefix.http {
    width: 65px; }
    form .unit.text .prefix.http:after,
    .sl-form .unit.text .prefix.http:after {
      content: 'http://'; }
    form .unit.text .prefix.http ~ input,
    .sl-form .unit.text .prefix.http ~ input {
      padding-left: 75px; }
  form .unit.text .prefixed-input,
  form .unit.text .suffixed-input,
  .sl-form .unit.text .prefixed-input,
  .sl-form .unit.text .suffixed-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row; }
    form .unit.text .prefixed-input .prefix,
    form .unit.text .prefixed-input .suffix,
    form .unit.text .suffixed-input .prefix,
    form .unit.text .suffixed-input .suffix,
    .sl-form .unit.text .prefixed-input .prefix,
    .sl-form .unit.text .prefixed-input .suffix,
    .sl-form .unit.text .suffixed-input .prefix,
    .sl-form .unit.text .suffixed-input .suffix {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -ms-flex-negative: 0;
          flex-shrink: 0;
      max-width: 70%;
      padding: 0 var(--space-5);
      border: 1px solid var(--form-field-border);
      background-color: var(--form-field-surface-muted);
      color: var(--form-field-text-muted);
      cursor: default; }
    form .unit.text .prefixed-input .prefix,
    form .unit.text .suffixed-input .prefix,
    .sl-form .unit.text .prefixed-input .prefix,
    .sl-form .unit.text .suffixed-input .prefix {
      border-top-left-radius: var(--form-field-radius);
      border-bottom-left-radius: var(--form-field-radius);
      border-right: 0; }
    form .unit.text .prefixed-input .suffix,
    form .unit.text .suffixed-input .suffix,
    .sl-form .unit.text .prefixed-input .suffix,
    .sl-form .unit.text .suffixed-input .suffix {
      border-top-right-radius: var(--form-field-radius);
      border-bottom-right-radius: var(--form-field-radius);
      border-left: 0; }
    form .unit.text .prefixed-input .width-50,
    form .unit.text .suffixed-input .width-50,
    .sl-form .unit.text .prefixed-input .width-50,
    .sl-form .unit.text .suffixed-input .width-50 {
      width: 50px; }
    form .unit.text .prefixed-input .text-prefix,
    form .unit.text .suffixed-input .text-prefix,
    .sl-form .unit.text .prefixed-input .text-prefix,
    .sl-form .unit.text .suffixed-input .text-prefix {
      overflow: hidden;
      text-overflow: ellipsis; }
    form .unit.text .prefixed-input .text-faded,
    form .unit.text .suffixed-input .text-faded,
    .sl-form .unit.text .prefixed-input .text-faded,
    .sl-form .unit.text .suffixed-input .text-faded {
      color: var(--form-field-text-muted); }
    form .unit.text .prefixed-input input,
    form .unit.text .suffixed-input input,
    .sl-form .unit.text .prefixed-input input,
    .sl-form .unit.text .suffixed-input input {
      margin: 0 !important; }
    form .unit.text .prefixed-input button.prefix,
    form .unit.text .prefixed-input button.suffix,
    form .unit.text .suffixed-input button.prefix,
    form .unit.text .suffixed-input button.suffix,
    .sl-form .unit.text .prefixed-input button.prefix,
    .sl-form .unit.text .prefixed-input button.suffix,
    .sl-form .unit.text .suffixed-input button.prefix,
    .sl-form .unit.text .suffixed-input button.suffix {
      color: inherit;
      cursor: pointer; }
  form .unit.text .prefixed-input input,
  .sl-form .unit.text .prefixed-input input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  form .unit.text .suffixed-input input,
  .sl-form .unit.text .suffixed-input input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  form .unit.scripts .list,
  .sl-form .unit.scripts .list {
    list-style: none;
    margin-bottom: var(--space-3); }
  form .unit.scripts .list-item,
  .sl-form .unit.scripts .list-item {
    position: relative;
    padding: var(--space-4) 0;
    border-top: 1px solid var(--form-divider-color);
    cursor: default;
    word-wrap: break-word;
    padding-right: var(--button-size-5); }
  form .unit.scripts .list-item .remove,
  .sl-form .unit.scripts .list-item .remove {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    padding: var(--space-5) var(--space-4);
    text-align: center;
    font-size: 14px;
    cursor: pointer;
    color: var(--form-field-text-muted); }
    form .unit.scripts .list-item .remove:hover,
    .sl-form .unit.scripts .list-item .remove:hover {
      color: var(--form-field-text); }
  form .unit.scripts .input-wrapper,
  .sl-form .unit.scripts .input-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    gap: var(--form-actions-gap); }
  form .unit .status,
  .sl-form .unit .status {
    position: absolute;
    right: 6px;
    bottom: 6px;
    z-index: 2;
    cursor: default; }
    form .unit .status .icon,
    .sl-form .unit .status .icon {
      display: block;
      position: relative;
      width: 24px;
      height: 24px;
      line-height: 24px;
      top: 4px;
      text-align: center;
      font-size: 18px;
      font-weight: 500;
      background: var(--form-status-warning-text);
      color: var(--color-text-inverse);
      border-radius: 50%;
      opacity: 0;
      -webkit-font-smoothing: antialiased;
      -webkit-transition: all 0.15s ease;
      transition: all 0.15s ease; }
    form .unit .status .icon.i-check,
    .sl-form .unit .status .icon.i-check {
      font-size: 16px; }
    form .unit .status.visible .icon,
    .sl-form .unit .status.visible .icon {
      opacity: 1;
      top: -2px; }
    form .unit .status .message,
    .sl-form .unit .status .message {
      position: absolute;
      right: -6px;
      top: -42px;
      padding: var(--space-3) var(--space-4);
      margin: 0;
      background: var(--surface-inverse);
      color: var(--color-text-inverse);
      font-size: 14px;
      visibility: hidden;
      border-radius: var(--radius-2);
      white-space: nowrap;
      opacity: 0;
      -webkit-transition: all 0.15s ease;
      transition: all 0.15s ease; }
      form .unit .status .message:before,
      .sl-form .unit .status .message:before {
        content: '';
        position: absolute;
        height: 0px;
        width: 0px;
        left: initial;
        right: 15px;
        top: 100%;
        bottom: initial;
        border-style: solid;
        border-width: 6px;
        border-color: transparent;
        -webkit-transform: rotate(360deg);
        margin-left: -6px;
        border-bottom-width: 0;
        border-top-color: var(--surface-inverse); }
  form .unit .status.success .icon,
  .sl-form .unit .status.success .icon {
    background: var(--form-status-success-text); }
  form .unit .status.error .icon,
  .sl-form .unit .status.error .icon {
    background: var(--form-status-warning-text); }
  form .unit .field-info,
  .sl-form .unit .field-info {
    position: absolute;
    width: 24px;
    height: 24px;
    right: 8px;
    top: 8px;
    z-index: 2;
    cursor: default;
    line-height: 24px;
    border-radius: 24px;
    text-align: center;
    font-size: 14px;
    color: var(--form-field-text-muted);
    background-color: var(--form-field-surface-muted);
    border: 1px solid var(--form-field-border); }
  form .unit .field-info:after,
  .sl-form .unit .field-info:after {
    font-family: Helvetica, sans-serif;
    content: '?'; }
  form .unit.has-error .field-info,
  .sl-form .unit.has-error .field-info {
    display: none; }
  form .actions,
  .sl-form .actions {
    margin-top: calc( var(--space-8) + var(--space-4) ); }
    form .actions .button + .button,
    .sl-form .actions .button + .button {
      margin-left: var(--form-actions-gap); }
  form .actions.sticky,
  .sl-form .actions.sticky {
    position: sticky;
    bottom: 0;
    margin-left: calc( var(--page-padding) * -1 );
    margin-right: calc( var(--page-padding) * -1 );
    backdrop-filter: var(--surface-glass-filter);
    margin-top: var(--space-7);
    padding: var(--space-7) var(--page-padding);
    border-top: 1px solid var(--form-divider-color); }
  form #error_explanation,
  .sl-form #error_explanation {
    padding: var(--space-5);
    border: 1px solid var(--form-status-warning-text);
    background: var(--form-status-warning-surface);
    color: var(--form-status-warning-text);
    border-radius: var(--radius-3); }
    form #error_explanation h2,
    .sl-form #error_explanation h2 {
      margin-bottom: 10px;
      font-size: inherit;
      font-weight: 500; }
    form #error_explanation ul,
    .sl-form #error_explanation ul {
      list-style-position: inside; }
  form .image-uploader,
  .sl-form .image-uploader {
    position: relative;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    border: 1px solid var(--form-field-border);
    border-radius: var(--form-field-radius); }
    form .image-uploader .image-uploader-preview,
    .sl-form .image-uploader .image-uploader-preview {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      position: relative;
      width: 52px;
      height: 52px;
      padding: var(--space-2);
      background-color: var(--form-field-surface-muted);
      border-top-left-radius: var(--form-field-radius);
      border-bottom-left-radius: var(--form-field-radius);
      background-image: url(//staging.slides.com/assets/editor/image-placeholder-white-transparent-500x500-1f08475c78a4a4600fa27f16bd179efdb19d3813ac0b41d3dd118b1c8d243c40.svg);
      background-size: contain;
      background-repeat: no-repeat; }
    form .image-uploader .image-uploader-actions,
    .sl-form .image-uploader .image-uploader-actions {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-flex: 2;
          -ms-flex-positive: 2;
              flex-grow: 2;
      text-align: right;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      background-color: var(--form-field-surface);
      padding: var(--space-3) var(--space-5);
      -webkit-box-pack: end;
          -ms-flex-pack: end;
              justify-content: flex-end;
      border-top-right-radius: var(--form-field-radius);
      border-bottom-right-radius: var(--form-field-radius); }
    form .image-uploader button,
    .sl-form .image-uploader button {
      position: relative;
      margin-left: var(--form-actions-gap);
      z-index: 10; }
    form .image-uploader .image-uploader-remove-button,
    .sl-form .image-uploader .image-uploader-remove-button {
      display: none; }
    form .image-uploader[data-state="populated"] .image-uploader-remove-button,
    .sl-form .image-uploader[data-state="populated"] .image-uploader-remove-button {
      display: block; }
    form .image-uploader[data-state="populated"] .image-uploader-preview,
    .sl-form .image-uploader[data-state="populated"] .image-uploader-preview {
      background-image: none; }
    form .image-uploader img,
    .sl-form .image-uploader img {
      max-width: 100%;
      max-height: 100%;
      margin: auto; }
    form .image-uploader input,
    .sl-form .image-uploader input {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      opacity: 0;
      z-index: 1;
      cursor: pointer; }
    form .image-uploader span,
    .sl-form .image-uploader span {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      margin: auto;
      width: 124px;
      height: 30px;
      line-height: 30px;
      z-index: 1;
      font-size: 14px;
      background: var(--surface-inverse);
      color: var(--color-text-inverse);
      border-radius: var(--radius-2); }
    form .image-uploader:hover span,
    .sl-form .image-uploader:hover span {
      background: var(--surface-inverse); }
  form .image-uploader.dark[data-state="populated"] .image-uploader-preview,
  .sl-form .image-uploader.dark[data-state="populated"] .image-uploader-preview {
    background-color: var(--surface-panel-alt); }

form .unit-row,
.sl-form .unit-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: var(--form-unit-margin-bottom); }
  form .unit-row .sl-checkbox,
  .sl-form .unit-row .sl-checkbox {
    margin-bottom: 0; }
  form .unit-row .unit,
  .sl-form .unit-row .unit {
    margin-top: 0;
    margin-bottom: 0;
    width: 100%; }
  form .unit-row .unit + .unit,
  .sl-form .unit-row .unit + .unit {
    margin-left: var(--form-unit-margin-top); }

.sl-form .unit.radio.full-width {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  gap: 4px; }
  .sl-form .unit.radio.full-width label {
    width: 100%; }

form :not(.sl-segmented-control) input[type="radio"],
.sl-form input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0; }
  form :not(.sl-segmented-control) input[type="radio"] + label,
  .sl-form input[type="radio"] + label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    padding: var(--space-4) var(--space-5);
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: var(--form-field-radius);
    margin-right: 2px;
    margin-bottom: var(--space-4);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    vertical-align: top;
    line-height: 1.4; }
    form :not(.sl-segmented-control) input[type="radio"] + label .dimmed,
    .sl-form input[type="radio"] + label .dimmed {
      margin-left: 4px; }
    form :not(.sl-segmented-control) input[type="radio"] + label .dimmed,
    form :not(.sl-segmented-control) input[type="radio"] + label .radio-description,
    .sl-form input[type="radio"] + label .dimmed,
    .sl-form input[type="radio"] + label .radio-description {
      color: var(--form-field-text-muted); }
  form :not(.sl-segmented-control) input[type="radio"] + label:before,
  .sl-form input[type="radio"] + label:before {
    content: '';
    display: inline-block;
    position: relative;
    width: 0.72em;
    height: 0.72em;
    line-height: 1;
    top: 0.15em;
    margin-right: 0.4em;
    border: 1px solid currentColor;
    border-radius: calc( var(--form-field-radius) * 0.5 );
    font-size: 1.2em;
    font-family: "slides";
    vertical-align: middle;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  form :not(.sl-segmented-control) input[type="radio"] + label.outline,
  .sl-form input[type="radio"] + label.outline {
    border-color: var(--form-field-border); }
  form :not(.sl-segmented-control) input[type="radio"] + label:hover,
  .sl-form input[type="radio"] + label:hover {
    border-color: var(--form-field-border-hover); }
  form :not(.sl-segmented-control) input[type="radio"] .inline-text-wrapper,
  .sl-form input[type="radio"] .inline-text-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
  form :not(.sl-segmented-control) input[type="radio"]:focus + label,
  .sl-form input[type="radio"]:focus + label {
    outline: 1px solid var(--form-field-border-active);
    outline-offset: 4px; }
  form :not(.sl-segmented-control) input[type="radio"]:checked + label:not(.radio-subtle),
  .sl-form input[type="radio"]:checked + label:not(.radio-subtle) {
    border-color: var(--form-field-border-active);
    background-color: var(--form-field-border-active);
    color: var(--color-accent-fg); }
    form :not(.sl-segmented-control) input[type="radio"]:checked + label:not(.radio-subtle) .dimmed,
    .sl-form input[type="radio"]:checked + label:not(.radio-subtle) .dimmed {
      color: inherit;
      opacity: 0.72; }
    form :not(.sl-segmented-control) input[type="radio"]:checked + label:not(.radio-subtle) .radio-description,
    .sl-form input[type="radio"]:checked + label:not(.radio-subtle) .radio-description {
      color: inherit;
      opacity: 0.78; }
  form :not(.sl-segmented-control) input[type="radio"]:checked + label.radio-subtle,
  .sl-form input[type="radio"]:checked + label.radio-subtle {
    border-color: var(--form-field-border-active); }
  form :not(.sl-segmented-control) input[type="radio"]:checked + label.radio-subtle:before,
  .sl-form input[type="radio"]:checked + label.radio-subtle:before {
    color: var(--color-accent); }
  form :not(.sl-segmented-control) input[type="radio"]:checked + label:before,
  .sl-form input[type="radio"]:checked + label:before {
    content: "\e91b";
    border-color: transparent;
    top: 0;
    left: -0.1em; }
  form :not(.sl-segmented-control) input[type="radio"]:disabled + label,
  .sl-form input[type="radio"]:disabled + label {
    pointer-events: none; }

form .unit.radio.side-by-side,
.sl-form .unit.radio.side-by-side {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 8px; }
  form .unit.radio.side-by-side label,
  .sl-form .unit.radio.side-by-side label {
    width: 100%;
    margin-right: 0;
    margin-bottom: 0; }

form .unit.radio.thumbs,
.sl-form .unit.radio.thumbs {
  background-color: var(--form-field-surface);
  border: 1px solid var(--form-field-border);
  border-radius: var(--form-field-radius);
  gap: 1px; }

form .unit.radio.thumbs input + label,
.sl-form .unit.radio.thumbs input + label {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: var(--space-4);
  gap: var(--space-4);
  opacity: 0.75;
  border: 0; }
form .unit.radio.thumbs input + label img,
.sl-form .unit.radio.thumbs input + label img {
  width: 100%; }
form .unit.radio.thumbs input + label:hover,
.sl-form .unit.radio.thumbs input + label:hover {
  -webkit-box-shadow: 0 0 0 1px var(--form-field-border-hover);
          box-shadow: 0 0 0 1px var(--form-field-border-hover); }
form .unit.radio.thumbs input + label:before,
.sl-form .unit.radio.thumbs input + label:before {
  display: none; }
form .unit.radio.thumbs input:checked + label,
.sl-form .unit.radio.thumbs input:checked + label {
  opacity: 1;
  z-index: 1; }
form .unit.radio.thumbs input:checked + label,
.sl-form .unit.radio.thumbs input:checked + label {
  background: var(--form-field-surface-focus);
  -webkit-box-shadow: 0 0 0 1px var(--form-field-border-active);
          box-shadow: 0 0 0 1px var(--form-field-border-active); }
form .unit.radio.thumbs input:checked + label:before,
.sl-form .unit.radio.thumbs input:checked + label:before {
  display: block;
  position: absolute;
  top: 8px;
  right: 8px;
  left: auto; }

form .unit.radio .radio-description,
.sl-form .unit.radio .radio-description {
  margin: 2px 0 0 0;
  line-height: 1.4;
  font-size: 0.9em; }

form .sl-datepicker label,
.sl-form .sl-datepicker label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-radius: var(--form-field-radius);
  border: 1px solid var(--form-field-border);
  color: var(--form-field-text-muted);
  padding: 0 var(--form-field-padding);
  height: var(--form-field-height);
  margin: 0; }
form .sl-datepicker .sl-datepicker-text,
.sl-form .sl-datepicker .sl-datepicker-text {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1; }
form .sl-datepicker .reset-button,
.sl-form .sl-datepicker .reset-button {
  display: none;
  margin: calc( var(--space-2) * -1 ) var(--space-2); }
form .sl-datepicker input,
.sl-form .sl-datepicker input {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  color: currentColor;
  background: transparent; }
form .sl-datepicker input:focus,
.sl-form .sl-datepicker input:focus {
  outline: none; }
form .sl-datepicker:hover label,
.sl-form .sl-datepicker:hover label {
  color: var(--form-field-text);
  border-color: var(--form-field-border-hover); }
form .sl-datepicker.is-set .reset-button,
.sl-form .sl-datepicker.is-set .reset-button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex; }
form .sl-datepicker.is-set:not(.is-expired) label,
.sl-form .sl-datepicker.is-set:not(.is-expired) label {
  border-color: var(--form-field-border-active); }
form .sl-datepicker.is-set:not(.is-expired) label,
form .sl-datepicker.is-set:not(.is-expired) input,
.sl-form .sl-datepicker.is-set:not(.is-expired) label,
.sl-form .sl-datepicker.is-set:not(.is-expired) input {
  color: var(--form-field-text); }
form .sl-datepicker.is-expired:not(:focus-within):not(:hover),
.sl-form .sl-datepicker.is-expired:not(:focus-within):not(:hover) {
  opacity: 0.75; }

form .unit.range input[type=range],
.sl-form .unit.range input[type=range] {
  width: 100%;
  background: transparent;
  -webkit-appearance: none;
  apperance: none; }
form .unit.range input[type="range"]::-webkit-slider-runnable-track,
.sl-form .unit.range input[type="range"]::-webkit-slider-runnable-track {
  background: var(--form-field-border);
  height: 6px;
  border-radius: 6px;
  background: -webkit-gradient(linear, left top, right top, from(var(--color-accent)), color-stop(var(--color-accent)), to(var(--form-field-border)));
  background: linear-gradient(to right, var(--color-accent) 0%, var(--color-accent) var(--range-progress-percent), var(--form-field-border) var(--range-progress-percent)); }
form .unit.range input[type="range"]::-moz-range-track,
.sl-form .unit.range input[type="range"]::-moz-range-track {
  background: var(--form-field-border);
  height: 6px;
  border-radius: 6px;
  background: linear-gradient(to right, var(--color-accent) 0%, var(--color-accent) var(--range-progress-percent), var(--form-field-border) var(--range-progress-percent)); }
form .unit.range input[type="range"]::-webkit-progress-value,
.sl-form .unit.range input[type="range"]::-webkit-progress-value {
  background: var(--form-field-border);
  height: 6px;
  border-radius: 6px;
  background: var(--color-accent); }
form .unit.range input[type=range]::-webkit-slider-thumb,
.sl-form .unit.range input[type=range]::-webkit-slider-thumb {
  background: var(--color-accent);
  width: 16px;
  height: 16px;
  margin-top: -6px;
  border-radius: 16px;
  -webkit-appearance: none;
  apperance: none;
  border: 0; }
form .unit.range input[type=range]::-moz-range-thumb,
.sl-form .unit.range input[type=range]::-moz-range-thumb {
  background: var(--color-accent);
  width: 16px;
  height: 16px;
  margin-top: -6px;
  border-radius: 16px;
  -webkit-appearance: none;
  apperance: none;
  border: 0; }
form .unit.range input[type=range]:hover::-webkit-slider-thumb,
.sl-form .unit.range input[type=range]:hover::-webkit-slider-thumb {
  background: var(--color-link-hover); }
form .unit.range input[type=range]:hover::-moz-range-thumb,
.sl-form .unit.range input[type=range]:hover::-moz-range-thumb {
  background: var(--color-link-hover); }
form .unit.range .range-wrapper,
.sl-form .unit.range .range-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--form-actions-gap); }
form .unit.range .range-value,
.sl-form .unit.range .range-value {
  min-width: 20px;
  text-align: right; }

.touch form .unit .error .message,
.touch .sl-form .unit .error .message,
form .unit.focused .error .message,
form .unit .error:hover .message,
form .unit .display-error .error .message,
.sl-form .unit.focused .error .message,
.sl-form .unit .error:hover .message,
.sl-form .unit .display-error .error .message {
  visibility: visible;
  top: -46px;
  opacity: 1; }

.input-field-tray {
  position: relative;
  top: -1px;
  padding: var(--space-3) var(--form-field-padding) var(--space-2) var(--form-field-padding);
  border: 1px solid var(--form-field-border);
  border-top: 0;
  border-bottom-left-radius: var(--form-field-radius);
  border-bottom-right-radius: var(--form-field-radius);
  background: var(--form-field-surface); }

.input-field-tray-presets {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: auto;
  padding-left: var(--space-2);
  padding-right: var(--space-2);
  -webkit-overflow-scrolling: touch; }

.input-field-tray-preset {
  display: inline-block;
  padding: var(--space-1) 0;
  border: 1px solid transparent;
  font-size: 12px;
  border-radius: var(--radius-2);
  cursor: pointer;
  -webkit-box-flex: 2;
      -ms-flex-positive: 2;
          flex-grow: 2;
  text-align: center;
  color: var(--form-field-text-muted);
  white-space: nowrap; }

.input-field-tray-preset:hover {
  color: inherit; }

.input-field-tray-preset.selected {
  border-color: var(--form-field-border-active);
  color: inherit; }

.input-field-tray-preset + .input-field-tray-preset {
  margin-left: var(--space-1); }

.unit.text.with-tray input {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }

.unit.text.with-tray .prefix {
  border-bottom-left-radius: 0 !important; }

.unit.text.with-tray .suffix {
  border-bottom-right-radius: 0 !important; }
/**
 * Site-wide header.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.global-header {
  position: sticky;
  top: 0;
  width: 100%;
  height: var(--header-height);
  margin: 0 auto;
  z-index: 11;
  font-weight: 500;
  background: var(--surface-glass);
  backdrop-filter: var(--surface-glass-filter);
  border-bottom: 1px solid var(--border-section);
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.global-header-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 0 var(--page-padding);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: var(--page-max-width); }

.global-header-nav-wrapper {
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.global-header-logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.global-header-logo.slides-logo {
  margin: 0 10px 0 -5px; }

.global-header-logo-static {
  -ms-flex-negative: 1;
      flex-shrink: 1;
  overflow: hidden; }

.global-header-logo-text {
  display: block;
  color: var(--color-text-strong);
  font-size: 18px;
  padding: var(--space-3) 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  max-width: 500px; }

.global-header-logo-text:hover {
  color: var(--color-text-strong); }

.global-header-logo-image {
  position: relative;
  height: calc(var(--header-height) - 20px);
  width: 220px;
  top: 10%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left center; }

.global-header-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  gap: 5px;
  position: relative;
  height: 100%;
  padding: 2px 0; }

.global-header-nav-compact {
  display: none; }

.global-header .nav-item:nth-child(1),
.global-header .nav-item-divider:nth-child(1) {
  -webkit-box-ordinal-group: 10;
      -ms-flex-order: 9;
          order: 9; }
.global-header .nav-item:nth-child(2),
.global-header .nav-item-divider:nth-child(2) {
  -webkit-box-ordinal-group: 9;
      -ms-flex-order: 8;
          order: 8; }
.global-header .nav-item:nth-child(3),
.global-header .nav-item-divider:nth-child(3) {
  -webkit-box-ordinal-group: 8;
      -ms-flex-order: 7;
          order: 7; }
.global-header .nav-item:nth-child(4),
.global-header .nav-item-divider:nth-child(4) {
  -webkit-box-ordinal-group: 7;
      -ms-flex-order: 6;
          order: 6; }
.global-header .nav-item:nth-child(5),
.global-header .nav-item-divider:nth-child(5) {
  -webkit-box-ordinal-group: 6;
      -ms-flex-order: 5;
          order: 5; }
.global-header .nav-item:nth-child(6),
.global-header .nav-item-divider:nth-child(6) {
  -webkit-box-ordinal-group: 5;
      -ms-flex-order: 4;
          order: 4; }
.global-header .nav-item:nth-child(7),
.global-header .nav-item-divider:nth-child(7) {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3; }
.global-header .nav-item:nth-child(8),
.global-header .nav-item-divider:nth-child(8) {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2; }
.global-header .nav-item:nth-child(9),
.global-header .nav-item-divider:nth-child(9) {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1; }
.global-header .nav-item:nth-child(10),
.global-header .nav-item-divider:nth-child(10) {
  -webkit-box-ordinal-group: 1;
      -ms-flex-order: 0;
          order: 0; }
.global-header .nav-item {
  display: inline-block;
  vertical-align: top; }
.global-header .nav-item.overflowing {
  visibility: hidden; }
.global-header .nav-item-divider {
  display: inline-block;
  margin: 0 5px;
  width: 1px;
  height: 30px;
  background-color: var(--surface-tint-2);
  -ms-flex-item-align: center;
      align-self: center; }
.global-header .nav-item.overflowing + .nav-item-divider {
  display: none; }
.global-header .nav-item-anchor {
  display: inline-block;
  position: relative;
  padding: 8px 10px;
  border-radius: var(--button-radius);
  outline: 0;
  line-height: 1;
  color: var(--color-text-strong);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .global-header .nav-item-anchor:hover {
    background-color: rgba(var(--surface-inverse-rgb), 0.12); }
  .global-header .nav-item-anchor:focus-visible {
    outline: 1px solid #226ede; }
  .global-header .nav-item-anchor:active {
    top: 1px; }
.global-header .nav-item-selected .nav-item-anchor {
  background-color: rgba(var(--surface-inverse-rgb), 0.12); }
.global-header .nav-item-changelog {
  display: none; }
.global-header .nav-item-highlighted .nav-item-anchor {
  color: var(--color-text-inverse);
  background-color: var(--surface-inverse);
  font-weight: 500; }
.global-header .nav-item-label {
  display: inline-block;
  position: relative;
  max-width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
  vertical-align: middle; }
.global-header .nav-item-label.wide {
  max-width: 300px; }
.global-header .nav-item-badge {
  display: inline-block;
  width: 22px;
  height: 22px;
  border-radius: 11px;
  text-align: center;
  line-height: 22px;
  margin-left: 4px;
  background-color: var(--color-accent);
  vertical-align: middle;
  font-size: 13px; }
.global-header .nav-item-burger {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  font-size: 10px; }
.global-header .nav-item-burger-1,
.global-header .nav-item-burger-2,
.global-header .nav-item-burger-3 {
  display: block;
  height: 0.2em;
  width: 1.8em;
  border-radius: 0.2em;
  background-color: var(--color-text-strong); }
.global-header .nav-item-burger-1,
.global-header .nav-item-burger-2 {
  margin-bottom: 0.3em; }
.global-header .changelog-indicator {
  position: absolute;
  display: block;
  bottom: -5px;
  right: -6px;
  width: 11px;
  height: 11px;
  border-radius: 11px;
  background-color: #226ede;
  border: 2px solid var(--surface-panel-alt);
  opacity: 1; }
.global-header .nav-item.overflow-button .nav-item-anchor {
  min-width: 32px;
  text-align: center; }
.global-header .upgrade-button .nav-item-label,
.global-header .reactivate-button .nav-item-label {
  max-width: none;
  color: var(--color-text-inverse); }
.global-header .upgrade-button .nav-item-anchor,
.global-header .reactivate-button .nav-item-anchor {
  max-width: none;
  background: var(--color-accent); }
.global-header .profile-button {
  margin-right: -10px; }
  .global-header .profile-button .nav-item-label {
    margin-right: 10px; }
  .global-header .profile-button .nav-item-anchor.menu-show-on-touch {
    border: 0 !important; }

@media screen and (max-width: 900px) {
  .global-header-wrapper {
    padding-left: var(--page-padding) !important; }

  .global-header .nav-item {
    margin-left: 2px; }

  .global-header .nav-item-anchor {
    font-size: 13px; }

  .global-header-nav {
    gap: 0; }

  .global-header .nav-item-anchor {
    padding-left: 6px;
    padding-right: 6px; }

  .global-header .nav-item-highlighted {
    margin-left: 4px; }

  .global-header .nav-item-highlighted .nav-item-anchor {
    padding-left: 6px;
    padding-right: 6px; }

  .global-header .profile-button .nav-item-label {
    max-width: 70px; }

  .global-header .slides-logo {
    margin-left: 0; }

  .global-header .slides-logo-word {
    display: none; } }
@media screen and (max-width: 650px) {
  .global-header-nav-full {
    display: none; }

  .global-header-nav-compact {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }

  .global-header .nav-item-anchor {
    padding-left: 6px;
    padding-right: 6px; }

  .global-header .nav-item-highlighted {
    margin-left: 6px; }

  .global-header .nav-item-highlighted .nav-item-anchor {
    padding-left: 8px;
    padding-right: 8px; }

  .global-header.show-menu .menu-arrow {
    -webkit-transform: scale(1, -1);
            transform: scale(1, -1); }

  .global-header.show-menu .global-header-nav-full {
    position: fixed;
    top: calc(var(--header-height) - var(--page-padding));
    right: var(--page-padding);
    width: auto;
    gap: 1px;
    padding: var(--space-2);
    min-width: 200px;
    max-width: calc(100% - var(--page-padding) * 2);
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background: var(--surface-overlay);
    border-radius: var(--radius-5);
    border: 1px solid var(--border-default); }

  .global-header.show-menu .global-header-nav-full .hide-in-overlay-menu {
    display: none; }

  .global-header.show-menu .global-header-nav-full .nav-item {
    margin: 0; }

  .global-header.show-menu .global-header-nav-full .nav-item-anchor {
    color: var(--color-overlay);
    width: 100%;
    padding: 0 var(--space-5);
    height: var(--button-size-7);
    border-radius: var(--radius-4);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    --webkit-tap-highlight-color: rgba(0, 0, 0, 0); } }
.sl-editor .global-header .global-header-logo,
.sl-review-page .global-header .global-header-logo {
  display: none; }
.sl-editor .global-header .global-header-wrapper,
.sl-review-page .global-header .global-header-wrapper {
  padding: 0 6px; }
.sl-editor .global-header .nav-item,
.sl-review-page .global-header .nav-item {
  display: none; }
.sl-editor .global-header .nav-item-burger,
.sl-review-page .global-header .nav-item-burger {
  vertical-align: initial;
  font-size: 8px; }
.sl-editor .global-header .profile-button,
.sl-review-page .global-header .profile-button {
  display: block;
  margin-left: 0;
  margin-right: 0; }
.sl-editor .global-header .profile-button .nav-item-label,
.sl-review-page .global-header .profile-button .nav-item-label {
  display: none; }

.sl-editor .global-header {
  position: absolute;
  width: 100%;
  height: 46px;
  bottom: 0;
  left: 0;
  top: auto;
  border-top: 1px solid var(--panel-divider-color);
  border-bottom: 0;
  background: transparent; }
  .sl-editor .global-header .changelog-indicator {
    border-color: var(--surface-panel); }
  .sl-editor .global-header .global-header-nav-wrapper {
    margin: 0 auto; }
  .sl-editor .global-header .nav-item-burger {
    font-size: 8px;
    top: -1px; }

.sl-review-page .global-header {
  width: var(--drawer-menu-width);
  height: var(--drawer-item-size);
  background: transparent; }
  .sl-review-page .global-header .changelog-indicator {
    display: none; }

html.decks.present-base .global-header .slides-logo-word {
  display: none; }
html.decks.present-base .global-header .nav-item {
  display: none; }
html.decks.present-base .global-header .profile-button {
  display: block; }

.global-header.show-on-scroll {
  position: fixed;
  top: calc(var(--header-height) * -1);
  opacity: 0;
  z-index: 20;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease; }
  .global-header.show-on-scroll.show-on-scroll-visible {
    top: 0;
    opacity: 1; }

.global-header-small {
  background: transparent; }

.global-header-small .slides-logo-word {
  display: none; }

.global-header.fixed {
  position: fixed;
  top: 0;
  background: transparent;
  backdrop-filter: none;
  border-bottom-color: transparent;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease; }
  .global-header.fixed .changelog-indicator {
    display: none; }

.global-header.fixed.is-scrolled {
  background: rgba(var(--surface-glass-rgb), 0.5);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border-section);
  -webkit-transition: all 1s ease;
  transition: all 1s ease; }
/**
 * Kudos component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
@-webkit-keyframes kudos-bounce {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  20% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8); }
  40% {
    -webkit-transform: scale(1.3);
            transform: scale(1.3); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
@keyframes kudos-bounce {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  20% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8); }
  40% {
    -webkit-transform: scale(1.3);
            transform: scale(1.3); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
[data-kudos-value]:after {
  content: attr(data-kudos-value); }

.kudos-button {
  position: relative;
  line-height: 40px;
  color: #fff;
  font-size: 18px;
  opacity: 0.5;
  padding: 0;
  outline: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .kudos-button:hover {
    opacity: 1; }
  .kudos-button .kudos-heart {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 42px;
    border-radius: 40px;
    background: rgba(0, 0, 0, 0.7);
    vertical-align: middle; }
  .kudos-button .kudos-icon.bounce {
    -webkit-animation: kudos-bounce 0.7s ease;
            animation: kudos-bounce 0.7s ease; }
  .kudos-button .kudos-count {
    display: block;
    position: absolute;
    width: auto;
    height: 1em;
    min-width: 1em;
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    padding: 0.4em;
    line-height: 1;
    left: 65%;
    top: 65%;
    border-radius: 32px;
    background: #000;
    font-size: 12px;
    -webkit-transition: all 0.2s ease 0.2s;
    transition: all 0.2s ease 0.2s;
    text-align: center; }
    .kudos-button .kudos-count[data-kudos-value="0"] {
      -webkit-transform: translate(-4px, -4px) scale(0.7);
              transform: translate(-4px, -4px) scale(0.7);
      opacity: 0;
      visibility: hidden;
      -webkit-transition: none;
      transition: none; }
  .kudos-button[data-kudoed-by-user="true"] .kudos-icon {
    color: #FF7676; }
/**
 * Logo animation.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
.slides-logo {
  --logo-size: 38px;
  position: relative;
  -webkit-box-flex: flex;
      -ms-flex: flex;
          flex: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: var(--logo-size);
  color: var(--color-text-strong); }

.slides-logo-symbol {
  display: block;
  position: relative;
  height: var(--logo-size);
  color: inherit !important; }

.slides-logo-symbol svg {
  width: var(--logo-size);
  height: var(--logo-size); }

.slides-logo-word {
  display: block;
  position: relative;
  width: 110px;
  height: var(--logo-size);
  color: inherit !important; }

.slides-logo-word svg {
  width: 100%;
  height: var(--logo-size); }

.slides-logo-word.dark {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjA0IiBoZWlnaHQ9IjEzMiIgdmlld0JveD0iMCAwIDYwNCAxMzIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI%2BCjxwYXRoIGQ9Ik04OC44ODU2IDc3LjcyQzg3LjE2NTYgNzQuMjMgODQuNjE1NiA3MS4wOCA4MS4yNTU2IDY4LjMxQzc3LjkyNTYgNjUuNTcgNzMuODU1NSA2My4xOCA2OS4xMTU1IDYxLjJDNjUuMzY1NSA1OS42MSA2MS4yMjU1IDU4LjI4IDU2LjcxNTUgNTcuMjFDNTUuNTE1NSA1Ni45MiA1NC4yOTU1IDU2LjY2IDUzLjA0NTUgNTYuNEM0OS40NzU1IDU1LjY0IDQ2LjI5NTUgNTQuNzggNDMuNDg1NSA1My43OUM0MC42NzU1IDUyLjgzIDM4LjM3NTYgNTEuNjggMzYuNjA1NiA1MC40QzM0LjgwNTYgNDkuMSAzMy40MjU2IDQ3LjYxIDMyLjQ2NTYgNDUuOTRDMzEuNTA1NiA0NC4yNSAzMS4wMDU2IDQyLjM0IDMxLjAwNTYgNDAuMTZDMzEuMDA1NiAzNy4zNyAzMS44MTU1IDM0Ljk1IDMzLjQyNTUgMzIuOTRDMzUuMDQ1NSAzMC45NiAzNy4zMDU1IDI5LjQyIDQwLjE3NTUgMjguMzNDNDMuMDE1NSAyNy4yNiA0Ni40MDU1IDI2LjcxIDUwLjMwNTUgMjYuNzFDNTMuNzQ1NSAyNi43MSA1Ny4wNTU1IDI3LjI4IDYwLjE3NTUgMjguNEM2My4zMjU1IDI5LjU1IDY2LjI0NTUgMzEuMjEgNjguOTI1NSAzMy40M0M3MC43MjU1IDM0LjkgNzIuNDE1NiAzNi42MyA3My45NzU2IDM4LjYyQzc0Ljg3NTYgMzkuNzcgNzYuNTg1NiAzOS44NyA3Ny42ODU2IDM4LjkxTDg4LjUwNTYgMjkuNDhDODkuNDc1NiAyOC42MyA4OS43MTU2IDI3LjE5IDg4Ljk5NTYgMjYuMTJDODYuNzA1NiAyMi43MSA4My45NDU1IDE5Ljc0IDgwLjcwNTUgMTcuMjNDNzYuODQ1NSAxNC4yNiA3Mi40MTU1IDEyLjAyIDY3LjM5NTUgMTAuNDhDNjIuMzY1NSA4Ljk2OTk5IDU2LjY2NTUgOC4yMDk5OSA1MC4zMDU1IDguMjA5OTlDNDQuNjc1NSA4LjIwOTk5IDM5LjQxNTYgOS4wMTk5OSAzNC41NjU2IDEwLjY2QzI5LjY5NTYgMTIuMjggMjUuNDE1NiAxNC41NCAyMS43NDU2IDE3LjQ2QzE4LjA3NTYgMjAuMzggMTUuMTc1NiAyMy44NCAxMy4wNjU2IDI3LjgzQzEwLjk1NTYgMzEuODQgOS45MTU1NiAzNi4yMiA5LjkxNTU2IDQwLjk5QzkuOTE1NTYgNDUuNzYgMTAuNjE1NSA0OS45OCAxMi4wMjU1IDUzLjdDMTMuNDM1NSA1Ny40MyAxNS42NDU2IDYwLjc5IDE4LjY2NTYgNjMuNzZDMjEuNjg1NiA2Ni43MyAyNS40MTU2IDY5LjIzIDI5Ljg0NTYgNzEuMjFDMzIuMTY1NiA3Mi4yNSAzNC42NjU2IDczLjE5IDM3LjQwNTYgNzQuMDJDMzkuOTA1NiA3NC43OCA0Mi41ODU1IDc1LjQzIDQ1LjQyNTUgNzZDNDguNTU1NSA3Ni42NSA1MS40MTU1IDc3LjM1IDU0LjAyNTUgNzguMTFDNTYuNjA1NSA3OC44NyA1OC45MjU1IDc5Ljc4IDYwLjk4NTUgODAuODdDNjMuMDQ1NSA4MS45NCA2NC43ODU2IDgzLjExIDY2LjE5NTYgODQuMzZDNjcuNTc1NiA4NS41OCA2OC42NDU2IDg2Ljk5IDY5LjM0NTYgODguNTVDNzAuMDQ1NiA5MC4xNCA3MC4zODU2IDkxLjgzIDcwLjM4NTYgOTMuNjhDNzAuMzg1NiA5Ni4yNiA2OS41MjU1IDk4LjU1IDY3LjgwNTUgMTAwLjU2QzY2LjA1NTUgMTAyLjU3IDYzLjY4NTYgMTA0LjEzIDYwLjY2NTYgMTA1LjI4QzU3LjY0NTYgMTA2LjQgNTQuMjg1NiAxMDYuOTcgNTAuNjA1NiAxMDYuOTdDNDQuMjI1NiAxMDYuOTcgMzguNDg1NiAxMDUuNTYgMzMuNDA1NiAxMDIuNzVDMjkuMzk1NiAxMDAuNTIgMjUuMjk1NiA5Ni44OCAyMS4xMzU2IDkxLjgxQzIwLjE5NTYgOTAuNjYgMTguNTA1NiA5MC40OCAxNy4zODU2IDkxLjQ2TDUuOTA1NTUgMTAxLjQ2QzQuODc1NTUgMTAyLjM2IDQuNjg1NTYgMTAzLjkzIDUuNTM1NTYgMTA1LjAxQzguNjE1NTYgMTA4Ljk1IDEyLjA4NTUgMTEyLjM2IDE1Ljg5NTUgMTE1LjIzQzIwLjMyNTUgMTE4LjU5IDI1LjMwNTUgMTIxLjEyIDMwLjgyNTUgMTIyLjc5QzM2LjMyNTUgMTI0LjQ2IDQyLjM5NTUgMTI1LjI5IDQ4Ljk4NTUgMTI1LjI5QzU3LjUwNTUgMTI1LjI5IDY0Ljk4NTUgMTIzLjg2IDcxLjM2NTUgMTIwLjk5Qzc3LjcyNTUgMTE4LjEyIDgyLjY3NTYgMTE0LjAzIDg2LjE4NTYgMTA4LjY3Qzg5LjcwNTYgMTAzLjMzIDkxLjQ0NTYgOTYuOTIgOTEuNDQ1NiA4OS40N0M5MS40NDU2IDg1LjE1IDkwLjU4NTUgODEuMjEgODguODY1NSA3Ny42OUw4OC44ODU2IDc3LjcyWiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTEwMC44NDYgNy42MVYxMjUuMDFIMTIwLjk1NlY3LjYxQzEyMC45NTYgNi4xNyAxMTkuNzg2IDUgMTE4LjM0NiA1SDEwMy40NDZDMTAyLjAwNiA1IDEwMC44MzYgNi4xNyAxMDAuODM2IDcuNjFIMTAwLjg0NloiIGZpbGw9ImJsYWNrIi8%2BCjxwYXRoIGQ9Ik0xMzMuODk2IDQ3LjQ2VjEyNS4wMUgxNTMuODU2VjQ0LjY5QzE1My44NTYgNDMuMDYgMTUyLjM3NiA0MS44MyAxNTAuNzY2IDQyLjEzTDEzNi4wMTYgNDQuOUMxMzQuNzg2IDQ1LjEzIDEzMy44OTYgNDYuMjEgMTMzLjg5NiA0Ny40NloiIGZpbGw9ImJsYWNrIi8%2BCjxwYXRoIGQ9Ik0yMzAuMDU2IDcuNjA5OThWNDkuMzVDMjI4LjY3NiA0Ny43OSAyMjcuMDM2IDQ2LjMzIDIyNS4xODYgNDQuOTdDMjIyLjE2NiA0Mi43NiAyMTguNzI2IDQxLjAxIDIxNC44OTYgMzkuNzFDMjExLjAzNiAzOC40MSAyMDcuMDc2IDM3Ljc2IDIwMi45NjYgMzcuNzZDMTk1LjQwNiAzNy43NiAxODguNjA2IDM5LjY5IDE4Mi42MTYgNDMuNTJDMTc2LjYyNiA0Ny4zOCAxNzEuODg2IDUyLjY0IDE2OC40MTYgNTkuMzNDMTY0Ljk0NiA2Ni4wNSAxNjMuMjM2IDczLjY2IDE2My4yMzYgODIuMjFDMTYzLjIzNiA5MC43NiAxNjUuMDA2IDk4LjQ5IDE2OC40OTYgMTA1LjE2QzE3Mi4wMTYgMTExLjggMTc2Ljc4NiAxMTcuMDQgMTgyLjc3NiAxMjAuODdDMTg4Ljc5NiAxMjQuNzMgMTk1LjU2NiAxMjYuNjMgMjAzLjEyNiAxMjYuNjNDMjA3LjAzNiAxMjYuNjMgMjEwLjgzNiAxMjYgMjE0LjU2NiAxMjQuNzhDMjE4LjI5NiAxMjMuNTMgMjIxLjU3NiAxMjEuODkgMjI0LjM4NiAxMTkuODNDMjI2LjgwNiAxMTguMDYgMjI4Ljg0NiAxMTYuMTMgMjMwLjQyNiAxMTQuMDVMMjMwLjY4NiAxMjUuMDJIMjQ5Ljk5NlY3LjYxOTk4QzI0OS45OTYgNi4xNzk5OCAyNDguODI2IDUuMDA5OTggMjQ3LjM4NiA1LjAwOTk4SDIzMi42NjZDMjMxLjIyNiA1LjAwOTk4IDIzMC4wNTYgNi4xNzk5OCAyMzAuMDU2IDcuNjE5OThWNy42MDk5OFpNMjI3LjY4NiA5Ni40OEMyMjUuNjc2IDEwMC41NyAyMjIuOTE2IDEwMy44MyAyMTkuMzQ2IDEwNi4yQzIxNS43NzYgMTA4LjU3IDIxMS42NTYgMTA5Ljc3IDIwNy4wMjYgMTA5Ljc3QzIwMi4zOTYgMTA5Ljc3IDE5OC4yNzYgMTA4LjU3IDE5NC43MDYgMTA2LjJDMTkxLjEzNiAxMDMuODMgMTg4LjM0NiAxMDAuNTcgMTg2LjM0NiA5Ni40OEMxODQuMzM2IDkyLjM2IDE4My4zNDYgODcuNiAxODMuMzQ2IDgyLjJDMTgzLjM0NiA3Ni44IDE4NC4zMzYgNzIuMTcgMTg2LjM0NiA2OEMxODguMzU2IDYzLjg2IDE5MS4xMzYgNjAuNiAxOTQuNzA2IDU4LjI4QzE5OC4yNzYgNTUuOTYgMjAyLjM2NiA1NC43OSAyMDcuMDI2IDU0Ljc5QzIxMS42ODYgNTQuNzkgMjE1Ljc3NiA1NS45NiAyMTkuMzQ2IDU4LjI4QzIyMi45MTYgNjAuNiAyMjUuNjc2IDYzLjg2IDIyNy42ODYgNjhDMjI5LjY5NiA3Mi4xNyAyMzAuNjg2IDc2Ljg4IDIzMC42ODYgODIuMkMyMzAuNjg2IDg3LjUyIDIyOS42OTYgOTIuMzYgMjI3LjY4NiA5Ni40OFoiIGZpbGw9ImJsYWNrIi8%2BCjxwYXRoIGQ9Ik0zNDIuMjE2IDc5Ljc2QzM0Mi4zMTYgNzMuNzIgMzQxLjQzNiA2OC4xMSAzMzkuNTU2IDYyLjk4QzMzNy42NTYgNTcuODUgMzM0LjkxNiA1My40MiAzMzEuMzQ2IDQ5LjY5QzMyNy43NzYgNDUuOTYgMzIzLjU4NiA0My4wMiAzMTguNzA2IDQwLjg2QzMxMy44MzYgMzguNyAzMDguNTk2IDM3LjYgMzAyLjk2NiAzNy42QzI5Ni41ODYgMzcuNiAyOTAuNzE2IDM4LjcyIDI4NS4zNzYgNDAuOTNDMjgwLjAwNiA0My4xNCAyNzUuNDI2IDQ2LjI3IDI3MS41OTYgNTAuMzRDMjY3LjczNiA1NC4zOCAyNjQuNzQ2IDU5LjE3IDI2Mi41NzYgNjQuN0MyNjAuNDE2IDcwLjIgMjU5LjM0NiA3Ni4zMiAyNTkuMzQ2IDgzLjAyQzI1OS4zNDYgOTEuNDYgMjYxLjI0NiA5OC45NCAyNjUuMTA2IDEwNS40OEMyNjguOTM2IDExMi4wMiAyNzQuMjc2IDExNy4xOCAyODEuMTU2IDEyMC45NkMyODguMDA2IDEyNC43NiAyOTUuOTI2IDEyNi42NCAzMDQuOTE2IDEyNi42NEMzMDguOTA2IDEyNi42NCAzMTIuOTY2IDEyNi4wOSAzMTcuMDg2IDEyNS4wMkMzMjEuMTc2IDEyMy45NSAzMjUuMTA2IDEyMi40NyAzMjguODM2IDEyMC41NkMzMzEuODI2IDExOS4wMyAzMzQuNTY2IDExNy4yNiAzMzcuMDM2IDExNS4yMUMzMzguMDY2IDExNC4zNiAzMzguMjE2IDExMi44MiAzMzcuNDM2IDExMS43M0wzMzAuNTM2IDEwMi4xM0MzMjkuNjg2IDEwMC45NCAzMjcuOTk2IDEwMC42NyAzMjYuODQ2IDEwMS41OEMzMjMuNzM2IDEwNC4wMyAzMjAuODA2IDEwNS43OCAzMTguMDQ2IDEwNi44NUMzMTQuNjg2IDEwOC4xNSAzMTEuMDE2IDEwOC44IDMwNy4wMjYgMTA4LjhDMzAxLjI5NiAxMDguOCAyOTYuMjk2IDEwNy42OCAyOTIuMDE2IDEwNS40NkMyODcuNzQ2IDEwMy4yNSAyODQuNDM2IDEwMC4wOSAyODIuMTE2IDk1Ljk4QzI4MC41NTYgOTMuMjIgMjc5LjUwNiA5MC4xNCAyNzkuMDE2IDg2LjczSDMzOS40OTZDMzQwLjkxNiA4Ni43MyAzNDIuMDY2IDg1LjYgMzQyLjA5NiA4NC4xOEwzNDIuMTk2IDc5Ljc0TDM0Mi4yMTYgNzkuNzZaTTMyMi43NTYgNzMuMTFIMjc5LjQ3NkMyNzkuOTE2IDcwLjkyIDI4MC41NjYgNjguOTcgMjgxLjQwNiA2Ny4yQzI4My4yNTYgNjMuMzcgMjg1Ljk2NiA2MC40MyAyODkuNjE2IDU4LjM3QzI5My4yMzYgNTYuMzEgMjk3LjY5NiA1NS4zIDMwMi45ODYgNTUuM0MzMDYuNDU2IDU1LjMgMzA5LjYwNiA1Ni4wMyAzMTIuNDY2IDU3LjQ5QzMxNS4zMzYgNTguOTUgMzE3LjY3NiA2MC45MyAzMTkuNTI2IDYzLjQ4QzMyMS4zNDYgNjYuMDEgMzIyLjQ0NiA2OC45OCAzMjIuNzU2IDcyLjMxVjczLjEyVjczLjExWiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTQxMi43OTYgOTEuNjFDNDExLjkwNiA4OSA0MTAuNDU2IDg2Ljc0IDQwOC4zOTYgODQuNzhDNDA2LjM2NiA4Mi41MSA0MDMuNTQ2IDgwLjUxIDM5OS45NzYgNzguNzlDMzk2LjY5NiA3Ny4yIDM5Mi42NTYgNzUuNzQgMzg3Ljg4NiA3NC40NEMzODcuNDk2IDc0LjMxIDM4Ny4wNzYgNzQuMjEgMzg2LjY1NiA3NC4xQzM4Mi44NzYgNzMuMjEgMzc5LjgwNSA3Mi4zIDM3Ny40MzUgNzEuMzRDMzc1LjAzNSA3MC4zNSAzNzMuMjY2IDY5LjQ5IDM3Mi4wNjYgNjguNzNDMzcwLjk5NiA2Ny45NyAzNzAuMTY2IDY3LjA0IDM2OS41NjYgNjUuODlDMzY4Ljk2NiA2NC43NyAzNjguNjA2IDYzLjU1IDM2OC40OTYgNjIuMjRDMzY4LjQ5NiA2MC43MyAzNjguODA2IDU5LjQgMzY5LjQwNiA1OC4yOEMzNjkuOTc2IDU3LjEzIDM3MC44MTYgNTYuMiAzNzEuOTA2IDU1LjQ0QzM3Mi45NzYgNTQuNjggMzc0LjMyNiA1NC4xMSAzNzUuOTY2IDUzLjcyQzM3Ny41ODYgNTMuMzYgMzc5LjQwNiA1My4xNyAzODEuNDY2IDUzLjE3QzM4My42MjYgNTMuMTcgMzg1Ljk0NiA1My42MSAzODguNDQ2IDU0LjU1QzM5MC45MjYgNTUuNDYgMzkzLjM5NiA1Ni42OSAzOTUuODE2IDU4LjJDMzk3LjEyNiA1OS4wMiAzOTguMzk2IDU5LjkgMzk5LjYwNiA2MC44NUM0MDAuNjI2IDYxLjY1IDQwMi4wNTYgNjEuNjUgNDAzLjAxNiA2MC43OEw0MTEuNTc2IDUzLjA0QzQxMi43MTYgNTIuMDEgNDEyLjcxNiA1MC4yMyA0MTEuNTk2IDQ5LjE4QzQwOS41MzYgNDcuMjMgNDA3LjE5NiA0NS41MSA0MDQuNTY2IDQ0LjAxQzQwMS4wNDYgNDIgMzk3LjI3NiA0MC40NyAzOTMuMjM2IDM5LjRDMzg5LjE3NiAzOC4zMSAzODQuOTc2IDM3Ljc2IDM4MC42NTYgMzcuNzZDMzc2LjMzNiAzNy43NiAzNzIuMzk2IDM4LjM2IDM2OC40ODYgMzkuNTZDMzY0LjYwNiA0MC43MyAzNjEuMTk2IDQyLjQ4IDM1OC4yNzYgNDQuNzRDMzU1LjM1NiA0Ny4wMSAzNTMuMDY2IDQ5LjY5IDM1MS4zOTYgNTIuNzZDMzQ5LjcwNiA1NS44MyAzNDguODY2IDU5LjI3IDM0OC44NjYgNjMuMDVDMzQ4Ljg2NiA2Ni4xIDM0OS4zMzYgNjguODkgMzUwLjI0NiA3MS40OUMzNTEuMTU2IDc0LjEgMzUyLjUzNiA3Ni40MSAzNTQuMzg2IDc4LjQ3QzM1Ni41NDYgODAuOTUgMzU5LjU2NiA4My4xOSAzNjMuNDU2IDg1LjE5QzM2NS45MzYgODYuNDcgMzY4LjgyNiA4Ny42NCAzNzIuMDc2IDg4LjcxQzM3My45NTYgODkuMzQgMzc1LjkzNiA4OS45MSAzNzguMDY2IDkwLjQ2QzM4MS43MzYgOTEuMzUgMzg0LjczNiA5Mi4yMSAzODcuMDU2IDkzLjA3QzM4OS4zNzYgOTMuOTMgMzkxLjA5NiA5NC43NCAzOTIuMTY2IDk1LjQ5QzM5NC4xMTYgOTcgMzk1LjA4NiA5OS4wNiAzOTUuMDg2IDEwMS42NkMzOTUuMDg2IDEwMy4wNyAzOTQuNzk2IDEwNC4zMiAzOTQuMTk2IDEwNS40NkMzOTMuNTk2IDEwNi42MSAzOTIuNzY2IDEwNy42IDM5MS42NjYgMTA4LjQ2QzM5MC41OTYgMTA5LjMyIDM4OS4zMTYgMTA5Ljk3IDM4Ny44NjYgMTEwLjQxQzM4Ni40MDYgMTEwLjgzIDM4NC43NjYgMTExLjA2IDM4Mi45MTYgMTExLjA2QzM3OC40ODYgMTExLjA2IDM3NC4yNjYgMTEwLjI1IDM3MC4yNzYgMTA4LjYxQzM2Ni45MzYgMTA3LjI2IDM2My43MTYgMTA0Ljk2IDM2MC44NjYgMTAyLjFDMzU5Ljg5NiAxMDEuMTMgMzU4LjMyNiAxMDEuMTIgMzU3LjMxNiAxMDIuMDNMMzQ4LjMyNiAxMTAuMTZDMzQ3LjI3NiAxMTEuMTEgMzQ3LjEzNiAxMTIuNzUgMzQ4LjA5NiAxMTMuNzlDMzUxLjYxNiAxMTcuNjEgMzU1Ljk1NiAxMjAuNjMgMzYxLjExNiAxMjIuOEMzNjcuMTA2IDEyNS4zMyAzNzMuOTA2IDEyNi42IDM4MS40NjYgMTI2LjZDMzg3LjYzNiAxMjYuNiAzOTMuMTY2IDEyNS40OCAzOTguMDg2IDEyMy4xOUM0MDMuMDA2IDEyMC45MiA0MDYuODk2IDExNy44IDQwOS43NTYgMTEzLjgxQzQxMi42MjYgMTA5LjggNDE0LjA1NiAxMDUuMjYgNDE0LjA1NiAxMDAuMThDNDE0LjA1NiA5Ny4wMyA0MTMuNjM2IDk0LjE2IDQxMi43NzYgOTEuNThMNDEyLjc5NiA5MS42MVoiIGZpbGw9ImJsYWNrIi8%2BCjxwYXRoIGQ9Ik00NzIuMzA2IDExNC4zQzQ3MS4xMDYgMTE1LjE2IDQ2OS44NTYgMTE1Ljg0IDQ2OC41MjYgMTE2LjI4QzQ2Ny4xOTYgMTE2Ljc1IDQ2NS44NDYgMTE2Ljk4IDQ2NC40MzYgMTE2Ljk4QzQ2Mi4xMTYgMTE2Ljk4IDQ2MC4wMDYgMTE2LjM4IDQ1OC4xMDYgMTE1LjE4QzQ1Ni4yMjYgMTE0LjAxIDQ1NC43MTYgMTEyLjQyIDQ1My41OTYgMTEwLjQxQzQ1Mi41MDYgMTA4LjQgNDUxLjk1NiAxMDYuMTQgNDUxLjk1NiAxMDMuNThDNDUxLjk1NiAxMDEuMDIgNDUyLjQ3NiA5OC43NiA0NTMuNTc2IDk2LjczQzQ1NC42NDYgOTQuNzIgNDU2LjEyNiA5My4xMSA0NTguMDA2IDkxLjk2QzQ1OS44NTYgOTAuNzkgNDYxLjk2NiA5MC4yMSA0NjQuMzY2IDkwLjIxQzQ2NS43NzYgOTAuMjEgNDY3LjE3NiA5MC40NyA0NjguNTg2IDkxLjAyQzQ2OS45OTYgOTEuNTcgNDcxLjI5NiA5Mi4zIDQ3Mi41NDYgOTMuMjFDNDcyLjk2NiA5My41MSA0NzMuMzU2IDkzLjgzIDQ3My43MTYgOTQuMTZDNDc0Ljg0NiA5NS4xOCA0NzYuNTU2IDk1LjE2IDQ3Ny41MjYgOTMuOTlMNDc5LjgxNiA5MS4yNEM0ODAuNjM2IDkwLjI2IDQ4MC42MTYgODguODEgNDc5Ljc2NiA4Ny44NkM0NzguMTk2IDg2LjExIDQ3Ni4yMTYgODQuNjggNDczLjg1NiA4My41N0M0NzAuNzA2IDgyLjExIDQ2Ny4yMzYgODEuMzggNDYzLjM4NiA4MS4zOEM0NTkuNTM2IDgxLjM4IDQ1NS44MDYgODIuMzQgNDUyLjYyNiA4NC4zQzQ0OS40MjYgODYuMjMgNDQ2LjkxNiA4OC44OSA0NDUuMDY2IDkyLjI1QzQ0My4yNDYgOTUuNTkgNDQyLjMwNiA5OS4zOSA0NDIuMzA2IDEwMy41OEM0NDIuMzA2IDEwNy43NyA0NDMuMjQ2IDExMS41OCA0NDUuMDY2IDExNC45NEM0NDYuOTE2IDExOC4zIDQ0OS40MTYgMTIwLjkzIDQ1Mi42MjYgMTIyLjg5QzQ1NS44MDYgMTI0Ljg0IDQ1OS4zOTYgMTI1LjgxIDQ2My4zODYgMTI1LjgxQzQ2Ni45NTYgMTI1LjgxIDQ3MC4zNjYgMTI1LjA4IDQ3My41NzYgMTIzLjU3QzQ3NS45MjYgMTIyLjQ4IDQ3Ny45MDYgMTIxLjE2IDQ3OS41MjYgMTE5LjU5QzQ4MC41MDYgMTE4LjY1IDQ4MC42MDYgMTE3LjExIDQ3OS43MzYgMTE2LjA2TDQ3Ny40OTYgMTEzLjM0QzQ3Ni41MzYgMTEyLjE4IDQ3NC44MjYgMTEyLjEyIDQ3My43MTYgMTEzLjE0QzQ3My4yNTYgMTEzLjU2IDQ3Mi43OTYgMTEzLjk0IDQ3Mi4zMTYgMTE0LjI5TDQ3Mi4zMDYgMTE0LjNaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNNTI1LjkwNiA5Mi4xOEM1MjMuOTc2IDg4LjgyIDUyMS4zNDYgODYuMTkgNTE3Ljk4NiA4NC4yNkM1MTQuNjI2IDgyLjMzIDUxMC44NDYgODEuMzkgNTA2LjYyNiA4MS4zOUM1MDIuNDA2IDgxLjM5IDQ5OC41NDYgODIuMzMgNDk1LjIxNiA4NC4yNkM0OTEuODU2IDg2LjE5IDQ4OS4xOTYgODguODIgNDg3LjI2NiA5Mi4xOEM0ODUuMzE2IDk1LjUxIDQ4NC4zNDYgOTkuMzIgNDg0LjM0NiAxMDMuNTlDNDg0LjM0NiAxMDcuODYgNDg1LjMwNiAxMTEuNjkgNDg3LjI2NiAxMTUuMDNDNDg5LjE5NiAxMTguMzkgNDkxLjg1NiAxMjEuMDIgNDk1LjIxNiAxMjIuOTVDNDk4LjU1NiAxMjQuODUgNTAyLjM1NiAxMjUuODIgNTA2LjYyNiAxMjUuODJDNTEwLjg5NiAxMjUuODIgNTE0LjYyNiAxMjQuODYgNTE3Ljk4NiAxMjIuOTVDNTIxLjM0NiAxMjEuMDIgNTIzLjk3NiAxMTguMzkgNTI1LjkwNiAxMTUuMDNDNTI3LjgwNiAxMTEuNyA1MjguNzc2IDEwNy44NyA1MjguNzc2IDEwMy41OUM1MjguNzc2IDk5LjMxIDUyNy44MTYgOTUuNTEgNTI1LjkwNiA5Mi4xOFpNNTE3LjEyNiAxMTAuNDJDNTE2LjA4NiAxMTIuNDMgNTE0LjY0NiAxMTQuMDIgNTEyLjgyNiAxMTUuMTlDNTExLjAyNiAxMTYuMzkgNTA4Ljk2NiAxMTYuOTkgNTA2LjYyNiAxMTYuOTlDNTA0LjI4NiAxMTYuOTkgNTAyLjIyNiAxMTYuMzkgNTAwLjM0NiAxMTUuMTlDNDk4LjQ5NiAxMTQuMDIgNDk3LjAzNiAxMTIuNDMgNDk2LjAyNiAxMTAuNDJDNDk0Ljk4NiAxMDguNDEgNDk0LjQ4NiAxMDYuMTUgNDk0LjQ4NiAxMDMuNTlDNDk0LjQ4NiAxMDEuMDMgNDk0Ljk3NiA5OC43NyA0OTYuMDI2IDk2Ljc0QzQ5Ny4wNDYgOTQuNzMgNDk4LjUwNiA5My4xMiA1MDAuMzQ2IDkxLjk3QzUwMi4yMjYgOTAuOCA1MDQuMzA2IDkwLjIyIDUwNi42MjYgOTAuMjJDNTA4Ljk0NiA5MC4yMiA1MTEuMDI2IDkwLjc5IDUxMi44MjYgOTEuOTdDNTE0LjY0NiA5My4xMiA1MTYuMDg2IDk0LjcxIDUxNy4xMjYgOTYuNzFDNTE4LjE5NiA5OC43MiA1MTguNjg2IDEwMS4wMSA1MTguNjM2IDEwMy41OUM1MTguNjg2IDEwNi4xNCA1MTguMTk2IDEwOC40MSA1MTcuMTI2IDExMC40MloiIGZpbGw9ImJsYWNrIi8%2BCjxwYXRoIGQ9Ik01OTcuNTU2IDg5LjQyQzU5Ni40NjYgODYuNzYgNTk0Ljg0NiA4NC43OCA1OTIuNjg2IDgzLjUxQzU5MC41MjYgODIuMjEgNTg3LjgxNiA4MS41NiA1ODQuNTg2IDgxLjU2QzU4My4xMjYgODEuNTYgNTgxLjY0NiA4MS43NyA1ODAuMTU2IDgyLjIxQzU3OC42NjYgODIuNjMgNTc3LjI2NiA4My4yOCA1NzUuOTA2IDg0LjExQzU3NC41NTYgODQuOTQgNTczLjMyNiA4NS44OCA1NzIuMjU2IDg2Ljk1QzU3MS4yOTYgODcuODYgNTcwLjUzNiA4OC44OCA1NjkuOTg2IDg5Ljk3QzU2OS40MzYgODguNDYgNTY4Ljc2NiA4Ny4xOCA1NjcuOTA2IDg2LjA5QzU2Ni43MDYgODQuNTMgNTY1LjE2NiA4My4zOCA1NjMuMzc2IDgyLjY1QzU2MS41NTYgODEuOTIgNTU5LjQ5NiA4MS41NiA1NTcuMTc2IDgxLjU2QzU1NS42MTYgODEuNTYgNTU0LjA0NiA4MS44MiA1NTIuNTM2IDgyLjMyQzU1MS4wMjYgODIuODQgNTQ5LjU5NiA4My41NCA1NDguMjY2IDg0LjQzQzU0Ni45MTYgODUuMzQgNTQ1LjczNiA4Ni4zOCA1NDQuNzc2IDg3LjYxQzU0NC41NjYgODcuODcgNTQ0LjM1NiA4OC4xNiA1NDQuMTQ2IDg4LjQyTDU0NC4wODYgODQuODNDNTQ0LjA2NiA4My40MyA1NDIuOTE2IDgyLjMgNTQxLjUxNiA4Mi4zSDUzNi43OTZDNTM1LjM3NiA4Mi4zIDUzNC4yMjYgODMuNDUgNTM0LjIyNiA4NC44N1YxMjUuMDJINTQ0LjI4NlY5OS40MUM1NDQuMjg2IDk4LjExIDU0NC41MTYgOTYuOTEgNTQ1LjAxNiA5NS44NEM1NDUuNTA2IDk0Ljc1IDU0Ni4xODYgOTMuODEgNTQ3LjA0NiA5M0M1NDcuOTA2IDkyLjE5IDU0OC45MjYgOTEuNTQgNTUwLjExNiA5MS4xQzU1MS4zMTYgOTAuNjMgNTUyLjU2NiA5MC40IDU1My45MTYgOTAuNEM1NTUuNTU2IDkwLjQgNTU2LjkzNiA5MC43NiA1NTguMDU2IDkxLjQ5QzU1OS4yMDYgOTIuMjIgNTYwLjA2NiA5My4yOSA1NjAuNjY2IDk0LjY0QzU2MS4yMzYgOTYuMDIgNTYxLjU1NiA5Ny43NCA1NjEuNTU2IDk5LjhWMTI1LjAySDU3MS42MTZWOTkuNDlDNTcxLjYxNiA5OC4xOSA1NzEuODQ2IDk2Ljk5IDU3Mi4zNDYgOTUuOTJDNTcyLjgxNiA5NC44MyA1NzMuNDk2IDkzLjg2IDU3NC4zNzYgOTMuMDNDNTc1LjIzNiA5Mi4yIDU3Ni4yNzYgOTEuNTQgNTc3LjQ3NiA5MS4xQzU3OC42OTYgOTAuNjMgNTc5Ljk3NiA5MC40IDU4MS4zMzYgOTAuNEM1ODMuMDg2IDkwLjQgNTg0LjUxNiA5MC43NCA1ODUuNjg2IDkxLjQyQzU4Ni44MzYgOTIuMSA1ODcuNzE2IDkzLjE0IDU4OC4yNjYgOTQuNTVDNTg4LjgzNiA5NS45NiA1ODkuMTI2IDk3LjczIDU4OS4xMjYgOTkuODlWMTI1LjAzSDU5OS4xODZWOTkuMjRDNTk5LjE4NiA5NS4zNiA1OTguNjM2IDkyLjA4IDU5Ny41NjYgODkuNDRMNTk3LjU1NiA4OS40MloiIGZpbGw9ImJsYWNrIi8%2BCjxwYXRoIGQ9Ik0xNTIuMDY2IDI4LjY4TDEzNS43MjYgMzEuNzVDMTM0LjI4NiAzMi4wMiAxMzIuOTY2IDMwLjkyIDEzMi45NjYgMjkuNDZWNy4zNEMxMzIuOTY2IDUuODggMTM0LjI5NiA0Ljc4IDEzNS43MjYgNS4wNUwxNTIuMDY2IDguMTJDMTUzLjQ0NiA4LjM4IDE1NC40NDYgOS41OCAxNTQuNDQ2IDEwLjk4VjI1LjgxQzE1NC40NDYgMjcuMjEgMTUzLjQ0NiAyOC40MiAxNTIuMDY2IDI4LjY3VjI4LjY4WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTQzMi4zNDYgMTE0LjU5QzQzMS4zMDYgMTEzLjUgNDI5Ljc5NiAxMTIuOTIgNDI3Ljg2NiAxMTIuOTJDNDI1LjkzNiAxMTIuOTIgNDI0LjU1NiAxMTMuNTUgNDIzLjQzNiAxMTQuNzRDNDIyLjM0NiAxMTUuOTYgNDIxLjc2NiAxMTcuNTMgNDIxLjc2NiAxMTkuNEM0MjEuNzY2IDEyMS40NiA0MjIuMzE2IDEyMy4wNSA0MjMuMzU2IDEyNC4xOUM0MjQuMzk2IDEyNS4zMSA0MjUuOTA2IDEyNS44OCA0MjcuODY2IDEyNS44OEM0MjkuNjg2IDEyNS44OCA0MzEuMTc2IDEyNS4yOCA0MzIuMjY2IDEyNC4wNkM0MzMuMzg2IDEyMi44NiA0MzMuOTM2IDEyMS4zIDQzMy45MzYgMTE5LjRDNDMzLjkzNiAxMTcuMjkgNDMzLjQxNiAxMTUuNyA0MzIuMzQ2IDExNC41OFYxMTQuNTlaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K); }
/**
 * Media library component used for accessing and managing
 * user media.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.media-library {
  --ml-filter-height: 40px;
  --ml-filter-expanded-height: 82px; }

.media-library-header-tabs {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  text-align: center;
  line-height: 70px; }
  .media-library-header-tabs .media-library-header-tabs-wrapper {
    display: inline-block;
    line-height: 1; }
  .media-library-header-tabs .media-library-header-tabs-wrapper .sl-segmented-control {
    margin-top: 0;
    margin-bottom: 0; }
  .media-library-header-tabs .media-library-header-tab .icon.i-users,
  .media-library-header-tabs .media-library-header-tab .icon.i-search {
    font-size: 1.35em; }

.media-library-page {
  position: relative;
  width: 100%;
  height: 100%;
  visibility: hidden; }

.media-library-page.visible {
  visibility: visible; }

.media-library-sidebar {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 278px;
  height: 100%;
  float: left;
  border-bottom-left-radius: 2px; }

.media-library-sidebar:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #eee;
  -webkit-transition: all 0.2s ease 0.1s;
  transition: all 0.2s ease 0.1s; }

.media-library-sidebar.visible:after {
  opacity: 0;
  visibility: hidden; }

.media-library-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-left: 278px;
  border-top-left-radius: var(--popup-inner-radius);
  opacity: 0;
  -webkit-transition: opacity 0.2s ease 0.1s;
  transition: opacity 0.2s ease 0.1s;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden; }
  .media-library-content.visible {
    opacity: 1; }

.media-library-load-status {
  position: absolute;
  top: 50%;
  left: 278px;
  right: 0;
  margin-top: -30px;
  text-align: center;
  color: #999; }
  .media-library-load-status .button {
    margin-left: 5px; }

.media-library-search {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
  .media-library-search .search-header {
    position: relative;
    padding: 20px;
    padding-top: 10px; }
  .media-library-search .search-header:after,
  .media-library-search .search-results:after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 12px;
    opacity: 0;
    z-index: 10;
    -webkit-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear; }
  .media-library-search .search-header:after {
    top: 100%;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0)));
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 100%); }
  .media-library-search .search-results:after {
    bottom: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.2)));
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%); }
  .media-library-search .search-header.show-scroll-shadow:after {
    opacity: 1; }
  .media-library-search .search-results.show-scroll-shadow:after {
    opacity: 1; }
  .media-library-search .search-input-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 80%;
    margin: 0 auto;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  .media-library-search .search-input,
  .media-library-search .search-reset,
  .media-library-search .search-sources {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 20px;
    font-size: 16px;
    border-radius: 40px;
    border: 1px solid var(--border-default);
    outline: 0;
    background: #fff;
    line-height: 44px;
    height: 44px; }
  .media-library-search .search-input {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    -webkit-appearance: none; }
  .media-library-search .search-reset {
    display: none;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    color: #555;
    cursor: pointer; }
  .media-library-search .search-reset:hover {
    color: #000; }
  .media-library-search .search-sources {
    position: relative;
    border-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    font-size: 14px;
    cursor: pointer;
    color: #555; }
  .media-library-search .search-sources:before {
    content: '';
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background-color: #ddd; }
  .media-library-search .search-sources .icon {
    margin-left: 10px; }
  .media-library-search .search-sources:hover {
    color: #000;
    background-color: #f5f5f5; }
  .media-library-search .search-input:focus,
  .media-library-search .search-input:focus ~ .search-reset,
  .media-library-search .search-input:focus ~ .search-sources {
    border-color: #226ede; }
  .media-library-search .search-input.has-value ~ .search-reset {
    display: block; }
  .media-library-search .search-results {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    padding: 8px;
    text-align: center;
    overflow: auto;
    will-change: scroll-position;
    background-color: #fff;
    -webkit-overflow-scrolling: touch; }
  .media-library-search .search-results-group {
    width: 100%;
    min-height: 100%;
    position: relative; }
  .media-library-search .search-results-group.hidden {
    display: none !important; }
  .media-library-search .search-results-group.empty:not(.hidden) + .search-results-group.empty {
    border-left: 1px solid #eee; }
  .media-library-search .search-results-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-bottom: 40px; }
    .media-library-search .search-results-placeholder .logo {
      width: 100px;
      height: 100px;
      background-repeat: no-repeat;
      background-size: contain;
      margin-bottom: 20px; }
    .media-library-search .search-results-placeholder .label {
      color: #aaa;
      font-weight: 600; }
  .media-library-search .search-results-group.empty .search-results-placeholder {
    visibility: visible; }
  .media-library-search .search-results-group[data-type="unsplash"] .logo {
    background-image: url(//staging.slides.com/assets/logos/unsplash-512x512-aaae081c6c6f0edfde4f343cf016e142ae00792576fbc3bac192acc3b9c402e0.svg); }
  .media-library-search .search-results-group[data-type="giphy"] .logo {
    background-image: url(//staging.slides.com/assets/logos/giphy-320x320-a8800e4fc2024ec987292adc884eab564f4199449b43f1adc9d97cb8a3d5925f.png); }
  .media-library-search .search-results-group[data-type="giphy"] .label {
    background-image: url(//staging.slides.com/assets/logos/powered-by-giphy-vert-text-d4a5e6a847a99c3e8c4f677283b468315ca5805b9c175b04cf64875382427785.png);
    width: 100px;
    height: 30px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50% 50%;
    color: transparent;
    opacity: 0.7; }
  .media-library-search .search-results .error {
    position: relative;
    width: 100%;
    height: 50%;
    top: 40%;
    color: #888; }
  .media-library-search .search-results .spinner {
    position: relative;
    top: 40%;
    height: 50%;
    margin-left: auto;
    margin-right: auto; }
  .media-library-search .search-result {
    display: block;
    position: relative;
    border: 4px solid #fff;
    cursor: pointer;
    float: left;
    overflow: hidden;
    -webkit-transition: border-color 0.2s ease;
    transition: border-color 0.2s ease;
    background-color: #fbfbfb;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .media-library-search .search-result-media {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease; }
  .media-library-search .search-result-attribution {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 3px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #fff;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
    font-size: 13px;
    text-align: right;
    padding: 6px;
    opacity: 0;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    z-index: 1; }
  .media-library-search .search-result-attribution:hover {
    white-space: normal; }
  .media-library-search .search-result:hover {
    border-color: #226ede;
    z-index: 1; }
    .media-library-search .search-result:hover .search-result-attribution {
      opacity: 1; }
    .media-library-search .search-result:hover .search-result-media {
      -webkit-transform: scale(1.06);
              transform: scale(1.06); }

.media-library-drag-instructions {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background: rgba(78, 139, 229, 0.7);
  z-index: 10;
  pointer-events: none; }
  .media-library-drag-instructions .inner {
    display: block;
    position: relative;
    width: 360px;
    padding: 60px 0;
    border: 5px solid #fff;
    margin: auto;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); }

.media-library-filters {
  overflow: auto;
  font-size: 0.9285em;
  padding: 0 var(--space-3);
  -webkit-overflow-scrolling: touch; }
  .media-library-filters.editable {
    bottom: 68px; }
  .media-library-filters .media-library-filter {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 0 10px;
    height: var(--ml-filter-height);
    cursor: pointer;
    color: var(--color-text-secondary);
    border-radius: var(--app-nav-radius);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
    .media-library-filters .media-library-filter:hover {
      color: var(--color-nav-link-hover);
      background-color: var(--surface-nav-link-hover); }
    .media-library-filters .media-library-filter.is-selected {
      color: var(--color-nav-link-selected);
      background-color: var(--surface-nav-link-selected);
      cursor: default; }
  .media-library-filters .media-library-filter .label {
    word-break: break-word; }
  .media-library-filters .media-library-filter .icon {
    color: #444; }
  .media-library-filters .media-library-filter .count {
    float: right;
    color: #999; }
  .media-library-filters .media-library-filter-types {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--space-1);
    border-bottom: 1px solid var(--border-default);
    border-top: 1px solid var(--border-default);
    padding: var(--space-1) 0; }
  .media-library-filters .media-library-filter-types .media-library-filter {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1; }
  .media-library-filters .media-library-search-filter {
    padding: 10px;
    cursor: text; }
  .media-library-filters .media-library-search-filter .search-input {
    width: 100%;
    color: currentColor;
    border: 1px solid transparent;
    padding-left: 0;
    background-color: transparent;
    -webkit-appearance: none; }
  .media-library-filters .media-library-search-filter .search-input:focus {
    outline: 0; }
  .media-library-filters .media-library-search-filter .search-input::-webkit-input-placeholder {
    color: var(--color-text-subtle); }
  .media-library-filters .media-library-search-filter .search-input::-moz-placeholder {
    color: var(--color-text-subtle); }
  .media-library-filters .media-library-search-filter .search-input:-ms-input-placeholder {
    color: var(--color-text-subtle); }
  .media-library-filters .media-library-search-filter .search-input::-ms-input-placeholder {
    color: var(--color-text-subtle); }
  .media-library-filters .media-library-search-filter .search-input::placeholder {
    color: var(--color-text-subtle); }
  .media-library-filters .media-library-filter.hidden {
    display: none; }

.media-library-filters-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--space-1); }

.media-library-tags {
  -webkit-perspective: 1000px;
          perspective: 1000px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--space-1); }
  .media-library-tags .tags-create {
    height: var(--ml-filter-height);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    color: var(--color-text-muted);
    cursor: pointer;
    border-radius: var(--app-nav-radius);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
    .media-library-tags .tags-create .tags-create-inner {
      padding: 0 10px; }
    .media-library-tags .tags-create:hover {
      color: var(--color-nav-link-hover);
      background-color: var(--surface-nav-link-hover); }
  .media-library-tags .tags-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: var(--space-1);
    position: relative;
    z-index: 10; }
  .media-library-tags .media-library-filter {
    position: relative;
    height: var(--ml-filter-height);
    border-bottom: 0;
    -webkit-transition: height 0.3s ease, padding 0.3s ease, opacity 0.3s ease, -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: height 0.3s ease, padding 0.3s ease, opacity 0.3s ease, -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275), height 0.3s ease, padding 0.3s ease, opacity 0.3s ease;
    transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275), height 0.3s ease, padding 0.3s ease, opacity 0.3s ease, -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d; }
  .media-library-tags .media-library-filter .front {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding: 0 10px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden; }
    .media-library-tags .media-library-filter .front .label-output {
      display: block;
      width: 175px;
      float: left;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis; }
    .media-library-tags .media-library-filter .front .controls-button {
      margin-top: -2px; }
  .media-library-tags .media-library-filter .back {
    --back-offset: calc( (var(--ml-filter-expanded-height) - var(--ml-filter-height)) / 2 );
    position: absolute;
    width: 98%;
    height: var(--ml-filter-expanded-height);
    top: 0;
    left: 1%;
    padding: 12px 7px;
    background-color: #fff;
    border-radius: var(--app-nav-radius);
    -webkit-transition: -webkit-box-shadow 0.3s linear;
    transition: -webkit-box-shadow 0.3s linear;
    transition: box-shadow 0.3s linear;
    transition: box-shadow 0.3s linear, -webkit-box-shadow 0.3s linear;
    -webkit-transform: translateZ(-1px) rotateX(-180deg) translateY(var(--back-offset));
            transform: translateZ(-1px) rotateX(-180deg) translateY(var(--back-offset));
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    cursor: default; }
    .media-library-tags .media-library-filter .back .label-input {
      width: 100%;
      border: 1px solid #ccc;
      padding: var(--space-1);
      cursor: text;
      -webkit-appearance: none;
      font-size: 1em; }
      .media-library-tags .media-library-filter .back .label-input:focus {
        outline: 0;
        border-color: #226ede; }
    .media-library-tags .media-library-filter .back .controls {
      margin-top: 10px;
      text-align: right; }
  .media-library-tags .media-library-filter .controls-button {
    display: inline-block;
    color: #fff;
    background-color: #888;
    padding: 6px;
    font-size: 12px;
    line-height: 12px;
    vertical-align: middle;
    border-radius: var(--button-radius);
    cursor: pointer; }
    .media-library-tags .media-library-filter .controls-button:hover {
      background-color: #555; }
    .media-library-tags .media-library-filter .controls-button.delete-button {
      float: left;
      background-color: #d04232; }
    .media-library-tags .media-library-filter .controls-button.delete-button:hover {
      background-color: #a83427; }
  .media-library-tags .media-library-filter .controls-button + .controls-button {
    margin-left: 10px; }
  .media-library-tags .media-library-filter .controls-permanent,
  .media-library-tags .media-library-filter .controls-out,
  .media-library-tags .media-library-filter .controls-over {
    float: right;
    margin-left: 5px; }
  .media-library-tags .media-library-filter .controls-over {
    display: none; }
  .media-library-tags .media-library-filter:hover .controls-out {
    display: none; }
  .media-library-tags .media-library-filter:hover .controls-over {
    display: block; }
  .media-library-tags .media-library-filter.is-editing {
    z-index: 11;
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg); }
    .media-library-tags .media-library-filter.is-editing .front {
      pointer-events: none; }
    .media-library-tags .media-library-filter.is-editing .back {
      -webkit-box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.5);
              box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.5); }

.media-library-filters.is-editing .tags-create,
.media-library-filters.is-editing .media-library-filter:not(.is-editing) {
  opacity: 0.4;
  pointer-events: none; }
.media-library-filters.is-editing .media-library-tags {
  border-left-color: #bbb; }

.ua-ie .media-library-filters .media-library-filter .back {
  -webkit-transform: none;
          transform: none;
  display: none; }
.ua-ie .media-library-filters .media-library-filter.is-editing {
  -webkit-transform: none;
          transform: none; }
  .ua-ie .media-library-filters .media-library-filter.is-editing .front {
    display: none; }
  .ua-ie .media-library-filters .media-library-filter.is-editing .back {
    display: block; }

.dragging-media-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: none;
  background-color: rgba(240, 240, 240, 0.9);
  z-index: 9;
  opacity: 0;
  border-radius: 2px;
  will-change: opacity; }

html.dragging-media {
  cursor: -webkit-grabbing;
  cursor: grabbing; }

html.dragging-media .dragging-media-overlay {
  display: block;
  -webkit-animation: fade-in 0.12s linear forwards;
          animation: fade-in 0.12s linear forwards; }

html.dragging-media .sl-popup-body {
  backdrop-filter: none; }

html.dragging-media .media-library-tags {
  -webkit-perspective: none;
          perspective: none; }

html.dragging-media .media-library-tags .media-library-filter {
  background-color: #fff;
  border-radius: 0;
  pointer-events: none; }

html.dragging-media .media-library-tags .media-library-filter.drag-over {
  color: #fff;
  background-color: #226ede; }

html.dragging-media .media-library-tags .media-library-filter.drag-over .count {
  color: #fff; }

.media-library-uploader {
  width: 100%;
  border: 4px solid transparent;
  border-bottom-left-radius: 2px; }

.media-library-uploader-button,
.media-library-uploader-exceeded {
  position: relative;
  width: 100%;
  height: 60px;
  line-height: 58px;
  color: #fff;
  padding: 0 20px;
  margin: auto 0;
  cursor: pointer;
  background-color: #226ede;
  border-radius: calc(var(--button-radius) * 2);
  text-align: center;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .media-library-uploader-button .label,
  .media-library-uploader-exceeded .label {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.2; }
  .media-library-uploader-button .icon,
  .media-library-uploader-exceeded .icon {
    position: relative;
    left: 10px;
    top: 4px;
    font-size: 26px; }
  .media-library-uploader-button .file-input,
  .media-library-uploader-exceeded .file-input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer; }
  .media-library-uploader-button:hover,
  .media-library-uploader-exceeded:hover {
    background-color: #4e8be5; }
  .media-library-uploader-button:active,
  .media-library-uploader-exceeded:active {
    background-color: #1e63c9; }
  .media-library-uploader-button:hover .icon,
  .media-library-uploader-exceeded:hover .icon {
    -webkit-animation: float-light 2s infinite ease-in-out;
            animation: float-light 2s infinite ease-in-out; }

.media-library-uploader.is-uploading .media-library-uploader-button {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }

.media-library-uploader-exceeded {
  display: none;
  background-color: #777; }
  .media-library-uploader-exceeded .label {
    line-height: 1.4; }
  .media-library-uploader-exceeded:hover {
    color: #fff;
    background-color: #919191; }
  .media-library-uploader-exceeded:active {
    background-color: #6a6a6a; }

.storage-limit-exceeded .media-library-uploader-button {
  display: none; }

.storage-limit-exceeded .media-library-uploader-exceeded {
  display: block; }

.media-library-uploader-limit {
  display: block;
  margin-top: 6px; }

.media-library-uploader-list {
  width: 100%;
  background: #272727;
  border-bottom-left-radius: 1px;
  max-height: 130px;
  overflow: auto;
  padding-top: 8px;
  margin-top: -10px;
  margin-bottom: 2px;
  border-bottom-left-radius: calc(var(--button-radius) * 2);
  border-bottom-right-radius: calc(var(--button-radius) * 2); }
  .media-library-uploader-list .media-library-uploader-item {
    position: relative;
    height: 0;
    line-height: 32px;
    color: #fff;
    font-size: 12px;
    cursor: default;
    overflow: hidden;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    mix-blend-mode: lighten; }
    .media-library-uploader-list .media-library-uploader-item .upload-spinner {
      display: inline-block;
      position: relative;
      width: 14px;
      height: 14px;
      top: 3px;
      background-color: #fff;
      border-radius: 1px;
      -webkit-animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal;
              animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal; }
    .media-library-uploader-list .media-library-uploader-item .item-text {
      position: relative;
      padding: 0 8px;
      z-index: 2; }
    .media-library-uploader-list .media-library-uploader-item .item-text .status {
      display: inline-block;
      width: 18px;
      text-align: center;
      margin-right: 6px; }
    .media-library-uploader-list .media-library-uploader-item .item-text .filename {
      color: #ddd; }
    .media-library-uploader-list .media-library-uploader-item .item-progress {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 1; }
    .media-library-uploader-list .media-library-uploader-item .item-progress .bar {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #555;
      -webkit-transition: all 0.3s ease;
      transition: all 0.3s ease;
      -webkit-transform-origin: 0% 0%;
              transform-origin: 0% 0%;
      -webkit-transform: scaleX(0);
              transform: scaleX(0); }
  .media-library-uploader-list .media-library-uploader-item.completed .item-progress .bar {
    -webkit-transform: scaleX(1) !important;
            transform: scaleX(1) !important;
    background-color: #1b58b2; }
  .media-library-uploader-list .media-library-uploader-item.failed .item-progress .bar {
    -webkit-transform: scaleX(1) !important;
            transform: scaleX(1) !important;
    background-color: #f44148; }
  .media-library-uploader-list .media-library-uploader-item.animate-in {
    height: 32px; }
  .media-library-uploader-list .media-library-uploader-item.animate-out {
    opacity: 0; }

.media-library-list {
  height: 100%;
  padding: 10px;
  overflow: auto;
  background-color: #fff;
  -webkit-overflow-scrolling: touch; }
  .media-library-list .info-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: none;
    z-index: 2;
    background-color: rgba(255, 255, 255, 0.3); }
    .media-library-list .info-overlay .info-overlay-action {
      position: absolute;
      left: 50%;
      bottom: 10px;
      width: 30px;
      height: 30px;
      margin-left: -15px;
      line-height: 30px;
      border-radius: 30px;
      font-size: 12px;
      text-align: center;
      background-color: #222;
      color: #fff;
      cursor: pointer;
      -webkit-transition: opacity 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      transition: opacity 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      transition: opacity 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      transition: opacity 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
      .media-library-list .info-overlay .info-overlay-action:hover {
        background-color: #444; }
    .media-library-list .info-overlay .info-overlay-action.preview-button {
      font-size: 14px;
      -webkit-transform: translateX(-36px);
              transform: translateX(-36px); }
    .media-library-list .info-overlay .info-overlay-action.label-button {
      -webkit-transform: none;
              transform: none; }
    .media-library-list .info-overlay .info-overlay-action.select-button {
      -webkit-transform: translateX(36px);
              transform: translateX(36px); }
    .media-library-list .info-overlay .select-button .checkmark {
      display: inline-block;
      border: 1px solid #ddd;
      width: 14px;
      height: 14px;
      border-radius: 1px;
      color: transparent; }
    .media-library-list .info-overlay .inline-button {
      display: none; }
    .media-library-list .info-overlay .info-overlay-action.is-on {
      background-color: #226ede; }
  .media-library-list .info-overlay.has-inline-option .preview-button {
    opacity: 0;
    visibility: hidden; }
  .media-library-list .info-overlay.has-inline-option .inline-button {
    display: block;
    -webkit-transform: translateX(-36px);
            transform: translateX(-36px); }
  .media-library-list .info-overlay.has-inline-option .label-button {
    -webkit-transform: none;
            transform: none; }
  .media-library-list .info-overlay.has-inline-option .select-button {
    -webkit-transform: translateX(36px);
            transform: translateX(36px); }
  .media-library-list .media-library-list-item[data-state="trashed"] .preview-button,
  .media-library-list .media-library-list-item[data-state="trashed"] .inline-button,
  .media-library-list .media-library-list-item[data-state="trashed"] .label-button {
    opacity: 0;
    visibility: hidden; }
  .media-library-list .media-library-list-item[data-state="trashed"] .select-button {
    -webkit-transform: none;
            transform: none; }
  .media-library-list .media-library-list-item {
    display: block;
    position: relative;
    float: left;
    width: 152px;
    height: 152px;
    margin: 5px;
    -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset;
            box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset;
    cursor: pointer;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: #f5f5f5; }
  .media-library-list .media-library-list-item[data-state="trashed"] {
    cursor: default; }
  .media-library-list .media-library-list-item.hover,
  .media-library-list .media-library-list-item:hover {
    -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.3) inset;
            box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.3) inset; }
    .media-library-list .media-library-list-item.hover .info-overlay,
    .media-library-list .media-library-list-item:hover .info-overlay {
      display: block; }
  .media-library-list .media-library-list-item.is-processing:before {
    content: 'Processing...';
    display: block;
    position: absolute;
    top: 74%;
    left: 0;
    width: 100%;
    color: #fff;
    z-index: 1;
    text-align: center;
    font-size: 12px; }
  .media-library-list .media-library-list-item[data-type="video"]:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    background-image: url(//staging.slides.com/assets/icons/video-icon-light-32-08e039bdfb8e4d35457b4908ada233356c14152e3a3490b664345eeee021c046.svg);
    background-size: 30%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: rgba(0, 0, 0, 0.3); }
  .media-library-list .media-library-list-item.has-intro {
    -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
  .media-library-list .media-library-list-item.hidden {
    -webkit-transform: scale(0.3);
            transform: scale(0.3); }
  .media-library-list.is-selecting .info-overlay {
    display: block;
    pointer-events: none;
    background-color: transparent; }
    .media-library-list.is-selecting .info-overlay .select-button {
      opacity: 0;
      left: 50%;
      -webkit-transform: scale(0.2);
              transform: scale(0.2);
      background-color: #222; }
      .media-library-list.is-selecting .info-overlay .select-button .checkmark {
        border-color: transparent;
        color: #fff; }
    .media-library-list.is-selecting .info-overlay .preview-button,
    .media-library-list.is-selecting .info-overlay .label-button,
    .media-library-list.is-selecting .info-overlay .inline-button {
      visibility: hidden;
      opacity: 0;
      -webkit-transform: none !important;
              transform: none !important; }
  .media-library-list.is-selecting .media-library-list-item {
    opacity: 0.3; }
  .media-library-list.is-selecting .media-library-list-item.is-selected {
    opacity: 1; }
    .media-library-list.is-selecting .media-library-list-item.is-selected .info-overlay .select-button {
      opacity: 1;
      -webkit-transform: none;
              transform: none;
      background-color: #226ede; }

html.has-visible-scrollbars .media-library-list-item {
  margin: 3px; }

.media-library-tray {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: var(--space-4);
  bottom: 15px;
  left: 10%;
  width: 80%;
  font-size: 13px;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(20px);
          transform: translateY(20px);
  -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  text-align: right;
  z-index: 2; }
  .media-library-tray .status {
    line-height: 28px;
    margin-right: auto; }
  .media-library-tray .restore-button,
  .media-library-tray .hard-delete-button {
    display: none; }
  .media-library-tray[data-state="trashed"] .soft-delete-button {
    display: none; }
  .media-library-tray[data-state="trashed"] .restore-button,
  .media-library-tray[data-state="trashed"] .hard-delete-button {
    display: initial; }
  .media-library-tray.visible {
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
            transform: none; }

.media-library-list-placeholder {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: none;
  color: #aaa;
  font-size: 14px;
  text-align: center;
  padding-top: 440px;
  cursor: default;
  background-image: url(//staging.slides.com/assets/media-library-placeholder-965f34ccb3124b7aef3c60966575f99759126b842f58d65a4c19d90c22a770bb.png);
  background-repeat: no-repeat;
  background-position: 50% 180px;
  line-height: 1.6; }
  .media-library-list-placeholder.visible {
    display: block; }

.media-library-drag-ghosts {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.9;
  z-index: 501;
  margin-left: -4px;
  margin-top: -4px; }
  .media-library-drag-ghosts .count {
    position: absolute;
    bottom: -8px;
    right: -8px;
    height: 30px;
    line-height: 30px;
    min-width: 30px;
    margin-left: -15px;
    padding: 0 4px;
    font-size: 12px;
    color: #fff;
    background: #222;
    border-radius: 15px;
    text-align: center; }

.media-library-drag-ghost {
  position: relative;
  display: inline-block;
  margin-right: 6px;
  margin-bottom: 6px;
  -webkit-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
          box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0; }
/**
 * Menu component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-menu {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  padding: var(--space-2);
  background: var(--surface-overlay);
  -webkit-box-shadow: 0 0 0 1px var(--border-overlay) inset;
          box-shadow: 0 0 0 1px var(--border-overlay) inset;
  color: var(--color-overlay);
  text-align: left;
  border-radius: var(--popover-radius);
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  white-space: nowrap;
  font-size: 13px;
  z-index: 2001;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  .sl-menu .sl-menu-hitarea {
    position: absolute;
    margin: -1px 0 0 -1px;
    z-index: 1; }
  .sl-menu .sl-menu-divider {
    width: 100%;
    height: 1px;
    margin: 2px 0;
    background: var(--border-overlay-divider); }
  .sl-menu svg.sl-menu-hitarea {
    pointer-events: none; }
    .sl-menu svg.sl-menu-hitarea path {
      pointer-events: auto;
      fill: transparent; }
  .sl-menu.debug div.sl-menu-hitarea {
    background-color: rgba(0, 255, 0, 0.5); }
  .sl-menu.debug svg.sl-menu-hitarea path {
    fill: rgba(0, 255, 0, 0.5); }
  .sl-menu .sl-menu-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: var(--space-1);
    position: relative;
    z-index: 2; }
  .sl-menu .sl-menu-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 0 10px;
    height: var(--button-size-6);
    width: 100%;
    color: var(--color-overlay);
    cursor: pointer;
    border-radius: calc(var(--popover-radius) - var(--radius-1));
    -webkit-appearance: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .sl-menu .sl-menu-item:hover,
  .sl-menu .sl-menu-item.popover-anchor {
    background-color: var(--surface-hover); }
  .sl-menu .sl-menu-item.active {
    background-color: var(--surface-hover-strong); }
  .sl-menu .sl-menu-item:focus {
    outline: 1px solid #226ede;
    outline-offset: 2px; }
  .sl-menu .sl-menu-item .label {
    line-height: inherit; }
  .sl-menu .sl-menu-item .icon {
    line-height: inherit;
    width: 1.2em;
    margin-left: 30px;
    font-size: 1em;
    text-align: center; }
  .sl-menu .sl-menu-item .counter {
    line-height: inherit;
    margin-left: 30px; }
  .sl-menu .sl-menu-item .counter-inner {
    display: inline-block;
    position: relative;
    top: -2px;
    width: 1.6em;
    height: 1.6em;
    line-height: 1.7em;
    border-radius: 1.6em;
    font-size: 0.8em;
    background-color: var(--color-accent);
    color: var(--color-text-inverse);
    text-align: center; }
  .sl-menu .sl-menu-arrow {
    position: absolute; }
  .sl-menu[data-alignment=t] .sl-menu-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: 1px;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-bottom-width: 0;
    border-top-color: var(--border-overlay); }
  .sl-menu[data-alignment=t] .sl-menu-arrow .sl-menu-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-bottom-width: 0;
    border-top-color: var(--surface-overlay); }
  .sl-menu[data-alignment=b] .sl-menu-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: -1px;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-top-width: 0;
    border-bottom-color: var(--border-overlay); }
  .sl-menu[data-alignment=b] .sl-menu-arrow .sl-menu-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-top-width: 0;
    border-bottom-color: var(--surface-overlay); }
  .sl-menu[data-alignment=l] .sl-menu-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: 1px;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-right-width: 0;
    border-left-color: var(--border-overlay); }
  .sl-menu[data-alignment=l] .sl-menu-arrow .sl-menu-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-right-width: 0;
    border-left-color: var(--surface-overlay); }
  .sl-menu[data-alignment=r] .sl-menu-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: -1px;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-left-width: 0;
    border-right-color: var(--border-overlay); }
  .sl-menu[data-alignment=r] .sl-menu-arrow .sl-menu-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-left-width: 0;
    border-right-color: var(--surface-overlay); }
/**
 * Meter component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-meter {
  position: relative;
  width: 100%;
  height: 28px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  overflow: hidden;
  cursor: default;
  color: #f9f9f9;
  border-color: currentColor; }
  .sl-meter .label {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 10px;
    z-index: 1;
    line-height: 26px;
    color: #333;
    font-size: 14px; }
  .sl-meter .progress {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    min-width: 1% !important;
    background-color: currentColor; }
  .sl-meter.animated {
    -webkit-transition: height 0.2s ease;
    transition: height 0.2s ease; }
    .sl-meter.animated .label {
      -webkit-transition: opacity 0.2s ease;
      transition: opacity 0.2s ease; }
    .sl-meter.animated .progress {
      -webkit-transition: all 0.2s ease;
      transition: all 0.2s ease; }
  .sl-meter[data-state="positive"] {
    color: #82e389; }
  .sl-meter[data-state="warning"] {
    color: #F8DE8A; }
  .sl-meter[data-state="negative"] {
    color: #F69A8B; }

.media-library .sl-meter {
  border-radius: 6px;
  border: 0px solid #333;
  background-color: #333; }
  .media-library .sl-meter .label {
    color: #fff;
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.4);
    font-size: 12px;
    line-height: 28px; }
  .media-library .sl-meter[data-state="positive"] {
    color: #1b58b2; }
  .media-library .sl-meter[data-state="warning"] {
    color: #1b58b2; }
  .media-library .sl-meter[data-state="negative"] {
    color: #ff5959; }
  .media-library .sl-meter[data-state="positive"]:not(:hover) {
    height: 8px; }
    .media-library .sl-meter[data-state="positive"]:not(:hover) .label {
      opacity: 0; }
/**
 * Tray used to show context options in modes (fragments, arrange, etc).
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
@-webkit-keyframes slide-toolbar-down {
  0% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px); }
  100% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
    opacity: 1;
    visibility: visible; } }
@keyframes slide-toolbar-down {
  0% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px); }
  100% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
    opacity: 1;
    visibility: visible; } }
.sl-tray-inner {
  height: var(--tray-height);
  padding: 0 var(--tray-padding);
  color: var(--color-text-strong);
  background: var(--surface-canvas);
  border-radius: var(--popover-radius);
  -webkit-box-shadow: 0 0 0 1px var(--border-default);
          box-shadow: 0 0 0 1px var(--border-default); }

.sl-mode-tray {
  position: fixed;
  left: 0;
  right: 0;
  z-index: 11;
  top: 0;
  -webkit-transform: translateY(-30px);
          transform: translateY(-30px);
  font-size: 13px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none; }
  .sl-mode-tray.visible {
    -webkit-animation: slide-toolbar-down 0.25s ease;
            animation: slide-toolbar-down 0.25s ease;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards; }
  .sl-mode-tray .inner {
    width: 90%;
    max-width: 600px;
    margin: 0 auto;
    overflow: hidden;
    pointer-events: auto; }
  .sl-mode-tray .description {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0;
    font-size: 1em;
    cursor: default; }
  .sl-mode-tray .buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: var(--space-4);
    position: relative;
    z-index: 1;
    margin-left: auto;
    white-space: nowrap; }
  .sl-mode-tray .button {
    font-size: 1em;
    -webkit-transition: opacity 0.2s ease, visibility 0.2s ease;
    transition: opacity 0.2s ease, visibility 0.2s ease; }
  .sl-mode-tray .button.hidden {
    opacity: 0;
    visibility: hidden; }
  .sl-mode-tray .idle-state,
  .sl-mode-tray .active-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: between;
        -ms-flex-pack: between;
            justify-content: between;
    height: var(--tray-height);
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease; }
  .sl-mode-tray .active-state {
    opacity: 0;
    visibility: hidden;
    clear: both; }
  .sl-mode-tray[data-state="active"] .idle-state {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(calc( var(--tray-height) * -1 ));
            transform: translateY(calc( var(--tray-height) * -1 )); }
  .sl-mode-tray[data-state="active"] .active-state {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(calc( var(--tray-height) * -1 ));
            transform: translateY(calc( var(--tray-height) * -1 )); }

.sl-editor .sl-mode-tray-annotate,
.sl-mode-tray-line,
.sl-mode-tray-arrange,
.sl-mode-tray-fragment,
.sl-mode-tray-image-editor {
  left: var(--page-inset-left);
  right: var(--page-inset-right); }

.sl-mode-tray .sl-range {
  display: inline-block; }

.sl-mode-tray .title-icon {
  margin-right: 0.8em;
  margin-left: 0.4em;
  font-size: 1.2em; }

@media screen and (max-width: 800px) {
  .sl-mode-tray {
    font-size: 11px; } }
/**
 * Fragment mode tray
 */
.sl-mode-tray-fragment .preview {
  position: relative;
  height: calc( var(--tray-height) - var(--space-6) );
  border-right: 1px solid var(--border-default);
  padding-right: var(--space-4);
  margin-right: var(--space-4);
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
.sl-mode-tray-fragment .preview-label {
  margin-right: var(--space-4);
  color: var(--color-text-subtle); }
.sl-mode-tray-fragment .preview-bar {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 30px;
  background-color: var(--surface-raised-stronger);
  border-radius: 30px;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  overflow: hidden;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .sl-mode-tray-fragment .preview-bar .segment {
    position: relative;
    font-size: 11px;
    width: 100%;
    height: 30px;
    line-height: 28px;
    text-align: center;
    cursor: default;
    z-index: 2;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .sl-mode-tray-fragment .preview-bar .segment:before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 6px;
    background-color: var(--color-text-subtle); }
  .sl-mode-tray-fragment .preview-bar .segment:hover:before,
  .sl-mode-tray-fragment .preview-bar .segment.highlight:before {
    background-color: var(--color-text); }
.sl-mode-tray-fragment .preview-progress {
  position: absolute;
  top: 0;
  left: 0;
  background: #226ede;
  height: 100%;
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
  visibility: hidden;
  opacity: 0; }
.sl-mode-tray-fragment .preview.active .preview-progress {
  visibility: visible;
  opacity: 1; }
.sl-mode-tray-fragment .preview-prev,
.sl-mode-tray-fragment .preview-next {
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  font-size: 1.2em;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
.sl-mode-tray-fragment .preview-prev {
  margin-left: var(--space-4);
  border-radius: 30px 0 0 30px; }
.sl-mode-tray-fragment .preview-next {
  border-radius: 0 30px 30px 0; }

/**
 * Drawing mode tray
 */
.sl-mode-tray-annotate .brush-color {
  width: 30px;
  height: 30px;
  border: 2px solid #fff;
  margin-right: 0.6em;
  border-radius: 4px;
  cursor: pointer; }
.sl-mode-tray-annotate .brush-color-inner {
  width: 100%;
  height: 100%;
  border: 13px solid rgba(255, 255, 255, 0.25);
  border-left-color: transparent;
  border-top-color: transparent; }
.sl-mode-tray-annotate .brush-sizes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
.sl-mode-tray-annotate .brush-size {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 32px;
  height: 32px;
  cursor: pointer;
  border-radius: 32px; }
.sl-mode-tray-annotate .brush-size + .brush-size,
.sl-mode-tray-annotate .custom-size {
  margin-left: 2px; }
.sl-mode-tray-annotate .custom-size {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }
  .sl-mode-tray-annotate .custom-size .brush-size-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 14px;
    opacity: 0.5;
    color: #000; }
.sl-mode-tray-annotate .brush-size-inner {
  border-radius: 32px;
  background: #fff;
  max-height: 26px !important;
  max-width: 26px !important; }
.sl-mode-tray-annotate .brush-size:hover {
  border: 2px solid #aaa; }
.sl-mode-tray-annotate .brush-size.selected {
  border: 2px solid #fff; }
/**
 * Notifications popup.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-notifications {
  --border-color: var(--border-subtle);
  position: fixed;
  right: var(--space-4);
  bottom: var(--space-4);
  width: 400px;
  z-index: 2001; }
  @media screen and (max-width: 400px) {
    .sl-notifications {
      max-width: 280px; } }

.sl-editor.editor-context-visible .sl-notifications {
  bottom: calc( var(--space-4) + var(--projector-inset-bottom) ); }

.sl-editor:not(.popup-open) .sl-notifications,
html.decks.review:not(.popup-open) .sl-notifications {
  right: calc( var(--space-4) + var(--page-inset-right, 0px) ); }

.sl-notification {
  position: absolute;
  right: 0;
  padding: 12px 12px;
  margin: 0;
  font-size: 14px;
  color: var(--color-text);
  background-color: var(--surface-overlay);
  border: 1px solid var(--border-color);
  text-align: left;
  border-radius: var(--popover-radius);
  opacity: 0;
  line-height: 1.4;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: default;
  -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.2s ease;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.2s ease;
  -webkit-transform: scale(0.8);
          transform: scale(0.8); }
  .sl-notification.has-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    gap: var(--space-4); }
  .sl-notification.show {
    opacity: 1;
    -webkit-transform: none;
            transform: none; }
  .sl-notification.hide {
    opacity: 0; }
  .sl-notification.white {
    color: #000;
    background-color: rgba(255, 255, 255, 0.95);
    border: 0; }
  .sl-notification.white-shadow {
    color: #000;
    background-color: rgba(255, 255, 255, 0.95);
    border: 0;
    -webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, 0.14);
            box-shadow: 0 2px 14px rgba(0, 0, 0, 0.14); }
  .sl-notification.negative {
    border: 0;
    color: var(--color-danger-fg);
    background-color: var(--color-danger); }

.sl-notification.loading-notification {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--space-4); }

.sl-notification.loading-notification .spinner {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 22px;
  height: 22px;
  margin: 0; }

.sl-notification .buttons {
  font-size: 0.866em; }

.sl-notification .buttons[data-layout="block"] {
  display: block;
  margin-top: 15px;
  text-align: right; }
  .sl-notification .buttons[data-layout="block"] .button + .button {
    margin-left: 10px; }

.sl-notification .buttons[data-layout="inline"] {
  display: inline-block;
  padding-left: 5px;
  margin: -4px 0 -4px 15px; }

.sl-notification .retry-options {
  margin-top: 15px;
  font-size: 0.866em;
  text-align: right; }

.sl-notification .retry-countdown {
  min-width: 130px;
  line-height: 25px;
  margin-right: 15px;
  float: left;
  vertical-align: middle;
  text-align: left; }

.sl-notification a,
.sl-notification a:hover {
  color: currentColor;
  border-bottom-color: currentColor; }

.sl-notification h4 {
  margin-bottom: 6px;
  font-weight: 600;
  font-size: 16px; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-onboarding {
  --sl-onboarding-padding: var(--space-8);
  --sl-onboarding-gap: var(--space-7);
  --sl-onboarding-action-padding: var(--space-5);
  --sl-onboarding-action-radius: var(--radius-4);
  --sl-onboarding-radius: var(--radius-6);
  display: block;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: left;
  color: var(--color-text);
  max-width: 520px;
  padding: var(--sl-onboarding-padding);
  background-color: var(--surface-section);
  border: var(--border-section-width) solid var(--border-section);
  -webkit-box-shadow: var(--shadow-section);
          box-shadow: var(--shadow-section);
  border-radius: var(--sl-onboarding-radius) !important;
  margin-bottom: calc( var(--space-8) + var(--space-7) ); }
  .sl-onboarding strong {
    font-weight: 500; }
  .sl-onboarding .sl-onboarding-text,
  .sl-onboarding .sl-onboarding-actions {
    width: 100%; }
  .sl-onboarding .sl-onboarding-text {
    margin-bottom: calc( var(--space-8) + var(--space-4) ); }
    .sl-onboarding .sl-onboarding-text h2 {
      font-size: 1.5em; }
    .sl-onboarding .sl-onboarding-text h3 {
      font-size: 1em; }
    .sl-onboarding .sl-onboarding-text .signature {
      margin-top: var(--space-5);
      max-width: 100%; }
  .sl-onboarding .suggested-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    padding: var(--sl-onboarding-action-padding) 0;
    border: 1px solid var(--border-default);
    border-radius: var(--sl-onboarding-action-radius);
    color: var(--color-text);
    background: var(--surface-panel); }
  .sl-onboarding .suggested-action + .suggested-action {
    margin-top: var(--sl-onboarding-gap); }
  .sl-onboarding .suggested-action:hover {
    border-color: var(--color-accent);
    background: var(--surface-hover); }
  .sl-onboarding .suggested-action .left {
    position: relative;
    margin-right: var(--space-5);
    border-right: 1px solid var(--border-default);
    width: calc( var(--button-size-9) + var(--space-6) );
    min-height: calc( var(--button-size-8) + var(--space-2) );
    -ms-flex-negative: 0;
        flex-shrink: 0;
    color: var(--color-accent); }
  .sl-onboarding .suggested-action .right {
    padding: 0 var(--space-5);
    -ms-flex-item-align: center;
        align-self: center; }
  .sl-onboarding .suggested-action .title {
    font-weight: 600; }
  .sl-onboarding .suggested-action .badge {
    position: relative;
    top: -1px;
    margin-left: var(--space-5);
    padding: var(--space-1) var(--space-3);
    font-size: 0.8em;
    border-radius: var(--radius-full);
    vertical-align: middle;
    font-weight: normal;
    background: var(--color-accent);
    color: var(--color-text-inverse);
    white-space: nowrap; }
  .sl-onboarding .suggested-action .description {
    color: var(--color-text-muted); }
  .sl-onboarding .suggested-action .icon {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 1.5em;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%); }
  .sl-onboarding .suggested-action .icon.i-chevron-right {
    font-size: 2em; }
  .sl-onboarding .suggested-action .hide-on-hover,
  .sl-onboarding .suggested-action .show-on-hover {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease; }
  .sl-onboarding .suggested-action:hover .hide-on-hover {
    opacity: 0;
    -webkit-transition-duration: 0.15s;
            transition-duration: 0.15s; }
  .sl-onboarding .suggested-action .show-on-hover {
    -webkit-transform: translateY(-50%) translateX(calc( ( var(--space-5) + var(--space-4) ) * -1 ));
            transform: translateY(-50%) translateX(calc( ( var(--space-5) + var(--space-4) ) * -1 ));
    opacity: 0; }
  .sl-onboarding .suggested-action:hover .show-on-hover {
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    opacity: 1; }
  .sl-onboarding .suggested-action.done:not(:hover) {
    opacity: 0.7;
    color: var(--color-text-subtle); }
    .sl-onboarding .suggested-action.done:not(:hover) .left {
      color: var(--color-text-subtle); }
    .sl-onboarding .suggested-action.done:not(:hover) .description {
      color: var(--color-text-subtle); }
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.reveal-viewport .sl-orientation-prompt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 2rem;
  z-index: 1000;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }

.reveal-viewport .sl-orientation-prompt-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1; }

.reveal-viewport .sl-orientation-prompt-inner {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 2rem;
  gap: 1rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  border-radius: 36px;
  background-color: rgba(10, 10, 18, 0.4);
  backdrop-filter: blur(8px);
  color: #fff;
  font-size: 18px;
  font-family: var(--font-sans);
  line-height: 1.4;
  pointer-events: auto;
  z-index: 2; }

.sl-orientation-prompt-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1rem; }

.reveal-viewport .sl-orientation-prompt button {
  border-radius: 6px; }

@media screen and (min-aspect-ratio: 4 / 3) {
  .reveal-viewport .sl-orientation-prompt {
    padding-left: 4rem;
    padding-right: 4rem; }

  .reveal-viewport .sl-orientation-prompt-inner {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    position: fixed;
    padding: 1rem;
    inset: 2rem 5rem; }

  .reveal-viewport .sl-orientation-prompt-text {
    -ms-flex-preferred-size: 44%;
        flex-basis: 44%;
    margin: 0 auto; } }
.orientation-prompt-visible .reveal .controls button {
  -webkit-animation: none !important;
          animation: none !important; }
/**
 * Page navigation sidebar, for scroll anchors and
 * internal page links.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.main.has-page-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  width: 100%;
  max-width: var(--page-max-width);
  margin-left: auto;
  margin-right: auto;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding-bottom: var(--section-margin); }

.main.has-page-nav .column {
  width: auto;
  margin-left: 0;
  margin-right: auto; }

.main.has-page-nav:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: var(--app-nav-width);
  border-left: 1px solid var(--border-section);
  background: var(--gradient-page);
  pointer-events: none; }

.sl-page-nav {
  position: sticky;
  width: var(--app-nav-width);
  top: var(--header-height);
  max-height: calc( 100vh - var(--header-height) );
  overflow-y: auto;
  padding: var(--page-padding);
  padding-top: calc(var(--section-padding) + var(--page-padding));
  vertical-align: top;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  border-right: 0;
  will-change: transform; }

.sl-page-nav a {
  font-size: 14px; }

.sl-page-nav ul {
  list-style: none; }

.sl-page-nav-header {
  font-size: 18.2px;
  margin-bottom: var(--space-6);
  padding-top: 0 !important;
  margin-top: 0 !important; }

.sl-page-nav h4 {
  font-size: 14px;
  margin: 0 0 20px 20px;
  padding: 0 0 20px 8px;
  color: var(--color-nav-heading);
  border-bottom: 1px solid var(--border-section); }

.sl-page-nav-divider {
  width: 100%;
  height: 1px;
  margin: 20px 0;
  background: var(--border-section); }

.sl-page-nav-marker {
  position: absolute;
  top: 0;
  left: var(--minus-space-4);
  width: 100%;
  height: 100%;
  z-index: -1;
  color: var(--color-nav-scroll); }
  .sl-page-nav-marker path {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease; }

.sl-page-nav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--space-2);
  margin-left: var(--minus-space-4); }

.sl-page-nav-pages {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }

.sl-page-nav-item {
  margin: 0 !important; }

.sl-page-nav-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  height: var(--button-size-5);
  padding: 0 var(--space-4);
  color: var(--color-nav-link);
  background: var(--surface-nav-link);
  border-radius: var(--nav-link-radius);
  font-weight: 500; }

.sl-page-nav-page-link {
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.sl-page-nav-link:hover {
  background: var(--surface-nav-link-hover);
  color: var(--color-nav-link-hover); }

.sl-page-nav-item.selected > .sl-page-nav-link {
  background: var(--surface-nav-link-selected);
  color: var(--color-nav-link-selected); }

.sl-page-nav-sections {
  margin: var(--space-2) 0 0 0; }

.sl-page-nav-page > .sl-page-nav-sections {
  margin-top: var(--space-3);
  padding: 0 0 var(--space-6) var(--space-4); }

.sl-page-nav .sl-page-nav-sections ul {
  margin-left: 12px; }

.sl-page-nav-sections li li {
  opacity: 0.8; }

.sl-page-nav-sections li.selected,
.sl-page-nav-sections li:has(.selected) {
  opacity: 1; }

.sl-page-nav-sections li li:hover {
  opacity: 1; }

.sl-page-nav-sections .sl-page-nav-section-link {
  padding-top: var(--space-1);
  padding-bottom: var(--space-1);
  display: block;
  color: var(--color-nav-scroll);
  -webkit-transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1); }

.sl-page-nav-sections .sl-page-nav-section-link:hover {
  color: var(--color-nav-scroll-active); }

.sl-page-nav-sections .selected > .sl-page-nav-section-link {
  color: var(--color-nav-scroll-active);
  -webkit-transform: translateX(5px);
          transform: translateX(5px); }

@media screen and (max-width: 900px) {
  .main.has-page-nav {
    display: block; }

  .main.has-page-nav:before {
    display: none; }

  .main.has-page-nav .column,
  .main.has-page-nav .column.thin {
    width: auto; }

  .main.has-page-nav .column > section {
    padding: 0 var(--space-2); }

  .sl-page-nav {
    position: static;
    display: block;
    width: 100%;
    max-height: none;
    overflow: visible; }

  .sl-page-nav-pages {
    display: block;
    overflow: visible; }

  .sl-page-nav-sections {
    display: none; }

  .sl-page-nav a {
    -webkit-transform: none !important;
            transform: none !important; }

  .sl-page-nav-marker {
    display: none; } }
/**
 * Full page preloader.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.page-loader {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 2000;
  background: #111;
  color: #fff;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease; }
  .page-loader .page-loader-inner {
    position: absolute;
    display: block;
    top: 40%;
    width: 100%;
    text-align: center;
    -webkit-transition: opacity 0.3s linear 0.1s;
    transition: opacity 0.3s linear 0.1s; }
    .page-loader .page-loader-inner.hidden {
      opacity: 0; }
    .page-loader .page-loader-inner .page-loader-spinner {
      display: block;
      position: relative;
      width: 50px;
      height: 50px;
      margin: 0 auto 20px auto;
      -webkit-animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal;
              animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal;
      background-color: #E4637C;
      border-radius: 1px; }
    .page-loader .page-loader-inner .page-loader-message {
      display: block;
      margin: 0;
      vertical-align: top;
      line-height: 32px;
      font-size: 14px;
      color: #bbb;
      font-family: Helvetica, sans-serif; }
  .page-loader[data-style="white"] {
    background: #fff;
    color: #555; }

body > .page-loader {
  position: fixed; }

.page-loader.visible {
  visibility: visible;
  opacity: 1; }

.page-loader.frozen .page-loader-spinner {
  -webkit-animation: none;
          animation: none; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-pills {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: var(--space-4); }

.sl-pills-empty {
  color: var(--color-text-faint);
  font-size: 12px; }

.sl-pill {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--space-2);
  padding: 0 var(--space-4);
  height: var(--button-size-3);
  -webkit-box-shadow: 0 0 0 1px var(--surface-hover-stronger) inset;
          box-shadow: 0 0 0 1px var(--surface-hover-stronger) inset;
  border-radius: var(--radius-full);
  font-size: var(--font-size-edit-ui);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.sl-pill-remove {
  height: 20px;
  width: 20px;
  margin-right: calc( var( --space-2 ) * -1 );
  padding: 0; }

.sl-pill-remove .icon {
  font-size: 12px; }

.sl-pill-add {
  min-width: var(--button-size-3);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }

.sl-pill-add .icon {
  font-size: 12px; }
@charset "UTF-8";
/**
 * Styles for the popup component.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-popup.dark-theme .sl-popup-background {
  background: rgba(30, 30, 30, 0.6); }
.sl-popup.dark-theme .sl-popup-inner {
  -webkit-box-shadow: 0 0 0 1px var(--surface-panel-alt);
          box-shadow: 0 0 0 1px var(--surface-panel-alt); }
.sl-popup.dark-theme .sl-popup-header {
  border-bottom: 1px solid var(--surface-panel-alt); }

.sl-popup {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 400;
  padding: 5px;
  font-size: 14px;
  pointer-events: none; }
  .sl-popup.sl-popup-inline {
    z-index: initial;
    position: relative;
    padding: 0; }
    .sl-popup.sl-popup-inline .sl-popup-inner {
      margin: 0;
      max-width: none;
      max-height: none;
      -webkit-box-shadow: none;
              box-shadow: none; }
  .sl-popup .sl-popup-background {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    -webkit-transition: opacity 0.15s ease;
    transition: opacity 0.15s ease;
    pointer-events: none; }
  .sl-popup h2, .sl-popup h3 {
    font-weight: normal; }
  .sl-popup .sl-popup-inner {
    position: relative;
    margin: auto;
    max-width: 98%;
    max-height: 98%;
    color: var(--color-text-strong);
    text-align: left;
    border-radius: var(--popup-radius);
    opacity: 0;
    -webkit-transition: opacity 0.15s ease, -webkit-transform 0.15s ease;
    transition: opacity 0.15s ease, -webkit-transform 0.15s ease;
    transition: transform 0.15s ease, opacity 0.15s ease;
    transition: transform 0.15s ease, opacity 0.15s ease, -webkit-transform 0.15s ease;
    -webkit-transform: scale(0.95);
            transform: scale(0.95); }
  .sl-popup .sl-popup-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 70px;
    padding: 20px;
    border-top-left-radius: var(--popup-radius);
    border-top-right-radius: var(--popup-radius);
    background: var(--surface-glass);
    backdrop-filter: var(--surface-glass-filter);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
  .sl-popup .sl-popup-header .sl-popup-header-title {
    max-width: 85%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden; }
  .sl-popup .sl-popup-header .sl-popup-header-title-item {
    color: #777;
    margin-left: 6px; }
  .sl-popup .sl-popup-header-actions {
    position: absolute;
    right: 20px;
    top: 17px; }
    .sl-popup .sl-popup-header-actions .button {
      font-size: 14px;
      vertical-align: top; }
    .sl-popup .sl-popup-header-actions .button .icon {
      margin-left: 6px; }
    .sl-popup .sl-popup-header-actions .button + .button {
      margin-left: 6px; }
    .sl-popup .sl-popup-header-actions .divider {
      display: inline-block;
      vertical-align: top;
      width: 1px;
      height: 34px;
      margin: 0 15px;
      background-color: #bbb; }
  .sl-popup .sl-popup-body {
    position: relative;
    line-height: 1.4;
    overflow: auto;
    background: var(--surface-glass);
    backdrop-filter: var(--surface-glass-filter);
    outline: none;
    border-bottom-left-radius: var(--popup-radius);
    border-bottom-right-radius: var(--popup-radius);
    -webkit-overflow-scrolling: touch; }
    .sl-popup .sl-popup-body p:first-child,
    .sl-popup .sl-popup-body h1:first-child,
    .sl-popup .sl-popup-body h2:first-child,
    .sl-popup .sl-popup-body h3:first-child,
    .sl-popup .sl-popup-body h4:first-child {
      margin-top: 0; }
  .sl-popup.skip-intro, .sl-popup.skip-intro .sl-popup-inner {
    -webkit-transition: none;
    transition: none; }
  .sl-popup.visible, .sl-popup.skip-intro {
    pointer-events: auto; }
    .sl-popup.visible .sl-popup-background, .sl-popup.skip-intro .sl-popup-background {
      opacity: 1; }
    .sl-popup.visible .sl-popup-inner, .sl-popup.skip-intro .sl-popup-inner {
      opacity: 1;
      -webkit-transform: none;
              transform: none; }

.sl-popup-solid .sl-popup-body {
  background: #fff; }

.sl-popup-body.has-sidebar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  padding: 0; }
  .sl-popup-body.has-sidebar .sl-popup-content {
    background: #fff;
    border-top-left-radius: var(--popup-inner-radius); }

.sl-popup-sidebar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 200px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding: 0 var(--space-4);
  gap: var(--space-1);
  overflow: auto; }

.sl-popup-content {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  overflow: auto;
  max-height: 100%; }

.sl-popup-content-page {
  position: relative;
  min-height: 100%; }

.sl-popup-sidebar-header {
  color: #aaa;
  font-weight: 500;
  text-transform: uppercase;
  padding: 24px 20px 10px 20px;
  line-height: 24px;
  font-size: 0.9em; }

.sl-popup-sidebar-divider {
  padding: 10px 20px; }
  .sl-popup-sidebar-divider:before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background: #ddd; }

.sl-popup-sidebar-button {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  width: 100%;
  height: var(--button-size-7);
  gap: var(--space-3);
  background: var(--surface-nav-link);
  color: var(--color-nav-link);
  border-radius: var(--nav-link-radius);
  font-weight: 500;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  background-color: transparent; }
  .sl-popup-sidebar-button:hover {
    color: var(--color-nav-link-hover);
    background: var(--surface-nav-link-hover); }
  .sl-popup-sidebar-button:active:not(.selected) {
    color: var(--color-nav-link-hover);
    background: var(--surface-nav-link-hover); }
  .sl-popup-sidebar-button.selected {
    color: var(--color-text);
    background: var(--surface-nav-link-selected);
    cursor: default; }
  .sl-popup-sidebar-button.disabled {
    pointer-events: none;
    opacity: 0.45;
    background-color: transparent; }
  .sl-popup-sidebar-button:focus {
    outline: none; }
  .sl-popup-sidebar-button:focus-visible {
    outline: 1px solid var(--color-accent);
    outline-offset: 2px; }
  .sl-popup-sidebar-button .icon {
    margin-left: auto;
    -ms-flex-negative: 0;
        flex-shrink: 0; }

.sl-popup-sidebar-primary-action {
  margin: auto 6px 6px 6px;
  padding: 24px 20px;
  text-align: left;
  line-height: 1.5em;
  font-weight: 500; }
  .sl-popup-sidebar-primary-action .icon {
    float: right;
    font-size: 1.5em; }

@media screen and (max-width: 500px) {
  .sl-popup-body.has-sidebar {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
    .sl-popup-body.has-sidebar .sl-popup-sidebar {
      width: 100%; }
    .sl-popup-body.has-sidebar .sl-popup-sidebar .sl-popup-sidebar-button.button {
      padding: var(--space-5) 20px; }
    .sl-popup-body.has-sidebar .sl-popup-sidebar .sl-popup-sidebar-button.button.selected {
      background-color: #226ede;
      color: #fff; }
    .sl-popup-body.has-sidebar .sl-popup-content {
      text-align: center; } }
.sl-popup[data-id="revision"] .sl-popup-body {
  padding: 5px;
  padding-top: 0; }
.sl-popup[data-id="revision"] .spinner {
  top: 45%;
  display: none; }
.sl-popup[data-id="revision"] .loading .spinner {
  display: block; }
.sl-popup[data-id="revision"] .deck {
  width: 100%;
  height: 100%;
  background: #777;
  border-radius: var(--popup-inner-radius);
  overflow: hidden; }
  .sl-popup[data-id="revision"] .deck iframe {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0; }

.sl-popup[data-id="session-expired"] .sl-popup-body {
  padding: 20px; }
.sl-popup[data-id="session-expired"] ol {
  margin: 15px 0;
  padding: 0;
  list-style: decimal inside; }

.sl-popup[data-id="deck-outdated"] .sl-popup-body {
  padding: 20px; }

.sl-popup[data-id="insert-snippet"] .sl-popup-body {
  padding: 20px; }
.sl-popup[data-id="insert-snippet"] .variables {
  margin: 20px 0; }
  .sl-popup[data-id="insert-snippet"] .variables .browse-for-image,
  .sl-popup[data-id="insert-snippet"] .variables .browse-for-video {
    float: right; }
  .sl-popup[data-id="insert-snippet"] .variables label {
    margin-bottom: 10px; }
  .sl-popup[data-id="insert-snippet"] .variables input {
    width: 100%; }

.sl-popup[data-id="code-editor"] .sl-popup-body,
.sl-popup[data-id="edit-slide-html"] .sl-popup-body {
  padding: 0 5px 5px 5px; }
.sl-popup[data-id="code-editor"] .editor,
.sl-popup[data-id="edit-slide-html"] .editor {
  position: relative;
  width: 100%;
  height: 100%; }
.sl-popup[data-id="code-editor"] .CodeMirror,
.sl-popup[data-id="edit-slide-html"] .CodeMirror {
  border-radius: var(--popup-inner-radius); }

.sl-popup[data-id="custom-fonts"] .sl-popup-body {
  padding: 20px; }
.sl-popup[data-id="custom-fonts"] input {
  width: 100%; }
.sl-popup[data-id="custom-fonts"] .google-settings .google-status {
  display: none;
  font-size: 0.8em;
  margin-top: 10px;
  color: #999; }
  .sl-popup[data-id="custom-fonts"] .google-settings .google-status.visible {
    display: block; }
.sl-popup[data-id="custom-fonts"] .google-settings .google-status-item {
  display: inline-block;
  border: 1px solid #ddd;
  padding: 2px 6px;
  border-radius: 20px;
  margin: 0 6px 6px 0; }
.sl-popup[data-id="custom-fonts"] .google-settings .google-status-item:first-child {
  margin-left: 6px; }

.sl-popup[data-id="preview-media"] .sl-popup-body {
  width: 100% !important;
  height: 100% !important;
  height: calc(100% - 70px) !important;
  overflow: hidden;
  padding: var(--popup-inner-radius);
  padding-top: 0; }
  .sl-popup[data-id="preview-media"] .sl-popup-body .media-preloader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1; }
  .sl-popup[data-id="preview-media"] .sl-popup-body img,
  .sl-popup[data-id="preview-media"] .sl-popup-body video,
  .sl-popup[data-id="preview-media"] .sl-popup-body iframe {
    position: relative;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
    opacity: 0;
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
    z-index: 2;
    border-radius: var(--popup-inner-radius); }
  .sl-popup[data-id="preview-media"] .sl-popup-body iframe {
    border: 0; }
  .sl-popup[data-id="preview-media"] .sl-popup-body.loaded-media img, .sl-popup[data-id="preview-media"] .sl-popup-body.loaded-media video, .sl-popup[data-id="preview-media"] .sl-popup-body.loaded-media iframe {
    opacity: 1; }

.sl-popup[data-id="preview-template"] .sl-popup-body {
  width: 100% !important;
  height: 100% !important;
  height: calc(100% - 70px) !important;
  overflow: hidden;
  padding-top: 1px; }
  .sl-popup[data-id="preview-template"] .sl-popup-body .popup-preloader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1; }
  .sl-popup[data-id="preview-template"] .sl-popup-body iframe {
    position: relative;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
    z-index: 2;
    border: 0;
    border-bottom-left-radius: var(--popup-inner-radius);
    border-bottom-right-radius: var(--popup-inner-radius); }
  .sl-popup[data-id="preview-template"] .sl-popup-body.loaded iframe {
    opacity: 1; }

.sl-popup[data-id="deck-templates"] .sl-popup-body {
  height: 800px; }
.sl-popup[data-id="deck-templates"] .sl-popup-content {
  overflow: hidden; }
.sl-popup[data-id="deck-templates"] .sl-popup-content-page {
  height: 100%;
  padding: 7.5px;
  overflow: auto; }
.sl-popup[data-id="deck-templates"] .content-placeholder {
  position: absolute;
  width: 100%;
  top: 45%;
  color: #999;
  text-align: center; }
.sl-popup[data-id="deck-templates"] .sl-deck-thumbnail {
  position: relative;
  display: inline-block;
  width: 250px;
  height: auto;
  margin: 7.5px;
  cursor: pointer;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  font-size: 1rem; }
.sl-popup[data-id="deck-templates"] .sl-deck-thumbnail .deck-thumb {
  overflow: hidden; }
.sl-popup[data-id="deck-templates"] .sl-deck-thumbnail:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; }

.sl-popup[data-id="markdown-importer"] .sl-popup-body {
  height: 800px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  overflow: hidden; }
.sl-popup[data-id="markdown-importer"] .sl-popup-header-actions {
  white-space: nowrap; }
.sl-popup[data-id="markdown-importer"] .editor-placeholder,
.sl-popup[data-id="markdown-importer"] .preview-placeholder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 5;
  color: #999;
  pointer-events: none;
  text-align: center; }
.sl-popup[data-id="markdown-importer"] .preview-placeholder,
.sl-popup[data-id="markdown-importer"] .markdown-instructions {
  background-color: var(--surface-canvas);
  color: var(--color-text-strong); }
.sl-popup[data-id="markdown-importer"] .markdown-editor {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  border-right: 1px solid var(--surface-panel-alt); }
.sl-popup[data-id="markdown-importer"] .markdown-preview {
  position: absolute;
  top: 0;
  left: 50%;
  width: 50%;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-auto-rows: -webkit-max-content;
  grid-auto-rows: max-content;
  gap: 10px;
  padding: 10px;
  max-height: 100%;
  overflow: auto;
  pointer-events: none; }
.sl-popup[data-id="markdown-importer"] .markdown-instructions {
  position: absolute;
  top: 0;
  left: 50%;
  width: 50%;
  height: 100%;
  overflow: auto;
  z-index: 10;
  padding: 20px;
  backdrop-filter: blur(10px);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
  -webkit-transform: translateY(16px);
          transform: translateY(16px); }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions pre code {
    padding: 4px 8px;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    background-color: var(--surface-panel); }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions h3 {
    font-weight: 500; }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions * + h3 {
    margin-top: 2em; }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions a {
    color: var(--color-accent); }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions table ul,
  .sl-popup[data-id="markdown-importer"] .markdown-instructions table ol {
    padding-left: 0;
    list-style-position: inside; }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions table tr {
    border-color: var(--border-subtle); }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions.visible {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
            transform: translateY(0); }
@media screen and (max-width: 600px) {
  .sl-popup[data-id="markdown-importer"] .sl-popup-header-title {
    display: none; }
  .sl-popup[data-id="markdown-importer"] .markdown-instructions {
    left: 0;
    width: 100%; } }

.sl-popup[data-id="translator"] {
  --toggle-column-width: 40px;
  --text-column-min-width: 220px; }
  .sl-popup[data-id="translator"] .sl-popup-inner {
    width: max(1000px, calc(var(--toggle-column-width) + var(--translator-text-column-count, 1) * var(--text-column-min-width))) !important; }
  .sl-popup[data-id="translator"] .sl-popup-body {
    padding: 20px 0 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    overflow: hidden;
    padding-bottom: 0; }
  .sl-popup[data-id="translator"] .scrollable-table {
    overflow: auto;
    max-height: 100%;
    padding-bottom: 50px;
    -webkit-overflow-scrolling: touch; }
  .sl-popup[data-id="translator"] .sl-table {
    table-layout: fixed;
    width: max(100%, calc(var(--toggle-column-width) + var(--translator-text-column-count, 1) * var(--text-column-min-width))); }
  .sl-popup[data-id="translator"] .sl-table col.toggle-column {
    width: var(--toggle-column-width); }
  .sl-popup[data-id="translator"] .sl-table col.text-column {
    width: calc((100% - var(--toggle-column-width)) / var(--translator-text-column-count, 1)); }
  .sl-popup[data-id="translator"] .sl-table th,
  .sl-popup[data-id="translator"] .sl-table td {
    padding: 0.75em 1em; }
  .sl-popup[data-id="translator"] .sl-table thead {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: #fff;
    -webkit-box-shadow: 0 0.5px 0px 0px #eee;
            box-shadow: 0 0.5px 0px 0px #eee; }
  .sl-popup[data-id="translator"] .sl-table th.original,
  .sl-popup[data-id="translator"] .sl-table td.original {
    padding-left: 20px;
    -webkit-box-shadow: -1px 0 0 0 #eee inset;
            box-shadow: -1px 0 0 0 #eee inset; }
  .sl-popup[data-id="translator"] .sl-table .translation-column-header-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 8px; }
  .sl-popup[data-id="translator"] .sl-table .translation-column-label {
    display: block;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0;
    line-height: 1.3; }
  .sl-popup[data-id="translator"] .sl-table .translation-column-header-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    gap: 8px;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .sl-popup[data-id="translator"] .sl-table .translation-column-progress,
  .sl-popup[data-id="translator"] .sl-table .translation-column-checkmark {
    display: none; }
  .sl-popup[data-id="translator"] .sl-table .translation-column-progress {
    font-size: 12px;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    white-space: nowrap; }
  .sl-popup[data-id="translator"] .sl-table .translation-column-checkmark {
    color: var(--color-success);
    font-size: 14px;
    line-height: 1; }
  .sl-popup[data-id="translator"] .sl-table .retry-language-button {
    display: none;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .sl-popup[data-id="translator"] .sl-table thead th.translation-column-header.in-progress,
  .sl-popup[data-id="translator"] .sl-table thead th.translation-column-header.finished,
  .sl-popup[data-id="translator"] .sl-table thead th.translation-column-header.failed {
    opacity: 1; }
  .sl-popup[data-id="translator"] .sl-table thead th.translation-column-header.in-progress .translation-column-progress {
    display: inline-block; }
  .sl-popup[data-id="translator"] .sl-table thead th.translation-column-header.finished .translation-column-checkmark {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  .sl-popup[data-id="translator"] .sl-table thead th.translation-column-header.failed {
    color: #cc5040; }
  .sl-popup[data-id="translator"] .sl-table thead th.translation-column-header.failed .retry-language-button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  .sl-popup[data-id="translator"] .sl-table.multi-language th.sticky,
  .sl-popup[data-id="translator"] .sl-table.multi-language td.sticky {
    opacity: 1;
    position: sticky;
    background-color: #fff;
    left: 0;
    z-index: 1; }
  .sl-popup[data-id="translator"] .sl-table tr.disabled {
    display: none; }
  .sl-popup[data-id="translator"] .sl-table th:before {
    content: '';
    background: var(--surface-canvas);
    width: 100%;
    height: 20px;
    position: absolute;
    top: -20px;
    left: 0; }
  .sl-popup[data-id="translator"] .sl-table table th:before {
    content: none; }
  .sl-popup[data-id="translator"] .sl-table th,
  .sl-popup[data-id="translator"] .sl-table td.pending {
    opacity: 0.6; }
  .sl-popup[data-id="translator"] .sl-table td.toggle {
    opacity: 0.6;
    text-align: center;
    padding: 0;
    padding-left: 10px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    vertical-align: middle; }
  .sl-popup[data-id="translator"] .sl-table .toggle:hover {
    opacity: 1; }
  .sl-popup[data-id="translator"] .sl-table td.original {
    opacity: 0.8; }
  .sl-popup[data-id="translator"] .sl-table td.pending:before {
    content: '–'; }
  .sl-popup[data-id="translator"] .sl-table td .button {
    width: 28px;
    height: 28px;
    padding: 0; }
  .sl-popup[data-id="translator"] .sl-table tbody * {
    font-size: 13px !important;
    line-height: 1.4;
    margin: 0;
    text-align: left !important; }
  .sl-popup[data-id="translator"] .sl-table td:not(.toggle) * {
    color: inherit !important; }
  .sl-popup[data-id="translator"] .sl-table td {
    vertical-align: top; }
  .sl-popup[data-id="translator"] .sl-table td[contenteditable]:focus {
    -webkit-box-shadow: 0 0 0 2px #226ede inset;
            box-shadow: 0 0 0 2px #226ede inset;
    outline: none; }
  .sl-popup[data-id="translator"] .sl-table tbody ul,
  .sl-popup[data-id="translator"] .sl-table tbody ol {
    list-style-position: inside;
    -webkit-padding-start: 0;
            padding-inline-start: 0; }
  .sl-popup[data-id="translator"] .sl-table tbody ul ul,
  .sl-popup[data-id="translator"] .sl-table tbody ol ol,
  .sl-popup[data-id="translator"] .sl-table tbody ul ol,
  .sl-popup[data-id="translator"] .sl-table tbody ol ul {
    -webkit-padding-start: 1em;
            padding-inline-start: 1em; }
  .sl-popup[data-id="translator"] .sl-table tbody table {
    margin: 0;
    width: 100%; }
  .sl-popup[data-id="translator"] .sl-table tbody table th,
  .sl-popup[data-id="translator"] .sl-table tbody table td {
    padding: 4px !important;
    width: auto !important; }
  .sl-popup[data-id="translator"] .sl-table tbody table tr {
    border-top: 0; }
  .sl-popup[data-id="translator"] .translation-status {
    padding: 6px 12px;
    border-radius: var(--radius-full);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 16px;
    position: absolute;
    bottom: var(--space-4);
    right: var(--space-4);
    z-index: 10;
    font-variant-numeric: tabular-nums;
    font-size: 12px;
    font-weight: 500;
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.5);
    -webkit-box-shadow: 0 0 0 1px #ddd;
            box-shadow: 0 0 0 1px #ddd;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
  .sl-popup[data-id="translator"] .translation-status .translation-status-failures {
    display: none;
    color: #cc5040; }
  .sl-popup[data-id="translator"] .translation-status.has-failures .translation-status-failures {
    display: block; }

.sl-popup[data-id="chart-editor"] .sl-popup-body {
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background-color: #fff;
  gap: 20px; }
.sl-popup[data-id="chart-editor"] .chart-preview {
  position: relative;
  border: 1px solid #ddd;
  padding: 10px;
  max-width: 100%;
  height: 30vh;
  max-height: 500px;
  border-radius: var(--popup-inner-radius); }

.ua-ie .sl-popup .sl-popup-inner {
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
/**
 * A toolbar used to access various tools related to live
 * presenting.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-present-toolbar {
  --toolbar-surface: var(--surface-glass);
  --toolbar-surface-hover: var(--surface-hover);
  --toolbar-surface-active: var(--color-accent);
  --toolbar-text-color: var(--color-accent-fg);
  --toolbar-text-color-active: var(--color-accent-fg);
  --color-option-border-color: #fff;
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  top: 8px;
  bottom: 8px;
  left: 0;
  padding-left: 8px;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  z-index: 9;
  -webkit-transform: translateX(-60px);
          transform: translateX(-60px);
  pointer-events: none; }
  .sl-present-toolbar.visible, .sl-present-toolbar.highlight {
    -webkit-transform: none;
            transform: none; }

.sl-present-toolbar[data-layout="bottom-left"] {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end; }

.sl-present-toolbar-option {
  width: 50px;
  max-height: 50px;
  overflow: hidden;
  background: var(--toolbar-surface);
  backdrop-filter: var(--glass-filter);
  color: var(--toolbar-text-color);
  border-radius: var(--button-radius);
  -webkit-transition: max-height 0.7s cubic-bezier(0.23, 1, 0.32, 1);
  transition: max-height 0.7s cubic-bezier(0.23, 1, 0.32, 1);
  pointer-events: auto; }

.sl-present-toolbar-option-trigger {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 50px;
  height: 50px;
  padding: 0;
  border-radius: var(--button-radius);
  font-size: 1.875em;
  color: inherit;
  cursor: pointer; }
  .sl-present-toolbar-option-trigger .icon {
    font-size: 0.8em;
    margin-top: -2px;
    vertical-align: middle; }
  .sl-present-toolbar-option-trigger .pointer-icon,
  .sl-present-toolbar-option-trigger .annotation-icon {
    display: block;
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    width: 1em;
    height: 1em; }
  .sl-present-toolbar-option-trigger .pointer-icon {
    background-image: url(//staging.slides.com/assets/cursors/stream-pointer-white-887455579cde8e3ef3e8f41cb86b67024871d7a667728fe4158043623edabf74.svg); }
  .sl-present-toolbar-option-trigger .annotation-icon {
    background-image: url(//staging.slides.com/assets/cursors/pen-white-f0c3cb78afa7381df3018241b5033266e35cb29236f28a37d1c27a0d3a1ad6cf.svg);
    background-size: 50%; }
  .sl-present-toolbar-option-trigger:hover {
    background: var(--toolbar-surface-hover); }

.sl-present-toolbar > * + * {
  margin-top: 5px; }

.sl-present-toolbar-option.active {
  max-height: 320px; }

.sl-present-toolbar-option.active .sl-present-toolbar-option-trigger {
  color: var(--toolbar-text-color-active);
  background-color: var(--toolbar-surface-active); }
  .sl-present-toolbar-option.active .sl-present-toolbar-option-trigger .annotation-icon {
    background-image: url(//staging.slides.com/assets/cursors/pen-white-f0c3cb78afa7381df3018241b5033266e35cb29236f28a37d1c27a0d3a1ad6cf.svg); }

.sl-present-toolbar-option.active .sl-present-toolbar-option-trigger:not(:last-child) {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }

.sl-present-toolbar-option-expansion {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: var(--toolbar-surface); }

.sl-present-toolbar-option-expansion > * + * {
  margin-top: 0px; }

.sl-present-toolbar-colorpicker {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0;
  padding: 10px 0; }

.sl-present-toolbar-colorpicker-color {
  width: 23px;
  height: 23px;
  border-radius: 23px;
  background-color: currentColor;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  margin: 4px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  cursor: pointer; }

.sl-present-toolbar-colorpicker-color:hover {
  border-color: var(--color-option-border-color); }

.sl-present-toolbar-colorpicker-color.active {
  border-color: var(--color-option-border-color);
  border-width: 4px;
  margin: 2px;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  width: 19px;
  height: 19px; }

.sl-present-toolbar-option.active .sl-present-toolbar-colorpicker-color {
  -webkit-animation: slide-and-scale-up 0.6s cubic-bezier(0.23, 1, 0.32, 1) forwards;
          animation: slide-and-scale-up 0.6s cubic-bezier(0.23, 1, 0.32, 1) forwards;
  -webkit-transform: scale(0.5) translateY(100%);
          transform: scale(0.5) translateY(100%); }
.sl-present-toolbar-option.active .sl-present-toolbar-colorpicker-color:nth-child(1) {
  -webkit-animation-delay: 0ms;
          animation-delay: 0ms;
  -webkit-animation-duration: 600ms;
          animation-duration: 600ms; }
.sl-present-toolbar-option.active .sl-present-toolbar-colorpicker-color:nth-child(2) {
  -webkit-animation-delay: 50ms;
          animation-delay: 50ms;
  -webkit-animation-duration: 625ms;
          animation-duration: 625ms; }
.sl-present-toolbar-option.active .sl-present-toolbar-colorpicker-color:nth-child(3) {
  -webkit-animation-delay: 100ms;
          animation-delay: 100ms;
  -webkit-animation-duration: 650ms;
          animation-duration: 650ms; }
.sl-present-toolbar-option.active .sl-present-toolbar-colorpicker-color:nth-child(4) {
  -webkit-animation-delay: 150ms;
          animation-delay: 150ms;
  -webkit-animation-duration: 675ms;
          animation-duration: 675ms; }
.sl-present-toolbar-option.active .sl-present-toolbar-colorpicker-color:nth-child(5) {
  -webkit-animation-delay: 200ms;
          animation-delay: 200ms;
  -webkit-animation-duration: 700ms;
          animation-duration: 700ms; }
.sl-present-toolbar-option.active .sl-present-toolbar-colorpicker-color:nth-child(6) {
  -webkit-animation-delay: 250ms;
          animation-delay: 250ms;
  -webkit-animation-duration: 725ms;
          animation-duration: 725ms; }

.sl-present-toolbar-button.button {
  width: 100%;
  height: 50px;
  background-color: transparent;
  border-top: 1px solid var(--border-subtle);
  border-radius: 0;
  color: inherit; }
  .sl-present-toolbar-button.button:hover {
    background: var(--toolbar-surface-hover); }
  .sl-present-toolbar-button.button .sl-keyboard-shortcut {
    display: block;
    margin: 5px 0 0 0; }
/**
 * Prompt module.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-prompt.light-theme {
  --prompt-text-color: var(--color-text-strong);
  --prompt-surface: #fff; }

.sl-prompt.dark-theme {
  --prompt-text-color: var(--color-text-strong);
  --prompt-surface: var(--surface-canvas); }
  .sl-prompt.dark-theme .sl-prompt-background {
    background: rgba(30, 30, 30, var(--overlay-opacity)); }
  .sl-prompt.dark-theme .sl-prompt-inner {
    color: var(--color-text-strong);
    -webkit-box-shadow: 0 0 0 1px var(--surface-panel-alt);
            box-shadow: 0 0 0 1px var(--surface-panel-alt); }
    .sl-prompt.dark-theme .sl-prompt-inner .title {
      color: var(--color-text-strong); }

.sl-prompt {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 401;
  padding: 10px;
  pointer-events: none; }
  .sl-prompt .sl-prompt-background {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, var(--overlay-opacity));
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    -webkit-transition: opacity 0.15s ease;
    transition: opacity 0.15s ease; }
  .sl-prompt .sl-prompt-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    pointer-events: auto;
    z-index: 2;
    -webkit-transition: opacity 0.15s ease, -webkit-transform 0.15s ease;
    transition: opacity 0.15s ease, -webkit-transform 0.15s ease;
    transition: opacity 0.15s ease, transform 0.15s ease;
    transition: opacity 0.15s ease, transform 0.15s ease, -webkit-transform 0.15s ease; }
  .sl-prompt .sl-prompt-inner {
    overflow: auto;
    -webkit-overflow-scrolling: touch; }
  .sl-prompt.popup-mode .sl-prompt-inner {
    border-radius: var(--popup-radius); }
  .sl-prompt .sl-prompt-arrow {
    position: absolute;
    z-index: 1; }
  .sl-prompt.visible .sl-prompt-background {
    opacity: 1; }
  .sl-prompt.visible .sl-prompt-wrapper {
    opacity: 1;
    -webkit-transform: none;
            transform: none; }
  .sl-prompt.transform-positioning .sl-prompt-wrapper {
    -webkit-transition: none;
    transition: none; }
  .sl-prompt.transform-positioning.visible .sl-prompt-wrapper {
    -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    transition: -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1); }
  .sl-prompt.non-optional, .sl-prompt.close-on-click-outside {
    pointer-events: auto; }
  .sl-prompt .sl-prompt-inner {
    position: relative;
    background: var(--prompt-surface);
    padding: 15px;
    color: var(--prompt-text-color);
    text-align: left;
    border-radius: var(--popover-radius);
    font-size: 12px; }
    .sl-prompt .sl-prompt-inner > .title {
      max-width: 450px;
      margin-bottom: 15px;
      padding: 0;
      font-size: 15px;
      font-weight: 500;
      word-break: break-word; }
    .sl-prompt .sl-prompt-inner > .title.has-subtitle, .sl-prompt .sl-prompt-inner > .title.has-body-text {
      margin-bottom: 5px; }
    .sl-prompt .sl-prompt-inner > .subtitle {
      max-width: 450px;
      margin-bottom: 15px;
      padding: 0;
      font-size: 14px;
      font-weight: normal;
      color: var(--color-text-secondary);
      word-break: break-word; }
      .sl-prompt .sl-prompt-inner > .subtitle a {
        color: var(--color-text-secondary);
        text-decoration: underline; }
      .sl-prompt .sl-prompt-inner > .subtitle a:hover {
        color: #226ede; }
    .sl-prompt .sl-prompt-inner > .body-text {
      max-width: 450px;
      margin-bottom: 15px;
      padding: 0;
      font-size: 12px;
      font-weight: normal; }
      .sl-prompt .sl-prompt-inner > .body-text a {
        color: var(--color-text-muted);
        text-decoration: underline; }
      .sl-prompt .sl-prompt-inner > .body-text a:hover {
        color: #226ede; }
    .sl-prompt .sl-prompt-inner .sl-checkbox {
      margin-bottom: 10px;
      font-size: 12px; }
    .sl-prompt .sl-prompt-inner .unit-row .sl-checkbox {
      margin-bottom: 0; }
    .sl-prompt .sl-prompt-inner .footer {
      text-align: right;
      position: sticky;
      background: var(--prompt-surface);
      bottom: -15px;
      padding: 15px 0;
      margin-bottom: -15px;
      margin-top: 5px;
      z-index: 1; }
      .sl-prompt .sl-prompt-inner .footer .button + .button {
        margin-left: 10px; }
      .sl-prompt .sl-prompt-inner .footer .button.left-align {
        float: left;
        margin-left: 0; }
      .sl-prompt .sl-prompt-inner .footer .button.left-align + .left-align {
        margin-left: 10px; }
      .sl-prompt .sl-prompt-inner .footer .icon {
        font-size: 14px; }
  .sl-prompt[data-alignment=t] .sl-prompt-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-bottom-width: 0;
    border-top-color: var(--prompt-surface); }
  .sl-prompt[data-alignment=b] .sl-prompt-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-top-width: 0;
    border-bottom-color: var(--prompt-surface); }
  .sl-prompt[data-alignment=l] .sl-prompt-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-right-width: 0;
    border-left-color: var(--prompt-surface); }
  .sl-prompt[data-alignment=r] .sl-prompt-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-left-width: 0;
    border-right-color: var(--prompt-surface); }

.sl-prompt-close-x {
  position: absolute;
  width: 30px;
  height: 30px;
  font-size: 16px;
  top: 8px;
  right: 8px;
  z-index: 1;
  color: var(--color-text-muted);
  background: transparent; }
  .sl-prompt-close-x:hover {
    color: var(--color-text-inverse);
    background: var(--surface-inverse); }

.sl-prompt[data-type="alert"] .message {
  max-width: 450px;
  margin-bottom: 15px;
  padding: 0;
  font-size: 16px;
  font-weight: normal;
  line-height: 1.4;
  word-break: break-word; }

.sl-prompt[data-type="flashmessage"] {
  z-index: 2002;
  -webkit-transition: none;
  transition: none; }
  .sl-prompt[data-type="flashmessage"] .title {
    font-size: 18px; }
  .sl-prompt[data-type="flashmessage"] .title:first-child:last-child {
    margin-bottom: 0; }
  .sl-prompt[data-type="flashmessage"] .sl-prompt-inner {
    padding: 24px;
    -webkit-transition: none;
    transition: none; }

.sl-prompt[data-type="select"] .sl-prompt-inner {
  text-align: left; }
.sl-prompt[data-type="select"] .sl-prompt-inner > .title {
  padding: 0; }
.sl-prompt[data-type="select"] .sl-prompt-inner > .title:not(.has-subtitle) {
  font-weight: normal; }
.sl-prompt[data-type="select"] .items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: var(--space-4);
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end; }
.sl-prompt[data-type="select"] .items:not(:first-child) {
  margin-top: var(--space-6); }
.sl-prompt[data-type="select"] .item {
  position: relative;
  border-radius: var(--button-radius);
  border: 2px solid transparent;
  cursor: pointer;
  max-width: 240px; }
  .sl-prompt[data-type="select"] .item .icon {
    margin: 0.2em 0;
    font-size: 2em; }
  .sl-prompt[data-type="select"] .item h3 {
    font-size: 1.14em;
    font-weight: 500; }
  .sl-prompt[data-type="select"] .item h3:last-child {
    font-weight: normal; }
  .sl-prompt[data-type="select"] .item p {
    margin: 5px 0;
    font-size: 1em; }
  .sl-prompt[data-type="select"] .item.outline {
    color: #3c3c3c;
    border-color: #6f6f6f; }
  .sl-prompt[data-type="select"] .item.outline:hover, .sl-prompt[data-type="select"] .item.outline.selected {
    color: #222;
    border-color: #222; }
  .sl-prompt[data-type="select"] .item.negative {
    color: #fff;
    background: #d04232;
    border-color: #d04232; }
    .sl-prompt[data-type="select"] .item.negative:hover {
      background: #da685b;
      border-color: #da685b; }
  .sl-prompt[data-type="select"] .item.focus {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px; }
  .sl-prompt[data-type="select"] .item.divider {
    margin-right: 1.42em; }
    .sl-prompt[data-type="select"] .item.divider:after {
      content: '';
      display: inline-block;
      position: absolute;
      top: 0;
      right: -1.07em;
      width: 1px;
      height: 100%;
      background: #e7e9ef; }
@media screen and (max-width: 615px) {
  .sl-prompt[data-type="select"][data-length="2"] .sl-prompt-inner, .sl-prompt[data-type="select"][data-length="3"] .sl-prompt-inner, .sl-prompt[data-type="select"][data-length="4"] .sl-prompt-inner {
    font-size: 12px; }
    .sl-prompt[data-type="select"][data-length="2"] .sl-prompt-inner > .title, .sl-prompt[data-type="select"][data-length="3"] .sl-prompt-inner > .title, .sl-prompt[data-type="select"][data-length="4"] .sl-prompt-inner > .title {
      font-size: 14px; } }
@media screen and (max-width: 500px) {
  .sl-prompt[data-type="select"][data-length="2"] .sl-prompt-inner, .sl-prompt[data-type="select"][data-length="3"] .sl-prompt-inner, .sl-prompt[data-type="select"][data-length="4"] .sl-prompt-inner {
    font-size: 11px; }
    .sl-prompt[data-type="select"][data-length="2"] .sl-prompt-inner > .title, .sl-prompt[data-type="select"][data-length="3"] .sl-prompt-inner > .title, .sl-prompt[data-type="select"][data-length="4"] .sl-prompt-inner > .title {
      font-size: 13px; } }
@media screen and (max-width: 500px) {
  .sl-prompt[data-type="select"][data-length="3"] .sl-prompt-inner, .sl-prompt[data-type="select"][data-length="4"] .sl-prompt-inner {
    font-size: 9px;
    padding: 8px; }
    .sl-prompt[data-type="select"][data-length="3"] .sl-prompt-inner > .title, .sl-prompt[data-type="select"][data-length="4"] .sl-prompt-inner > .title {
      font-size: 12px;
      max-width: 250px; } }

.sl-prompt[data-type="list"] .list {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
.sl-prompt[data-type="list"] .list-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  padding: 12px 25px 12px 0;
  color: #666;
  cursor: pointer;
  max-width: 300px;
  min-width: 200px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
  .sl-prompt[data-type="list"] .list-item .checkmark {
    position: absolute;
    right: 5px;
    opacity: 0; }
  .sl-prompt[data-type="list"] .list-item:hover:before, .sl-prompt[data-type="list"] .list-item.focus:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: var(--minus-space-4);
    bottom: 0;
    left: var(--minus-space-4);
    border-radius: var(--nav-link-radius); }
  .sl-prompt[data-type="list"] .list-item:hover:before {
    background: var(--surface-hover); }
  .sl-prompt[data-type="list"] .list-item:hover, .sl-prompt[data-type="list"] .list-item.selected {
    color: var(--color-text-strong); }
  .sl-prompt[data-type="list"] .list-item.selected .checkmark {
    opacity: 1; }
  .sl-prompt[data-type="list"] .list-item.focus:before {
    outline: 1px solid var(--color-accent); }
  .sl-prompt[data-type="list"] .list-item:last-child, .sl-prompt[data-type="list"] .list-item.last-child-before-divider {
    border-bottom: 0; }
  .sl-prompt[data-type="list"] .list-item.has-description .list-item-title {
    font-weight: 500; }
.sl-prompt[data-type="list"] .list-item > * {
  z-index: 1; }
.sl-prompt[data-type="list"] .list-item.has-icon,
.sl-prompt[data-type="list"] .list-item.has-thumb {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  max-width: 360px;
  min-width: 200px; }
.sl-prompt[data-type="list"] .list-item.has-thumb {
  padding: 12px 0; }
.sl-prompt[data-type="list"] .list-item-icon,
.sl-prompt[data-type="list"] .list-item-thumb {
  -ms-flex-item-align: center;
      align-self: center;
  width: 1em;
  margin-right: 0.8em;
  text-align: center;
  font-size: 1.5em; }
.sl-prompt[data-type="list"] .list-item-icon {
  opacity: 0.8; }
.sl-prompt[data-type="list"] .list-item-thumb {
  width: 100px;
  height: 65px;
  border-radius: var(--radius-3); }
.sl-prompt[data-type="list"] .list-item-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-flex: 2;
      -ms-flex-positive: 2;
          flex-grow: 2; }
.sl-prompt[data-type="list"] .list-item-description {
  display: block;
  margin: 4px 0 0 0;
  line-height: 1.4;
  color: #666; }
.sl-prompt[data-type="list"] .list-item:hover .list-item-icon {
  opacity: 1; }
.sl-prompt[data-type="list"] .list-item:hover .list-item-description,
.sl-prompt[data-type="list"] .list-item.selected .list-item-description {
  color: #666666; }
.sl-prompt[data-type="list"] .list-item.header-item {
  border-bottom: 1px solid var(--border-default);
  font-weight: 500; }
.sl-prompt[data-type="list"] .list-item-divider {
  padding: 12px 25px 12px 0;
  border-bottom: 1px solid #eee;
  color: #6f6f6f;
  pointer-events: none; }
.sl-prompt[data-type="list"] .list-item-divider:not(:first-child) {
  margin-top: 10px; }
.sl-prompt[data-type="list"][data-list-type="select"]:not(.has-selection) .list-item {
  color: #222; }
.sl-prompt[data-type="list"][data-list-type="links"] .title {
  font-size: 1em;
  color: #999; }
.sl-prompt[data-type="list"][data-list-type="links"] .list-item {
  color: #222; }
.sl-prompt[data-type="list"][data-list-type="fonts"] .list-item {
  font-size: 1.25em;
  color: #222; }
.sl-prompt[data-type="list"] .footer {
  border-top: 1px solid var(--border-default); }

.sl-prompt[data-type="accordion"] .sl-prompt-inner {
  padding: 0; }
.sl-prompt[data-type="accordion"] .accordion-item {
  display: block;
  position: relative;
  color: #555;
  max-width: 400px;
  min-width: 200px;
  background-color: #fff;
  -webkit-transition: background-color 0.2s ease;
  transition: background-color 0.2s ease; }
  .sl-prompt[data-type="accordion"] .accordion-item .item-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    padding: 1em 15px;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none; }
    .sl-prompt[data-type="accordion"] .accordion-item .item-header > .icon:first-child {
      margin-right: 14px;
      vertical-align: middle; }
    .sl-prompt[data-type="accordion"] .accordion-item .item-header .title {
      font-weight: 500;
      font-size: 14px;
      -webkit-box-flex: 1;
          -ms-flex-positive: 1;
              flex-grow: 1; }
    .sl-prompt[data-type="accordion"] .accordion-item .item-header .expand-button,
    .sl-prompt[data-type="accordion"] .accordion-item .item-header .collapse-button {
      font-size: 14px;
      position: relative;
      float: right;
      color: transparent; }
    .sl-prompt[data-type="accordion"] .accordion-item .item-header .checkmark-square {
      display: inline-block;
      width: 16px;
      height: 16px;
      border: 1px solid #ddd;
      border-radius: var(--checkbox-radius); }
    .sl-prompt[data-type="accordion"] .accordion-item .item-header .collapse-button {
      display: none;
      border-color: transparent;
      color: #111; }
  .sl-prompt[data-type="accordion"] .accordion-item .item-header:hover {
    color: #111; }
  .sl-prompt[data-type="accordion"] .accordion-item .item-header:hover .checkmark-square {
    border-color: #111; }
  .sl-prompt[data-type="accordion"] .accordion-item .item-content {
    opacity: 0;
    max-height: 0;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0 15px;
    overflow: hidden;
    white-space: normal;
    -webkit-transition: all 0.2s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.2s cubic-bezier(0.23, 1, 0.32, 1); }
  .sl-prompt[data-type="accordion"] .accordion-item.focus {
    outline: 1px solid var(--color-accent);
    outline-offset: -1px; }
  .sl-prompt[data-type="accordion"] .accordion-item:first-child {
    padding-top: 5px; }
  .sl-prompt[data-type="accordion"] .accordion-item:last-child {
    padding-bottom: 5px;
    border-bottom: 0; }
.sl-prompt[data-type="accordion"].accordion-open .accordion-item:not(.selected) {
  background-color: #f5f5f5; }
.sl-prompt[data-type="accordion"] .accordion-item.selected .item-header {
  color: #111; }
.sl-prompt[data-type="accordion"] .accordion-item.selected .item-header .expand-button {
  display: none; }
.sl-prompt[data-type="accordion"] .accordion-item.selected .item-header .collapse-button {
  display: block; }
.sl-prompt[data-type="accordion"] .accordion-item.selected .item-content {
  -webkit-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  opacity: 1;
  max-height: 600px;
  margin-top: 5px;
  margin-bottom: 15px; }
.sl-prompt[data-type="accordion"] .accordion-item:first-child {
  border-top-left-radius: var(--popover-radius);
  border-top-right-radius: var(--popover-radius); }
.sl-prompt[data-type="accordion"] .accordion-item:last-child {
  border-bottom-left-radius: var(--popover-radius);
  border-bottom-right-radius: var(--popover-radius); }

.sl-prompt[data-type="input"] .sl-prompt-inner input,
.sl-prompt[data-type="input"] .sl-prompt-inner textarea {
  background: #fff;
  outline: 0;
  border: 1px solid #ddd;
  border-radius: var(--form-field-radius);
  resize: none;
  padding: 8px;
  font-size: 14px;
  width: 100%; }
  .sl-prompt[data-type="input"] .sl-prompt-inner input:focus,
  .sl-prompt[data-type="input"] .sl-prompt-inner textarea:focus {
    border-color: #226ede; }
.sl-prompt[data-type="input"] .sl-prompt-inner input {
  min-width: 300px;
  font-size: 14px; }
.sl-prompt[data-type="input"] .sl-prompt-inner .input-wrapper {
  position: relative; }
  .sl-prompt[data-type="input"] .sl-prompt-inner .input-wrapper .input-status {
    position: absolute;
    right: 1px;
    bottom: 1px;
    padding: 9px;
    border-radius: var(--form-field-radius);
    background: #fff;
    color: #bbb;
    pointer-events: none; }
    .sl-prompt[data-type="input"] .sl-prompt-inner .input-wrapper .input-status.negative {
      color: red; }

.sl-prompt[data-type="range"] .sl-prompt-inner input {
  font-size: 14px; }

.sl-prompt[data-type="form"] .sl-form {
  line-height: 1.4;
  font-size: 12px; }
  .sl-prompt[data-type="form"] .sl-form input,
  .sl-prompt[data-type="form"] .sl-form select,
  .sl-prompt[data-type="form"] .sl-form textarea {
    width: 100%; }
  .sl-prompt[data-type="form"] .sl-form .sl-form > .unit + .unit {
    margin-top: 30px; }
  .sl-prompt[data-type="form"] .sl-form .half-units {
    margin: 15px 0 25px 0; }
  .sl-prompt[data-type="form"] .sl-form .half-units .unit {
    display: inline-block;
    width: 50%;
    margin: 0; }
  .sl-prompt[data-type="form"] .sl-form .half-units .unit:first-child {
    padding-right: 10px; }
  .sl-prompt[data-type="form"] .sl-form .half-units .unit:last-child {
    padding-left: 10px; }
  .sl-prompt[data-type="form"] .sl-form .half-units:first-child {
    margin-top: 0; }

.sl-prompt-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 2;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: rgba(255, 255, 255, 0.94);
  color: #222;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease; }
  .sl-prompt-overlay.visible {
    visibility: visible;
    opacity: 1; }
  .sl-prompt-overlay h3 {
    font-size: 1em;
    margin: 10px 0 20px 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    line-height: 1.6; }
  .sl-prompt-overlay .icon {
    width: 32px;
    height: 32px;
    line-height: 32px;
    border-radius: 32px;
    margin: 6px auto;
    font-size: 19px;
    color: #fff; }
  .sl-prompt-overlay .spinner {
    margin: 6px auto; }
  .sl-prompt-overlay[data-status="positive"] .icon {
    background-color: #65DC71; }
  .sl-prompt-overlay[data-status="negative"] .icon {
    background-color: #ED473A; }

.sl-visibility-prompt .sl-prompt-inner {
  padding: 5px; }

.sl-visibility-prompt .items,
.sl-speaker-layout-prompt .items {
  gap: var(--space-2) !important; }

.sl-visibility-prompt .item,
.sl-speaker-layout-prompt .item {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 0.57em 1.07em;
  gap: 0;
  height: auto;
  text-align: center;
  color: var(--color-text) !important; }

.sl-visibility-prompt .item:hover,
.sl-speaker-layout-prompt .item:hover {
  color: #222 !important; }

.sl-visibility-prompt .item.selected,
.sl-speaker-layout-prompt .item.selected {
  color: var(--color-accent-fg) !important;
  background-color: var(--color-accent) !important; }

.sl-speaker-layout-prompt .sl-prompt-inner .title,
.sl-speaker-layout-prompt .sl-prompt-inner .subtitle {
  max-width: none; }

.sl-speaker-layout-prompt .item {
  min-width: 110px; }
  .sl-speaker-layout-prompt .item .speaker-layout-icon {
    opacity: 0.5; }
  .sl-speaker-layout-prompt .item:hover .speaker-layout-icon, .sl-speaker-layout-prompt .item.selected .speaker-layout-icon {
    opacity: 1; }

.sl-speaker-layout-prompt .speaker-layout-icon {
  display: block;
  margin: 10px auto;
  width: 48px;
  height: 32px;
  background-size: contain;
  background-position: 50% 50%;
  background-repeat: no-repeat; }
.sl-speaker-layout-prompt .item.selected .speaker-layout-icon {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1); }
.sl-speaker-layout-prompt .speaker-layout-icon[data-speaker-layout="default"] {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-default-abe7d0a081f3dc23f45e089aa83d705f924d22b2c6ca24bd220d149eec771403.svg); }
.sl-speaker-layout-prompt .speaker-layout-icon[data-speaker-layout="wide"] {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-wide-66189311138483710e8a9b86ce834c059d2eaa6e7646301053e161247f22cc59.svg); }
.sl-speaker-layout-prompt .speaker-layout-icon[data-speaker-layout="tall"] {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-tall-932ab8737f8f64c332c5df05f25235c26e4973e8bf1773af0db1e966a8ea18d6.svg); }
.sl-speaker-layout-prompt .speaker-layout-icon[data-speaker-layout="notes-only"] {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-notes-only-8c4bb4b5b1a13edb52fab8538f666cf66c852286a2dd9879fc7e2f6978bb6e79.svg); }
.sl-speaker-layout-prompt .speaker-layout-icon[data-speaker-layout="current-only"] {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-current-only-c56150d785b069a05941ccc07263e609215721f8b04f74aff92a3bb224c0d9c5.svg); }
.sl-speaker-layout-prompt .speaker-layout-icon[data-speaker-layout="upcoming-only"] {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-upcoming-only-0f799a32cb6babe98050cdc69111a724ae6edad9c12fa9e4675212b0678324c0.svg); }

.sl-sms-prompt .sl-form {
  width: 300px; }
.sl-sms-prompt .sl-form input,
.sl-sms-prompt .sl-form select {
  display: block;
  width: 100%; }
.sl-sms-prompt .sl-form > * + * {
  margin-top: 10px; }

.sl-slide-background-prompt {
  z-index: 399;
  -webkit-transition: opacity 0.2s ease, background-color 0.2s linear;
  transition: opacity 0.2s ease, background-color 0.2s linear; }
  .sl-slide-background-prompt:after {
    content: '';
    background: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.2)), color-stop(25%, rgba(0, 0, 0, 0.2)), color-stop(50%, rgba(0, 0, 0, 0)));
    background: linear-gradient(to left, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0) 50%);
    -webkit-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    opacity: 0;
    z-index: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0; }
  .sl-slide-background-prompt[data-alignment="r"]:after {
    background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.2)), color-stop(25%, rgba(0, 0, 0, 0.2)), color-stop(50%, rgba(0, 0, 0, 0)));
    background: linear-gradient(to right, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0) 50%); }
  .sl-slide-background-prompt .sl-prompt-inner {
    z-index: 2;
    -webkit-box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
            box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1); }

.sl-slide-background-prompt.accordion-open {
  background-color: transparent !important; }
  .sl-slide-background-prompt.accordion-open:after {
    opacity: 1; }

.sl-slide-background-prompt .sl-prompt-inner .accordion-item {
  width: 270px; }
.sl-slide-background-prompt .sl-prompt-inner .item-header .external-url {
  display: none;
  margin-right: 10px; }
.sl-slide-background-prompt .sl-prompt-inner .accordion-item:not(.selected) .item-header:hover .external-url {
  display: inline-block;
  opacity: 0.6; }
.sl-slide-background-prompt .sl-prompt-inner .accordion-item:not(.selected) .item-header:hover .external-url:hover {
  display: inline-block;
  opacity: 1; }
.sl-slide-background-prompt .sl-prompt-inner .sl-select {
  display: block;
  width: 100%; }
.sl-slide-background-prompt .sl-prompt-inner .media-opacity-wrapper,
.sl-slide-background-prompt .sl-prompt-inner .sl-select + .sl-select {
  margin-top: 10px; }
.sl-slide-background-prompt .sl-prompt-inner .sl-checkbox {
  font-size: inherit; }
.sl-slide-background-prompt .sl-prompt-inner .unit-description {
  line-height: 1.4;
  font-size: inherit; }
.sl-slide-background-prompt .sl-prompt-inner input {
  width: 100%; }
.sl-slide-background-prompt .sl-prompt-inner .media-thumbnail {
  border: 1px solid #ddd;
  padding: 5px;
  margin-bottom: 15px;
  border-radius: var(--form-field-radius); }
.sl-slide-background-prompt .sl-prompt-inner .media-thumbnail.clickable {
  cursor: pointer; }
  .sl-slide-background-prompt .sl-prompt-inner .media-thumbnail.clickable:hover {
    border-color: #777; }
.sl-slide-background-prompt .sl-prompt-inner .media-thumbnail-inner {
  width: 100%;
  height: 100px;
  border-radius: var(--form-field-radius);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-color: #f5f5f5; }
.sl-slide-background-prompt .sl-prompt-inner .upload-progress {
  text-align: center;
  padding: 20px 0; }
  .sl-slide-background-prompt .sl-prompt-inner .upload-progress .spinner {
    margin: 0 auto 20px auto; }
.sl-slide-background-prompt .sl-prompt-inner .iframe-url-warning {
  color: #ff0000;
  margin-top: 1em;
  line-height: 1.4; }

.sl-unsubscribe-prompt .sl-form {
  margin: 20px 0 30px; }
.sl-unsubscribe-prompt input[type="radio"] + label {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
  padding: 12px;
  margin-bottom: 0;
  width: 100%; }
.sl-unsubscribe-prompt .cancellation-footnote {
  border-top: 1px solid #ddd;
  padding-top: 20px;
  margin-top: 20px;
  line-height: 1.5; }
.sl-unsubscribe-prompt .cancellation-footnote strong {
  font-weight: 500; }

.sl-preview-media-prompt .sl-prompt-inner {
  padding: 8px; }
  .sl-preview-media-prompt .sl-prompt-inner .title,
  .sl-preview-media-prompt .sl-prompt-inner .subtitle {
    max-width: none; }

.sl-preview-media-prompt .preview-element {
  position: relative;
  background-color: #f5f5f5; }
  .sl-preview-media-prompt .preview-element .media-preloader {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1; }
  .sl-preview-media-prompt .preview-element img,
  .sl-preview-media-prompt .preview-element video {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 2;
    border-radius: var(--popover-radius); }
  .sl-preview-media-prompt .preview-element.loaded-media img, .sl-preview-media-prompt .preview-element.loaded-media video {
    opacity: 1;
    position: relative; }

.sl-notes-prompt .dock-icon {
  display: block;
  width: 1.3em;
  height: 1em;
  border: 2px solid currentColor;
  border-bottom-width: 4px;
  float: left;
  margin-right: 8px;
  -webkit-transition: border-bottom-width 0.15s ease;
  transition: border-bottom-width 0.15s ease; }
.sl-notes-prompt .dock-button:hover .dock-icon {
  border-bottom-width: 6px; }

.sl-slide-settings-prompt .sl-transition-list {
  margin-top: 10px;
  font-size: 8px; }
.sl-slide-settings-prompt .sl-transition-thumbnail {
  border: 1px solid transparent;
  border-radius: 2px;
  cursor: pointer;
  margin-bottom: 0 !important; }
  .sl-slide-settings-prompt .sl-transition-thumbnail:hover {
    border-color: transparent; }
  .sl-slide-settings-prompt .sl-transition-thumbnail.selected {
    border-color: #226ede;
    outline: none; }
.sl-slide-settings-prompt .sl-transition-thumbnail:focus {
  outline: 2px solid #226ede; }
.sl-slide-settings-prompt .clear-button {
  visibility: hidden;
  margin-left: auto; }
.sl-slide-settings-prompt .clear-button.visible {
  visibility: visible; }

.sl-deck-timing-prompt .sl-form {
  width: 400px;
  max-width: 100%; }
.sl-deck-timing-prompt .reset-button {
  display: none; }

.sl-auto-animate-prompt .sl-form {
  width: 470px;
  max-width: 100%;
  margin-bottom: 35px; }
.sl-auto-animate-prompt .unit-row,
.sl-auto-animate-prompt .auto-animate-status {
  margin-bottom: 15px; }
.sl-auto-animate-prompt .sl-easing-list {
  margin-top: 10px;
  font-size: 8px; }
.sl-auto-animate-prompt .sl-easing-thumbnail {
  cursor: pointer; }
  .sl-auto-animate-prompt .sl-easing-thumbnail:hover {
    border-color: transparent; }
.sl-auto-animate-prompt .sl-easing-thumbnail path {
  -webkit-transition-property: all;
  transition-property: all; }
.sl-auto-animate-prompt .sl-easing-thumbnail:focus {
  outline: 2px solid #226ede; }
.sl-auto-animate-prompt .animation-preview {
  width: 100%;
  height: 200px;
  position: relative;
  margin-bottom: 15px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden; }
.sl-auto-animate-prompt .animation-preview-inner {
  width: 100%;
  height: 100%;
  background-color: #f6f7f9;
  border-radius: var(--popover-radius); }
.sl-auto-animate-prompt .animation-preview-block {
  position: absolute;
  -webkit-transition: inherit;
  transition: inherit; }
.sl-auto-animate-prompt .animation-preview-block.unmatched {
  opacity: 0;
  -webkit-transition: none;
  transition: none; }
.sl-auto-animate-prompt .animation-preview-block.unmatched.unmatched-visible {
  opacity: 1;
  -webkit-transition: inherit;
  transition: inherit; }
.sl-auto-animate-prompt .animation-preview-label {
  position: absolute;
  top: 8px;
  right: 8px;
  color: rgba(0, 0, 0, 0.3);
  font-size: 11px;
  line-height: 1;
  text-transform: uppercase; }
.sl-auto-animate-prompt .animation-preview-label {
  position: absolute;
  top: 8px;
  left: 8px;
  color: rgba(0, 0, 0, 0.2);
  font-size: 11px;
  line-height: 1;
  text-transform: uppercase; }
.sl-auto-animate-prompt .animation-preview-pagination {
  position: absolute;
  top: 8px;
  right: 8px;
  font-size: 11px;
  line-height: 1; }
.sl-auto-animate-prompt .animation-preview-pagination li {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background-color: rgba(0, 0, 0, 0.1);
  margin-left: 4px;
  cursor: pointer; }
.sl-auto-animate-prompt .animation-preview-pagination li:hover,
.sl-auto-animate-prompt .animation-preview-pagination li.selected {
  background-color: rgba(0, 0, 0, 0.4); }

.sl-promotion-prompt .sl-prompt-inner {
  font-size: 16px;
  padding: 2em;
  -webkit-box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
          box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2); }

.sl-promotion-prompt .sl-prompt-inner .footer {
  margin-top: 2em; }

.sl-promotion-prompt-header {
  height: 200px;
  border-radius: calc(var(--popover-radius) / 2);
  margin-bottom: 2em;
  background: #E4637C;
  display: grid;
  place-items: center; }

.sl-promotion-prompt-header .icon {
  font-size: 70px;
  color: #fff; }

.sl-promotion-prompt-message {
  max-width: 450px;
  line-height: 1.4; }

.sl-promotion-prompt-message .title {
  font-size: 1.4em; }

@media screen and (max-width: 500px) {
  .sl-promotion-prompt .sl-prompt-inner {
    padding: 1em; } }
.sl-promotion-prompt.ai-usage .sl-prompt-inner {
  font-size: 14px; }
.sl-promotion-prompt.ai-usage .sl-promotion-prompt-header {
  background: linear-gradient(135deg, #226ede 0%, #7b00ff 100%);
  color: #fff; }

.sl-copywriter-prompt {
  --inner-border-radius: calc(var(--popover-radius) - var(--radius-1)); }

.sl-copywriter-prompt .sl-prompt-inner {
  font-size: 13px;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 280px;
  -webkit-transition: width 0.4s cubic-bezier(0.86, 0, 0.07, 1), height 0.4s cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: width 0.4s cubic-bezier(0.86, 0, 0.07, 1), height 0.4s cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: width 0.4s cubic-bezier(0.86, 0, 0.07, 1), height 0.4s cubic-bezier(0.86, 0, 0.07, 1), transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: width 0.4s cubic-bezier(0.86, 0, 0.07, 1), height 0.4s cubic-bezier(0.86, 0, 0.07, 1), transform 0.4s cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  overflow: hidden; }

.sl-copywriter-prompt-prompts {
  width: 280px;
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1); }

.sl-copywriter-prompt-results {
  position: relative;
  width: 400px;
  height: auto;
  max-height: 100%;
  overflow: auto;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1); }

.sl-copywriter-prompt.animate-transition .sl-prompt-wrapper,
.sl-copywriter-prompt.animate-transition .sl-prompt-arrow {
  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1); }

.sl-copywriter-prompt.animate-transition[data-state="results"] .sl-prompt-wrapper {
  -webkit-transform: translateX(-60px);
          transform: translateX(-60px); }

.sl-copywriter-prompt.animate-transition[data-state="results"] .sl-prompt-arrow {
  -webkit-transform: translateX(60px);
          transform: translateX(60px); }

.sl-copywriter-prompt[data-state="results"] .sl-prompt-inner {
  width: 400px; }

.sl-copywriter-prompt[data-state="results"] .sl-copywriter-prompt-prompts,
.sl-copywriter-prompt[data-state="results"] .sl-copywriter-prompt-results {
  -webkit-transform: translateX(-280px);
          transform: translateX(-280px); }

.sl-copywriter-prompt header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #f5f5f5;
  background-color: var(--prompt-surface);
  position: sticky;
  top: 0;
  padding: 4px; }

.sl-copywriter-prompt footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 4px;
  padding-right: 8px;
  border-top: 1px solid #f5f5f5;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.sl-copywriter-prompt .copywriter-title {
  padding: 8px 10px; }

.sl-copywriter-prompt .copywriter-button {
  padding: 8px 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 5px;
  border-radius: var(--inner-border-radius);
  color: inherit;
  cursor: pointer; }

.sl-copywriter-prompt .copywriter-button:hover {
  background-color: #f0f1f5;
  color: #000; }

.sl-copywriter-prompt-prompts footer {
  color: #777; }

.sl-copywriter-prompt .copywriter-list {
  padding: 4px; }

.sl-copywriter-prompt-option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  text-align: left;
  gap: 6px;
  padding: 12px 12px;
  color: #222;
  line-height: 1.3;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.sl-copywriter-prompt-option .right {
  display: grid;
  place-items: center;
  margin-left: auto; }

.sl-copywriter-prompt-option:first-child {
  border-top-left-radius: var(--inner-border-radius);
  border-top-right-radius: var(--inner-border-radius); }

.sl-copywriter-prompt-option:last-child {
  border-bottom-left-radius: var(--inner-border-radius);
  border-bottom-right-radius: var(--inner-border-radius); }

.sl-copywriter-prompt-option:hover {
  background-color: #f0f1f5; }

.sl-copywriter-prompt-option:active {
  background-color: #eaecf1; }

.sl-copywriter-prompt-option.focus {
  outline: 2px solid #226ede; }

.sl-copywriter-prompt-prompts.has-selection {
  pointer-events: none; }

.sl-copywriter-prompt-prompts.has-selection .sl-copywriter-prompt-option:not(.selected) {
  opacity: 0.2;
  -webkit-transition: all ease 0.2s;
  transition: all ease 0.2s; }

.sl-copywriter-prompt-option.selected .icon {
  opacity: 0;
  -webkit-transition: all ease 0.2s;
  transition: all ease 0.2s;
  -webkit-transform: translateX(-8px);
          transform: translateX(-8px); }

.sl-copywriter-prompt-option .spinner-wrapper {
  opacity: 0;
  -webkit-transform: translateX(8px);
          transform: translateX(8px); }

.sl-copywriter-prompt-option.selected .spinner-wrapper {
  opacity: 1;
  -webkit-transition: all ease 0.2s;
  transition: all ease 0.2s;
  -webkit-transform: translateX(0);
          transform: translateX(0); }

.sl-copywriter-prompt-option .sl-select {
  padding: 2px 4px;
  margin: -2px 0;
  height: var(--button-size-2);
  line-height: 1; }

.sl-copywriter-prompt-option .result-value * {
  font-size: 1em;
  margin: 0;
  color: inherit !important; }
.sl-copywriter-prompt-option .result-value > * + * {
  margin-top: 0.25em; }
.sl-copywriter-prompt-option .result-value h1, .sl-copywriter-prompt-option .result-value h2, .sl-copywriter-prompt-option .result-value h3, .sl-copywriter-prompt-option .result-value h4, .sl-copywriter-prompt-option .result-value h5, .sl-copywriter-prompt-option .result-value h6 {
  font-size: 1.125em; }
.sl-copywriter-prompt-option .result-value ul, .sl-copywriter-prompt-option .result-value ol {
  padding-left: 1em; }

.sl-image-suggestions-prompt .item {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 200px;
  height: 130px;
  vertical-align: top; }
  .sl-image-suggestions-prompt .item img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain; }

.preview-size-prompt .list-item-thumb {
  place-content: center;
  background-color: #bebfc2;
  padding: 0.5em; }

.preview-size-prompt .default-preview-size .list-item-thumb {
  padding: 0.25em; }

.preview-size-prompt .list-item-thumb-inner {
  max-height: 100%;
  margin: auto;
  border: 2px solid #226dde;
  background-color: #fff;
  border-radius: 4px; }

.sl-shortcuts-prompt .sl-prompt-inner {
  width: 1000px; }

.sl-shortcuts-prompt .sl-shortcuts-layout {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 30px; }

.sl-shortcuts-prompt .sl-shortcuts-column {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  min-width: 250px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 25px; }

.sl-shortcuts-prompt .sl-shortcuts-title {
  margin: 0 0 30px 0; }

.sl-shortcuts-prompt .sl-shortcuts-category-wrapper {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto; }

.sl-shortcuts-prompt .sl-shortcuts-category {
  margin: 0 0 10px 0;
  font-size: 14px;
  opacity: 0.7; }

.sl-shortcuts-prompt .sl-shortcuts-table td {
  padding: 2px 0; }

.sl-shortcuts-prompt .sl-shortcuts-table td:first-child {
  width: 100px;
  vertical-align: top; }

.sl-shortcuts-prompt .sl-shortcut-hint {
  display: block;
  opacity: 0.7; }

.sl-shortcuts-prompt .sl-shortcut-key {
  letter-spacing: 2px; }

.ua-ie .sl-prompt .sl-prompt-inner {
  -webkit-transform: none !important;
          transform: none !important; }
/**
 * Numeric range component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-range {
  --sl-range-border-width: 1px;
  --sl-range-border-color: var(--border-subtle);
  --sl-range-radius: var(--form-field-radius);
  --sl-range-progress-color: var(--surface-hover);
  --sl-range-progress-active-color: var(--color-accent);
  position: relative;
  width: 100%;
  border: var(--sl-range-border-width) solid var(--sl-range-border-color);
  border-radius: var(--sl-range-radius);
  cursor: col-resize;
  overflow: hidden; }
  .sl-range .sl-range-number {
    position: relative;
    width: 100%;
    background: transparent;
    outline: 0;
    outline-offset: 0;
    cursor: col-resize;
    z-index: 2;
    border: 0 !important;
    margin: 0 !important; }
    .sl-range .sl-range-number:focus {
      cursor: text; }
  .sl-range:focus-within {
    border-color: var(--form-field-border-active); }
  .sl-range .sl-range-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    z-index: 4;
    background-color: var(--sl-range-progress-color);
    -webkit-transform-origin: 0 0;
            transform-origin: 0 0;
    -webkit-transition: background-color 0.1s linear;
    transition: background-color 0.1s linear; }
  .sl-range[data-progress-bar="hidden"] {
    cursor: text; }
    .sl-range[data-progress-bar="hidden"] .sl-range-number {
      cursor: text; }
    .sl-range[data-progress-bar="hidden"] .sl-range-progress {
      display: none; }
  .sl-range[data-unit]:after {
    content: attr(data-unit);
    margin-left: 1px; }
  .sl-range.is-changing .sl-range-progress, .sl-range:focus-within .sl-range-progress, .sl-range[data-progress-bar="always-visible"] .sl-range-progress {
    background-color: var(--sl-range-progress-active-color); }
  .sl-range[data-style="tray"] {
    border: 0; }
    .sl-range[data-style="tray"] .sl-range-number {
      color: currentColor;
      padding: 6px; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
.resizer-anchor {
  position: absolute;
  width: 16px;
  height: 16px;
  background: #fff;
  z-index: 50;
  border-radius: 50%;
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.8), 0 0 2px rgba(0, 0, 0, 0.8);
          box-shadow: 0 1px 0 rgba(0, 0, 0, 0.8), 0 0 2px rgba(0, 0, 0, 0.8);
  cursor: pointer;
  opacity: 0;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  -webkit-transition: opacity 0.22s ease, margin 0.22s ease;
  transition: opacity 0.22s ease, margin 0.22s ease; }
  .resizer-anchor[data-direction=n] {
    margin-top: 8px;
    cursor: row-resize; }
  .resizer-anchor[data-direction=w] {
    margin-left: 8px;
    cursor: col-resize; }
  .resizer-anchor[data-direction=s] {
    margin-top: -8px;
    cursor: row-resize; }
  .resizer-anchor[data-direction=e] {
    margin-left: -8px;
    cursor: col-resize; }
  .resizer-anchor.visible {
    opacity: 0.7;
    margin: 0; }
  .resizer-anchor:hover {
    opacity: 1; }
  .resizer-anchor:active {
    -webkit-transform: translateY(1px);
            transform: translateY(1px); }

.resizer-overlay {
  display: none;
  position: absolute;
  z-index: 49; }
/**
 * Interface component for selecting a resolution.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-resolution .sl-select {
  width: 100%; }
.sl-resolution .units,
.sl-resolution .custom-size {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 0; }
  .sl-resolution .units .unit,
  .sl-resolution .custom-size .unit {
    margin: 0;
    width: 100%; }
  .sl-resolution .units .unit + .unit,
  .sl-resolution .custom-size .unit + .unit {
    margin-left: 15px; }
.sl-resolution .custom-size {
  display: none;
  padding: 15px;
  border: 1px solid #ddd;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .sl-resolution .custom-size .unit {
    margin-bottom: 0; }
.sl-resolution.expanded .sl-select {
  margin-bottom: 0 !important;
  border-color: #ddd;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }
.sl-resolution.expanded .unit.size:after {
  content: '';
  display: block;
  width: 100%;
  height: 14px;
  margin-top: -2px;
  top: 100%;
  left: 0;
  position: absolute;
  background: #fff;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
.sl-resolution.expanded .custom-size {
  positive: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: -4px; }
/**
 * Scroll shadow component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-scroll-shadow-top,
.sl-scroll-shadow-bottom {
  position: absolute;
  left: 0;
  height: 15px;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  z-index: 100;
  -webkit-transition: opacity 0.1s linear;
  transition: opacity 0.1s linear; }

.sl-scroll-shadow-top {
  top: 0;
  -webkit-transform-origin: 50% 0;
          transform-origin: 50% 0;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)); }

.sl-scroll-shadow-bottom {
  bottom: 0;
  -webkit-transform-origin: 50% 100%;
          transform-origin: 50% 100%;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(to top, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)); }

.sl-scroll-shadow-top.dark-background {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.35)), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0)); }

.sl-scroll-shadow-bottom.dark-background {
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.35)), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(to top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0)); }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-segmented-control {
  --segmented-control-surface: var(--surface-tint-1);
  --segmented-control-item-surface-hover: var(--surface-tint-2);
  --segmented-control-item-surface-active: #fff;
  --segmented-control-item-color: var(--color-text-secondary);
  --segmented-control-item-color-hover: var(--color-text-strong);
  --segmented-control-item-color-active: #111113;
  --segmented-control-item-radius: var(--radius-full);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  background-color: var(--segmented-control-surface);
  gap: var(--space-2);
  padding: var(--space-3);
  border-radius: var(--radius-full);
  font-weight: 500;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  .sl-segmented-control.full-width {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }

.sl-segmented-control.full-width .sl-segmented-control-item {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  width: 100%; }

.sl-segmented-control-item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: var(--button-size-6);
  padding: 0 var(--space-6);
  margin: 0;
  gap: var(--space-3);
  border-radius: var(--segmented-control-item-radius);
  color: var(--segmented-control-item-color);
  border: 0;
  line-height: 1.4;
  cursor: pointer;
  white-space: nowrap;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.sl-segmented-control.m {
  padding: var(--space-2); }

.sl-segmented-control-item .icon {
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.sl-segmented-control-item:hover {
  color: var(--segmented-control-item-color-hover);
  background-color: var(--segmented-control-item-surface-hover); }

.sl-segmented-control input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none; }

.sl-segmented-control input[type="radio"]:focus-visible + .sl-segmented-control-item {
  outline: 1px solid var(--color-accent);
  outline-offset: 2px; }

.sl-segmented-control-item.active,
.sl-segmented-control input[type="radio"]:checked + .sl-segmented-control-item {
  background-color: var(--segmented-control-item-surface-active);
  color: var(--segmented-control-item-color-active);
  cursor: default; }

.sl-segmented-control-item .check-mark {
  display: none;
  font-size: 1.1em;
  margin-top: -0.1em; }

.sl-segmented-control input[type="radio"]:checked + .sl-segmented-control-item .check-mark {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex; }

.sl-segmented-control input[type="radio"]:checked + .sl-segmented-control-item .dimmed,
.sl-segmented-control input[type="radio"]:checked + .sl-segmented-control-item .radio-description {
  color: var(--color-text-muted); }

.sl-segmented-control input[type="radio"]:disabled + .sl-segmented-control-item {
  pointer-events: none;
  opacity: 0.5;
  cursor: default; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-slide-thumbnail {
  position: relative;
  border-radius: 2px;
  overflow: hidden; }
  .sl-slide-thumbnail .sl-slide-thumbnail-background {
    display: block !important;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover; }
  .sl-slide-thumbnail .sl-slide-thumbnail-content {
    position: relative;
    top: 0;
    left: 0;
    z-index: 2;
    -webkit-transform-origin: 0% 0%;
            transform-origin: 0% 0%; }
    .sl-slide-thumbnail .sl-slide-thumbnail-content section {
      border: 0 !important;
      outline: 0 !important;
      display: block !important; }
    .sl-slide-thumbnail .sl-slide-thumbnail-content section:before {
      border: 0 !important; }
/**
 * A cursor that is synced via a live stream.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-stream-pointer {
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
  z-index: 200;
  pointer-events: none;
  -webkit-transform-origin: top left;
          transform-origin: top left;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: visibility 0.2s ease, opacity 0.2s ease;
  transition: visibility 0.2s ease, opacity 0.2s ease; }

.sl-stream-pointer.has-position.visible {
  visibility: visible;
  opacity: 1; }

.sl-stream-pointer svg {
  position: relative;
  left: -28%;
  top: -9%; }

.sl-stream-pointer svg path {
  fill: #000;
  stroke: #fff;
  stroke-width: 1px; }

.sl-stream-pointer.purple svg path {
  fill: #7b00ff;
  stroke: rgba(255, 255, 255, 0.75);
  stroke-width: 1; }

.sl-stream-pointer:before,
.sl-stream-pointer:after {
  content: '';
  position: absolute;
  width: 1em;
  height: 1em;
  left: -0.5em;
  top: -0.5em;
  border-radius: 1em;
  background-color: rgba(34, 110, 222, 0.5);
  z-index: -1;
  opacity: 0; }

.sl-stream-pointer:before {
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1); }

.sl-stream-pointer.is-down:before {
  opacity: 1;
  -webkit-transform: scale(0.3);
          transform: scale(0.3); }

.sl-stream-pointer:after {
  -webkit-transform: scale(2);
          transform: scale(2);
  -webkit-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1); }

.sl-stream-pointer.is-down:after {
  opacity: 1;
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transition: none;
  transition: none; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-table-editor {
  --add-size: 36px;
  --table-col-min-width: 40px;
  --table-header-bg-color: #f4f4f4;
  position: relative;
  outline: none; }
  .sl-table-editor .add-col,
  .sl-table-editor .add-row {
    position: relative;
    z-index: 1;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    gap: 6px;
    font-size: 1.25em; }
  .sl-table-editor .add-col:hover,
  .sl-table-editor .add-row:hover {
    border: 1px solid #226ede; }
  .sl-table-editor .add-col {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: var(--add-size);
    left: -1px; }
  .sl-table-editor .add-row {
    width: calc(100% - var(--add-size));
    height: var(--add-size);
    -ms-flex-negative: 0;
        flex-shrink: 0;
    top: -1px; }
  .sl-table-editor.is-dragging {
    cursor: -webkit-grabbing !important;
    cursor: grabbing !important; }
    .sl-table-editor.is-dragging * {
      cursor: -webkit-grabbing !important;
      cursor: grabbing !important; }

.sl-table-editor-wrapper {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  overflow: auto; }

.sl-table-editor-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  overflow: auto; }

.sl-table-editor-table {
  border-collapse: collapse;
  background: #fff;
  -ms-flex-negative: 1;
      flex-shrink: 1;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  width: 100%;
  min-width: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  table-layout: fixed; }
  .sl-table-editor-table thead {
    position: sticky;
    top: 0;
    z-index: 1; }
  .sl-table-editor-table .col-header-row th {
    background-color: var(--table-header-bg-color); }
  .sl-table-editor-table .col-label-row td:not(.row-header) {
    background-color: #f9f9f9;
    font-weight: 500;
    color: #333; }
  .sl-table-editor-table .col-label-row td[data-col-type="label"] {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    color: #999; }
  .sl-table-editor-table .col-label-row td.row-header {
    background-color: var(--table-header-bg-color);
    font-weight: 500;
    color: #999;
    pointer-events: none; }
  .sl-table-editor-table th, .sl-table-editor-table td {
    border: 1px solid #ddd;
    padding: 10px 12px;
    text-align: left; }
  .sl-table-editor-table td[data-col-index],
  .sl-table-editor-table td.col-label-row-cell {
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
    .sl-table-editor-table td[data-col-index]:hover:not(.is-editing):not(.is-focused):not(.is-selected),
    .sl-table-editor-table td.col-label-row-cell:hover:not(.is-editing):not(.is-focused):not(.is-selected) {
      outline: 1px solid #bbb;
      outline-offset: -1px; }
    .sl-table-editor-table td[data-col-index].is-selected,
    .sl-table-editor-table td.col-label-row-cell.is-selected {
      background-color: rgba(34, 110, 222, 0.1); }
    .sl-table-editor-table td[data-col-index].is-focused,
    .sl-table-editor-table td.col-label-row-cell.is-focused {
      outline: 1px solid #226ede;
      outline-offset: -1px;
      z-index: 1; }
    .sl-table-editor-table td[data-col-index].is-editing,
    .sl-table-editor-table td.col-label-row-cell.is-editing {
      outline: 2px solid #226ede;
      outline-offset: -2px;
      background-color: #fff;
      color: transparent;
      z-index: 2; }
  .sl-table-editor-table td[data-col-type="label"] {
    font-weight: 500; }
  .sl-table-editor-table td[data-col-type="string"] {
    text-align: left; }
  .sl-table-editor-table th {
    font-weight: 500;
    color: #333; }
  .sl-table-editor-table th.col-header {
    background-color: var(--table-header-bg-color);
    font-weight: 500;
    color: #999;
    text-align: center;
    cursor: -webkit-grab;
    cursor: grab;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    position: relative; }
    .sl-table-editor-table th.col-header:active {
      cursor: -webkit-grabbing;
      cursor: grabbing; }
    .sl-table-editor-table th.col-header.is-dragging {
      opacity: 0.5; }
    .sl-table-editor-table th.col-header.no-drag {
      cursor: default; }
      .sl-table-editor-table th.col-header.no-drag:active {
        cursor: default; }
  .sl-table-editor-table .col-header-letter {
    display: inline-block; }
  .sl-table-editor-table .col-header-menu {
    display: none;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: absolute;
    right: 4px;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    cursor: pointer;
    width: 24px;
    height: 24px;
    border-radius: var(--radius-2);
    color: #333; }
    .sl-table-editor-table .col-header-menu:hover {
      background-color: rgba(0, 0, 0, 0.08); }
  .sl-table-editor-table th.col-header:hover .col-header-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .sl-table-editor-table th.corner-cell {
    cursor: default; }
  .sl-table-editor-table th.row-header,
  .sl-table-editor-table td.row-header {
    background-color: var(--table-header-bg-color);
    font-weight: 500;
    color: #999;
    text-align: center;
    width: var(--table-col-min-width);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
    .sl-table-editor-table th.row-header:active,
    .sl-table-editor-table td.row-header:active {
      cursor: -webkit-grabbing;
      cursor: grabbing; }
  .sl-table-editor-table td.row-header {
    cursor: -webkit-grab;
    cursor: grab; }
  .sl-table-editor-table tr.is-dragging {
    opacity: 0.5; }

.sl-table-drag-indicator {
  position: absolute;
  background-color: #226ede;
  pointer-events: none;
  z-index: 1000;
  display: none; }

.sl-table-cell-editor {
  position: absolute;
  display: none;
  z-index: 100;
  border: none;
  padding: 10px 12px;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  background-color: transparent;
  color: inherit;
  text-align: inherit;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  outline: none; }
  .sl-table-cell-editor:focus {
    outline: none; }
/**
 * Table styles.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-table {
  --sl-table-divider: var(--border-subtle);
  --sl-table-heading: var(--color-text-muted);
  --sl-table-stripe-surface: var(--surface-hover-subtle);
  --sl-table-card-surface: var(--surface-panel-alt);
  --sl-table-card-surface-hover: var(--surface-hover-subtle);
  --sl-table-card-code-surface: var(--surface-hover);
  --sl-table-card-code-text: var(--color-text-secondary);
  width: 100%;
  color: var(--color-text); }
  .sl-table th {
    font-weight: 500;
    text-align: left;
    padding: 0.8em 1em 0.8em 0.5em;
    color: var(--sl-table-heading); }
  .sl-table td {
    padding: 0.8em 1em 0.8em 0.5em;
    color: inherit; }
    .sl-table td button + button {
      margin-left: 10px; }
  .sl-table th:first-child,
  .sl-table td:first-child {
    padding-left: 0; }
  .sl-table th:last-child,
  .sl-table td:last-child {
    padding-right: 0; }
  .sl-table tr {
    line-height: 1.6em; }
  .sl-table tr + tr,
  .sl-table thead + tbody tr {
    border-top: 1px solid var(--sl-table-divider); }
  .sl-table tr.disabled {
    opacity: 0.6; }

.sl-table.stripes tr {
  border-top: 0; }
.sl-table.stripes tr:nth-child(odd) {
  background-color: var(--sl-table-stripe-surface); }
.sl-table.stripes th:first-child,
.sl-table.stripes td:first-child,
.sl-table.stripes th:last-child,
.sl-table.stripes td:last-child {
  padding: 0.8em 1em 0.8em 0.8em; }

.sl-table.cards {
  --sl-table-cards-padding-x: var(--space-5);
  --sl-table-cards-padding-y: var(--space-5);
  border-collapse: separate;
  border-spacing: 0 6px; }
  .sl-table.cards th {
    padding: 0 var(--sl-table-cards-padding-x) 6px;
    font-weight: 500;
    color: var(--sl-table-heading); }
  .sl-table.cards td {
    padding: var(--sl-table-cards-padding-y) var(--sl-table-cards-padding-x);
    vertical-align: middle;
    background: var(--sl-table-card-surface); }
  .sl-table.cards tr {
    line-height: 1.4; }
  .sl-table.cards tbody td:first-child {
    border-radius: var(--radius-4) 0 0 var(--radius-4); }
  .sl-table.cards tbody td:last-child {
    width: 1%;
    border-radius: 0 var(--radius-4) var(--radius-4) 0;
    white-space: nowrap; }
  .sl-table.cards .table-title {
    font-weight: 500;
    color: var(--color-text); }
  .sl-table.cards .table-muted {
    color: var(--color-text-muted); }
  .sl-table.cards .table-subtitle {
    margin-top: 4px; }
  .sl-table.cards .table-action {
    text-align: right; }
  .sl-table.cards .table-action form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    margin: 0; }
/**
 * Component used to manage a list of tags.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--space-1); }

.sl-tags-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--space-1);
  position: relative;
  z-index: 10; }

.sl-tags-tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  padding: var(--space-3);
  width: 100%;
  cursor: pointer;
  line-height: 1.4;
  color: var(--color-nav-link, var(--color-text));
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-align: left;
  vertical-align: top;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.sl-tags-tag:focus {
  z-index: 12; }

.sl-tags-tag.intro {
  -webkit-animation: tag-intro 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards;
          animation: tag-intro 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards; }

.sl-tags-tag.count-changed {
  -webkit-animation: tag-pulse 0.7s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.25s;
          animation: tag-pulse 0.7s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.25s; }

.sl-tags-tag .label {
  height: var(--button-size-3);
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  line-height: var(--button-size-3);
  padding: 0 var(--space-3); }

.sl-tags-tag .name-input {
  width: 100%;
  height: var(--button-size-3);
  border: 1px solid var(--color-accent);
  border-radius: var(--radius-2);
  outline: none;
  background: var(--surface-section);
  padding: 0 var(--space-3);
  color: currentColor;
  margin-left: calc( var(--space-1) * -0.5 ); }

.sl-tags-tag .tag-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin-left: auto;
  padding-left: var(--space-1);
  gap: var(--space-1); }

.sl-tags-tag .tag-options button {
  display: none;
  font-size: var(--font-size-edit-ui); }

.sl-tags-tag:not(.editing):hover .tag-options .edit-button,
.sl-tags-tag:not(.editing):hover .tag-options .delete-button,
.sl-tags-tag:not(.editing):hover .tag-options .star-button,
.sl-tags-tag:not(.editing).focus .tag-options .edit-button,
.sl-tags-tag:not(.editing).focus .tag-options .delete-button,
.sl-tags-tag:not(.editing).focus .tag-options .star-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.sl-tags-tag.default-tag .unstar-button {
  display: block; }

.sl-tags-tag.default-tag .star-button {
  display: none !important; }

.sl-tags-new {
  color: var(--color-nav-heading, var(--color-text-muted)); }

.sl-tags-new .icon {
  color: var(--color-nav-link, var(--color-text)); }

.sl-tags.empty .sl-tags-all {
  display: none; }

.sl-tags-match-count {
  position: relative;
  display: inline-block;
  min-width: calc( var(--button-size-1) - var(--space-1) );
  height: calc( var(--button-size-1) - var(--space-1) );
  border-radius: var(--radius-full);
  line-height: calc( var(--button-size-1) - var(--space-1) );
  margin-left: var(--space-2);
  padding: 0 var(--space-3);
  font-size: calc( var(--font-size-edit-ui) - 1px );
  font-weight: normal;
  text-align: center;
  vertical-align: top;
  color: var(--color-text-secondary);
  background: var(--surface-hover);
  -ms-flex-negative: 0;
      flex-shrink: 0; }
  .sl-tags-match-count:empty {
    display: none; }

.sl-tags-tag.editing .sl-tags-match-count {
  display: none; }

.sl-tags-tag.editing .save-button,
.sl-tags-tag.editing .delete-button,
.sl-tags-tag.editing .star-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
/**
 * Templates component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-templates {
  --templates-padding: var(--space-4);
  --templates-button-size: var(--button-size-7);
  --templates-thumb-radius: var(--radius-3);
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 105; }
  .sl-templates .sl-templates-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    position: absolute;
    background: var(--surface-glass);
    backdrop-filter: var(--surface-glass-filter);
    color: #222;
    text-align: left;
    border-radius: var(--popup-radius);
    font-size: 14px;
    -webkit-box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.2);
            box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.2);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
  .sl-templates .sl-templates-arrow {
    position: absolute; }
  .sl-templates[data-alignment=t] .sl-templates-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-top-width: 0;
    border-bottom-color: #fff; }
  .sl-templates[data-alignment=b] .sl-templates-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -8px;
    border-bottom-width: 0;
    border-top-color: #fff; }
  .sl-templates[data-alignment=l] .sl-templates-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-left-width: 0;
    border-right-color: #fff; }
  .sl-templates[data-alignment=r] .sl-templates-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -8px;
    border-right-width: 0;
    border-left-color: #fff; }
  .sl-templates .sl-templates-sidebar {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 220px;
    height: 100%;
    font-size: 14px;
    border-bottom-left-radius: var(--popup-radius);
    border-top-left-radius: var(--popup-radius);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .sl-templates .sl-templates-sidebar-pages {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    overflow: auto;
    padding: var(--space-4);
    gap: var(--space-1); }
  .sl-templates .sl-templates-sidebar-header {
    color: var(--color-text-muted);
    padding: 20px 20px 10px var(--templates-padding);
    font-weight: 500;
    font-size: 0.9em;
    border-top: 1px solid var(--border-strong); }
  .sl-templates .sl-templates-sidebar-button {
    --button-size: var(--templates-button-size);
    --button-color: var(--color-text-secondary);
    --button-color-hover: var(--color-text-secondary);
    --button-color-active: var(--color-text-secondary);
    --button-background: transparent;
    --button-background-hover: var(--surface-hover);
    --button-background-active: var(--surface-hover-stronger);
    width: 100%;
    font-weight: 500; }
    .sl-templates .sl-templates-sidebar-button.selected {
      color: var(--color-text);
      background-color: var(--surface-hover-strongest);
      cursor: default; }
  .sl-templates .sl-templates-add-new {
    --button-size: var(--templates-button-size);
    margin: auto var(--templates-padding) var(--templates-padding) var(--templates-padding);
    -webkit-transition: none !important;
    transition: none !important;
    font-weight: 500; }
    .sl-templates .sl-templates-add-new .ladda-label {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-flex: 1;
          -ms-flex: 1;
              flex: 1;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between; }
    .sl-templates .sl-templates-add-new[disabled] {
      --button-color: var(--color-text-muted);
      --button-background: var(--surface-hover-strongest); }
  .sl-templates .sl-templates-content {
    position: relative;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #fff;
    border-top-right-radius: var(--popup-radius);
    border-bottom-right-radius: var(--popup-radius); }
    .sl-templates .sl-templates-content .page {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      display: none;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column; }
      .sl-templates .sl-templates-content .page.present {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex; }
    .sl-templates .sl-templates-content .page-content {
      overflow: auto;
      height: 100%;
      padding: var(--templates-padding);
      -webkit-overflow-scrolling: touch; }
    .sl-templates .sl-templates-content .placeholder {
      width: 100%;
      line-height: 1.4;
      margin-top: 20%;
      padding: 0 20px;
      font-size: 16px;
      color: #777;
      text-align: center;
      grid-column: 1/-1; }
    .sl-templates .sl-templates-content .action-list:not(:empty) {
      border-bottom: 1px solid var(--border-subtle);
      margin-bottom: var(--templates-padding);
      padding-bottom: var(--templates-padding); }

.sl-templates-header {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  top: 0;
  width: 100%;
  height: var(--templates-button-size);
  line-height: var(--templates-button-size);
  border-top-left-radius: var(--popup-radius);
  border-top-right-radius: var(--popup-radius); }

.sl-templates-header h3 {
  font-size: 1.2em;
  font-weight: 500; }

.sl-templates-inner.has-header {
  padding-top: var(--templates-button-size); }

.sl-templates .action-list,
.sl-templates .template-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--templates-padding); }

.sl-templates .template-item {
  display: inline-block;
  position: relative;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .sl-templates .template-item.hidden {
    display: none; }
  .sl-templates .template-item.intro-animation {
    -webkit-animation: scale-in 0.8s cubic-bezier(0.23, 1, 0.32, 1) forwards;
            animation: scale-in 0.8s cubic-bezier(0.23, 1, 0.32, 1) forwards; }
  .sl-templates .template-item.semi-hidden .template-item-thumb {
    opacity: 0.6; }
  .sl-templates .template-item:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10; }
  .sl-templates .template-item .template-item-thumb {
    width: 100%;
    overflow: hidden;
    border: 1px solid #eee;
    border-radius: var(--templates-thumb-radius) var(--templates-thumb-radius) 0 0; }
  .sl-templates .template-item .template-item-thumb:last-child {
    border-radius: var(--templates-thumb-radius); }
  .sl-templates .template-item .template-item-label {
    display: block;
    position: relative;
    top: -1px;
    padding: 6px;
    font-size: 13px;
    line-height: 18px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: #f5f5f5;
    border: 1px solid #eee;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-top: 0;
    border-radius: 0 0 var(--templates-thumb-radius) var(--templates-thumb-radius); }
  .sl-templates .template-item .template-item-options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    position: absolute;
    right: 6px;
    bottom: 6px;
    z-index: 101;
    visibility: hidden; }
  .sl-templates .template-item.hover .template-item-options, .sl-templates .template-item:hover .template-item-options {
    visibility: visible; }
  .sl-templates .template-item.hover .template-item-thumb,
  .sl-templates .template-item.hover .template-item-label, .sl-templates .template-item:hover .template-item-thumb,
  .sl-templates .template-item:hover .template-item-label {
    border-color: #666; }

.sl-templates .page-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  height: var(--templates-button-size);
  line-height: var(--templates-button-size);
  font-size: 12px;
  padding: 0 var(--templates-padding); }
  .sl-templates .page-header button {
    margin-left: auto; }

.sl-templates .page-header + .page-content {
  padding-top: 0; }

.sl-templates .decks-page .page-content {
  padding-top: 0;
  padding-bottom: 0; }
.sl-templates .decks-page .deck-filters {
  position: relative;
  margin: 0;
  padding: 0 var(--templates-padding);
  height: var(--templates-button-size);
  line-height: var(--templates-button-size);
  z-index: 10;
  font-size: 12px;
  background: #fff;
  border-top-right-radius: var(--popup-radius);
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #888; }
.sl-templates .decks-page .deck-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  padding: var(--templates-padding) 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  border-bottom: 1px solid #eee;
  overflow: hidden; }
.sl-templates .decks-page .deck-item:first-child {
  padding-top: 0; }
.sl-templates .decks-page .deck-thumb {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 132px;
  height: 132px;
  border: 1px solid #eee;
  border-radius: var(--radius-3);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-color: #f5f5f5;
  -webkit-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transition-property: width, height, margin;
  transition-property: width, height, margin; }
.sl-templates .decks-page .deck-info {
  min-width: 300px;
  padding-left: 20px;
  text-align: left;
  -webkit-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1); }
.sl-templates .decks-page .deck-title {
  font-size: 16px;
  font-weight: normal; }
.sl-templates .decks-page .deck-meta {
  display: inline-block;
  border-top: 1px solid #eee;
  margin-top: 8px;
  font-size: 13px; }
.sl-templates .decks-page .deck-meta > * + *:before {
  content: '\2022';
  margin: 0 6px; }
.sl-templates .decks-page .deck-meta-item {
  display: inline-block;
  padding: 8px 0;
  color: #777; }
.sl-templates .decks-page .deck-author:hover {
  color: #226ede; }
.sl-templates .decks-page .deck-preview .buttons {
  position: absolute;
  right: 0;
  top: 100%;
  margin-top: 15px;
  z-index: 2;
  border-radius: var(--radius-3); }
.sl-templates .decks-page .deck-preview .button {
  opacity: 0;
  visibility: hidden;
  margin-left: 8px;
  vertical-align: top;
  -webkit-transition: visibility 0.4s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.4s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: visibility 0.4s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.4s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.4s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.4s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.4s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px); }
.sl-templates .decks-page .deck-preview .close-preview-button {
  padding: 8px; }
.sl-templates .decks-page .deck-item:not(.selected):hover .deck-thumb {
  border-color: #d5d5d5; }
.sl-templates .decks-page .deck-item.selected .close-preview-button,
.sl-templates .decks-page .deck-item.selected.loaded .insert-slide-button {
  opacity: 1;
  visibility: visible;
  -webkit-transform: none;
          transform: none; }
.sl-templates .decks-page .deck-item.selected {
  pointer-events: none; }
.sl-templates .decks-page .deck-item.selected .deck-thumb {
  width: 100%;
  height: 300px;
  margin-bottom: 50px;
  pointer-events: auto; }
.sl-templates .decks-page .deck-item.selected .deck-info {
  opacity: 0;
  visibility: hidden; }
.sl-templates .decks-page .deck-preview {
  position: relative;
  width: 100%;
  height: 100%; }
  .sl-templates .decks-page .deck-preview iframe {
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: var(--radius-3); }
.sl-templates .decks-page .deck-preloader {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(255, 255, 255, 0.95);
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
  opacity: 0;
  z-index: 1;
  -webkit-animation: fade-in 0.2s;
          animation: fade-in 0.2s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards; }

.sl-templates .generate-page .page-content {
  padding: 0;
  overflow: hidden; }

.touch-editor .sl-templates .template-item-options {
  visibility: visible !important;
  opacity: 1 !important; }
/**
 * Styles for a grid of text, as seen underneath the
 * pricing page.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-text-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  -webkit-column-gap: clamp(48px, 6vw, 96px);
     -moz-column-gap: clamp(48px, 6vw, 96px);
          column-gap: clamp(48px, 6vw, 96px);
  row-gap: clamp(42px, 4vw, 72px);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  max-width: var(--page-max-width);
  margin: 8em auto 5em auto;
  padding: 0 var(--page-padding);
  text-align: left;
  line-height: 1.6;
  color: var(--color-text-muted);
  overflow: visible; }
  .sl-text-grid .cell {
    width: auto;
    min-width: 0;
    margin: 0;
    text-align: left;
    vertical-align: top; }
    .sl-text-grid .cell h3 {
      font-size: 14px;
      font-weight: 600;
      color: var(--color-text-secondary); }
  @media screen and (max-width: 820px) {
    .sl-text-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      -webkit-column-gap: clamp(28px, 5vw, 52px);
         -moz-column-gap: clamp(28px, 5vw, 52px);
              column-gap: clamp(28px, 5vw, 52px); } }
  @media screen and (max-width: 560px) {
    .sl-text-grid {
      grid-template-columns: minmax(0, 1fr);
      row-gap: 28px; } }
/**
 * Styles for the Theme Options component.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-themeoptions,
.sl-easing-list,
.sl-transition-list {
  --theme-options-thumb-surface: var(--surface-panel-alt, #fff);
  --theme-options-thumb-surface-alt: var(--surface-raised-stronger, #eee);
  --theme-options-thumb-text: var(--color-text, #000);
  --theme-options-thumb-text-muted: var(--color-text-muted, #aaa);
  --theme-options-thumb-border: transparent;
  --theme-options-thumb-border-strong: var(--border-stronger, #666);
  --theme-options-thumb-border-active: var(--color-accent, #666);
  --theme-options-thumb-shadow-hover: 0 1px 2px rgba(0, 0, 0, 0.10),
  	0 5px 14px rgba(0, 0, 0, 0.15);
  --theme-options-thumb-easing-stroke: var(--border-strong, #bbb);
  --theme-options-thumb-easing-stroke-hover: var(--color-text-secondary, #666); }

.sl-themeoptions .section {
  width: 100%; }
  .sl-themeoptions .section h3 {
    font-size: 16px !important;
    margin-bottom: 15px;
    font-weight: 500; }
  .sl-themeoptions .section .sl-info {
    --size: 22px;
    float: right; }
.sl-themeoptions .section + .section {
  margin-top: 24px;
  margin-bottom: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--border-default); }
.sl-themeoptions .section.options .sl-checkbox {
  display: inline-block;
  width: 49%;
  margin: 0; }
.sl-themeoptions .section.options .sl-checkbox + .sl-checkbox {
  margin-left: 2%; }
.sl-themeoptions .section .sl-resolution {
  margin: 15px 0 25px 0; }

.sl-themeoptions ul,
.sl-transition-list,
.sl-easing-list {
  list-style: none;
  line-height: 1.3em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

.sl-themeoptions li,
.sl-transition-list .sl-transition-thumbnail,
.sl-easing-list .sl-easing-thumbnail {
  display: inline-block;
  min-width: 106px;
  height: 106px;
  margin: 0 0 12px 0;
  padding: 0;
  outline: 3px solid var(--theme-options-thumb-border);
  border-radius: var(--button-radius);
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  cursor: pointer;
  vertical-align: top;
  -webkit-transition: border 0.15s ease, -webkit-transform 0.15s ease, -webkit-box-shadow 0.15s ease;
  transition: border 0.15s ease, -webkit-transform 0.15s ease, -webkit-box-shadow 0.15s ease;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border 0.15s ease;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border 0.15s ease, -webkit-transform 0.15s ease, -webkit-box-shadow 0.15s ease;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .sl-themeoptions li .thumb-icon,
  .sl-transition-list .sl-transition-thumbnail .thumb-icon,
  .sl-easing-list .sl-easing-thumbnail .thumb-icon {
    display: inline-block;
    position: relative;
    width: 100%;
    padding-top: 72px;
    font-size: 24px;
    text-align: center;
    color: var(--theme-options-thumb-text-muted); }
  .sl-themeoptions li:hover,
  .sl-transition-list .sl-transition-thumbnail:hover,
  .sl-easing-list .sl-easing-thumbnail:hover {
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
    -webkit-box-shadow: var(--theme-options-thumb-shadow-hover);
            box-shadow: var(--theme-options-thumb-shadow-hover);
    outline-color: var(--theme-options-thumb-border-strong); }
  .sl-themeoptions li:focus,
  .sl-transition-list .sl-transition-thumbnail:focus,
  .sl-easing-list .sl-easing-thumbnail:focus {
    outline: 1px solid #226ede; }
  .sl-themeoptions li.selected,
  .sl-transition-list .sl-transition-thumbnail.selected,
  .sl-easing-list .sl-easing-thumbnail.selected {
    outline-color: var(--theme-options-thumb-border-active);
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
    -webkit-box-shadow: none;
            box-shadow: none; }

.sl-themeoptions .selector.theme li {
  position: relative;
  width: 164px;
  height: 198px;
  background-color: var(--surface-raised);
  background-image: url("https://static.slid.es/images/default-deck-thumbnail-transparent.png");
  background-repeat: no-repeat;
  background-size: 164px; }
  .sl-themeoptions .selector.theme li .thumb-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    min-height: 34px;
    max-height: 34px;
    padding: 7px;
    font-size: 12px;
    color: var(--color-text);
    background: var(--surface-raised);
    -webkit-box-shadow: 0 -1px 0px rgba(0, 0, 0, 0.05);
            box-shadow: 0 -1px 0px rgba(0, 0, 0, 0.05);
    border-bottom-left-radius: var(--button-radius);
    border-bottom-right-radius: var(--button-radius); }
  .sl-themeoptions .selector.theme li:hover .thumb-label {
    white-space: normal;
    max-height: 100%; }
  .sl-themeoptions .selector.theme li .thumb-label-inner {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  .sl-themeoptions .selector.theme li:hover .thumb-label-inner {
    white-space: normal; }
  .sl-themeoptions .selector.theme li[data-theme=""] {
    background: var(--surface-raised-stronger); }
  .sl-themeoptions .selector.theme li .thumb-preloader {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
    -webkit-transition: opacity 0.3s ease 0.1s;
    transition: opacity 0.3s ease 0.1s; }
  .sl-themeoptions .selector.theme li .thumb-preloader.hidden {
    opacity: 0; }
.sl-themeoptions .selector.theme li.filler {
  visibility: hidden; }
.sl-themeoptions .selector.color li,
.sl-themeoptions .selector.font li {
  position: relative;
  text-align: center; }
  .sl-themeoptions .selector.color li h1,
  .sl-themeoptions .selector.font li h1 {
    margin: 13px 0 0 0;
    font-size: 24px;
    text-shadow: none;
    padding: 4px 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  .sl-themeoptions .selector.color li p,
  .sl-themeoptions .selector.color li a,
  .sl-themeoptions .selector.font li p,
  .sl-themeoptions .selector.font li a {
    margin-top: 0px;
    font-size: 16px;
    text-shadow: none;
    pointer-events: none; }
  .sl-themeoptions .selector.color li[data-pro],
  .sl-themeoptions .selector.font li[data-pro] {
    border: 0; }
  .sl-themeoptions .selector.color li[data-pro]:after,
  .sl-themeoptions .selector.font li[data-pro]:after {
    content: 'Pro';
    display: block;
    position: absolute;
    width: 150%;
    height: 20px;
    left: -10px;
    top: 10px;
    background: var(--surface-pro);
    color: var(--color-pro);
    font-weight: bold;
    padding: 5px 0;
    -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
            box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(35deg);
            transform: rotate(35deg); }
.sl-themeoptions .selector.color div {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  border-radius: 50%;
  margin-top: 40px; }
.sl-themeoptions .selector.font ul {
  -webkit-font-smoothing: antialiased; }
.sl-themeoptions .selector.font li {
  width: 32%; }
.sl-themeoptions .selector.font li > * {
  opacity: 0;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease; }
.sl-themeoptions .selector.font li.font-loaded > * {
  opacity: 1; }
.sl-themeoptions.using-theme .section.options,
.sl-themeoptions.using-theme .section.resolution,
.sl-themeoptions.using-theme .selector.font,
.sl-themeoptions.using-theme .selector.color,
.sl-themeoptions.using-theme .selector.transition,
.sl-themeoptions.using-theme .selector.background-transition {
  display: none; }

.sl-easing-list,
.sl-transition-list {
  font-size: 10px; }

.sl-easing-list .sl-easing-thumbnail,
.sl-transition-list .sl-transition-thumbnail {
  height: auto;
  min-width: auto;
  margin: 0 0 8px 0;
  padding: 0;
  outline: 3px solid var(--theme-options-thumb-border); }
  .sl-easing-list .sl-easing-thumbnail .thumb,
  .sl-transition-list .sl-transition-thumbnail .thumb {
    width: 10.6em;
    min-height: 8.48em;
    position: relative;
    overflow: hidden;
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
    -webkit-perspective: 400px;
            perspective: 400px; }
  .sl-easing-list .sl-easing-thumbnail .label,
  .sl-transition-list .sl-transition-thumbnail .label {
    text-align: center;
    margin: 0 0 10px 0 !important;
    font-size: 1.3em; }
  .sl-easing-list .sl-easing-thumbnail .icon,
  .sl-transition-list .sl-transition-thumbnail .icon {
    margin-left: 8px;
    color: var(--theme-options-thumb-text-muted); }
  .sl-easing-list .sl-easing-thumbnail .icon:hover,
  .sl-transition-list .sl-transition-thumbnail .icon:hover {
    color: inherit; }

.sl-easing-list.spacing-around {
  margin: 8px 8px 0 8px; }

.sl-easing-list .sl-easing-thumbnail .thumb {
  height: 8.48em; }

.sl-easing-list .sl-easing-thumbnail {
  border: 1px solid transparent;
  border-radius: 2px; }

.sl-easing-list .sl-easing-thumbnail.selected {
  border-color: #226ede;
  outline: none; }

.sl-easing-list .sl-easing-thumbnail path {
  stroke: var(--theme-options-thumb-easing-stroke);
  stroke-width: 2; }

.sl-easing-list .sl-easing-thumbnail:hover path {
  stroke: var(--theme-options-thumb-easing-stroke-hover);
  stroke-width: 2; }

.sl-transition-list .sl-transition-thumbnail .slide1,
.sl-transition-list .sl-transition-thumbnail .slide2 {
  display: block;
  position: absolute;
  width: 6em;
  height: 6em;
  line-height: 6em;
  left: 50%;
  top: 50%;
  margin-top: -3em;
  margin-left: -3em;
  background-color: var(--theme-options-thumb-surface-alt);
  color: var(--theme-options-thumb-text);
  text-align: center;
  font-weight: 600;
  -webkit-transition: all 0.7s cubic-bezier(0.26, 0.86, 0.44, 0.985);
  transition: all 0.7s cubic-bezier(0.26, 0.86, 0.44, 0.985); }
.sl-transition-list .sl-transition-thumbnail .slide-number {
  font-size: 1.9em; }
.sl-transition-list .sl-transition-thumbnail[data-transition='cube'] .slide1 {
  background-image: url(//staging.slides.com/assets/transition-thumbs-68d056cf01ad856ed283322b9c85f31fd5288076be1cf8a88de724a9e38885af.png);
  background-size: auto 10.6em;
  background-position: -42.4em; }
.sl-transition-list .sl-transition-thumbnail[data-transition='page'] .slide1 {
  background-image: url(//staging.slides.com/assets/transition-thumbs-68d056cf01ad856ed283322b9c85f31fd5288076be1cf8a88de724a9e38885af.png);
  background-size: auto 10.6em;
  background-position: -53em; }

.touch-editor .sl-themeoptions li {
  -webkit-transform: none;
          transform: none; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-tooltip {
  --tooltip-border: var(--border-subtle);
  position: fixed;
  display: block;
  z-index: 2000;
  background: #111;
  border: 1px solid #252525;
  border-radius: 4px;
  pointer-events: none; }
  .sl-tooltip p, .sl-tooltip pre {
    margin: 0;
    padding: 4px 8px;
    line-height: 1.4;
    color: #fff;
    font-size: 12px !important; }
  .sl-tooltip pre[data-highlight-theme] {
    padding: 4px;
    overflow: hidden; }
    .sl-tooltip pre[data-highlight-theme] code {
      border-radius: 4px;
      padding: 8px; }
  .sl-tooltip .keyboard-shortcut {
    margin-left: 6px;
    color: #bbb;
    letter-spacing: 1px; }
  .sl-tooltip br + .keyboard-shortcut {
    margin-left: 0; }
  .sl-tooltip .dimmed {
    color: #bbb; }
  .sl-tooltip .dimmed-row {
    color: #bbb;
    display: block;
    margin-top: 4px; }
  .sl-tooltip .sl-tooltip-arrow {
    position: absolute; }
  .sl-tooltip[data-alignment=t] .sl-tooltip-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: 1px;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -6px;
    border-bottom-width: 0;
    border-top-color: #252525; }
  .sl-tooltip[data-alignment=t] .sl-tooltip-arrow .sl-tooltip-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -6px;
    border-bottom-width: 0;
    border-top-color: #111; }
  .sl-tooltip[data-alignment=b] .sl-tooltip-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: -1px;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -6px;
    border-top-width: 0;
    border-bottom-color: #252525; }
  .sl-tooltip[data-alignment=b] .sl-tooltip-arrow .sl-tooltip-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-left: -6px;
    border-top-width: 0;
    border-bottom-color: #111; }
  .sl-tooltip[data-alignment=l] .sl-tooltip-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: 1px;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -6px;
    border-right-width: 0;
    border-left-color: #252525; }
  .sl-tooltip[data-alignment=l] .sl-tooltip-arrow .sl-tooltip-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -6px;
    border-right-width: 0;
    border-left-color: #111; }
  .sl-tooltip[data-alignment=r] .sl-tooltip-arrow:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: -1px;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -6px;
    border-left-width: 0;
    border-right-color: #252525; }
  .sl-tooltip[data-alignment=r] .sl-tooltip-arrow .sl-tooltip-arrow-fill:before {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-style: solid;
    border-width: 6px;
    border-color: transparent;
    -webkit-transform: rotate(360deg);
    margin-top: -6px;
    border-left-width: 0;
    border-right-color: #111; }
/**
 * Tutorial overlay styles.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-tutorial {
  z-index: 401;
  font-size: 16px;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0; }
  .sl-tutorial .sl-tutorial-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 60px;
    height: 60px; }
    .sl-tutorial .sl-tutorial-controls .button {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: 8px;
      -webkit-box-flex: 0;
          -ms-flex: 0;
              flex: 0; }
  .sl-tutorial .sl-tutorial-controls-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-radius: 30px;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); }
  .sl-tutorial .sl-tutorial-pagination,
  .sl-tutorial .sl-tutorial-buttons {
    position: relative;
    border-radius: 30px; }
  .sl-tutorial .sl-tutorial-pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    text-align: center;
    font-size: 0.875em;
    padding: 10px;
    background: #226ede; }
  .sl-tutorial .sl-tutorial-pagination-number {
    display: inline-block;
    position: relative;
    width: 1em;
    height: 1em;
    border-radius: 1em;
    margin: 0 0.5em;
    cursor: pointer; }
  .sl-tutorial .sl-tutorial-pagination-number.past {
    background: #fff;
    opacity: 0.5; }
  .sl-tutorial .sl-tutorial-pagination-number.present {
    background: #fff; }
  .sl-tutorial .sl-tutorial-pagination-number.future {
    border: 2px solid #fff; }
  .sl-tutorial .sl-tutorial-buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 8px;
    height: 100%;
    background: #144286;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding: 0 20px;
    white-space: nowrap; }
    .sl-tutorial .sl-tutorial-buttons:before {
      content: '';
      position: absolute;
      height: 0px;
      width: 0px;
      left: 0;
      right: auto;
      top: 50%;
      bottom: auto;
      border-style: solid;
      border-width: 6px;
      border-color: transparent;
      -webkit-transform: rotate(360deg);
      margin-top: -6px;
      border-right-width: 0;
      border-left-color: #226ede; }
  .sl-tutorial .sl-tutorial-message {
    position: absolute;
    top: 0;
    left: 0;
    padding: 15px;
    background-color: rgba(255, 255, 255, 0.95);
    color: #222;
    font-size: 1em;
    line-height: 1.4;
    border-radius: var(--popover-radius);
    -webkit-transition: -webkit-transform 0.3s ease;
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease; }
    .sl-tutorial .sl-tutorial-message h3 {
      font-size: 1em;
      font-weight: bold; }
    .sl-tutorial .sl-tutorial-message p {
      margin: 0.3em 0 0 0; }
    .sl-tutorial .sl-tutorial-message .de-emphasize {
      color: #999; }
      .sl-tutorial .sl-tutorial-message .de-emphasize a {
        color: #999; }
      .sl-tutorial .sl-tutorial-message .de-emphasize a:hover {
        color: #104eaa; }
    .sl-tutorial .sl-tutorial-message[data-alignment="t"]:before {
      content: '';
      position: absolute;
      height: 0px;
      width: 0px;
      left: 50%;
      right: auto;
      top: 100%;
      bottom: auto;
      border-style: solid;
      border-width: 8px;
      border-color: transparent;
      -webkit-transform: rotate(360deg);
      margin-left: -8px;
      border-bottom-width: 0;
      border-top-color: rgba(255, 255, 255, 0.95); }
    .sl-tutorial .sl-tutorial-message[data-alignment="r"]:before {
      content: '';
      position: absolute;
      height: 0px;
      width: 0px;
      left: auto;
      right: 100%;
      top: 50%;
      bottom: auto;
      border-style: solid;
      border-width: 8px;
      border-color: transparent;
      -webkit-transform: rotate(360deg);
      margin-top: -8px;
      border-left-width: 0;
      border-right-color: rgba(255, 255, 255, 0.95); }
    .sl-tutorial .sl-tutorial-message[data-alignment="b"]:before {
      content: '';
      position: absolute;
      height: 0px;
      width: 0px;
      left: 50%;
      right: auto;
      top: auto;
      bottom: 100%;
      border-style: solid;
      border-width: 8px;
      border-color: transparent;
      -webkit-transform: rotate(360deg);
      margin-left: -8px;
      border-top-width: 0;
      border-bottom-color: rgba(255, 255, 255, 0.95); }
    .sl-tutorial .sl-tutorial-message[data-alignment="l"]:before {
      content: '';
      position: absolute;
      height: 0px;
      width: 0px;
      left: 100%;
      right: auto;
      top: 50%;
      bottom: auto;
      border-style: solid;
      border-width: 8px;
      border-color: transparent;
      -webkit-transform: rotate(360deg);
      margin-top: -8px;
      border-right-width: 0;
      border-left-color: rgba(255, 255, 255, 0.95); }
    .sl-tutorial .sl-tutorial-message[data-alignment="tl"]:before {
      content: '';
      position: absolute;
      height: 0px;
      width: 0px;
      left: 100%;
      right: auto;
      top: 12px;
      bottom: auto;
      border-style: solid;
      border-width: 8px;
      border-color: transparent;
      -webkit-transform: rotate(360deg);
      margin-top: -8px;
      border-right-width: 0;
      border-left-color: rgba(255, 255, 255, 0.95); }
  .sl-tutorial.last-step .sl-tutorial-next {
    width: 96%; }
/**
 * Media uploader component.
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.uploader {
  position: relative;
  background: #f9f9f9;
  border: 1px solid #ddd; }
  .uploader .uploader-input,
  .uploader .uploader-progress,
  .uploader .uploader-output {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: none;
    text-align: center; }
  .uploader .uploader-input {
    cursor: pointer; }
    .uploader .uploader-input input {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      opacity: 0;
      cursor: pointer; }
    .uploader .uploader-input span {
      position: relative;
      top: 40%;
      padding: 4px 8px;
      font-size: 0.8em;
      background: rgba(0, 0, 0, 0.4);
      color: #fff; }
    .uploader .uploader-input:hover span {
      background: black; }
  .uploader[data-state="input"] .uploader-input, .uploader[data-state="progress"] .uploader-progress, .uploader[data-state="output"] .uploader-output {
    display: block; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.user-info {
  --user-info-link-gap: var(--space-4);
  --user-info-link-item-gap: var(--space-3);
  --user-info-section-gap: var(--space-3);
  position: relative;
  font-size: 13px;
  color: var(--color-text); }
  .user-info .title {
    margin-bottom: var(--user-info-section-gap);
    font-size: 1.4em; }
    .user-info .title .username {
      color: var(--color-text-strong);
      margin-right: var(--space-2); }
    .user-info .title .pro-badge {
      top: -2px; }
  .user-info .picture {
    width: 8.75em;
    height: 8.75em;
    float: left;
    margin: 0 var(--space-6) var(--space-3) 0;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-4);
    background-color: var(--surface-panel);
    background-size: cover;
    background-position: 50% 0%;
    background-repeat: no-repeat; }
  .user-info .links {
    list-style: none;
    margin: var(--user-info-link-gap) 0; }
    .user-info .links li {
      display: inline-block;
      margin-right: var(--user-info-link-gap);
      margin-bottom: var(--space-2);
      color: var(--color-text-secondary); }
      .user-info .links li .icon {
        position: relative;
        margin-right: var(--user-info-link-item-gap);
        top: 1px; }
    .user-info .links a {
      color: inherit; }
      .user-info .links a:hover {
        color: var(--color-text-strong); }
  .user-info .description {
    max-width: 650px;
    margin: 0;
    color: var(--color-text-muted); }
  .user-info .edit {
    position: absolute;
    right: calc( var(--space-3) * -1 );
    top: calc( var(--space-3) * -1 ); }
/**
 * Web browser frame used in various places around the site and app.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.sl-webbrowser {
  font-size: 16px;
  width: 100%;
  height: 100%;
  color: #f5f5f5;
  -webkit-box-shadow: 0 0.375em 1.25em rgba(0, 0, 0, 0.15), 0 0.125em 0.375em rgba(0, 0, 0, 0.2);
          box-shadow: 0 0.375em 1.25em rgba(0, 0, 0, 0.15), 0 0.125em 0.375em rgba(0, 0, 0, 0.2); }

.sl-webbrowser.no-shadow {
  -webkit-box-shadow: none;
          box-shadow: none; }

.sl-webbrowser-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  width: 100%;
  height: 2.1875em;
  padding: 0 0.625em;
  background-color: currentColor;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  border-top-left-radius: 1em;
  border-top-right-radius: 1em; }

.sl-webbrowser-header-dot {
  width: 0.625em;
  height: 0.625em;
  border-radius: 0.625em;
  background-color: rgba(0, 0, 0, 0.1);
  margin-right: 0.375em;
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.sl-webbrowser-header-url {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  max-width: 60%;
  padding: 2px 0.625em;
  margin-left: 0.625em;
  border-radius: 1.25em;
  font-size: 11px;
  color: #222;
  border: 1px solid #eee;
  background-color: #fff;
  cursor: default; }

.sl-webbrowser-header-aspectratio {
  margin-left: auto;
  padding: 2px;
  color: #999;
  font-size: 10px;
  letter-spacing: 0.05em;
  cursor: default; }

.sl-webbrowser-content {
  position: relative;
  border: 0.5em solid transparent;
  border-top: 0;
  border-bottom-left-radius: 1em;
  border-bottom-right-radius: 1em;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  background-color: currentColor;
  overflow: hidden; }

.sl-webbrowser-content img,
.sl-webbrowser-content video,
.sl-webbrowser-content iframe {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 0 !important; }

.sl-webbrowser-spinner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.4s linear 0.2s;
  transition: all 0.4s linear 0.2s;
  background-color: #e4637c;
  border-radius: 4px;
  z-index: 1; }

.sl-webbrowser.loaded .sl-webbrowser-spinner {
  opacity: 0;
  visibility: hidden; }

.sl-webbrowser.translucent {
  color: rgba(255, 255, 255, 0.15);
  -webkit-box-shadow: none;
          box-shadow: none; }
  .sl-webbrowser.translucent .sl-webbrowser-header-dot {
    background-color: rgba(255, 255, 255, 0.15); }
/*!
 * Main styles for Slides
 *
 * @author Hakim El Hattab
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
/**
 * Mode-agnostic design tokens.
 */
:root {
  --font-size-edit-ui: 12px;
  --radius-1: 2px;
  --radius-2: 4px;
  --radius-3: 6px;
  --radius-4: 8px;
  --radius-5: 12px;
  --radius-6: 16px;
  --radius-full: 9999px;
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 8px;
  --space-5: 12px;
  --space-6: 16px;
  --space-7: 24px;
  --space-8: 32px;
  --space-9: 40px;
  --minus-space-1: -2px;
  --minus-space-2: -4px;
  --minus-space-3: -6px;
  --minus-space-4: -8px;
  --minus-space-5: -12px;
  --minus-space-6: -16px;
  --minus-space-7: -24px;
  --minus-space-8: -32px;
  --minus-space-9: -40px;
  --button-size-1: 20px;
  --button-size-2: 24px;
  --button-size-3: 28px;
  --button-size-4: 32px;
  --button-size-5: 36px;
  --button-size-6: 40px;
  --button-size-7: 48px;
  --button-size-8: 56px;
  --button-size-9: 64px;
  --button-radius: var(--radius-4);
  --nav-link-radius: var(--radius-4);
  --section-padding: var(--space-9);
  --section-margin: var(--space-9);
  --section-radius: var(--radius-4);
  --popover-radius: var(--radius-4);
  --popup-radius: var(--radius-5);
  --popup-inner-radius: var(--radius-4);
  --drawer-item-size: 46px;
  --drawer-menu-width: var( --drawer-item-size );
  --drawer-tool-width: 300px;
  --page-inset-right: var( --drawer-menu-width );
  --page-padding: var(--space-6);
  --site-max-width: 1440px;
  --app-max-width: 1920px;
  --page-max-width: var(--site-max-width);
  --header-height: 70px;
  --header-padding: var(--space-4);
  --tray-height: 49px;
  --tray-padding: 10px;
  --app-nav-width: 340px;
  --app-nav-padding: var(--page-padding);
  --app-nav-item-padding: var(--space-5);
  --app-nav-radius: var(--button-radius);
  --form-field-padding: var(--space-5);
  --form-field-radius: var(--radius-4);
  --form-field-height: var(--button-size-6);
  --checkbox-radius: var(--radius-2);
  --card-radius: var(--radius-4); }

/**
 * Theme entry point.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
/**
 * Primitive color scales.
 *
 * Gray and accent ramps are the shared foundation for both
 * light and dark mode. Semantic tokens should map to these
 * values instead of introducing new neutral or accent colors.
 */
/**
 * Documentation page tokens.
 */
:root {
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html {
  color-scheme: light; }

html.dark-theme {
  color-scheme: dark;
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html.light-theme {
  color-scheme: light;
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.dark-theme:not(html) {
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.light-theme:not(html) {
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.inverse-theme:not(html) {
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html.dark-theme .inverse-theme,
.dark-theme:not(html) .inverse-theme {
  --accent-1: #fcfdff;
  --accent-2: #f5f9ff;
  --accent-3: #eaf3ff;
  --accent-4: #dcebff;
  --accent-5: #cbe1ff;
  --accent-6: #b7d4ff;
  --accent-7: #9ec2f9;
  --accent-8: #7baaf3;
  --accent-9: #226ede;
  --accent-10: #0f60ce;
  --accent-11: #1d69d9;
  --accent-12: #113162;
  --accent-a1: #0055ff03;
  --accent-a2: #0066ff0a;
  --accent-a3: #006eff15;
  --accent-a4: #006eff23;
  --accent-a5: #006cff34;
  --accent-a6: #0067ff48;
  --accent-a7: #005ff061;
  --accent-a8: #005be884;
  --accent-a9: #0058d9dd;
  --accent-a10: #0056cbf0;
  --accent-a11: #0056d4e2;
  --accent-a12: #002257ee;
  --accent-contrast: #fff;
  --gray-1: #fcfcfd;
  --gray-2: #f9f9fb;
  --gray-3: #eff0f3;
  --gray-4: #e7e8ec;
  --gray-5: #e0e1e6;
  --gray-6: #d8d9e0;
  --gray-7: #cdced7;
  --gray-8: #a7a8b2;
  --gray-9: #7d7f89;
  --gray-10: #73757f;
  --gray-11: #585961;
  --gray-12: #1b1c20;
  --gray-13: #000000;
  --gray-a1: #00005503;
  --gray-a2: #00005506;
  --gray-a3: #00104010;
  --gray-a4: #000b3618;
  --gray-a5: #0009321f;
  --gray-a6: #00073527;
  --gray-a7: #00063332;
  --gray-a8: #00083046;
  --gray-a9: #00051d74;
  --gray-a10: #00051b7f;
  --gray-a11: #0002119d;
  --gray-a12: #000107e1;
  --gray-a13: #0000000a;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 252, 252, 253;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 249, 249, 251;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 239, 240, 243;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a2);
  --surface-tint-1: var(--gray-a3);
  --surface-tint-2: var(--gray-a4);
  --surface-tint-3: var(--gray-a5);
  --surface-tint-4: var(--gray-a6);
  --surface-tint-5: var(--gray-a7);
  --surface-inset-1: rgba(0, 0, 3, 0.03);
  --surface-inset-2: rgba(0, 0, 3, 0.06);
  --surface-inset-3: rgba(0, 0, 3, 0.09);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 30, 31, 36;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 252, 252, 253;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a4);
  --state-selection-fg: var(--text-1);
  --code-surface: var(--gray-12);
  --code-border: var(--gray-11);
  --code-text: #dde7fb;
  --code-text-muted: rgba(255, 255, 255, 0.7);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-10);
  --color-link-hover: var(--accent-11);
  --color-success: #40cb90;
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --button-neutral-surface: #293235;
  --button-neutral-surface-hover: #364144;
  --button-neutral-surface-active: #253033;
  --button-neutral-text: #fff;
  --button-neutral-soft-surface: var(--surface-tint-1);
  --button-neutral-soft-surface-hover: var(--surface-tint-3);
  --button-neutral-soft-surface-active: var(--surface-tint-1);
  --button-neutral-soft-text: var(--color-text);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: var(--gray-11);
  --button-strong-surface-active: var(--gray-10);
  --button-strong-text: #fff;
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: #0c56b9;
  --button-primary-text: var(--accent-contrast);
  --button-disabled-surface: var(--surface-tint-1);
  --button-disabled-text: var(--color-text-muted);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: #e8f7ef;
  --status-success-text: #156b49;
  --status-info-surface: #ecf3ff;
  --status-info-text: #2f57b8;
  --status-warning-surface: #fff4e8;
  --status-warning-text: #945319;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-checked: var(--color-accent);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: var(--surface-tint-0);
  --form-field-surface-focus: transparent;
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #efefef, transparent 280px);
  --surface-section: var(--surface-canvas);
  --border-section: var(--border-subtle);
  --border-section-width: 1px;
  --shadow-section: 0 14px 30px rgba(0, 0, 0, 0.06);
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-strong);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

.light-theme:not(html) .inverse-theme {
  --accent-1: #0b111c;
  --accent-2: #0f1825;
  --accent-3: #112647;
  --accent-4: #123160;
  --accent-5: #193c72;
  --accent-6: #224883;
  --accent-7: #2b5597;
  --accent-8: #3264b2;
  --accent-9: #226ede;
  --accent-10: #317df0;
  --accent-11: #86b7ff;
  --accent-12: #d1e3fe;
  --accent-a1: #0012fb0c;
  --accent-a2: #0062f916;
  --accent-a3: #116eff3a;
  --accent-a4: #1471ff55;
  --accent-a5: #257bff68;
  --accent-a6: #3483fd7b;
  --accent-a7: #408aff90;
  --accent-a8: #428cffad;
  --accent-a9: #257dffdc;
  --accent-a10: #448dffad;
  --accent-a11: #86b7ff;
  --accent-a12: #d2e4fffe;
  --accent-contrast: #fff;
  --gray-1: #111113;
  --gray-2: #19191a;
  --gray-3: #222224;
  --gray-4: #29292d;
  --gray-5: #313134;
  --gray-6: #3a3a3d;
  --gray-7: #48484c;
  --gray-8: #6f6f73;
  --gray-9: #7c7d80;
  --gray-10: #88888c;
  --gray-11: #bcbcbf;
  --gray-12: #efeff3;
  --gray-13: #f5f5f5;
  --gray-a1: #1111bb03;
  --gray-a2: #dedef70a;
  --gray-a3: #e0e0f815;
  --gray-a4: #ddddff1e;
  --gray-a5: #e8e8fc26;
  --gray-a6: #ebebfb30;
  --gray-a7: #ededfd40;
  --gray-a8: #f4f4ff58;
  --gray-a9: #f3f6ff68;
  --gray-a10: #f7f7ff76;
  --gray-a11: #fafaffb3;
  --gray-a12: #f9f9fef2;
  --gray-a13: #f9f9fef2;
  --text-1: var(--gray-13);
  --text-2: var(--gray-12);
  --text-3: var(--gray-11);
  --text-4: var(--gray-10);
  --text-5: var(--gray-9);
  --text-6: var(--gray-8);
  --surface-1: var(--gray-1);
  --surface-1-rgb: 17, 17, 17;
  --surface-2: var(--gray-2);
  --surface-2-rgb: 25, 25, 25;
  --surface-3: var(--gray-3);
  --surface-3-rgb: 34, 34, 34;
  --surface-4: var(--gray-4);
  --surface-5: var(--gray-5);
  --surface-6: var(--gray-6);
  --border-1: var(--gray-a3);
  --border-2: var(--gray-a4);
  --border-3: var(--gray-a5);
  --border-4: var(--gray-a6);
  --border-5: var(--gray-a7);
  --border-6: var(--gray-a8);
  --border-7: var(--gray-a9);
  --surface-tint-0: var(--gray-a3);
  --surface-tint-1: var(--gray-a4);
  --surface-tint-2: var(--gray-a5);
  --surface-tint-3: var(--gray-a6);
  --surface-tint-4: var(--gray-a7);
  --surface-tint-5: var(--gray-a8);
  --surface-inset-1: rgba(0, 0, 0, 0.12);
  --surface-inset-2: rgba(0, 0, 0, 0.2);
  --surface-inset-3: rgba(0, 0, 0, 0.28);
  --glass-bg: rgba(var(--surface-1-rgb), 0.86);
  --glass-bg-rgb: var(--surface-1-rgb);
  --glass-bg-hover: rgba(var(--surface-2-rgb), 0.86);
  --glass-filter: blur(8px);
  --inverse-surface: var(--gray-12);
  --inverse-surface-rgb: 238, 238, 238;
  --inverse-text: var(--gray-1);
  --inverse-text-rgb: 17, 17, 17;
  --tone-positive-1: #2f8f4f;
  --tone-negative-1: #b34336;
  --tone-negative-2: #d34b3c;
  --tone-negative-3: #b34336;
  --state-selection-bg: var(--accent-a5);
  --state-selection-fg: var(--text-1);
  --code-surface: #0d1117;
  --code-border: var(--gray-4);
  --code-text: var(--gray-12);
  --code-text-muted: var(--gray-11);
  --font-sans: 'Inter', Helvetica, sans-serif;
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
  --color-accent: var(--accent-9);
  --color-accent-fg: #fff;
  --color-spot-1: #FFBD3E;
  --color-spot-1-fg: #000;
  --color-spot-2: #25BA81;
  --color-spot-2-fg: #000;
  --color-spot-3: #B2A5FF;
  --color-spot-3-fg: #000;
  --surface-lite: #45484b;
  --color-lite: #fff;
  --surface-pro: var(--accent-9);
  --surface-pro-hover: var(--accent-10);
  --color-pro: var(--accent-contrast);
  --surface-team: #00955c;
  --color-team: var(--color-spot-2-fg);
  --color-text-faint: var(--text-6);
  --color-text-subtle: var(--text-5);
  --color-text-muted: var(--text-4);
  --color-text-secondary: var(--text-3);
  --color-text: var(--text-2);
  --color-text-strong: var(--text-1);
  --surface-canvas: var(--surface-1);
  --surface-canvas-rgb: var(--surface-1-rgb);
  --surface-panel: var(--surface-2);
  --surface-panel-rgb: var(--surface-2-rgb);
  --surface-panel-alt: var(--surface-3);
  --surface-raised: var(--surface-4);
  --surface-raised-strong: var(--surface-5);
  --surface-raised-stronger: var(--surface-6);
  --border-subtle: var(--border-1);
  --border-default: var(--border-2);
  --border-strong: var(--border-3);
  --border-stronger: var(--border-5);
  --border-strongest: var(--border-6);
  --surface-hover-subtle: var(--surface-tint-0);
  --surface-hover: var(--surface-tint-1);
  --surface-hover-strong: var(--surface-tint-2);
  --surface-hover-stronger: var(--surface-tint-3);
  --surface-hover-strongest: var(--surface-tint-4);
  --surface-inset: var(--surface-inset-1);
  --surface-inset-strong: var(--surface-inset-2);
  --surface-inset-stronger: var(--surface-inset-3);
  --surface-glass: var(--glass-bg);
  --surface-glass-rgb: var(--glass-bg-rgb);
  --surface-glass-hover: var(--glass-bg-hover);
  --surface-glass-filter: var(--glass-filter);
  --surface-inverse: var(--inverse-surface);
  --surface-inverse-rgb: var(--inverse-surface-rgb);
  --color-text-inverse: var(--inverse-text);
  --surface-overlay: var(--surface-canvas);
  --border-overlay: var(--surface-inset-strong);
  --border-overlay-divider: var(--border-subtle);
  --color-overlay: var(--color-text-strong);
  --surface-code: var(--code-surface);
  --border-code: var(--code-border);
  --color-text-code: var(--code-text);
  --color-text-code-muted: var(--code-text-muted);
  --color-success: var(--tone-positive-1);
  --color-danger: var(--tone-negative-1);
  --color-danger-hover: var(--tone-negative-2);
  --color-danger-active: var(--tone-negative-3);
  --color-danger-fg: #fff;
  --button-overlay-subtle-text: var(--color-text);
  --button-overlay-strong-text: #fff;
  --button-overlay-neutral-5: rgba(0, 0, 0, 0.05);
  --button-overlay-neutral-10: rgba(0, 0, 0, 0.1);
  --button-overlay-neutral-10-hover: rgba(0, 0, 0, 0.2);
  --button-overlay-neutral-30: rgba(0, 0, 0, 0.3);
  --button-overlay-neutral-30-hover: rgba(0, 0, 0, 0.7);
  --button-overlay-neutral-60: rgba(0, 0, 0, 0.6);
  --button-overlay-neutral-60-hover: rgba(0, 0, 0, 0.9);
  --button-weight: 500;
  --editor-panel-1-bg: var(--surface-canvas);
  --editor-panel-1-bg-rgb: var(--surface-canvas-rgb);
  --editor-panel-2-bg: var(--surface-panel);
  --editor-panel-2-bg-rgb: var(--surface-panel-rgb);
  --panel-divider-color: var(--border-default);
  --color-link: var(--accent-11);
  --color-link-hover: var(--accent-12);
  --color-success: #48c88c;
  --button-neutral-surface: var(--gray-4);
  --button-neutral-surface-hover: var(--gray-5);
  --button-neutral-surface-active: var(--gray-4);
  --button-neutral-text: var(--color-text-strong);
  --button-neutral-soft-surface: var(--surface-tint-0);
  --button-neutral-soft-surface-hover: var(--surface-tint-2);
  --button-neutral-soft-surface-active: var(--surface-tint-0);
  --button-neutral-soft-text: var(--color-text-strong);
  --button-strong-surface: var(--gray-12);
  --button-strong-surface-hover: #fff;
  --button-strong-surface-active: var(--gray-11);
  --button-strong-text: var(--gray-1);
  --button-primary-surface: var(--accent-9);
  --button-primary-surface-hover: var(--accent-10);
  --button-primary-surface-active: var(--accent-9);
  --button-primary-text: var(--accent-contrast);
  --button-outline-border: var(--border-strong);
  --button-outline-border-hover: var(--border-strongest);
  --button-outline-border-disabled: var(--border-default);
  --button-ghost-surface-hover: var(--surface-hover);
  --button-ghost-surface-active: var(--surface-hover-strong);
  --status-success-surface: rgba(48, 155, 106, 0.2);
  --status-success-text: #7ee0b5;
  --status-info-surface: rgba(74, 125, 255, 0.2);
  --status-info-text: #a6c0ff;
  --status-warning-surface: rgba(228, 200, 77, 0.415);
  --status-warning-text: #ffd39d;
  --form-field-border: var(--border-strong);
  --form-field-border-hover: var(--border-strongest);
  --form-field-border-active: var(--color-accent);
  --form-field-surface: transparent;
  --form-field-surface-focus: var(--surface-inset);
  --form-field-surface-muted: var(--surface-tint-1);
  --form-field-text: var(--color-text);
  --form-field-text-muted: var(--color-text-muted);
  --surface-page: var(--surface-canvas);
  --color-page: var(--color-text);
  --gradient-page: linear-gradient(165deg, #181819, transparent 280px);
  --surface-section: var(--surface-panel);
  --border-section: var(--border-default);
  --border-section-width: 1px;
  --shadow-section: none;
  --color-section-description: var(--color-text-muted);
  --color-nav-heading: var(--color-text-subtle);
  --color-nav-scroll: var(--color-text-muted);
  --color-nav-scroll-active: var(--color-text-secondary);
  --surface-nav-link: transparent;
  --surface-nav-link-hover: var(--surface-hover);
  --surface-nav-link-selected: var(--surface-hover-strong);
  --color-nav-link: var(--color-text-secondary);
  --color-nav-link-hover: var(--color-text-secondary);
  --color-nav-link-selected: var(--color-text-strong); }

html.docs {
  --docs-gap: var(--space-6);
  --docs-gap-lg: var(--space-8);
  --docs-padding: var(--space-6);
  --docs-outdent: calc(var(--docs-padding) * -1);
  --docs-radius: calc(var(--radius-6) + var(--radius-2));
  --docs-radius-lg: calc(var(--radius-6) + var(--space-5));
  --docs-radius-inner: calc(var(--docs-radius-lg) - 6px);
  --docs-radius-inner-2: calc(var(--docs-radius-lg) - 12px);
  --docs-radius-card-inner: calc(var(--docs-radius) - 6px);
  --docs-text: var(--color-text);
  --docs-text-muted: var(--color-text-muted);
  --docs-text-subtle: var(--color-text-subtle);
  --docs-heading-muted: var(--color-text-subtle);
  --docs-border: var(--border-strong);
  --docs-border-soft: var(--border-default);
  --docs-border-strong: var(--border-stronger);
  --docs-inline-bg: var(--surface-hover);
  --docs-table-header-bg: var(--surface-panel);
  --docs-code-bg: var(--surface-code);
  --docs-code-border: var(--border-code);
  --docs-code-text: var(--color-text-code);
  --docs-code-label: var(--color-text-code-muted);
  --docs-surface: var(--surface-panel);
  --docs-surface-subtle: var(--surface-canvas);
  --docs-tag-bg: var(--surface-panel-alt);
  --docs-tag-fg: var(--color-text-secondary);
  --docs-method-get-bg: var(--status-success-surface);
  --docs-method-get-fg: var(--status-success-text);
  --docs-method-post-bg: var(--status-info-surface);
  --docs-method-post-fg: var(--status-info-text);
  --docs-method-mcp-bg: var(--status-warning-surface);
  --docs-method-mcp-fg: var(--status-warning-text); }

[data-drawer] {
  --page-inset-right: calc( var(--drawer-menu-width) + var(--drawer-tool-width) ); }

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

:-webkit-full-screen {
  width: 100%;
  height: 100%; }

:-ms-fullscreen {
  width: 100%;
  height: 100%; }

:fullscreen {
  width: 100%;
  height: 100%; }

::-moz-selection {
  background: var(--surface-inverse);
  color: var(--color-text-inverse); }

::selection {
  background: var(--surface-inverse);
  color: var(--color-text-inverse); }

html,
body {
  padding: 0;
  margin: 0;
  color: var(--color-page);
  font-family: var(--font-sans);
  font-size: 14px;
  font-optical-sizing: auto;
  font-weight: 400;
  font-variation-settings: "opsz" auto;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased; }
  html:before,
  body:before {
    content: '' !important; }

html {
  -webkit-font-smoothing: subpixel-antialiased !important; }

html.sl-root:not(.loaded) * {
  -webkit-transition: none !important;
  transition: none !important; }

body {
  overflow-y: scroll; }

body > *:not(.reveal) {
  font-family: var(--font-sans); }

html,
#container {
  background-color: var(--surface-page); }

html.spa,
html.deck-dashboard {
  --page-max-width: var(--app-max-width);
  height: 100vh;
  height: var(--viewport-height, 100vh); }
  html.spa body,
  html.spa #container,
  html.deck-dashboard body,
  html.deck-dashboard #container {
    height: 100%;
    overflow: hidden; }

#container {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  min-height: 100svh; }

.main {
  line-height: 1.5;
  color: var(--color-page); }

.icon {
  display: inline-block;
  line-height: 1; }

.spinner {
  display: block;
  width: 32px;
  height: 32px;
  margin-top: 16px;
  margin-left: 16px; }
  .spinner.flush {
    margin: 0; }
  .spinner.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -16px;
    margin-left: -16px; }
  .spinner.centered-horizontally {
    margin-left: auto;
    margin-right: auto; }

.spinner-bitmap {
  display: block;
  width: 32px;
  height: 32px;
  background-image: url(data:image/png;base64,R0lGODlhIAAgAPMAAP///wAAAMbGxoSEhLa2tpqamjY2NlZWVtjY2OTk5Ly8vB4eHgQEBAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAIAAgAAAE5xDISWlhperN52JLhSSdRgwVo1ICQZRUsiwHpTJT4iowNS8vyW2icCF6k8HMMBkCEDskxTBDAZwuAkkqIfxIQyhBQBFvAQSDITM5VDW6XNE4KagNh6Bgwe60smQUB3d4Rz1ZBApnFASDd0hihh12BkE9kjAJVlycXIg7CQIFA6SlnJ87paqbSKiKoqusnbMdmDC2tXQlkUhziYtyWTxIfy6BE8WJt5YJvpJivxNaGmLHT0VnOgSYf0dZXS7APdpB309RnHOG5gDqXGLDaC457D1zZ/V/nmOM82XiHRLYKhKP1oZmADdEAAAh+QQJCgAAACwAAAAAIAAgAAAE6hDISWlZpOrNp1lGNRSdRpDUolIGw5RUYhhHukqFu8DsrEyqnWThGvAmhVlteBvojpTDDBUEIFwMFBRAmBkSgOrBFZogCASwBDEY/CZSg7GSE0gSCjQBMVG023xWBhklAnoEdhQEfyNqMIcKjhRsjEdnezB+A4k8gTwJhFuiW4dokXiloUepBAp5qaKpp6+Ho7aWW54wl7obvEe0kRuoplCGepwSx2jJvqHEmGt6whJpGpfJCHmOoNHKaHx61WiSR92E4lbFoq+B6QDtuetcaBPnW6+O7wDHpIiK9SaVK5GgV543tzjgGcghAgAh+QQJCgAAACwAAAAAIAAgAAAE7hDISSkxpOrN5zFHNWRdhSiVoVLHspRUMoyUakyEe8PTPCATW9A14E0UvuAKMNAZKYUZCiBMuBakSQKG8G2FzUWox2AUtAQFcBKlVQoLgQReZhQlCIJesQXI5B0CBnUMOxMCenoCfTCEWBsJColTMANldx15BGs8B5wlCZ9Po6OJkwmRpnqkqnuSrayqfKmqpLajoiW5HJq7FL1Gr2mMMcKUMIiJgIemy7xZtJsTmsM4xHiKv5KMCXqfyUCJEonXPN2rAOIAmsfB3uPoAK++G+w48edZPK+M6hLJpQg484enXIdQFSS1u6UhksENEQAAIfkECQoAAAAsAAAAACAAIAAABOcQyEmpGKLqzWcZRVUQnZYg1aBSh2GUVEIQ2aQOE+G+cD4ntpWkZQj1JIiZIogDFFyHI0UxQwFugMSOFIPJftfVAEoZLBbcLEFhlQiqGp1Vd140AUklUN3eCA51C1EWMzMCezCBBmkxVIVHBWd3HHl9JQOIJSdSnJ0TDKChCwUJjoWMPaGqDKannasMo6WnM562R5YluZRwur0wpgqZE7NKUm+FNRPIhjBJxKZteWuIBMN4zRMIVIhffcgojwCF117i4nlLnY5ztRLsnOk+aV+oJY7V7m76PdkS4trKcdg0Zc0tTcKkRAAAIfkECQoAAAAsAAAAACAAIAAABO4QyEkpKqjqzScpRaVkXZWQEximw1BSCUEIlDohrft6cpKCk5xid5MNJTaAIkekKGQkWyKHkvhKsR7ARmitkAYDYRIbUQRQjWBwJRzChi9CRlBcY1UN4g0/VNB0AlcvcAYHRyZPdEQFYV8ccwR5HWxEJ02YmRMLnJ1xCYp0Y5idpQuhopmmC2KgojKasUQDk5BNAwwMOh2RtRq5uQuPZKGIJQIGwAwGf6I0JXMpC8C7kXWDBINFMxS4DKMAWVWAGYsAdNqW5uaRxkSKJOZKaU3tPOBZ4DuK2LATgJhkPJMgTwKCdFjyPHEnKxFCDhEAACH5BAkKAAAALAAAAAAgACAAAATzEMhJaVKp6s2nIkolIJ2WkBShpkVRWqqQrhLSEu9MZJKK9y1ZrqYK9WiClmvoUaF8gIQSNeF1Er4MNFn4SRSDARWroAIETg1iVwuHjYB1kYc1mwruwXKC9gmsJXliGxc+XiUCby9ydh1sOSdMkpMTBpaXBzsfhoc5l58Gm5yToAaZhaOUqjkDgCWNHAULCwOLaTmzswadEqggQwgHuQsHIoZCHQMMQgQGubVEcxOPFAcMDAYUA85eWARmfSRQCdcMe0zeP1AAygwLlJtPNAAL19DARdPzBOWSm1brJBi45soRAWQAAkrQIykShQ9wVhHCwCQCACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiRMDjI0Fd30/iI2UA5GSS5UDj2l6NoqgOgN4gksEBgYFf0FDqKgHnyZ9OX8HrgYHdHpcHQULXAS2qKpENRg7eAMLC7kTBaixUYFkKAzWAAnLC7FLVxLWDBLKCwaKTULgEwbLA4hJtOkSBNqITT3xEgfLpBtzE/jiuL04RGEBgwWhShRgQExHBAAh+QQJCgAAACwAAAAAIAAgAAAE7xDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfZiCqGk5dTESJeaOAlClzsJsqwiJwiqnFrb2nS9kmIcgEsjQydLiIlHehhpejaIjzh9eomSjZR+ipslWIRLAgMDOR2DOqKogTB9pCUJBagDBXR6XB0EBkIIsaRsGGMMAxoDBgYHTKJiUYEGDAzHC9EACcUGkIgFzgwZ0QsSBcXHiQvOwgDdEwfFs0sDzt4S6BK4xYjkDOzn0unFeBzOBijIm1Dgmg5YFQwsCMjp1oJ8LyIAACH5BAkKAAAALAAAAAAgACAAAATwEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GGl6NoiPOH16iZKNlH6KmyWFOggHhEEvAwwMA0N9GBsEC6amhnVcEwavDAazGwIDaH1ipaYLBUTCGgQDA8NdHz0FpqgTBwsLqAbWAAnIA4FWKdMLGdYGEgraigbT0OITBcg5QwPT4xLrROZL6AuQAPUS7bxLpoWidY0JtxLHKhwwMJBTHgPKdEQAACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GAULDJCRiXo1CpGXDJOUjY+Yip9DhToJA4RBLwMLCwVDfRgbBAaqqoZ1XBMHswsHtxtFaH1iqaoGNgAIxRpbFAgfPQSqpbgGBqUD1wBXeCYp1AYZ19JJOYgH1KwA4UBvQwXUBxPqVD9L3sbp2BNk2xvvFPJd+MFCN6HAAIKgNggY0KtEBAAh+QQJCgAAACwAAAAAIAAgAAAE6BDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfYIDMaAFdTESJeaEDAIMxYFqrOUaNW4E4ObYcCXaiBVEgULe0NJaxxtYksjh2NLkZISgDgJhHthkpU4mW6blRiYmZOlh4JWkDqILwUGBnE6TYEbCgevr0N1gH4At7gHiRpFaLNrrq8HNgAJA70AWxQIH1+vsYMDAzZQPC9VCNkDWUhGkuE5PxJNwiUK4UfLzOlD4WvzAHaoG9nxPi5d+jYUqfAhhykOFwJWiAAAIfkECQoAAAAsAAAAACAAIAAABPAQyElpUqnqzaciSoVkXVUMFaFSwlpOCcMYlErAavhOMnNLNo8KsZsMZItJEIDIFSkLGQoQTNhIsFehRww2CQLKF0tYGKYSg+ygsZIuNqJksKgbfgIGepNo2cIUB3V1B3IvNiBYNQaDSTtfhhx0CwVPI0UJe0+bm4g5VgcGoqOcnjmjqDSdnhgEoamcsZuXO1aWQy8KAwOAuTYYGwi7w5h+Kr0SJ8MFihpNbx+4Erq7BYBuzsdiH1jCAzoSfl0rVirNbRXlBBlLX+BP0XJLAPGzTkAuAOqb0WT5AH7OcdCm5B8TgRwSRKIHQtaLCwg1RAAAOwAAAAAAAAAAAA==);
  background-repeat: no-repeat; }

.clear {
  clear: both; }

.vcenter:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle; }

.vcenter-target {
  display: inline-block;
  vertical-align: middle; }

.no-transition,
.no-transition * {
  -webkit-transition: none !important;
  transition: none !important;
  -webkit-animation-duration: 0s !important;
          animation-duration: 0s !important; }

.grow-in-on-load {
  opacity: 0;
  -webkit-transform: scale(0.96);
          transform: scale(0.96);
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease; }

html.loaded .grow-in-on-load {
  opacity: 1;
  -webkit-transform: none;
          transform: none; }

.cc-window {
  z-index: 2000; }

.cc-window,
.cc-window.cc-banner {
  position: fixed;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 6px;
  border-radius: var(--radius-full);
  max-width: calc(var(--page-max-width) - 12px);
  padding: 10px;
  font-size: 13px;
  background: rgba(0, 0, 0, 0.8) !important;
  backdrop-filter: var(--surface-glass-filter);
  border: 1px solid var(--border-subtle);
  -webkit-transition: none;
  transition: none; }

.cc-window .cc-btn {
  border-radius: var(--radius-full);
  padding: 0.2em 0.6em;
  min-width: 100px !important; }

/****************************************************
 * SHARED STYLES
 ****************************************************/
button,
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  color: inherit; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-sans);
  line-height: 1.3em;
  font-weight: normal; }

h1, h2, h3, h4, h5, h6, ul, li {
  margin: 0;
  padding: 0; }

h1 {
  font-size: 23.8px;
  font-weight: 500; }

h2 {
  font-size: 23.8px;
  font-weight: 500; }

h3 {
  font-size: 18.2px;
  font-weight: 500; }

h4 {
  font-size: 14px;
  font-weight: 500; }

h5 {
  font-size: 14px;
  font-weight: 500; }

h6 {
  font-size: 14px;
  font-weight: 500; }

p {
  margin: 1em 0; }

a {
  color: var(--color-link);
  text-decoration: none;
  outline: 0; }
  a:hover {
    color: var(--color-link-hover); }
  a:focus {
    outline: 1px solid #226ede; }

p a,
table a {
  border-bottom: 1px solid var(--color-link); }

p a:hover,
table a:hover {
  border-bottom: 1px solid var(--color-link-hover); }

b {
  font-weight: 600; }

small {
  font-size: 0.8em; }

button {
  border: 0;
  background: transparent;
  cursor: pointer; }

.text-semi-bold {
  font-weight: 500; }

.reveal-viewport {
  width: 100%;
  height: 100%; }

/****************************************************
 * STANDARD LAYOUT
 ****************************************************/
.container .column {
  width: 100%;
  max-width: var(--page-max-width);
  margin: 0 auto;
  padding: 0 var(--page-padding); }
  @media screen and (max-width: 440px) {
    .container .column {
      padding: 0 10px; } }
  .container .column > section, .container .column > div > section {
    position: relative;
    width: 100%;
    margin: var(--section-margin) auto;
    border-radius: var(--section-radius);
    padding: var(--section-padding);
    border: var(--border-section-width) solid var(--border-section);
    background: var(--surface-section);
    -webkit-box-shadow: var(--shadow-section);
            box-shadow: var(--shadow-section); }
    .container .column > section h2, .container .column > div > section h2 {
      margin-bottom: 20px; }
    .container .column > section h3:first-child, .container .column > div > section h3:first-child {
      margin-top: 0; }
    .container .column > section .header-with-description h2, .container .column > div > section .header-with-description h2 {
      margin-bottom: 10px; }
    .container .column > section .header-with-description p, .container .column > div > section .header-with-description p {
      margin-top: 0;
      margin-bottom: 20px; }
    .container .column > section.critical-error, .container .column > div > section.critical-error {
      border-color: #f00;
      background: #eb5555;
      color: #fff; }
    @media screen and (max-width: 440px) {
      .container .column > section, .container .column > div > section {
        padding: calc(var(--section-padding) * 0.5);
        -webkit-box-shadow: none;
                box-shadow: none; }
        .container .column > section:first-child, .container .column > div > section:first-child {
          margin-top: 10px; } }

.has-page-nav .column > section,
.column > section.transparent,
.column > div > section.transparent {
  background: transparent;
  border-radius: 0;
  border-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
  padding: var(--page-padding); }

.has-page-nav .column > section {
  margin-left: 0; }

.has-page-nav .column > section + section {
  border-width: 0;
  border-top: 1px solid var(--border-section);
  padding-top: var(--section-padding); }

/****************************************************
 * NOTIFICATION MESSAGES INJECTED BY SERVER
 ****************************************************/
.flash-notification {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  text-align: center;
  z-index: 100;
  display: none; }
  .flash-notification p {
    display: inline-block;
    margin: 13px;
    padding: 10px 20px;
    background: #111;
    color: white;
    border: 1px solid #333;
    border-radius: 4px; }

.upgrade-promotion-notification {
  display: none; }

/****************************************************
 * FULL PAGE PRELOADER OVERLAY
 ****************************************************/
.page-loader {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 2000;
  background: #111;
  color: #fff;
  opacity: 1;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease; }
  .page-loader .page-loader-inner {
    position: absolute;
    display: block;
    top: 40%;
    width: 100%;
    text-align: center; }
    .page-loader .page-loader-inner .page-loader-spinner {
      display: block;
      position: relative;
      width: 50px;
      height: 50px;
      margin: 0 auto 20px auto;
      -webkit-animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal;
              animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal;
      background-color: #E4637C;
      border-radius: 1px; }
    .page-loader .page-loader-inner .page-loader-message {
      display: block;
      margin: 0;
      vertical-align: top;
      line-height: 32px;
      font-size: 14px;
      color: #bbb;
      font-family: Helvetica, sans-serif; }

.page-loader.visible {
  visibility: visible;
  opacity: 1; }

.page-loader.frozen .page-loader-spinner {
  -webkit-animation: none;
          animation: none; }

/****************************************************
 * PRO-BADGE
 ****************************************************/
.pro-badge {
  display: inline-block;
  position: relative;
  padding: 3px 5px;
  font-size: 10px;
  font-weight: 500;
  line-height: 12px;
  letter-spacing: 0.5px;
  border-radius: 4px;
  background: var(--surface-pro);
  color: var(--color-pro);
  vertical-align: middle; }
  .pro-badge:after {
    display: inline-block;
    margin-left: 2px;
    color: var(--color-pro);
    content: "\e094";
    font-family: 'slides';
    font-weight: normal;
    -webkit-font-smoothing: antialiased; }
  .pro-badge:hover {
    color: var(--color-pro);
    background: var(--surface-pro-hover); }

/****************************************************
 * TOUCH-SPECIFIC
 ****************************************************/
.touch .user-view li .controls {
  opacity: 1 !important; }
.touch .deck-view .options {
  opacity: 1; }

/****************************************************
 * HELP TOOLTIP
 ****************************************************/
.sl-info {
  --size: 1.3em;
  display: inline-block;
  font-size: calc(var(--size) * 0.45);
  width: var(--size);
  height: var(--size);
  line-height: var(--size);
  border-radius: var(--size);
  color: #fff;
  background-color: var(--surface-raised-strong);
  text-align: center;
  vertical-align: middle;
  -ms-flex-item-align: center;
      align-self: center; }

.sl-info:hover {
  background-color: var(--surface-hover-strongest); }

.sl-info-inline {
  margin-top: -0.2em; }

.sl-info:after {
  font-family: 'slides';
  content: '\e070'; }

.sl-info-help:after {
  font-family: Helvetica, sans-serif;
  content: '?'; }

/****************************************************
 * INTRO HEADER GROUP ON STATIC PAGES AND FORMS
 ****************************************************/
.marketing-intro {
  margin-top: 2em;
  margin-bottom: 1.5em; }

.marketing-intro h2,
.marketing-intro h3 {
  margin-top: 0 !important;
  margin-bottom: 0.1em;
  text-align: center; }

.marketing-intro h2 {
  font-size: 2em;
  font-weight: 500;
  color: #888; }

.marketing-intro h3 {
  font-size: 1.5em;
  color: #aaa; }

.marketing-intro .section-description {
  color: #888;
  padding: 0 40px; }

@media screen and (max-width: 600px) {
  .marketing-intro {
    margin-top: 20px; } }
/****************************************************
 * CURSORS
 ****************************************************/
html[data-active-cursor="move"] * {
  cursor: move !important; }

html[data-active-cursor="n-resize"] * {
  cursor: n-resize !important; }

html[data-active-cursor="ne-resize"] * {
  cursor: ne-resize !important; }

html[data-active-cursor="e-resize"] * {
  cursor: e-resize !important; }

html[data-active-cursor="se-resize"] * {
  cursor: se-resize !important; }

html[data-active-cursor="s-resize"] * {
  cursor: s-resize !important; }

html[data-active-cursor="sw-resize"] * {
  cursor: sw-resize !important; }

html[data-active-cursor="w-resize"] * {
  cursor: w-resize !important; }

html[data-active-cursor="nw-resize"] * {
  cursor: nw-resize !important; }

html[data-active-cursor="crosshair"] * {
  cursor: crosshair !important; }

/****************************************************
 * COUPON CODES
 ****************************************************/
.sl-coupon {
  position: relative;
  margin: 4em auto 0 auto;
  text-align: center;
  pointer-events: none; }
  .sl-coupon .sl-coupon-inner {
    display: inline-block;
    padding: 12px 20px;
    margin: 0;
    border-radius: 4px;
    text-align: left;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(0, 0, 0, 0.1);
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(0, 0, 0, 0.1); }
  .sl-coupon .sl-coupon-redeem-by {
    color: #888;
    margin-top: 4px; }
  .sl-coupon p {
    margin: 0;
    text-align: center; }

/****************************************************
 * Info icons
 ****************************************************/
.sl-info-icon {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 2em;
  height: 2em;
  font-size: 0.75em;
  color: var(--color-text-strong);
  background-color: var(--surface-hover);
  border-radius: 50%; }

.sl-info-icon:hover {
  background-color: var(--surface-hover-strong); }
/**
 * Base styles for dashboards that show a list of decks.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
.deck-dashboard {
  --dashboard-radius: var(--radius-4);
  --dashboard-gap: calc(var(--space-6));
  --dashboard-card-padding: var(--space-6);
  --dashboard-icon-button-width: var(--button-size-5);
  --dashboard-icon-button-height: var(--button-size-4);
  --dashboard-toolbar-height: calc(var(--button-size-7) + var(--space-1));
  --dashboard-toolbar-padding: calc(var(--space-4) + var(--space-1));
  --dashboard-section-padding: var(--page-padding);
  --dashboard-selection-button-size: var(--button-size-3); }

.deck-dashboard .main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin: 0 auto;
  width: 100%;
  height: calc(100% - var(--header-height));
  max-width: var(--page-max-width); }

.deck-dashboard.show-recent-signup-onboarding {
  opacity: 0;
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease; }

.deck-dashboard.loaded {
  opacity: 1; }

.deck-dashboard [data-layout="list"] .main {
  max-width: var(--page-max-width)-600; }

.deck-dashboard .content-wrapper {
  position: sticky;
  top: 0px;
  overflow: auto;
  -webkit-box-flex: 2;
      -ms-flex-positive: 2;
          flex-grow: 2;
  padding: var(--dashboard-section-padding) var(--dashboard-section-padding) 0 var(--dashboard-section-padding);
  scroll-padding: var(--dashboard-section-padding);
  background: var(--gradient-page); }

.deck-dashboard .content-wrapper-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: calc( var(--space-3) * -1 );
  margin-bottom: calc( var(--space-4) + var(--space-1) );
  color: var(--color-text-subtle);
  font-size: 12px; }

.deck-dashboard .layout-selector {
  margin-left: auto;
  color: currentColor;
  padding: 0;
  border: 0; }
  .deck-dashboard .layout-selector:hover {
    color: var(--color-text-strong); }

@media screen and (max-width: 540px) {
  .layout-selector {
    display: none; } }
.deck-dashboard.loading-filters .app-nav-section {
  display: none; }
.deck-dashboard.loading-filters .content-wrapper-header {
  visibility: hidden; }
.deck-dashboard.loading-filters .decks:not(.decks-skeleton) {
  display: none !important; }

.deck-dashboard .deck-tabs.hidden,
.deck-dashboard .sl-tags.hidden {
  display: none; }

.deck-dashboard .announcement {
  margin-bottom: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  background: var(--surface-glass);
  backdrop-filter: var(--surface-glass-filter);
  border: 1px solid var(--border-section);
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0; }
  .deck-dashboard .announcement h3,
  .deck-dashboard .announcement h4 {
    font-weight: 600;
    margin-bottom: 0.5em; }
  .deck-dashboard .announcement p {
    margin: 0.25em 0; }
  .deck-dashboard .announcement .button {
    margin-top: 1em; }
  .deck-dashboard .announcement .button + .button {
    margin-left: var(--space-5); }

.deck-dashboard .announcement + section {
  margin-top: 0;
  border-top-right-radius: 0;
  border-top-left-radius: 0; }

.deck-dashboard .deck-ghosts {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 100;
  margin-left: calc( var(--space-2) * -1 );
  margin-top: calc( var(--space-2) * -1 );
  display: grid;
  grid-gap: var(--space-2);
  grid-template-columns: repeat(4, 100px); }
.deck-dashboard .deck-ghost {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
  width: 100px;
  margin-right: -50px;
  border-radius: var(--radius-3);
  overflow: hidden;
  background-color: var(--surface-section);
  border: 1px solid var(--border-section);
  -webkit-box-shadow: var(--shadow-section);
          box-shadow: var(--shadow-section);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1); }
.deck-dashboard .deck-ghost-title {
  font-size: 6px;
  padding: var(--space-3) var(--space-2);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden; }
.deck-dashboard .deck-ghost-thumbnail {
  width: 100px;
  height: 100px;
  padding: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  border: 0;
  border-right: 1px solid var(--border-section);
  -webkit-box-sizing: content-box;
          box-sizing: content-box; }
.deck-dashboard .deck-ghost-thumbnail .deck-thumb:after {
  display: none; }
.deck-dashboard .deck-ghost-thumbnail .deck-thumb-image {
  width: 100px;
  height: 100px;
  -webkit-box-shadow: none;
          box-shadow: none;
  background-color: var(--surface-panel-alt);
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat; }
.deck-dashboard .deck-ghost-thumbnail .deck-preview,
.deck-dashboard .deck-ghost-thumbnail .deck-preview-controls {
  display: none; }
.deck-dashboard .deck-ghost-overflow {
  padding: var(--space-4);
  -ms-flex-item-align: end;
      align-self: flex-end;
  position: absolute;
  bottom: 0;
  right: 0;
  color: var(--color-text-muted);
  font-size: 14px; }
.deck-dashboard .dragging-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(var(--surface-canvas-rgb), 0.7);
  backdrop-filter: var(--surface-glass-filter);
  z-index: 9;
  display: none; }
.deck-dashboard .content-wrapper .dragging-overlay {
  position: fixed;
  left: auto; }
.deck-dashboard.dragging-deck {
  cursor: -webkit-grabbing;
  cursor: grabbing; }
.deck-dashboard.dragging-deck .dragging-overlay {
  display: block; }
.deck-dashboard.dragging-deck .sl-tags-list .sl-tags-tag:not(.selected) {
  background-color: var(--surface-section); }
.deck-dashboard.dragging-deck .sl-tags-list .sl-tags-tag {
  border-radius: 0; }
.deck-dashboard.dragging-deck .sl-tags-list {
  z-index: 20; }
.deck-dashboard.dragging-deck .sl-tags-list .sl-tags-tag:hover {
  outline: 3px solid var(--color-accent) !important;
  z-index: 20; }
.deck-dashboard.dragging-deck .sl-tags-list .sl-tags-tag .tag-options {
  display: none; }

.deck-dashboard .selection-toolbar {
  position: fixed;
  left: var(--app-nav-width);
  right: 0;
  z-index: 9;
  top: 100%;
  -webkit-transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transform: translateY(20px);
          transform: translateY(20px);
  font-size: 14px;
  visibility: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  .deck-dashboard .selection-toolbar.visible {
    -webkit-transform: translateY(calc( ( var(--dashboard-toolbar-height) * -1 ) - var(--dashboard-gap) ));
            transform: translateY(calc( ( var(--dashboard-toolbar-height) * -1 ) - var(--dashboard-gap) ));
    visibility: visible; }
  .deck-dashboard .selection-toolbar .inner {
    width: 100%;
    max-width: 700px;
    height: var(--dashboard-toolbar-height);
    margin: 0 auto;
    padding: var(--dashboard-toolbar-padding);
    color: var(--color-text-inverse);
    background: var(--surface-inverse);
    border: 1px solid rgba(var(--surface-inverse-rgb), 0.12);
    border-radius: var(--radius-3);
    -webkit-box-shadow: var(--shadow-section);
            box-shadow: var(--shadow-section);
    overflow: hidden; }
    .deck-dashboard .selection-toolbar .inner .description {
      float: left;
      margin: 0;
      font-size: 1em;
      cursor: default;
      line-height: calc( var(--dashboard-toolbar-height) - ( var(--dashboard-toolbar-padding) * 2 ) ); }
    .deck-dashboard .selection-toolbar .inner .button {
      float: right;
      font-size: 1em;
      margin-left: var(--space-5); }

.deck-dashboard .sidebar-upgrade-button {
  background: var(--color-accent);
  color: var(--color-text-inverse);
  padding: var(--space-5) var(--space-6);
  border-radius: var(--dashboard-radius); }
.deck-dashboard .sidebar-upgrade-button:hover {
  background: var(--color-link-hover); }
.deck-dashboard .user-info {
  font-size: 13px; }
  .deck-dashboard .user-info .title .username {
    color: var(--color-text-strong); }
  .deck-dashboard .user-info .description {
    color: var(--color-text-muted); }
  .deck-dashboard .user-info .picture {
    float: right;
    margin: 0 0 var(--space-5) var(--space-5);
    width: 6em;
    height: 6em;
    border: 2px solid var(--surface-section);
    border-radius: var(--dashboard-radius);
    background-color: var(--surface-panel); }
  .deck-dashboard .user-info .edit {
    display: none;
    background: var(--surface-section);
    color: var(--color-text-muted); }
  .deck-dashboard .user-info .edit:hover {
    color: var(--color-text-strong); }
  .deck-dashboard .user-info .links {
    margin-bottom: 0; }
.deck-dashboard .user-info:hover .edit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
.deck-dashboard .deck-placeholder {
  text-align: center;
  color: var(--color-text-muted);
  grid-column: 1 / -1; }
  .deck-dashboard .deck-placeholder > p {
    padding: calc( var(--space-8) * 3 + var(--space-6) + var(--space-2) ) 0; }
  .deck-dashboard .deck-placeholder .retry {
    margin-left: var(--space-5); }
  .deck-dashboard .deck-placeholder .spinner {
    margin-top: calc( var(--space-8) * 3 + var(--space-6) + var(--space-2) ); }
  .deck-dashboard .deck-placeholder.fade-in {
    opacity: 0;
    -webkit-animation: fade-in 0.3s 0.1s ease forwards;
            animation: fade-in 0.3s 0.1s ease forwards; }
.deck-dashboard .decks.loading[data-tab-id="shared"],
.deck-dashboard .decks.loading[data-tab-id="trash"] {
  grid-template-columns: auto; }
.deck-dashboard .showing-onboarding {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center; }
.deck-dashboard .decks-skeleton {
  opacity: 0.5; }
.deck-dashboard .deck-skeleton {
  pointer-events: none; }
.deck-dashboard .deck-skeleton .sl-deck-thumbnail {
  margin-bottom: calc( ( var(--space-8) * 3 ) + var(--space-5) + var(--space-2) + var(--space-1) ); }
.deck-dashboard .decks {
  display: none;
  grid-gap: var(--dashboard-gap);
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.deck-dashboard .decks.visible {
  display: grid; }
.deck-dashboard .flash {
  -webkit-animation: flash-opacity 0.3s 1 ease;
          animation: flash-opacity 0.3s 1 ease; }
.deck-dashboard .decks.visible[data-placeholder]:empty {
  display: block; }
.deck-dashboard .decks[data-placeholder]:empty:after {
  content: attr(data-placeholder);
  display: block;
  padding: calc( var(--space-8) * 3 + var(--space-6) + var(--space-2) ) 0;
  color: var(--color-text-subtle);
  text-align: center; }
.deck-dashboard .deck.recovered {
  opacity: 0;
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
  -webkit-transition: none;
  transition: none; }
.deck-dashboard .deck.recovered-visible {
  opacity: 1;
  -webkit-transform: none;
          transform: none;
  -webkit-transition: all 0.5s cubic-bezier(0.3, 0.9, 0.135, 1) 0.3s;
  transition: all 0.5s cubic-bezier(0.3, 0.9, 0.135, 1) 0.3s; }
.deck-dashboard .deck {
  --border-width: 1px;
  --border-color: var(--surface-hover-subtle);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
  min-height: calc( 250px + ( var(--dashboard-card-padding) * 2 ) );
  max-width: 400px;
  font-size: 14px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
  vertical-align: top;
  border-radius: var(--dashboard-radius);
  background-color: var(--surface-panel-alt);
  color: var(--color-text);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .deck-dashboard .deck:last-child {
    margin-bottom: 0; }
.deck-dashboard .deck:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  -webkit-box-shadow: 0 0 0 var(--border-width) var(--border-color) inset;
          box-shadow: 0 0 0 var(--border-width) var(--border-color) inset;
  border-radius: var(--dashboard-radius);
  z-index: 4;
  pointer-events: none; }
@media (hover: hover) {
  .deck-dashboard .deck.hover,
  .deck-dashboard .deck:hover:not(.trash) {
    --border-width: 2px;
    --border-color: var(--border-strongest); } }
.deck-dashboard .presentations {
  padding-bottom: var(--dashboard-section-padding); }
.deck-dashboard .presentations.selecting-multiple .deck:not(.selected):after {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  content: '';
  display: block;
  background: rgba(var(--surface-canvas-rgb), 0.78);
  opacity: 0.75;
  z-index: 8; }
.deck-dashboard .presentations.selecting-multiple .deck:not(.selected) .deck-controls {
  opacity: 0; }
.deck-dashboard .presentations.selecting-multiple .deck:not(.selected) > * {
  pointer-events: none; }
.deck-dashboard .presentations.selecting-multiple .deck-title,
.deck-dashboard .presentations.selecting-multiple .deck-description,
.deck-dashboard .presentations.selecting-multiple .deck-metadata {
  pointer-events: none; }
.deck-dashboard .deck.selected {
  --border-width: 2px;
  --border-color: var(--color-accent) !important; }
.deck-dashboard .deck.trash {
  cursor: default; }
.deck-dashboard .deck.hidden-via-tag,
.deck-dashboard .deck.hidden-via-search {
  display: none !important; }
.deck-dashboard .decks .deck-link {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
.deck-dashboard .decks .sl-deck-thumbnail {
  width: 100%;
  max-width: 100%;
  min-height: 250px;
  padding-bottom: 0;
  border-top-left-radius: var(--radius-3);
  border-top-right-radius: var(--radius-3);
  border-bottom: 1px solid var(--border-section);
  overflow: hidden;
  z-index: 2; }
.deck-dashboard .decks .sl-deck-thumbnail .deck-thumb {
  aspect-ratio: 1 / 1; }
.deck-dashboard .deck .highlight {
  background-color: var(--status-warning-surface); }
.deck-dashboard .deck .deck-title {
  font-size: 1.1em;
  font-weight: 500;
  margin: var(--dashboard-card-padding) 0 0 0;
  padding: 0 var(--dashboard-card-padding);
  color: var(--color-text-strong); }
.deck-dashboard .deck-title-value {
  overflow-wrap: break-word; }
.deck-dashboard .deck-description {
  display: none;
  margin-top: 0;
  margin-bottom: var(--space-4);
  padding: 0 var(--dashboard-card-padding);
  word-wrap: break-word;
  font-size: 0.928571429em;
  color: var(--color-text-muted); }
.deck-dashboard .is-interactive {
  position: relative;
  z-index: 3; }
.deck-dashboard .deck-private-indicator {
  display: none;
  position: absolute;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  top: 8px;
  left: 8px;
  width: var(--dashboard-icon-button-width);
  height: var(--dashboard-icon-button-height); }
.deck-dashboard .deck[data-visibility="self"] .deck-private-indicator {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
.deck-dashboard .deck-owner {
  display: block;
  position: absolute;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  top: 6px;
  left: 6px;
  border: 2px solid var(--surface-section);
  background-color: var(--surface-section);
  overflow: hidden;
  -webkit-box-shadow: 0 0 0 1px var(--border-section);
          box-shadow: 0 0 0 1px var(--border-section); }
.deck-dashboard .deck-owner-avatar {
  width: 100%;
  height: 100%; }
  .deck-dashboard .deck-owner-avatar img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%; }
.deck-dashboard [data-layout="list"] .decks.visible {
  display: block; }
.deck-dashboard [data-layout="list"] .deck {
  display: block;
  max-width: none;
  min-height: calc( 150px + ( var(--dashboard-card-padding) * 2 ) );
  margin-bottom: var(--dashboard-gap);
  padding: var(--dashboard-card-padding); }
.deck-dashboard [data-layout="list"] .deck-skeleton {
  height: calc( 150px + ( var(--dashboard-card-padding) * 2 ) ); }
.deck-dashboard [data-layout="list"] .deck-title {
  margin-top: 0;
  margin-bottom: var(--space-4); }
.deck-dashboard [data-layout="list"] .deck-title,
.deck-dashboard [data-layout="list"] .deck-description {
  padding-left: 0; }
.deck-dashboard [data-layout="list"] .deck-metadata {
  padding: 0; }
.deck-dashboard [data-layout="list"] .deck-description {
  display: block; }
.deck-dashboard [data-layout="list"] .deck-controls {
  position: absolute;
  right: 0;
  bottom: 0;
  max-width: 400px; }
.deck-dashboard [data-layout="list"] .sl-deck-thumbnail {
  width: 150px;
  height: 150px;
  min-height: 0;
  float: left;
  margin: 0 var(--dashboard-card-padding) var(--space-5) 0;
  border: 0; }
.deck-dashboard [data-layout="list"] .sl-deck-thumbnail:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  -webkit-box-shadow: 0 0 0 1px var(--border-section) inset;
          box-shadow: 0 0 0 1px var(--border-section) inset; }
@media screen and (max-width: 540px) {
  .deck-dashboard [data-layout="list"] .deck {
    min-height: calc( 80px + ( var(--dashboard-card-padding) * 4 ) );
    padding-bottom: calc( var(--dashboard-card-padding) * 4 );
    font-size: 12px; }
  .deck-dashboard [data-layout="list"] .deck-skeleton {
    height: calc( 80px + ( var(--dashboard-card-padding) * 2 ) ); }
  .deck-dashboard [data-layout="list"] .deck-controls {
    margin-bottom: calc( var(--dashboard-card-padding) * 0.5 ); }
  .deck-dashboard [data-layout="list"] .sl-deck-thumbnail {
    width: 80px;
    height: 80px; } }
.deck-dashboard .deck-metadata {
  color: var(--color-text-muted);
  font-size: 11px;
  margin: var(--space-2) 0;
  padding: 0 var(--dashboard-card-padding); }
.deck-dashboard .deck-metadata-item {
  display: inline-block;
  padding: var(--space-2) 0;
  margin-right: var(--space-5);
  line-height: 1.6; }
  .deck-dashboard .deck-metadata-item .icon {
    margin-right: var(--space-2);
    font-size: 0.9em; }
  .deck-dashboard .deck-metadata-item.no-text .icon {
    margin-right: 0; }
.deck-dashboard .deck-metadata-item:last-child {
  margin-right: 0; }
.deck-dashboard .deck-metadata-item-link {
  color: var(--color-text);
  padding: var(--space-2) var(--space-4); }
  .deck-dashboard .deck-metadata-item-link:hover {
    background-color: var(--surface-hover); }
.deck-dashboard .untag {
  display: none;
  position: absolute;
  top: var(--space-5);
  left: var(--space-5);
  width: var(--dashboard-selection-button-size);
  height: var(--dashboard-selection-button-size);
  border-radius: var(--radius-full);
  line-height: calc( var(--dashboard-selection-button-size) - var(--space-2) );
  font-size: calc( var(--dashboard-selection-button-size) / 2 );
  background: var(--surface-section);
  border: 1px solid var(--border-section);
  -webkit-box-shadow: var(--shadow-section);
          box-shadow: var(--shadow-section);
  padding: 0;
  text-align: center; }
  .deck-dashboard .untag:hover {
    border-color: var(--border-strong); }
.deck-dashboard .filtered-by-tag .deck:hover .untag {
  display: block; }
.deck-dashboard .deck-controls {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 0 var(--dashboard-card-padding);
  margin-bottom: var(--space-5);
  margin-top: auto;
  pointer-events: none; }
  .deck-dashboard .deck-controls .button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    width: var(--dashboard-icon-button-width);
    height: var(--dashboard-icon-button-height);
    padding: 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border-color: var(--border-section);
    -webkit-transition: none !important;
    transition: none !important;
    pointer-events: auto; }
    .deck-dashboard .deck-controls .button:focus {
      z-index: 2; }
    .deck-dashboard .deck-controls .button.focus, .deck-dashboard .deck-controls .button:hover {
      border-color: var(--border-strong); }
.deck-dashboard .deck-controls .share {
  display: inline-block; }
.deck-dashboard .secondary {
  opacity: 0;
  visibility: hidden; }
.deck-dashboard .deck:hover .secondary,
.deck-dashboard .deck.hover .secondary,
.deck-dashboard .presentations:not(.selecting-multiple) .deck.selected .secondary {
  opacity: 1;
  visibility: visible; }
.deck-dashboard .deck.is-owner:not(.trash) .deck-title-value,
.deck-dashboard .deck.is-owner:not(.trash) .deck-description-value {
  cursor: text; }
.deck-dashboard .deck.is-owner .deck-description-value:empty:before {
  content: 'Add description';
  color: var(--color-text-subtle); }
.deck-dashboard .deck.is-selectable {
  cursor: default; }
.deck-dashboard .decks[data-tab-id="shared"] .deck .deck-link,
.deck-dashboard .decks[data-tab-id="personal"] .deck:not(.is-owner) .deck-link {
  display: block; }
@media screen and (max-width: 940px) {
  .deck-dashboard body {
    height: auto !important;
    overflow: auto !important; }
  .deck-dashboard .main {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
  .deck-dashboard .content-wrapper {
    height: auto; }
  .deck-dashboard .column {
    padding: 0; }
  .deck-dashboard .column > section {
    padding: var(--dashboard-card-padding);
    margin-top: 0;
    -webkit-box-shadow: none;
            box-shadow: none; }
  .deck-dashboard .user-info .edit {
    display: none; }
  .deck-dashboard .deck,
  .deck-dashboard .deck.is-owner {
    cursor: pointer; }
  .deck-dashboard .deck-title,
  .deck-dashboard .deck-description {
    pointer-events: none;
    padding-right: 0; }
  .deck-dashboard .secondary {
    opacity: 1; }
  .deck-dashboard .selection-toolbar,
  .deck-dashboard .selection-checkbox,
  .deck-dashboard .untag {
    display: none !important; } }
.deck-dashboard[data-account=default] .deck:not([data-visibility="self"]) .deck-controls .visibility {
  display: none; }
.deck-dashboard.touch .secondary, .deck-dashboard.touch .selection-checkbox {
  opacity: 1 !important;
  visibility: visible; }

.deck-dashboard:not(.has-tags) .deck-controls .tag {
  display: none !important; }
/**
 * The abstract and basic styles for a page intended
 * for presenting a deck with controls.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.decks.present-base {
  --present-controls-width: 400px;
  --present-controls-padding: var(--page-padding);
  --present-controls-padding-mobile: var(--space-5);
  --present-controls-section-gap: var(--space-8);
  --present-controls-button-gap: var(--space-4);
  --present-controls-footer-button-size: calc( var(--button-size-8) + var(--space-2) );
  --present-controls-footer-button-basis: calc( var(--button-size-8) + var(--space-2) );
  --present-offline-offset: var(--space-4);
  --present-offline-padding-y: var(--space-3);
  --present-offline-padding-x: var(--space-4);
  --present-offline-radius: var(--radius-3);
  --present-offline-surface: var(--surface-glass);
  --present-offline-color: var(--color-overlay);
  --present-panel-surface: var(--surface-canvas);
  --present-panel-color: var(--color-overlay);
  --present-panel-border: var(--border-overlay);
  --present-panel-divider: var(--border-overlay-divider);
  --present-panel-shadow: 0 0 0 1px var(--present-panel-border), 0 24px 50px var(--surface-inset-stronger);
  --present-dimmer-start: var(--surface-inset-stronger);
  --present-dimmer-end: var(--surface-inset-1);
  width: 100%;
  height: 100%; }
  html.decks.present-base.ua-standalone.ua-safari {
    height: 100vh; }
  html.decks.present-base body {
    width: 100%;
    height: 100%;
    background: var(--surface-canvas);
    color: var(--color-page);
    overflow: hidden; }
  html.decks.present-base:not(.presentation-started-transition-ended) body {
    -webkit-perspective: 1200px;
            perspective: 1200px;
    -webkit-perspective-origin: 100% 50%;
            perspective-origin: 100% 50%; }
  html.decks.present-base .reveal-viewport {
    overflow: hidden;
    -webkit-transform: translateX(-50px) scale(0.9) rotateY(-6deg);
            transform: translateX(-50px) scale(0.9) rotateY(-6deg);
    -webkit-transform-origin: 100% 50%;
            transform-origin: 100% 50%;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease; }
  html.decks.present-base .reveal .dimmer {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    pointer-events: none;
    z-index: 100;
    background: -webkit-gradient(linear, left top, right top, from(var(--present-dimmer-start)), to(var(--present-dimmer-end)));
    background: linear-gradient(to right, var(--present-dimmer-start) 0%, var(--present-dimmer-end) 100%);
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease; }
  html.decks.present-base .reveal .controls,
  html.decks.present-base .reveal .progress {
    position: absolute; }

.present-base .sl-present-offline {
  position: absolute;
  top: var(--present-offline-offset);
  right: var(--present-offline-offset);
  font-size: 20px;
  padding: var(--present-offline-padding-y) var(--present-offline-padding-x);
  line-height: 1;
  background: var(--present-offline-surface);
  backdrop-filter: var(--surface-glass-filter);
  border: 1px solid var(--present-panel-border);
  color: var(--present-offline-color);
  border-radius: var(--present-offline-radius);
  z-index: 9; }

html.decks.present-base .sl-present-controls {
  position: absolute;
  width: var(--present-controls-width);
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
  background: var(--present-panel-surface);
  color: var(--present-panel-color);
  border-right: 1px solid var(--present-panel-border);
  -webkit-box-shadow: var(--present-panel-shadow);
          box-shadow: var(--present-panel-shadow);
  font-size: 14px;
  -webkit-transform-origin: 0% 50%;
          transform-origin: 0% 50%;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease; }
  html.decks.present-base .sl-present-controls h2 {
    font-size: 1.5em; }
  html.decks.present-base .sl-present-controls .description {
    margin: 0.5em 0 1em 0;
    line-height: 1.4em; }
html.decks.present-base .sl-present-controls-content {
  position: relative;
  height: 100%;
  padding: var(--present-controls-padding);
  padding-top: calc( var(--present-controls-padding) * 1.5 );
  overflow: auto;
  -webkit-overflow-scrolling: touch; }
html.decks.present-base .sl-present-controls-section {
  display: block;
  margin: 0;
  margin-top: var(--present-controls-section-gap);
  vertical-align: top; }
  html.decks.present-base .sl-present-controls-section h2 {
    font-size: 1em;
    font-weight: 500; }
  html.decks.present-base .sl-present-controls-section p {
    margin: 0.5em 0 1em 0;
    line-height: 1.4em;
    color: var(--color-text-secondary); }
  html.decks.present-base .sl-present-controls-section input[type="text"] {
    width: 100%;
    padding: 0 var(--space-4);
    background: var(--surface-panel);
    color: var(--color-text);
    border: 1px solid var(--border-default); }
  html.decks.present-base .sl-present-controls-section .button-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--present-controls-button-gap); }
  html.decks.present-base .sl-present-controls-section .sl-checkbox {
    margin: calc( var(--space-5) - var(--space-1) ) 0; }
html.decks.present-base .sl-present-controls-footer {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  bottom: 0;
  padding: var(--present-controls-padding);
  background: var(--present-panel-surface);
  border-top: 1px solid var(--present-panel-divider); }
  html.decks.present-base .sl-present-controls-footer .button {
    height: var(--present-controls-footer-button-size);
    line-height: var(--present-controls-footer-button-size);
    padding: 0 1em;
    text-align: center;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -ms-flex-preferred-size: var(--present-controls-footer-button-basis);
        flex-basis: var(--present-controls-footer-button-basis); }
  html.decks.present-base .sl-present-controls-footer .button .icon {
    font-size: 18px; }
  html.decks.present-base .sl-present-controls-footer .button + .button {
    margin-left: var(--present-controls-button-gap); }
  html.decks.present-base .sl-present-controls-footer .start-presentation {
    -webkit-box-flex: 2;
        -ms-flex-positive: 2;
            flex-grow: 2;
    -ms-flex-preferred-size: auto;
        flex-basis: auto; }
@media screen and (max-width: 500px) {
  html.decks.present-base .sl-present-controls {
    width: 100%;
    font-size: 14px; }
  html.decks.present-base .sl-present-controls-section {
    margin-top: var(--present-controls-section-gap); }
  html.decks.present-base .sl-present-controls-footer {
    padding: var(--present-controls-padding-mobile); }
    html.decks.present-base .sl-present-controls-footer button {
      height: calc( var(--button-size-7) + var(--space-2) );
      line-height: calc( var(--button-size-7) + var(--space-2) ); }
  html.decks.present-base .sl-present-toolbar {
    display: none; } }

html.decks.present-base .made-with-slides {
  visibility: hidden; }

html.decks.present-base.presentation-started .reveal-viewport {
  -webkit-transform: none;
          transform: none; }
html.decks.present-base.presentation-started .reveal .dimmer {
  opacity: 0;
  visibility: hidden; }
html.decks.present-base.presentation-started .sl-present-controls {
  visibility: hidden;
  -webkit-transform: translateX(calc( var(--present-controls-width) * -1.2 ));
          transform: translateX(calc( var(--present-controls-width) * -1.2 )); }
html.decks.present-base.presentation-started .made-with-slides {
  visibility: visible; }

.sl-root.present-base.presentation-started body[data-cursor="live-pointer"] .reveal .controls *,
.sl-root.present-base.presentation-started body[data-cursor="live-pointer"] .sl-present-toolbar * {
  cursor: none !important; }
/**
 * Rendered instead of the editor when the users is
 * Free but trying to edit a private deck.
 */
.access-requires-upgrade-message {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 600px;
  margin: 10vh auto !important; }
  .access-requires-upgrade-message .col-icon {
    padding-right: 1rem;
    margin-right: 1rem; }
  .access-requires-upgrade-message .lock-icon {
    font-size: 70px;
    margin-bottom: 2rem;
    color: #e5e5e5; }
  .access-requires-upgrade-message .buttons {
    margin-top: 1.5rem; }
  .access-requires-upgrade-message .button {
    margin: 10px 10px 0 0; }

@media screen and (max-width: 600px) {
  .access-requires-upgrade-message {
    margin: 1rem auto !important; }
    .access-requires-upgrade-message .col-icon {
      display: none; } }
/**
 * Deck embed page styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.decks.embed {
  height: 100%; }
  html.decks.embed .reveal .controls,
  html.decks.embed .reveal .progress,
  html.decks.embed .reveal .playback,
  html.decks.embed .reveal .slide-number {
    position: absolute; }
  html.decks.embed .embed-footer {
    position: fixed;
    width: 100%;
    height: 34px;
    left: 0;
    bottom: 0;
    z-index: 10;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    opacity: 0;
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease; }
  html.decks.embed.loaded .embed-footer {
    opacity: 1; }
  html.decks.embed .embed-footer-promotion,
  html.decks.embed .embed-footer-button {
    display: inline-block;
    height: 34px;
    line-height: 34px;
    padding: 0 12px;
    font-size: 16px;
    vertical-align: top;
    color: #fff; }
    html.decks.embed .embed-footer-promotion:hover,
    html.decks.embed .embed-footer-button:hover {
      opacity: 1;
      background: #000; }
    html.decks.embed .embed-footer-promotion:focus,
    html.decks.embed .embed-footer-button:focus {
      outline: 0; }
  html.decks.embed .embed-footer-promotion {
    font-size: 14px; }
  html.decks.embed .embed-footer-promotion .label {
    vertical-align: 0px; }
  html.decks.embed .embed-footer-promotion .logo {
    margin-right: 6px;
    vertical-align: -7px; }
  html.decks.embed .embed-footer-buttons {
    position: absolute;
    right: 0;
    top: 0; }
  html.decks.embed[data-embed-style="light"] .embed-footer {
    background: #f5f5f5; }
    html.decks.embed[data-embed-style="light"] .embed-footer .embed-footer-promotion,
    html.decks.embed[data-embed-style="light"] .embed-footer .embed-footer-button {
      color: #222; }
      html.decks.embed[data-embed-style="light"] .embed-footer .embed-footer-promotion:hover,
      html.decks.embed[data-embed-style="light"] .embed-footer .embed-footer-button:hover {
        opacity: 1;
        color: #000;
        background: #fff; }
  html.decks.embed[data-embed-style="hidden"] .embed-footer {
    display: none; }
  html.decks.embed[data-embed-byline="hidden"] .embed-footer-promotion {
    display: none; }
  html.decks.embed[data-embed-share="hidden"] .embed-footer-share {
    display: none; }

html.decks[data-embed-style="transparent"],
html.decks[data-embed-style="transparent"] body,
html.decks[data-embed-style="transparent"] .reveal-viewport {
  background: transparent; }
html.decks[data-embed-style="transparent"] .embed-footer {
  display: none; }

@media screen and (max-width: 520px) {
  html.decks.embed.supports-fullscreen .embed-footer-share {
    display: none; } }
html.decks.embed .reveal {
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  opacity: 0; }

html.decks.embed.fonts-are-ready .reveal {
  opacity: 1; }

html.decks.embed:-webkit-full-screen .embed-footer {
  display: none; }

html.decks.embed:-moz-full-screen .embed-footer {
  display: none; }

html.decks.embed:-ms-fullscreen .embed-footer {
  display: none; }

html.decks.embed:full-screen .embed-footer {
  display: none; }
/**
 * Fullscreen deck views.
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.decks.print,
html.decks.export,
html.decks.fullscreen {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  html.decks.print.ua-standalone.ua-safari,
  html.decks.export.ua-standalone.ua-safari,
  html.decks.fullscreen.ua-standalone.ua-safari {
    height: 100vh; }

@media all and (display-mode: standalone) {
  html.decks.fullscreen {
    height: 100vh; } }
html.decks.scroll .global-header {
  scroll-snap-align: start;
  position: absolute; }

html.decks.scroll .reveal-viewport {
  min-height: 100vh;
  min-height: 100svh; }

/**
 * A "Made with Slides" watermark that appears on all fullscreen
 * style deck pages (live streams, kiosk mode).
 */
html.decks.live .made-with-slides,
html.decks.kiosk .made-with-slides,
html.decks.scroll .made-with-slides,
html.decks.fullscreen .made-with-slides {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
  color: #000;
  padding-left: 42px;
  background-image: url(//staging.slides.com/logo/slides-symbol-flat-a1a1a1-512x512.png);
  background-size: 32px;
  background-position: top left;
  background-repeat: no-repeat;
  background-color: #f2f3f9;
  opacity: 0.8;
  z-index: 1; }
  html.decks.live .made-with-slides:hover,
  html.decks.kiosk .made-with-slides:hover,
  html.decks.scroll .made-with-slides:hover,
  html.decks.fullscreen .made-with-slides:hover {
    opacity: 1;
    background-image: url(//staging.slides.com/logo/slides-symbol-flat-128x128.png); }
  @media screen and (max-width: 400px) {
    html.decks.live .made-with-slides,
    html.decks.kiosk .made-with-slides,
    html.decks.scroll .made-with-slides,
    html.decks.fullscreen .made-with-slides {
      width: 32px;
      height: 32px;
      padding: 0;
      overflow: hidden;
      color: transparent; } }

html.decks.scroll .made-with-slides {
  position: fixed; }

html.decks.auto-slide-controls-visible.live .made-with-slides,
html.decks.auto-slide-controls-visible.kiosk .made-with-slides,
html.decks.auto-slide-controls-visible.fullscreen .made-with-slides {
  left: 80px;
  bottom: 30px; }

html.decks.summary-bubble-visible.live .made-with-slides,
html.decks.summary-bubble-visible.kiosk .made-with-slides,
html.decks.summary-bubble-visible.fullscreen .made-with-slides {
  left: 90px;
  bottom: 34px; }

/* Disabled to improve FCP time
// Don't show reveal.js content until fonts have loaded
html.decks.fullscreen .reveal {
	transition: opacity 0.3s ease;
	opacity: 0;
}
html.decks.fullscreen.fonts-are-ready .reveal {
	opacity: 1;
}
*/
/**
 * The client version of the deck /live view.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.decks.live-client.ua-standalone.ua-safari {
  height: 100vh; }
html.decks.live-client .reveal .controls,
html.decks.live-client .reveal .progress {
  position: absolute; }
html.decks.live-client .reveal .pause-overlay .resume-button {
  display: none; }
html.decks.live-client .summary-bubble {
  display: block;
  position: absolute;
  height: 58px;
  width: 58px;
  left: 20px;
  bottom: 20px;
  padding: 4px;
  text-align: center;
  z-index: 2;
  background: #fff;
  -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
          box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
  border-radius: 50px;
  text-align: left;
  cursor: default;
  color: #222;
  white-space: nowrap;
  overflow: hidden;
  font-size: 15px;
  -webkit-transition: width 0.2s ease;
  transition: width 0.2s ease; }
  html.decks.live-client .summary-bubble .summary-bubble-picture {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    float: left;
    background-size: cover;
    background-color: #ddd; }
  html.decks.live-client .summary-bubble .summary-bubble-content {
    display: inline-block;
    position: relative;
    top: 4px;
    padding-right: 20px;
    vertical-align: top;
    text-indent: 10px; }
    html.decks.live-client .summary-bubble .summary-bubble-content h4, html.decks.live-client .summary-bubble .summary-bubble-content p, html.decks.live-client .summary-bubble .summary-bubble-content a {
      display: block;
      margin: 0;
      max-width: 350px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      line-height: 1.3;
      font-size: 1em; }
    html.decks.live-client .summary-bubble .summary-bubble-content a {
      color: inherit; }
    html.decks.live-client .summary-bubble .summary-bubble-content a:hover {
      text-decoration: underline; }
    html.decks.live-client .summary-bubble .summary-bubble-content h4 {
      font-weight: bold; }
html.decks.live-client .summary-bubble.hidden {
  display: none; }
html.decks.live-client .sl-start-screen {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: none;
  z-index: 2001;
  background: #fff;
  color: #222;
  line-height: 1.4; }
  html.decks.live-client .sl-start-screen.visible {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
html.decks.live-client .sl-start-screen-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: auto;
  padding: 2rem; }
html.decks.live-client .sl-start-screen-media {
  -webkit-box-shadow: inset 0 0 0px 1px rgba(0, 0, 0, 0.1);
          box-shadow: inset 0 0 0px 1px rgba(0, 0, 0, 0.1);
  margin: 1em 1.5em 1em 0;
  border-radius: 2px;
  overflow: hidden; }
html.decks.live-client .sl-start-screen .deck-image {
  width: 250px;
  height: 250px;
  background-color: #eee;
  display: block;
  z-index: -1;
  position: relative; }
html.decks.live-client .sl-start-screen-text {
  width: 100%;
  max-width: 380px; }
html.decks.live-client .sl-start-screen .deck-title {
  margin-bottom: 0.5rem; }
html.decks.live-client .sl-start-screen .deck-author {
  margin-top: 0.5rem;
  position: relative;
  opacity: 1; }
html.decks.live-client .sl-start-screen .deck-author-picture {
  display: inline-block;
  position: relative;
  width: 1.25em;
  height: 1.25em;
  margin-right: 5px;
  vertical-align: top;
  background-size: cover;
  background-repeat: no-repeat; }
html.decks.live-client .sl-start-screen .instructions {
  color: #666; }
html.decks.live-client .sl-start-screen .button .icon {
  margin-left: 0.5rem;
  margin-right: -0.2em;
  vertical-align: top; }
/**
 * The client version of the deck /live view.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.decks.live-server .sl-present-controls .edit-button-back {
  -ms-flex-preferred-size: 30%;
      flex-basis: 30%;
  padding-left: var(--space-3); }
  html.decks.live-server .sl-present-controls .edit-button-back .icon {
    margin-right: var(--space-1);
    vertical-align: middle; }

html.decks.live-server .live-view-make-private {
  display: block;
  margin-top: var(--space-5); }

html.decks.live-server .live-share .unit {
  margin: 0; }

html.decks.live-server .sl-present-annotation-toolbar {
  font-size: 14px; }
/**
 * Styles applied to an offline presentation that has
 * been exported via ZIP download or Dropbox sync.
 */
/*
html.decks.offline .reveal {
	transition: opacity 0.3s ease;
	opacity: 0;
}
html.decks.offline.fonts-are-ready .reveal {
	opacity: 1;
}
*/
html.decks.offline,
html.decks.offline body {
  height: 100%; }

@media all and (display-mode: standalone) {
  html.decks.offline {
    height: 100vh; } }
/**
 * Rendered before a deck if the deck is password
 * protected.
 */
html.decks.password {
  background: #272d2e;
  color: #fff;
  height: 100%; }

html.decks.password body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%; }

html.decks.password .password-content {
  margin: auto;
  padding: 10px 10px 100px 10px;
  text-align: center;
  color: #fff; }
  html.decks.password .password-content .password-icon {
    position: relative;
    height: 150px;
    width: 150px;
    margin: 0 auto 40px auto; }
    html.decks.password .password-content .password-icon.wobble {
      -webkit-animation: wobble 0.8s linear;
              animation: wobble 0.8s linear; }
    html.decks.password .password-content .password-icon .icon {
      font-size: 90px;
      width: 150px;
      height: 150px;
      line-height: 150px;
      border-radius: 75px;
      background: #B85656;
      color: #272d2e; }
    html.decks.password .password-content .password-icon .password-icon-check .icon {
      color: rgba(255, 255, 255, 0.7);
      background-color: #40cb90;
      font-size: 70px; }
    html.decks.password .password-content .password-icon .password-icon-lock,
    html.decks.password .password-content .password-icon .password-icon-check {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      text-align: center;
      -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
    html.decks.password .password-content .password-icon .password-icon-check {
      opacity: 0;
      -webkit-transform: scale(0.3);
              transform: scale(0.3); }
  html.decks.password .password-content .password-title {
    margin-bottom: 30px; }
  html.decks.password .password-content .sl-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  html.decks.password .password-content .password-input {
    font-size: 25px;
    height: 60px;
    padding: 0 20px;
    -webkit-box-flex: 2;
        -ms-flex-positive: 2;
            flex-grow: 2;
    width: 100%;
    vertical-align: middle; }
  html.decks.password .password-content .password-input:focus {
    border-color: #fff; }
  html.decks.password .password-content .password-submit {
    height: 60px;
    margin: 0 0 0 10px;
    padding-left: 25px;
    padding-right: 25px;
    vertical-align: middle;
    background-color: rgba(255, 255, 255, 0.2);
    color: #fff;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  html.decks.password .password-content .password-submit:hover {
    background-color: rgba(255, 255, 255, 0.3); }
  @media screen and (max-height: 600px) {
    html.decks.password .password-content {
      padding: 10px; } }
  @media screen and (max-height: 400px) {
    html.decks.password .password-content .password-icon {
      display: none; } }

html.decks.password .password-content.outro .password-icon-lock {
  opacity: 0;
  -webkit-transform: scale(0.5);
          transform: scale(0.5); }
html.decks.password .password-content.outro .password-icon-check {
  opacity: 1;
  -webkit-transform: none;
          transform: none; }
/**
 * Deck view where collaborators can review and leave
 * feedback.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.decks.review .reveal .progress,
html.decks.review .reveal .controls,
html.decks.review .reveal .playback,
html.decks.review .reveal .slide-number {
  position: absolute; }

html.decks.review.space-efficient-drawer {
  --drawer-tool-width: min(calc( 100vw - var( --drawer-menu-width ) ), 300px);
  --page-inset-right: var( --drawer-menu-width ); }

html.decks.review .reveal-viewport {
  padding-right: var(--page-inset-right); }

html.decks.review .reveal {
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  opacity: 0; }

html.decks.review.fonts-are-ready .reveal {
  opacity: 1; }
/**
 * Deck embed page styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
/****************************************************
 * DECK VIEW
 ****************************************************/
html.decks.show {
  --deck-show-divider: var(--border-section);
  --deck-show-card-surface: var(--surface-section);
  --deck-show-card-muted-surface: var(--surface-panel);
  --deck-show-card-padding-y: calc( var(--space-4) + var(--space-1) );
  --deck-show-card-padding-x: calc( var(--space-6) - var(--space-1) );
  --deck-show-pill-size: calc( var(--button-size-7) + var(--space-1) );
  --deck-show-pill-padding: var(--space-2);
  --deck-show-option-size: calc( var(--button-size-6) - var(--space-2) );
  --deck-show-option-horizontal-padding: calc( var(--space-4) + var(--space-1) );
  --deck-show-social-button-size: var(--button-size-4);
  overflow: auto !important;
  height: auto !important; }

html.decks.show .reveal {
  line-height: 1; }
html.decks.show .marquee {
  position: relative;
  z-index: 1;
  background: var(--surface-page);
  border-bottom: 1px solid var(--deck-show-divider); }
  html.decks.show .marquee .reveal-frame {
    position: relative;
    z-index: 2;
    height: 860px;
    height: 90vh;
    height: calc(100vh - 235px);
    width: 100%;
    overflow: hidden; }
    html.decks.show .marquee .reveal-frame .progress,
    html.decks.show .marquee .reveal-frame .controls,
    html.decks.show .marquee .reveal-frame .playback,
    html.decks.show .marquee .reveal-frame .slide-number {
      position: absolute; }
  html.decks.show .marquee .deck-kudos {
    position: absolute;
    z-index: 3;
    left: calc( var(--space-6) + var(--space-2) );
    bottom: calc( var(--space-7) + var(--space-1) );
    opacity: 0;
    -webkit-transition: opacity 0.3s ease 0.2s;
    transition: opacity 0.3s ease 0.2s; }
  html.decks.show .marquee .pill {
    position: absolute;
    height: calc( var(--deck-show-pill-size) + ( var(--deck-show-pill-padding) * 2 ) );
    width: auto;
    min-width: 160px;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    bottom: 0;
    padding: var(--deck-show-pill-padding);
    z-index: 2;
    background: var(--deck-show-card-surface);
    border: 1px solid var(--deck-show-divider);
    -webkit-box-shadow: var(--shadow-section);
            box-shadow: var(--shadow-section);
    border-radius: var(--radius-full);
    text-align: left;
    cursor: default;
    opacity: 0;
    visibility: hidden;
    white-space: nowrap;
    -webkit-transition: opacity 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: opacity 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: opacity 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: opacity 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), visibility 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    pointer-events: none; }
    html.decks.show .marquee .pill.visible {
      opacity: 1;
      visibility: visible;
      -webkit-transform: translateY(calc( var(--deck-show-pill-size) / -2 ));
              transform: translateY(calc( var(--deck-show-pill-size) / -2 ));
      pointer-events: auto; }
    html.decks.show .marquee .pill .pill-picture {
      width: var(--deck-show-pill-size);
      height: var(--deck-show-pill-size);
      border-radius: var(--radius-full);
      background-size: cover;
      background-color: var(--deck-show-card-muted-surface);
      -ms-flex-negative: 0;
          flex-shrink: 0; }
    html.decks.show .marquee .pill .pill-content {
      display: inline-block;
      position: relative;
      padding-right: calc( var(--space-7) - var(--space-2) );
      max-width: 100%;
      text-indent: calc( var(--space-4) + var(--space-1) );
      font-size: 15px;
      overflow: hidden;
      color: var(--color-text); }
    html.decks.show .marquee .pill .pill-title,
    html.decks.show .marquee .pill .pill-description {
      margin: 0;
      max-width: 100%;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      line-height: 1.3; }
    html.decks.show .marquee .pill .pill-title {
      font-weight: 600;
      color: var(--color-text-strong); }
  html.decks.show .marquee .instructions-pill .pill-picture {
    background-image: url(//staging.slides.com/assets/deck-navigation-help-icon-8a32d332fcd4c7f65faf1076212c7cb97bbc739b6fa4bf33565039b170d07a74.png); }
  html.decks.show .marquee .instructions-pill[data-icon="down-arrow"] .pill-picture {
    background-image: url(//staging.slides.com/assets/deck-navigation-down-icon-b7c00be8792b4f787164342047e9dbeeabe463829d5aa19de3eae83f7c34bfbb.png); }
html.decks.show .column h2, html.decks.show .column h3 {
  font-weight: normal; }
html.decks.show .column section h2 {
  font-size: 22px;
  margin-bottom: calc( var(--space-8) - var(--space-1) ); }
@media screen and (orientation: portrait) and (max-width: 400px) {
  html.decks.show .marquee .reveal-frame {
    height: calc(55vh); } }
@media screen and (orientation: landscape) and (max-width: 600px), screen and (max-height: 600px) {
  html.decks.show .marquee .reveal-frame {
    height: calc(100vh - 80px); } }

html.decks.show .deck-card {
  position: relative;
  margin-top: -1px;
  padding-top: 0;
  padding-bottom: var(--space-5);
  border-radius: 0 0 var(--section-radius) var(--section-radius);
  font-size: 14px;
  -webkit-box-shadow: var(--shadow-section);
          box-shadow: var(--shadow-section); }
html.decks.show .deck-card-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-height: var(--deck-show-option-size);
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: var(--space-5) 0; }
html.decks.show .deck-sharing {
  margin-right: auto;
  white-space: nowrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
html.decks.show .deck-social {
  position: relative; }
html.decks.show .deck-social-button {
  display: inline-block;
  width: var(--deck-show-social-button-size);
  height: var(--deck-show-social-button-size);
  line-height: var(--deck-show-social-button-size);
  border-radius: var(--button-radius);
  margin: 0 var(--space-3) 0 0;
  vertical-align: top;
  text-align: center;
  color: #fff;
  cursor: pointer;
  opacity: 0.75;
  background-color: var(--button-neutral-soft-surface); }
html.decks.show .deck-social-button:hover {
  opacity: 1; }
html.decks.show .facebook-share-button {
  background-image: url(//staging.slides.com/assets/icons/facebook-icon-58-mono-d1a72abbe2db1c8c1673901d91ff96d516ad31142a4d86c657dbace6df5d5c1a.svg);
  background-size: 16px;
  background-position: 50% 50%;
  background-repeat: no-repeat; }
  html.decks.show .facebook-share-button:hover {
    background-color: #1877F2; }
  html.decks.show .facebook-share-button:focus {
    outline: 0; }
html.decks.show .twitter-share-button .icon {
  position: relative;
  top: 1px; }
html.decks.show .twitter-share-button:hover {
  background-color: #000; }
html.decks.show .twitter-share-button:focus {
  outline: 0; }
html.decks.show .deck-card .divider {
  width: 1px;
  height: calc( var(--deck-show-option-size) * 0.6 );
  margin: 0 var(--space-5);
  background-color: var(--deck-show-divider); }
html.decks.show .deck-state {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  padding: 0 var(--deck-show-option-horizontal-padding);
  height: var(--deck-show-option-size);
  line-height: var(--deck-show-option-size);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: auto;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-2);
  background: var(--deck-show-card-muted-surface);
  color: var(--color-text-muted);
  font-size: 1em;
  cursor: default;
  -ms-flex-item-align: start;
      align-self: flex-start; }
html.decks.show .deck-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  z-index: 3; }
  html.decks.show .deck-options .button {
    text-align: center;
    font-size: 16px;
    min-width: var(--deck-show-option-size);
    height: var(--deck-show-option-size);
    line-height: var(--deck-show-option-size);
    padding: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  html.decks.show .deck-options .button + .button {
    margin-left: var(--space-3); }
html.decks.show .deck-promotion {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: var(--deck-show-social-button-size);
  z-index: 1; }
  html.decks.show .deck-promotion .button {
    height: var(--deck-show-social-button-size);
    line-height: var(--deck-show-social-button-size);
    font-size: 1em;
    color: var(--color-text);
    padding: 0 var(--deck-show-option-horizontal-padding);
    max-width: 280px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-transition: none;
    transition: none; }
  html.decks.show .deck-promotion .fork-template-button {
    position: relative;
    padding-left: calc( var(--deck-show-social-button-size) + var(--deck-show-option-horizontal-padding) );
    background-color: var(--deck-show-card-muted-surface); }
    html.decks.show .deck-promotion .fork-template-button:hover {
      background-color: var(--surface-hover); }
    html.decks.show .deck-promotion .fork-template-button .icon {
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: var(--deck-show-social-button-size);
      background: var(--color-accent);
      display: grid;
      place-items: center;
      color: var(--color-text-inverse); }
  html.decks.show .deck-promotion .made-with-slides {
    padding-left: calc( var(--deck-show-social-button-size) + var(--deck-show-option-horizontal-padding) );
    background-image: url(//staging.slides.com/assets/logo/slides-symbol-4b4ebdd85815c1b9b3009029dd351b36d0c32dbe694c1fa039998ce8eead6369.svg);
    background-size: var(--deck-show-social-button-size);
    background-position: top left;
    background-repeat: no-repeat;
    background-color: var(--deck-show-card-muted-surface); }
    html.decks.show .deck-promotion .made-with-slides:hover {
      background-color: var(--surface-hover); }
html.decks.show .deck-promotion:not(:last-child) {
  margin-right: var(--space-5); }
html.decks.show .deck-card-body {
  padding: var(--space-8) 0 var(--space-4) 0;
  margin-top: var(--space-2);
  border-top: 1px solid var(--deck-show-divider);
  font-size: 13px; }
  html.decks.show .deck-card-body .description {
    line-height: 1.4em;
    margin: var(--space-5) 0;
    word-wrap: break-word; }
  html.decks.show .deck-card-body .deck-meta {
    display: block;
    position: relative;
    padding: var(--space-3) 0;
    margin: var(--space-5) 0;
    z-index: 10;
    background: var(--deck-show-card-surface); }
    html.decks.show .deck-card-body .deck-meta .icon {
      vertical-align: middle;
      margin-right: var(--space-3); }
    html.decks.show .deck-card-body .deck-meta .value {
      vertical-align: middle;
      color: var(--color-text); }
    html.decks.show .deck-card-body .deck-meta li {
      cursor: default;
      color: var(--color-text-muted);
      display: inline-block;
      vertical-align: top; }
    html.decks.show .deck-card-body .deck-meta li + li {
      margin-left: calc( var(--space-6) - var(--space-1) ); }
  html.decks.show .deck-card-body .deck-info {
    width: 46%;
    float: left; }
    html.decks.show .deck-card-body .deck-info h1 {
      font-size: 1.4em;
      font-weight: normal;
      color: var(--color-text-strong); }
html.decks.show .user-info {
  width: 50%;
  float: right;
  font-size: 13px; }
  html.decks.show .user-info .icon.edit {
    display: none; }
  html.decks.show .user-info .picture {
    width: 7.5em;
    height: 7.5em; }
@media screen and (max-width: 780px) {
  html.decks.show .deck-info,
  html.decks.show .user-info {
    width: 100% !important;
    float: none !important; }
  html.decks.show .deck-info {
    margin-bottom: calc( var(--space-8) - var(--space-1) ); }
  html.decks.show .deck-social {
    display: none; }
  html.decks.show .deck-options .button + .button {
    margin: 0; } }
@media screen and (max-width: 550px) {
  html.decks.show .deck-card {
    -webkit-box-shadow: none;
            box-shadow: none; }
  html.decks.show .kudos-count {
    display: none !important; }
  html.decks.show .deck-card-body {
    padding: calc( var(--space-6) + var(--space-2) ) 0 var(--space-5) 0; }
  html.decks.show .deck-card-body,
  html.decks.show .user-info {
    font-size: 14px; }
    html.decks.show .deck-card-body h1, html.decks.show .deck-card-body h2, html.decks.show .deck-card-body h3,
    html.decks.show .user-info h1,
    html.decks.show .user-info h2,
    html.decks.show .user-info h3 {
      font-size: 1.3em;
      font-weight: 500; }
  html.decks.show .user-info .username:before {
    content: 'By';
    display: inline-block;
    color: var(--color-text-subtle);
    margin-right: var(--space-2); }
  html.decks.show .user-info .picture {
    float: right;
    width: 2em;
    height: 2em;
    margin: 0 0 var(--space-5) var(--space-5); } }

html.decks.show.ua-safari .print-button {
  opacity: 0.5; }

/* Disabled to improve FCP time
// Don't show reveal.js content until fonts have loaded
html.decks.show .reveal {
	transition: opacity 0.3s ease;
	opacity: 0;
}
html.decks.show.fonts-are-ready .reveal {
	opacity: 1;
}
*/
html.decks.show .no-transforms .reveal-frame {
  height: auto;
  overflow: visible; }
  html.decks.show .no-transforms .reveal-frame .reveal {
    padding: calc( var(--space-8) + var(--space-4) ) 0; }

html.decks.show #carbonads {
  display: none !important; }
/**
 * The speaker view.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
@-webkit-keyframes flash-green {
  0%, 100% {
    background: var(--color-accent); }
  5%, 15% {
    background: #A4DDA4; } }
@keyframes flash-green {
  0%, 100% {
    background: var(--color-accent); }
  5%, 15% {
    background: #A4DDA4; } }
@-webkit-keyframes flash-red {
  0%, 100% {
    background: var(--color-accent); }
  5%, 15% {
    background: #e03948; } }
@keyframes flash-red {
  0%, 100% {
    background: var(--color-accent); }
  5%, 15% {
    background: #e03948; } }
@-webkit-keyframes dark-mode-icon-in {
  0% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg); }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); } }
@keyframes dark-mode-icon-in {
  0% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg); }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); } }
@-webkit-keyframes dark-mode-icon-out {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg); } }
@keyframes dark-mode-icon-out {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg); } }
html.speaker-view .reveal {
  overflow: hidden; }
html.speaker-view .reveal .controls,
html.speaker-view .reveal .progress,
html.speaker-view .reveal .slide-number {
  position: absolute; }
html.speaker-view .reveal .pause-overlay {
  display: none; }
html.speaker-view .current-slide,
html.speaker-view .upcoming-slide,
html.speaker-view .speaker-controls {
  display: block;
  position: absolute; }
html.speaker-view .speaker-view-options {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 10; }
html.speaker-view .speaker-overlay-element {
  display: inline-block;
  padding: 0 10px;
  height: 30px;
  line-height: 30px;
  background: rgba(220, 220, 220, 0.9);
  color: #222;
  font-size: 14px;
  vertical-align: top;
  border-radius: 2px; }
html.speaker-view button.speaker-overlay-element {
  cursor: pointer; }
html.speaker-view button.speaker-overlay-element:focus {
  outline: 1px solid #226ede;
  outline-offset: 2px; }
html.speaker-view button.speaker-overlay-element:hover {
  background: #e6e6e6; }
html.speaker-view .slide-preview-header {
  position: absolute;
  top: 8px;
  left: 8px; }
html.speaker-view .slide-preview-label {
  margin-right: 2px;
  font-size: 11px;
  text-transform: uppercase;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
html.speaker-view .current-slide {
  position: relative;
  width: 65%;
  height: 100%;
  top: 0;
  left: 0;
  padding: 0; }
  html.speaker-view .current-slide .message-overlay {
    position: absolute;
    width: 100%;
    left: 0;
    top: 40%;
    color: #fff;
    text-align: center;
    z-index: 200;
    opacity: 0;
    -webkit-animation: fade-in 1s linear 0.5s forwards;
            animation: fade-in 1s linear 0.5s forwards; }
html.speaker-view .upcoming-slide {
  width: 35%;
  height: 40%;
  top: 0;
  right: 0;
  padding: 0;
  z-index: 10; }
  html.speaker-view .upcoming-slide .upcoming-slide-jump-to {
    margin-right: 2px; }
  html.speaker-view .upcoming-slide .upcoming-slide-jump-to.hidden {
    visibility: hidden;
    opacity: 0; }
  html.speaker-view .upcoming-slide iframe {
    width: 100%;
    height: 100%;
    border: 0; }
html.speaker-view .upcoming-slide-end-screen,
html.speaker-view .upcoming-slide-not-available {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  visibility: hidden;
  background-color: #eee;
  color: #222; }
  html.speaker-view .upcoming-slide-end-screen p,
  html.speaker-view .upcoming-slide-not-available p {
    margin: auto;
    text-align: center; }
html.speaker-view .upcoming-slide.is-last-slide .upcoming-slide-end-screen {
  visibility: visible; }
html.speaker-view .upcoming-slide.not-available iframe,
html.speaker-view .upcoming-slide.not-available .upcoming-slide-jump-to {
  display: none; }
html.speaker-view .upcoming-slide.not-available .upcoming-slide-not-available {
  visibility: visible; }
html.speaker-view .speaker-controls {
  width: 35%;
  height: 60%;
  bottom: 0;
  right: 0;
  padding: 8px;
  font-size: 1.375rem;
  color: #252525;
  z-index: 9; }
html.speaker-view .speaker-timer,
html.speaker-view .speaker-notes {
  padding: 10px 0; }
html.speaker-view .speaker-controls-label {
  text-transform: uppercase;
  font-weight: normal;
  font-size: 0.7em;
  color: #666; }
html.speaker-view .speaker-timer {
  position: relative;
  margin-bottom: 10px;
  padding-top: 0;
  padding-bottom: 15px;
  cursor: default;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  html.speaker-view .speaker-timer .speaker-controls-label {
    display: inline-block;
    margin-right: 8px; }
  html.speaker-view .speaker-timer .value {
    font-size: 1.8em; }
  html.speaker-view .speaker-timer .timer-value span {
    float: left;
    color: inherit;
    opacity: 0.3;
    font-variant-numeric: tabular-nums; }
  html.speaker-view .speaker-timer .timer-value span.isset,
  html.speaker-view .speaker-timer .timer-value span.isset ~ * {
    opacity: 1; }
  html.speaker-view .speaker-timer .timer-value .hours:after,
  html.speaker-view .speaker-timer .timer-value .minutes:after {
    content: ':'; }
  html.speaker-view .speaker-timer .timer-value.overtime:before {
    content: '-';
    float: left;
    color: #d04232;
    opacity: 1; }
  html.speaker-view .speaker-timer .timer-value.overtime span {
    color: #d04232;
    opacity: 1; }
  html.speaker-view .speaker-timer .clock-value {
    float: right;
    text-align: right; }
  html.speaker-view .speaker-timer .timer-option {
    padding: 0 12px;
    height: 30px;
    border-radius: 2px;
    text-transform: uppercase;
    font-size: 11px;
    background-color: rgba(220, 220, 220, 0.9);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
  html.speaker-view .speaker-timer .timer-option + .timer-option {
    margin-left: 5px; }
  html.speaker-view .speaker-timer .timer-option:hover {
    background-color: #e6e6e6; }
  html.speaker-view .speaker-timer .timer-option.fixed-width {
    width: 3em;
    padding: 0; }
  html.speaker-view .speaker-timer .timer-start-button,
  html.speaker-view .speaker-timer .timer-pause-button,
  html.speaker-view .speaker-timer .timer-resume-button,
  html.speaker-view .speaker-timer .timer-stop-button {
    display: none; }
  html.speaker-view .speaker-timer[data-timer-state="idle"] .timer-start-button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex; }
  html.speaker-view .speaker-timer[data-timer-state="paused"] .timer-resume-button, html.speaker-view .speaker-timer[data-timer-state="paused"] .timer-stop-button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex; }
  html.speaker-view .speaker-timer[data-timer-state="started"] .timer-pause-button, html.speaker-view .speaker-timer[data-timer-state="started"] .timer-stop-button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex; }
html.speaker-view .speaker-timer .timer-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 14px; }
html.speaker-view .speaker-timer .timer-values {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 14px; }
html.speaker-view .speaker-notes .value {
  display: block;
  margin-top: 5px;
  white-space: pre-wrap;
  line-height: 1.5;
  overflow: auto;
  -webkit-overflow-scrolling: touch; }
  html.speaker-view .speaker-notes .value .dim {
    color: #bbb; }
html.speaker-view .speaker-progress {
  position: relative;
  width: 100%;
  height: 20px;
  z-index: 10;
  color: inherit;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 12px;
  border-radius: 2px;
  text-transform: uppercase; }
html.speaker-view .speaker-progress-content {
  position: relative;
  padding: 0 6px;
  z-index: 4;
  width: 100%;
  pointer-events: none;
  color: #000; }
  html.speaker-view .speaker-progress-content .status {
    position: relative;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    font-weight: 600;
    padding: 4px 6px;
    background: rgba(255, 255, 255, 0.25);
    border-radius: 4px; }
    html.speaker-view .speaker-progress-content .status:empty {
      display: none; }
    html.speaker-view .speaker-progress-content .status.hidden {
      opacity: 0;
      -webkit-transition: all 0.5s ease;
      transition: all 0.5s ease; }
  html.speaker-view .speaker-progress-content .slide-number {
    float: right; }
html.speaker-view .speaker-progress-bar,
html.speaker-view .speaker-countdown-bar {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: #f5f5f5;
  border-radius: 2px; }
html.speaker-view .speaker-countdown-bar {
  display: none;
  height: 6px;
  top: 100%;
  margin-top: 4px; }
html.speaker-view .speaker-inner-bar {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: #1baee1;
  border-radius: 2px;
  -webkit-transform: scale(1, 0);
          transform: scale(1, 0);
  -webkit-transform-origin: 0% 50%;
          transform-origin: 0% 50%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease; }
html.speaker-view .speaker-countdown-bar .speaker-inner-bar {
  background: #999;
  -webkit-transform-origin: 100% 50%;
          transform-origin: 100% 50%; }
html.speaker-view .has-time-limit .speaker-countdown-bar {
  display: block; }
@media screen and (max-width: 1080px), (max-height: 600px) {
  html.speaker-view .speaker-controls {
    font-size: 16px; } }
@media screen and (max-width: 900px) {
  html.speaker-view .speaker-controls {
    font-size: 14px; } }
@media screen and (max-width: 800px) {
  html.speaker-view .speaker-controls {
    font-size: 12px; } }

/**
 * Desktop only
 */
html.speaker:not(.speaker-mobile) .subscribers {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  visibility: hidden;
  opacity: 0;
  cursor: default;
  background: #fff;
  color: #666;
  font-size: 11px;
  line-height: 1.4em;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transform: translateY(100%);
          transform: translateY(100%); }
  html.speaker:not(.speaker-mobile) .subscribers.visible {
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
            transform: none; }
  html.speaker:not(.speaker-mobile) .subscribers .subscribers-inner {
    padding: 8px;
    border-top: 1px solid rgba(200, 200, 200, 0.5); }
  html.speaker:not(.speaker-mobile) .subscribers .subscribers-label,
  html.speaker:not(.speaker-mobile) .subscribers .subscribers-value {
    display: inline-block;
    margin: 0;
    padding: 5px;
    text-transform: uppercase;
    vertical-align: top; }
  html.speaker:not(.speaker-mobile) .subscribers .subscribers-label {
    font-weight: normal; }
  html.speaker:not(.speaker-mobile) .subscribers .subscribers-value {
    padding-left: 8px;
    padding-right: 8px;
    border-radius: 4px;
    font-weight: normal;
    font-size: 1.2em;
    float: right;
    background: var(--color-accent);
    color: #fff; }
    html.speaker:not(.speaker-mobile) .subscribers .subscribers-value .icon {
      margin-right: 4px; }
  html.speaker:not(.speaker-mobile) .subscribers .subscribers-value.flash-green {
    -webkit-animation: flash-green 2s ease;
            animation: flash-green 2s ease; }
  html.speaker:not(.speaker-mobile) .subscribers .subscribers-value.flash-red {
    -webkit-animation: flash-red 2s ease;
            animation: flash-red 2s ease; }

/**
 * Mobile only
 */
html.speaker-mobile {
  -ms-touch-action: none;
      touch-action: none;
  position: fixed; }
  html.speaker-mobile .upcoming-slide,
  html.speaker-mobile .speaker-view-options,
  html.speaker-mobile .slide-preview-header {
    display: none; }
  html.speaker-mobile .current-slide {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    visibility: hidden !important;
    opacity: 1;
    z-index: auto; }
  html.speaker-mobile .reveal .controls {
    bottom: 54px;
    z-index: 20;
    visibility: visible; }
  html.speaker-mobile .reveal .controls button {
    color: #226ede; }
  html.speaker-mobile .speaker-controls {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 20px;
    z-index: 11;
    font-size: 18px; }
  html.speaker-mobile .speaker-timer {
    padding-top: 0;
    padding-bottom: 0;
    border-bottom: 1px solid #444; }
  html.speaker-mobile .speaker-timer .value {
    font-size: 1.5em; }
  html.speaker-mobile .speaker-timer .timer-option {
    -webkit-box-flex: 2;
        -ms-flex-positive: 2;
            flex-grow: 2; }
  html.speaker-mobile .speaker-timer .timer-option,
  html.speaker-mobile .speaker-timer .timer-option.fixed-width {
    width: 50%; }
  html.speaker-mobile .speaker-timer .timer-rewind-button {
    width: 3em; }
  html.speaker-mobile .speaker-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 44px;
    font-size: 0.7em;
    border-radius: 0;
    pointer-events: none; }
  html.speaker-mobile .speaker-progress-bar {
    border-radius: 0;
    background: #a8b6ba !important; }
  html.speaker-mobile .speaker-inner-bar {
    border-radius: 0; }
  html.speaker-mobile .speaker-progress-content {
    padding: 0 20px; }
  html.speaker-mobile .speaker-countdown-bar {
    display: none !important; }
  html.speaker-mobile .speaker-touch-feedback {
    content: '';
    display: block;
    position: fixed;
    bottom: 44px;
    left: 0;
    width: 100%;
    height: 400px;
    background: -webkit-gradient(linear, left bottom, left top, from(#226ede), color-stop(50%, transparent));
    background: linear-gradient(to top, #226ede 0%, transparent 50%);
    z-index: -1;
    pointer-events: none;
    -webkit-animation: fade-in 0.2s 1 ease forwards;
            animation: fade-in 0.2s 1 ease forwards; }
  html.speaker-mobile .speaker-touch-feedback.hidden {
    -webkit-animation: fade-out 0.5s 1 ease forwards;
            animation: fade-out 0.5s 1 ease forwards; }
  html.speaker-mobile .subscribers {
    position: absolute;
    width: auto;
    left: 0;
    bottom: 44px;
    color: inherit;
    background: transparent;
    font-size: 16px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transform: translateY(100%);
            transform: translateY(100%); }
    html.speaker-mobile .subscribers.visible {
      opacity: 1;
      visibility: visible;
      -webkit-transform: none;
              transform: none; }
    html.speaker-mobile .subscribers .subscribers-inner {
      padding: 0 8px; }
    html.speaker-mobile .subscribers .subscribers-label {
      display: none; }
    html.speaker-mobile .subscribers .subscribers-value {
      display: inline-block;
      padding: 0.25em 0.5em;
      border-radius: 4px;
      float: right;
      background: var(--color-accent);
      color: #fff;
      font-weight: normal;
      vertical-align: top; }
      html.speaker-mobile .subscribers .subscribers-value .icon {
        margin-right: 4px; }
    html.speaker-mobile .subscribers .subscribers-value.flash-green {
      -webkit-animation: flash-green 2s ease;
              animation: flash-green 2s ease; }
    html.speaker-mobile .subscribers .subscribers-value.flash-red {
      -webkit-animation: flash-red 2s ease;
              animation: flash-red 2s ease; }
  @media only screen and (orientation: landscape) {
    html.speaker-mobile .speaker-controls,
    html.speaker-mobile .speaker-progress-content {
      padding-left: 40px !important;
      padding-right: 40px !important; } }
  @media screen and (min-width: 740px) and (min-height: 500px) {
    html.speaker-mobile .speaker-controls {
      font-size: 24px; }
    html.speaker-mobile .subscribers {
      bottom: 66px;
      font-size: 20px; }
    html.speaker-mobile .speaker-progress {
      height: 66px;
      font-size: 20px; } }

/**
 * Speaker view layouts
 */
html.speaker-view .speaker-layout-button {
  width: 38px;
  padding: 0; }

html.speaker-view .speaker-layout-button .icon {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 100%;
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-default-abe7d0a081f3dc23f45e089aa83d705f924d22b2c6ca24bd220d149eec771403.svg);
  background-size: 60%;
  background-position: 50% 50%;
  background-repeat: no-repeat; }

html.speaker-view[data-speaker-layout="default"] .current-slide {
  border-right: 1px solid #ddd; }
html.speaker-view[data-speaker-layout="default"] .upcoming-slide {
  border-bottom: 1px solid #ddd; }

html.speaker-view[data-speaker-layout="wide"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-wide-66189311138483710e8a9b86ce834c059d2eaa6e7646301053e161247f22cc59.svg); }
html.speaker-view[data-speaker-layout="wide"] .current-slide,
html.speaker-view[data-speaker-layout="wide"] .upcoming-slide {
  width: 50%;
  height: 45%;
  padding: 0; }
html.speaker-view[data-speaker-layout="wide"] .current-slide {
  top: 0;
  left: 0;
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #ddd; }
html.speaker-view[data-speaker-layout="wide"] .upcoming-slide {
  top: 0;
  left: 50%;
  border-bottom: 1px solid #ddd; }
html.speaker-view[data-speaker-layout="wide"] .speaker-controls {
  top: 45%;
  left: 0;
  width: 100%;
  height: 55%;
  font-size: 1.375rem; }

html.speaker-view[data-speaker-layout="tall"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-tall-932ab8737f8f64c332c5df05f25235c26e4973e8bf1773af0db1e966a8ea18d6.svg); }
html.speaker-view[data-speaker-layout="tall"] .current-slide,
html.speaker-view[data-speaker-layout="tall"] .upcoming-slide {
  width: 45%;
  height: 50%;
  padding: 0; }
html.speaker-view[data-speaker-layout="tall"] .current-slide {
  top: 0;
  left: 0;
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #ddd; }
html.speaker-view[data-speaker-layout="tall"] .upcoming-slide {
  top: 50%;
  left: 0;
  border-right: 1px solid #ddd; }
html.speaker-view[data-speaker-layout="tall"] .speaker-timer {
  padding-top: 0; }
html.speaker-view[data-speaker-layout="tall"] .speaker-controls {
  padding-top: 8px;
  left: 45%;
  width: 55%;
  height: 100%;
  font-size: 1.375rem; }

html.speaker-view[data-speaker-layout="notes-only"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-notes-only-8c4bb4b5b1a13edb52fab8538f666cf66c852286a2dd9879fc7e2f6978bb6e79.svg); }
html.speaker-view[data-speaker-layout="notes-only"] .current-slide,
html.speaker-view[data-speaker-layout="notes-only"] .upcoming-slide {
  display: none; }
html.speaker-view[data-speaker-layout="notes-only"] .speaker-timer {
  padding-top: 0; }
html.speaker-view[data-speaker-layout="notes-only"] .speaker-controls {
  padding-top: 8px;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 1.71875rem; }

html.speaker-view[data-speaker-layout="current-only"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-current-only-c56150d785b069a05941ccc07263e609215721f8b04f74aff92a3bb224c0d9c5.svg); }
html.speaker-view[data-speaker-layout="current-only"] .upcoming-slide,
html.speaker-view[data-speaker-layout="current-only"] .speaker-controls,
html.speaker-view[data-speaker-layout="current-only"] .current-slide .slide-preview-label {
  display: none; }
html.speaker-view[data-speaker-layout="current-only"] .current-slide {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; }

html.speaker-view[data-speaker-layout="upcoming-only"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-current-only-c56150d785b069a05941ccc07263e609215721f8b04f74aff92a3bb224c0d9c5.svg); }
html.speaker-view[data-speaker-layout="upcoming-only"] .current-slide,
html.speaker-view[data-speaker-layout="upcoming-only"] .speaker-controls,
html.speaker-view[data-speaker-layout="upcoming-only"] .current-slide .slide-preview-label {
  display: none; }
html.speaker-view[data-speaker-layout="upcoming-only"] .upcoming-slide {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; }

html.speaker-view[data-speaker-theme="dark"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-default-white-2ff083f95736d01ac80ea9f4b80c6b171b51079fe90c5feddd140803fba95c06.svg); }

html.speaker-view[data-speaker-theme="dark"][data-speaker-layout="wide"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-wide-white-3207be840c5ab09f4ab6fae3dd18300e1e2ed0d2847226705f89f0132e91662e.svg); }

html.speaker-view[data-speaker-theme="dark"][data-speaker-layout="tall"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-tall-white-08a62d97bfe3f0247206d20fe814cf6bcc483a7bbfbaeb3d463538d182b8a8ab.svg); }

html.speaker-view[data-speaker-theme="dark"][data-speaker-layout="notes-only"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-notes-only-white-929a9716d44076981e1f0f791c9d8d94bdc66a84fcef2003de10f238791d7002.svg); }

html.speaker-view[data-speaker-theme="dark"][data-speaker-layout="current-only"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-current-only-white-c48cd57584fd4400628fd4dc79ba0cd5b98cc0253f7f5d6bfb33a5985a7f4030.svg); }

html.speaker-view[data-speaker-theme="dark"][data-speaker-layout="upcoming-only"] .speaker-layout-button .icon {
  background-image: url(//staging.slides.com/assets/icons/speaker-view/speaker-view-layout-upcoming-only-white-319eba0e8d938ead05183e7d6901daefd9f8d63f091fc31c4aa29891cd3bcc66.svg); }

html.speaker-view[data-speaker-theme="dark"] .current-slide, html.speaker-view[data-speaker-theme="dark"] .upcoming-slide {
  border-color: #555; }

/**
 * Speaker view mode
 */
html.speaker-view .speaker-dark-mode-button {
  position: relative;
  width: 36px;
  overflow: hidden;
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  margin-left: 2px; }

html.speaker-view .speaker-dark-mode-button .icon {
  position: absolute;
  width: 1em;
  height: 1em;
  top: 50%;
  left: 50%;
  margin-left: -0.5em;
  margin-top: -0.5em;
  -webkit-transform-origin: 50% 200%;
          transform-origin: 50% 200%;
  -webkit-transition: opacity 0.4s cubic-bezier(0.86, 0, 0.07, 1), color 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  transition: opacity 0.4s cubic-bezier(0.86, 0, 0.07, 1), color 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards; }

html.speaker-view .speaker-dark-mode-button .icon-sun {
  color: #252525;
  -webkit-animation: dark-mode-icon-in 0.4s cubic-bezier(0.86, 0, 0.07, 1);
          animation: dark-mode-icon-in 0.4s cubic-bezier(0.86, 0, 0.07, 1); }

html.speaker-view .speaker-dark-mode-button .icon-moon {
  opacity: 0;
  color: yellow;
  -webkit-animation: dark-mode-icon-out 0.4s cubic-bezier(0.86, 0, 0.07, 1);
          animation: dark-mode-icon-out 0.4s cubic-bezier(0.86, 0, 0.07, 1); }

html.speaker-view[data-speaker-theme="dark"] .speaker-dark-mode-button .icon-sun {
  opacity: 0;
  -webkit-animation: dark-mode-icon-out 0.4s cubic-bezier(0.86, 0, 0.07, 1);
          animation: dark-mode-icon-out 0.4s cubic-bezier(0.86, 0, 0.07, 1); }
html.speaker-view[data-speaker-theme="dark"] .speaker-dark-mode-button .icon-moon {
  opacity: 1;
  -webkit-animation: dark-mode-icon-in 0.4s cubic-bezier(0.86, 0, 0.07, 1);
          animation: dark-mode-icon-in 0.4s cubic-bezier(0.86, 0, 0.07, 1); }

html.speaker-view[data-speaker-theme="dark"] body,
html.speaker-view[data-speaker-theme="dark"] .speaker-controls {
  background-color: #111;
  color: #fff; }
html.speaker-view[data-speaker-theme="dark"] .speaker-controls-label,
html.speaker-view[data-speaker-theme="dark"] .speaker-notes .dim {
  color: #888; }
html.speaker-view[data-speaker-theme="dark"] .current-slide .reveal,
html.speaker-view[data-speaker-theme="dark"] .upcoming-slide iframe {
  border-color: #222; }
html.speaker-view[data-speaker-theme="dark"] .speaker-progress-bar,
html.speaker-view[data-speaker-theme="dark"] .speaker-countdown-bar {
  background: #444; }
html.speaker-view[data-speaker-theme="dark"] .speaker-timer .timer-option,
html.speaker-view[data-speaker-theme="dark"] .speaker-overlay-element {
  background-color: rgba(68, 68, 68, 0.9);
  color: #fff; }
html.speaker-view[data-speaker-theme="dark"] .speaker-timer .timer-option:hover,
html.speaker-view[data-speaker-theme="dark"] button.speaker-overlay-element:hover {
  background-color: #555; }
html.speaker-view[data-speaker-theme="dark"] .upcoming-slide-end-screen,
html.speaker-view[data-speaker-theme="dark"] .upcoming-slide-not-available {
  background-color: #222;
  color: #fff; }
html.speaker-view[data-speaker-theme="dark"] .subscribers {
  background: #111;
  color: #fff; }
html.speaker-view[data-speaker-theme="dark"] .subscribers .subscribers-inner {
  border-top-color: rgba(200, 200, 200, 0.1); }
/**
 * User auth page styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.devise {
  --devise-border: var(--border-strong);
  --devise-border-strong: var(--border-strongest);
  --devise-divider: var(--border-default);
  --devise-surface: var(--surface-section);
  --devise-surface-alt: var(--surface-panel-alt);
  --devise-surface-hover: var(--surface-hover);
  --devise-text-muted: var(--color-text-secondary);
  --devise-text-subtle: var(--color-text-muted);
  --devise-text-faint: var(--color-text-subtle);
  --devise-shadow-s: 0 1px 1px rgba(0, 0, 0, 0.15);
  --devise-shadow-m: 0 2px 2px rgba(0, 0, 0, 0.1);
  --devise-provider-facebook: #4267b2;
  --devise-provider-facebook-hover: #5074be;
  --devise-provider-facebook-hover-strong: #6283c5;
  --devise-provider-google-surface: var(--surface-raised);
  --devise-provider-google-surface-hover: var(--surface-raised-strong);
  --devise-provider-google-text: var(--color-text);
  --devise-provider-google-action: #4285f4;
  --devise-provider-google-action-hover: #72a4f7;
  --devise-provider-email: var(--surface-raised);
  --devise-sso-surface: #000;
  --devise-sso-surface-hover: #222; }
  html.devise .column.thin,
  html.devise .column.wide {
    max-width: 100%; }
  html.devise .column.thin {
    width: 540px; }
  html.devise .column.wide {
    width: 825px; }
  html.devise .devise-note {
    padding-top: 10px;
    margin-top: 50px;
    border-top: 1px solid var(--devise-divider);
    font-size: 15px;
    color: var(--devise-text-muted); }
  html.devise .devise-note.hidden {
    display: none; }
  html.devise .devise-links {
    padding-top: 10px;
    margin-top: 50px;
    border-top: 1px solid var(--devise-divider); }
    html.devise .devise-links a, html.devise .devise-links button {
      padding: 0;
      color: var(--devise-text-muted); }
      html.devise .devise-links a:hover, html.devise .devise-links button:hover {
        color: var(--color-text-strong); }
    html.devise .devise-links * + a,
    html.devise .devise-links * + button {
      margin-left: 10px; }
  html.devise .devise-note:not(.hidden) + .devise-links {
    margin-top: 10px; }
  html.devise form input[type=text],
  html.devise form input[type=email],
  html.devise form input[type=search],
  html.devise form input[type=password],
  html.devise .sl-form input[type=text],
  html.devise .sl-form input[type=email],
  html.devise .sl-form input[type=search],
  html.devise .sl-form input[type=password] {
    width: 100%; }
  html.devise section form:first-child {
    margin-top: 0; }

html.sessions, html.sessions body, html.sessions #container,
html.passwords,
html.passwords body,
html.passwords #container,
html.subscriptions.new,
html.subscriptions.new body,
html.subscriptions.new #container,
html.registrations.new,
html.registrations.new body,
html.registrations.new #container,
html.registrations.create,
html.registrations.create body,
html.registrations.create #container,
html.invitations.show,
html.invitations.show body,
html.invitations.show #container,
html.teams-reactivate,
html.teams-reactivate body,
html.teams-reactivate #container,
html.devise.verify,
html.devise.verify body,
html.devise.verify #container,
html.users.confirm,
html.users.confirm body,
html.users.confirm #container {
  height: 100%; }
html.sessions #container,
html.passwords #container,
html.subscriptions.new #container,
html.registrations.new #container,
html.registrations.create #container,
html.invitations.show #container,
html.teams-reactivate #container,
html.devise.verify #container,
html.users.confirm #container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
html.sessions #main,
html.sessions .global-header,
html.sessions .global-footer,
html.passwords #main,
html.passwords .global-header,
html.passwords .global-footer,
html.subscriptions.new #main,
html.subscriptions.new .global-header,
html.subscriptions.new .global-footer,
html.registrations.new #main,
html.registrations.new .global-header,
html.registrations.new .global-footer,
html.registrations.create #main,
html.registrations.create .global-header,
html.registrations.create .global-footer,
html.invitations.show #main,
html.invitations.show .global-header,
html.invitations.show .global-footer,
html.teams-reactivate #main,
html.teams-reactivate .global-header,
html.teams-reactivate .global-footer,
html.devise.verify #main,
html.devise.verify .global-header,
html.devise.verify .global-footer,
html.users.confirm #main,
html.users.confirm .global-header,
html.users.confirm .global-footer {
  -ms-flex-negative: 0;
      flex-shrink: 0; }
html.sessions .global-footer,
html.passwords .global-footer,
html.subscriptions.new .global-footer,
html.registrations.new .global-footer,
html.registrations.create .global-footer,
html.invitations.show .global-footer,
html.teams-reactivate .global-footer,
html.devise.verify .global-footer,
html.users.confirm .global-footer {
  margin-top: 20px; }

html.sessions .invitation-message,
html.invitations .invitation-message {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: transparent;
  padding-top: 20px;
  padding-bottom: 20px; }
  html.sessions .invitation-message .invite-image,
  html.invitations .invitation-message .invite-image {
    height: 60px;
    width: 60px;
    border-radius: 60px;
    border: 2px solid var(--surface-page);
    -webkit-box-shadow: var(--devise-shadow-m);
            box-shadow: var(--devise-shadow-m);
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  html.sessions .invitation-message .invite-message,
  html.invitations .invitation-message .invite-message {
    padding-left: 20px;
    margin: 0; }

html.devise .auth-options {
  position: relative; }
html.devise .auth-divider {
  position: relative;
  width: 100%;
  height: 1px;
  left: 0;
  top: 0;
  margin: 42px 0;
  background: var(--devise-divider); }
html.devise .auth-divider:after {
  content: 'OR';
  background: var(--devise-surface);
  position: absolute;
  left: 50%;
  top: 50%;
  font-size: 12px;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  margin-top: -15px;
  margin-left: -15px;
  color: var(--devise-text-faint); }
html.devise .auth-option.oauth {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: var(--space-4); }
html.devise .auth-option.oauth .oauth-form {
  margin-top: 0;
  width: 100%; }
html.devise .auth-button {
  position: relative;
  width: 100%;
  height: var(--button-size-7);
  padding: 0;
  gap: 0;
  border-radius: var(--button-radius);
  font-weight: 500;
  outline-offset: 4px; }
html.devise .auth-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 100%;
  width: var(--button-size-7);
  padding: 0;
  text-align: center;
  font-size: 24px; }
html.devise .auth-button.facebook .auth-icon {
  background-image: url(//staging.slides.com/assets/icons/facebook-icon-58-8f97d81d5007da10da97542cd3809543d307f8bf48cdddb51ae131d53e17f4f9.svg);
  background-size: 24px;
  background-position: 50% 50%;
  background-repeat: no-repeat; }
html.devise .auth-button.google .auth-icon {
  background-image: url(//staging.slides.com/assets/icons/google-icon-48-e8af5c4a1ee1f31733c1b9b9e075f6292db7833194176d2d8cdeca4b26e2ec5d.svg);
  background-size: 24px;
  background-position: 50% 50%;
  background-repeat: no-repeat; }
html.devise .auth-toggle-content {
  display: block; }
html.devise .auth-toggle-content.hidden {
  display: none; }
@media screen and (max-width: 550px) {
  html.devise .auth-option.oauth {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; } }

html.registrations.new .registration-options,
html.registrations.create .registration-options,
html.invitations.show .registration-options {
  position: relative; }
html.registrations.new .registration-divider,
html.registrations.create .registration-divider,
html.invitations.show .registration-divider {
  position: relative;
  width: 100%;
  height: 1px;
  left: 0;
  top: 0;
  margin: 42px 0;
  background: var(--devise-divider); }
html.registrations.new .registration-option,
html.registrations.create .registration-option,
html.invitations.show .registration-option {
  position: relative;
  -webkit-box-shadow: 0 0 0 1px var(--devise-border);
          box-shadow: 0 0 0 1px var(--devise-border); }
html.registrations.new .registration-option.expandable,
html.registrations.create .registration-option.expandable,
html.invitations.show .registration-option.expandable {
  -webkit-transition: max-height 0.3s ease;
  transition: max-height 0.3s ease;
  overflow: hidden;
  max-height: 54px; }
html.registrations.new .registration-option + .registration-option,
html.registrations.create .registration-option + .registration-option,
html.invitations.show .registration-option + .registration-option {
  margin-top: 1px; }
html.registrations.new .registration-toggle,
html.registrations.create .registration-toggle,
html.invitations.show .registration-toggle {
  display: block;
  position: relative;
  width: 100%;
  padding: 0 70px 0 15px;
  height: 54px;
  line-height: 54px;
  text-align: left;
  color: var(--devise-text-muted); }
  html.registrations.new .registration-toggle .registration-checkbox,
  html.registrations.create .registration-toggle .registration-checkbox,
  html.invitations.show .registration-toggle .registration-checkbox {
    width: 20px;
    height: 20px;
    color: transparent;
    margin: 0 10px; }
  html.registrations.new .registration-toggle .registration-toggle-icon,
  html.registrations.create .registration-toggle .registration-toggle-icon,
  html.invitations.show .registration-toggle .registration-toggle-icon {
    display: block;
    position: absolute;
    height: 40px;
    width: 40px;
    right: 14px;
    top: 6px;
    border-radius: 20px;
    text-align: center;
    line-height: 40px;
    font-size: 20px;
    color: #fff;
    -webkit-box-shadow: var(--devise-shadow-s);
            box-shadow: var(--devise-shadow-s); }
  html.registrations.new .registration-toggle.facebook .registration-toggle-icon,
  html.registrations.create .registration-toggle.facebook .registration-toggle-icon,
  html.invitations.show .registration-toggle.facebook .registration-toggle-icon {
    background-color: var(--devise-provider-facebook);
    background-image: url(//staging.slides.com/assets/icons/facebook-icon-58-8f97d81d5007da10da97542cd3809543d307f8bf48cdddb51ae131d53e17f4f9.svg);
    background-size: 20px;
    background-position: 50% 50%;
    background-repeat: no-repeat; }
  html.registrations.new .registration-toggle.google .registration-toggle-icon,
  html.registrations.create .registration-toggle.google .registration-toggle-icon,
  html.invitations.show .registration-toggle.google .registration-toggle-icon {
    background-color: var(--devise-provider-google-surface);
    background-image: url(//staging.slides.com/assets/icons/google-icon-48-e8af5c4a1ee1f31733c1b9b9e075f6292db7833194176d2d8cdeca4b26e2ec5d.svg);
    background-size: 22px;
    background-position: 50% 50%;
    background-repeat: no-repeat; }
  html.registrations.new .registration-toggle.email .registration-toggle-icon,
  html.registrations.create .registration-toggle.email .registration-toggle-icon,
  html.invitations.show .registration-toggle.email .registration-toggle-icon {
    background-color: var(--devise-provider-email); }
html.registrations.new .registration-option:first-child,
html.registrations.create .registration-option:first-child,
html.invitations.show .registration-option:first-child {
  border-top-left-radius: var(--radius-4);
  border-top-right-radius: var(--radius-4);
  overflow: hidden; }
html.registrations.new .registration-option:last-child,
html.registrations.create .registration-option:last-child,
html.invitations.show .registration-option:last-child {
  border-bottom-left-radius: var(--radius-4);
  border-bottom-right-radius: var(--radius-4);
  overflow: hidden; }
html.registrations.new .registration-docs .unit.checkbox,
html.registrations.create .registration-docs .unit.checkbox,
html.invitations.show .registration-docs .unit.checkbox {
  margin-bottom: 15px;
  font-size: 15px; }
html.registrations.new .registration-description,
html.registrations.create .registration-description,
html.invitations.show .registration-description {
  margin-bottom: 14px;
  font-size: 15px;
  color: var(--devise-text-muted); }
html.registrations.new .registration-toggle-content,
html.registrations.create .registration-toggle-content,
html.invitations.show .registration-toggle-content {
  visibility: hidden;
  padding: 15px; }
html.registrations.new .registration-option:hover,
html.registrations.create .registration-option:hover,
html.invitations.show .registration-option:hover {
  -webkit-box-shadow: 0 0 0 1px var(--devise-border-strong);
          box-shadow: 0 0 0 1px var(--devise-border-strong);
  z-index: 2; }
html.registrations.new .registration-option.selected,
html.registrations.create .registration-option.selected,
html.invitations.show .registration-option.selected {
  max-height: 350px;
  z-index: 2;
  -webkit-box-shadow: 0 0 0 1px var(--color-accent);
          box-shadow: 0 0 0 1px var(--color-accent); }
  html.registrations.new .registration-option.selected .registration-toggle,
  html.registrations.create .registration-option.selected .registration-toggle,
  html.invitations.show .registration-option.selected .registration-toggle {
    color: var(--color-text-strong); }
  html.registrations.new .registration-option.selected .registration-checkbox,
  html.registrations.create .registration-option.selected .registration-checkbox,
  html.invitations.show .registration-option.selected .registration-checkbox {
    color: currentColor;
    border-color: transparent; }
  html.registrations.new .registration-option.selected .registration-toggle-content,
  html.registrations.create .registration-option.selected .registration-toggle-content,
  html.invitations.show .registration-option.selected .registration-toggle-content {
    visibility: visible; }
html.registrations.new .actions,
html.registrations.create .actions,
html.invitations.show .actions {
  margin-top: 50px;
  text-align: right; }
html.registrations.new .actions .button[data-option-id="facebook"],
html.registrations.create .actions .button[data-option-id="facebook"],
html.invitations.show .actions .button[data-option-id="facebook"] {
  background-color: var(--devise-provider-facebook); }
  html.registrations.new .actions .button[data-option-id="facebook"]:not([disabled]):hover,
  html.registrations.create .actions .button[data-option-id="facebook"]:not([disabled]):hover,
  html.invitations.show .actions .button[data-option-id="facebook"]:not([disabled]):hover {
    background-color: var(--devise-provider-facebook-hover-strong); }
html.registrations.new .actions .button[data-option-id="google"],
html.registrations.create .actions .button[data-option-id="google"],
html.invitations.show .actions .button[data-option-id="google"] {
  background-color: var(--devise-provider-google-action); }
  html.registrations.new .actions .button[data-option-id="google"]:not([disabled]):hover,
  html.registrations.create .actions .button[data-option-id="google"]:not([disabled]):hover,
  html.invitations.show .actions .button[data-option-id="google"]:not([disabled]):hover {
    background-color: var(--devise-provider-google-action-hover); }
html.registrations.new .actions .button:not(.disabled),
html.registrations.create .actions .button:not(.disabled),
html.invitations.show .actions .button:not(.disabled) {
  -webkit-animation: small-bounce 0.4s ease;
          animation: small-bounce 0.4s ease; }

html.registrations #user_challenge,
html.invitations #user_challenge {
  position: relative;
  border-radius: 2px;
  margin-bottom: 35px; }
  html.registrations #user_challenge canvas,
  html.invitations #user_challenge canvas {
    display: block;
    width: 100%;
    height: 120px;
    background: var(--devise-surface-alt);
    border-radius: var(--radius-4);
    -webkit-box-shadow: 0 0 0 1px var(--devise-border);
            box-shadow: 0 0 0 1px var(--devise-border); }
  html.registrations #user_challenge .instruction,
  html.invitations #user_challenge .instruction {
    display: block;
    position: relative;
    padding-top: 4px;
    margin-bottom: -8px;
    color: var(--devise-text-faint);
    font-size: 12px;
    text-align: right; }
  html.registrations #user_challenge.completed .instruction,
  html.invitations #user_challenge.completed .instruction {
    visibility: hidden; }

html.registrations.edit .column .photo-editor .picture,
html.registrations.update .column .photo-editor .picture {
  position: relative;
  width: 60px;
  height: 60px;
  margin: 0 15px 0 0;
  float: left;
  z-index: 2;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
          box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
  background-color: var(--devise-surface-alt);
  background-size: cover;
  background-position: 50% 0%;
  background-repeat: no-repeat; }
html.registrations.edit .column .photo-editor .description,
html.registrations.update .column .photo-editor .description {
  position: relative;
  height: 60px;
  line-height: 58px;
  padding: 0 15px;
  font-size: 0.9em;
  background: var(--devise-surface-alt);
  border: 1px solid var(--devise-border);
  border-radius: 2px;
  white-space: nowrap;
  overflow: hidden; }
  html.registrations.edit .column .photo-editor .description .action,
  html.registrations.update .column .photo-editor .description .action {
    position: absolute;
    right: 0px;
    top: 0;
    background: transparent;
    padding: 0 15px 0 5px; }
html.registrations.edit .column .photo-editor .gravatar-photo,
html.registrations.update .column .photo-editor .gravatar-photo {
  display: none; }
html.registrations.edit .column .photo-editor[data-photo-type='gravatar'] .gravatar-photo,
html.registrations.update .column .photo-editor[data-photo-type='gravatar'] .gravatar-photo {
  display: block; }
html.registrations.edit .column .photo-editor[data-photo-type='gravatar'] .profile-photo,
html.registrations.update .column .photo-editor[data-photo-type='gravatar'] .profile-photo {
  display: none; }
html.registrations.edit .account-type,
html.registrations.update .account-type {
  margin-top: 15px;
  margin-bottom: 25px; }
  html.registrations.edit .account-type p,
  html.registrations.update .account-type p {
    margin: 0 0 5px 0; }
  html.registrations.edit .account-type .lite-account,
  html.registrations.edit .account-type .pro-account,
  html.registrations.edit .account-type .free-account,
  html.registrations.update .account-type .lite-account,
  html.registrations.update .account-type .pro-account,
  html.registrations.update .account-type .free-account {
    display: none;
    position: relative;
    padding: 15px;
    font-size: 0.9em;
    background: var(--surface-raised);
    border-radius: var(--radius-4);
    white-space: nowrap;
    overflow: hidden; }
    html.registrations.edit .account-type .lite-account .action,
    html.registrations.edit .account-type .pro-account .action,
    html.registrations.edit .account-type .free-account .action,
    html.registrations.update .account-type .lite-account .action,
    html.registrations.update .account-type .pro-account .action,
    html.registrations.update .account-type .free-account .action {
      position: absolute;
      right: 15px;
      background: transparent;
      padding: 0 0 0 5px; }
html.registrations.edit [data-toggle-content].active,
html.registrations.update [data-toggle-content].active {
  color: var(--color-text-strong); }
html.registrations.edit .optional-content,
html.registrations.update .optional-content {
  opacity: 0;
  visibility: hidden;
  max-height: 0;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease; }
  html.registrations.edit .optional-content.visible,
  html.registrations.update .optional-content.visible {
    max-height: 150px;
    opacity: 1;
    visibility: visible; }
  html.registrations.edit .optional-content .button,
  html.registrations.update .optional-content .button {
    color: var(--accent-contrast); }
html.registrations.edit .delete-account-action,
html.registrations.update .delete-account-action {
  display: none; }

html.registrations.edit[data-account=default] .free-account {
  display: block; }

html.registrations.edit[data-account=lite] .lite-account {
  display: block; }

html.registrations.edit[data-account=pro] .pro-account {
  display: block; }

html.devise .callout-section {
  background-color: var(--color-accent);
  color: var(--accent-contrast); }
html.devise .column form,
html.devise .column .sl-form {
  margin-top: 30px; }
  html.devise .column form .unit.cvc,
  html.devise .column form .unit.mmyy,
  html.devise .column .sl-form .unit.cvc,
  html.devise .column .sl-form .unit.mmyy {
    display: inline-block;
    margin-top: 0; }
  html.devise .column form .unit.mmyy,
  html.devise .column .sl-form .unit.mmyy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-right: 15px; }
  html.devise .column form .unit.mmyy label,
  html.devise .column .sl-form .unit.mmyy label {
    width: 100%; }
  html.devise .column form .unit.mmyy .sl-select,
  html.devise .column .sl-form .unit.mmyy .sl-select {
    background-color: var(--devise-surface-alt);
    border-color: var(--devise-border);
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    max-width: 120px; }
  html.devise .column form .unit.mmyy .sl-select:hover,
  html.devise .column .sl-form .unit.mmyy .sl-select:hover {
    border-color: var(--devise-border-strong); }
  html.devise .column form .unit.mmyy .mm,
  html.devise .column .sl-form .unit.mmyy .mm {
    margin-right: 4px; }
  html.devise .column form .unit.cvc,
  html.devise .column .sl-form .unit.cvc {
    width: 120px; }
  html.devise .column form .sl-info,
  html.devise .column .sl-form .sl-info {
    margin-left: 10px; }
html.devise .unit-group-description {
  margin-top: 0.5em;
  margin-bottom: 1em;
  color: var(--devise-text-muted); }
html.devise .credit-card {
  border: 1px solid var(--devise-border);
  background: var(--devise-surface);
  padding: 10px;
  margin-bottom: 20px;
  cursor: default; }
html.devise .credit-card .faded {
  color: var(--devise-text-subtle); }
html.devise .credit-card-type {
  float: right; }
html.devise .credit-card-type[data-type] {
  width: 50px;
  height: 24px;
  background-size: contain;
  background-position: 100% 50%;
  background-repeat: no-repeat; }
html.devise .credit-card-type[data-type="alipay"] {
  background-image: url(//staging.slides.com/assets/icons/cc/alipay-dccb48bb781d95b653a32866cb9faee24bec761d54315b497e261e565114e0c5.svg); }
html.devise .credit-card-type[data-type="amex"] {
  background-image: url(//staging.slides.com/assets/icons/cc/amex-69c295aeb5dc775f7eb83d88ff4d002a9701a56141b2fbdd8c6eec1e8fb51b44.svg); }
html.devise .credit-card-type[data-type="diners"] {
  background-image: url(//staging.slides.com/assets/icons/cc/diners-47dcef0a6f33ec3fbd977a725d924849a84b08bc17a85a7c3f0d0bbb8502573c.svg); }
html.devise .credit-card-type[data-type="discover"] {
  background-image: url(//staging.slides.com/assets/icons/cc/discover-65de6e725a4c0f3a629d9327fc1f81ec41471d89b90e331f92499583c2f4b61e.svg); }
html.devise .credit-card-type[data-type="jcb"] {
  background-image: url(//staging.slides.com/assets/icons/cc/jcb-ff5b117b745d51efdd91b18f78b4145642ad9d27f5e4173d96f2ddcb1864bf3a.svg); }
html.devise .credit-card-type[data-type="maestro"] {
  background-image: url(//staging.slides.com/assets/icons/cc/maestro-76863f435a5a5425468efd60be36b168ab77492a9e4bc33261e002ba02666b92.svg); }
html.devise .credit-card-type[data-type="mastercard"] {
  background-image: url(//staging.slides.com/assets/icons/cc/mastercard-59e32ecefad2e8b087426984892ad0bfe90f0e904ce8f84db99db9fd586e0cc1.svg); }
html.devise .credit-card-type[data-type="visa"] {
  background-image: url(//staging.slides.com/assets/icons/cc/visa-4619feaed108fa6ebede476bb174e75f59bf776e8ae97b57839d6dff48974706.svg); }

html.teams-reactivate .marketing-intro {
  margin-top: 30px; }

html.subscriptions.show .billing-loader .billing-loader-spinner {
  min-height: 400px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
html.subscriptions.show .billing-loader .spinner {
  display: inline-block;
  position: relative;
  margin-top: 10px;
  vertical-align: top; }
html.subscriptions.show .billing-details .field {
  margin-bottom: 10px; }
  html.subscriptions.show .billing-details .field .label {
    font-weight: 500; }
  html.subscriptions.show .billing-details .field .value {
    float: right; }
html.subscriptions.show .billing-details .field + .field {
  border-top: 1px solid var(--border-subtle);
  padding-top: 10px; }
html.subscriptions.show .billing-history table .refund {
  display: block;
  color: var(--devise-text-subtle);
  margin-left: -5px; }
html.subscriptions.show .billing-history table .download {
  text-align: right; }
html.subscriptions.show .billing-history table .download form {
  display: inline-block;
  margin: 0; }
html.subscriptions.show .billing-history table .download form + form {
  margin-left: 4px; }
html.subscriptions.show .billing-history table .download .button {
  padding: 6px;
  font-size: 12px; }
html.subscriptions.show .billing-history .sl-checkbox {
  margin-top: 30px;
  font-size: 14px; }
html.subscriptions.show .billing-settings textarea {
  font-size: 1em; }
html.subscriptions.show section .actions {
  margin-top: 40px; }
  html.subscriptions.show section .actions .title {
    margin-bottom: 20px;
    font-weight: 500; }
  html.subscriptions.show section .actions .button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-top: 10px;
    font-size: 14px;
    height: var(--button-size-5); }
html.subscriptions.show .billing-thanks {
  width: 460px; }
  html.subscriptions.show .billing-thanks section {
    padding-left: 0;
    padding-right: 0;
    background: transparent;
    -webkit-box-shadow: none;
            box-shadow: none;
    border: 0; }
html.subscriptions.show .signature-image {
  mix-blend-mode: difference;
  -webkit-filter: invert(1);
          filter: invert(1); }
html.subscriptions.show.light-theme .signature-image {
  mix-blend-mode: darken;
  -webkit-filter: none;
          filter: none; }
@media screen and (max-width: 1180px) {
  html.subscriptions.show .billing-thanks {
    display: none; } }
@media screen and (max-width: 550px) {
  html.subscriptions.show .billing-history table th.optional,
  html.subscriptions.show .billing-history table td.optional {
    display: none; } }
@media screen and (max-width: 450px) {
  html.subscriptions.show .billing-details .field .value {
    display: block;
    float: none; } }

@media screen and (max-width: 500px) {
  html.sessions.new .marketing-intro {
    display: none; } }
html.sessions.new .auth-options-sso .auth-button.sso {
  margin-top: 0;
  padding: 15px 70px 15px 15px;
  border: 0;
  background-color: var(--devise-sso-surface);
  border-radius: var(--radius-3);
  color: #fff; }
  html.sessions.new .auth-options-sso .auth-button.sso .auth-icon {
    left: auto;
    right: 0;
    border-left-color: rgba(255, 255, 255, 0.3) !important;
    color: #fff !important;
    font-size: 22px; }
  html.sessions.new .auth-options-sso .auth-button.sso:hover {
    background-color: var(--devise-sso-surface-hover);
    color: #fff; }
html.sessions.new .auth-options-sso .auth-button.sso-email-fallback {
  margin: 30px 0 0 0;
  padding: 6px 12px;
  color: var(--devise-text-muted);
  background: transparent;
  border: 1px solid var(--devise-border);
  border-radius: var(--radius-3);
  -webkit-box-shadow: none;
          box-shadow: none;
  font-weight: normal; }
  html.sessions.new .auth-options-sso .auth-button.sso-email-fallback:hover {
    color: var(--color-text-strong);
    border-color: var(--devise-border-strong); }
html.sessions.new .auth-options-sso .auth-option.email-auth {
  padding: 0; }
html.sessions.new .auth-options-sso .auth-option.email-auth .auth-toggle-content {
  border: 1px solid var(--devise-border);
  border-top: 0;
  padding: var(--space-4);
  margin-top: -4px;
  border-radius: 0 0 var(--radius-3) var(--radius-3); }
html.sessions.new .auth-options-sso .auth-toggle .text-expanded {
  display: none; }
html.sessions.new .auth-options-sso .auth-toggle.expanded .text-collapsed {
  display: none; }
html.sessions.new .auth-options-sso .auth-toggle.expanded .text-expanded {
  display: block; }

html.sessions.new .saml-auth + .email-auth {
  border-top: 0;
  font-size: 0.9em; }
  html.sessions.new .saml-auth + .email-auth form {
    padding: 12px; }

html.devise.verify section:not([data-verify-state="idle"]) {
  display: none; }
/**
 * Explore page styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.home.explore .sl-deck-thumbnail,
html.teams.show .sl-deck-thumbnail {
  background-color: var(--surface-canvas); }
html.home.explore .deck-list h1,
html.home.explore .deck-list h3,
html.teams.show .deck-list h1,
html.teams.show .deck-list h3 {
  margin-bottom: 20px; }
html.home.explore .search-form,
html.teams.show .search-form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 640px;
  font-size: 18px; }
  html.home.explore .search-form .search-term-wrapper,
  html.teams.show .search-form .search-term-wrapper {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    position: relative;
    height: var(--button-size-7); }
  html.home.explore .search-form .search-term,
  html.teams.show .search-form .search-term {
    width: 100%;
    font-size: 1em;
    padding-left: 1.6em;
    border-radius: 100px 0 0 100px;
    background: var(--form-field-surface);
    border: 1px solid var(--form-field-border);
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
    html.home.explore .search-form .search-term:focus,
    html.teams.show .search-form .search-term:focus {
      border-color: var(--form-field-border-active);
      background: var(--form-field-surface-focus); }
  html.home.explore .search-form .search-clear,
  html.teams.show .search-form .search-clear {
    display: none;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    padding: 7px 0.7em;
    font-size: 1.1em;
    background-color: transparent; }
    html.home.explore .search-form .search-clear .icon,
    html.teams.show .search-form .search-clear .icon {
      border-radius: 20px;
      padding: 6px; }
    html.home.explore .search-form .search-clear:hover .icon,
    html.teams.show .search-form .search-clear:hover .icon {
      background: var(--form-field-surface-hover); }
  html.home.explore .search-form .search-submit,
  html.teams.show .search-form .search-submit {
    height: var(--button-size-7);
    padding-right: 1.2em;
    padding-left: 1em;
    font-size: 1.3em;
    border-radius: 0 100px 100px 0; }
html.home.explore .search-keywords,
html.teams.show .search-keywords {
  max-width: 640px;
  margin: 0 auto;
  font-size: 12px;
  margin-top: 10px; }
  html.home.explore .search-keywords h4,
  html.teams.show .search-keywords h4 {
    display: inline-block;
    margin-right: 4px;
    font-size: 1em; }
  html.home.explore .search-keywords .search-keywords-list,
  html.teams.show .search-keywords .search-keywords-list {
    display: inline-block; }
  html.home.explore .search-keywords button,
  html.teams.show .search-keywords button {
    display: inline-block;
    padding: 4px;
    margin-left: 4px; }
html.home.explore .search.has-searched .search-clear,
html.teams.show .search.has-searched .search-clear {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
html.home.explore .search-results,
html.teams.show .search-results {
  display: block; }
  html.home.explore .search-results header,
  html.teams.show .search-results header {
    margin-bottom: 1em; }
  html.home.explore .search-results:not(.has-searched),
  html.teams.show .search-results:not(.has-searched) {
    display: none; }
html.home.explore .search-results-title,
html.teams.show .search-results-title {
  display: inline-block;
  position: relative;
  top: 5px;
  margin: 0 0 1em 0;
  font-style: italic;
  font-size: 16.8px;
  font-weight: normal;
  color: #555; }
html.home.explore .search-results-sorting,
html.teams.show .search-results-sorting {
  display: none;
  margin: 0 0 1em 0;
  float: right; }
  html.home.explore .search-results-sorting label,
  html.teams.show .search-results-sorting label {
    margin: 0 0 0 5px; }
html.home.explore .search-results-list,
html.teams.show .search-results-list {
  clear: both; }
@media screen and (max-width: 1200px) {
  html.home.explore .search-results,
  html.teams.show .search-results {
    max-height: none; } }
@media screen and (max-width: 950px) {
  html.home.explore .search .search-form,
  html.teams.show .search .search-form {
    font-size: 16px; } }
@media screen and (max-width: 500px) {
  html.home.explore .search .search-form,
  html.teams.show .search .search-form {
    font-size: 14px; }
  html.home.explore .search .search-results header .search-results-sorting,
  html.home.explore .search .search-results header .deck-pagination,
  html.teams.show .search .search-results header .search-results-sorting,
  html.teams.show .search .search-results header .deck-pagination {
    float: none; } }
@media screen and (max-width: 400px) {
  html.home.explore .sl-deck-thumbnail,
  html.teams.show .sl-deck-thumbnail {
    width: 100%;
    margin: 0 0 15px 0 !important; }
  html.home.explore .deck-thumb-image,
  html.teams.show .deck-thumb-image {
    margin-left: auto;
    margin-right: auto; } }
/**
 * Features page styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.home.features .features-section {
  margin: 0 auto;
  text-align: left; }
  html.home.features .features-section h3 {
    color: #999;
    margin: 0 auto;
    max-width: var(--page-max-width);
    margin-bottom: 1em; }
  html.home.features .features-section ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 0 4%;
    max-width: var(--page-max-width);
    margin: 0 auto; }
html.home.features .features-item {
  display: block;
  font-size: 14px; }
  html.home.features .features-item h4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 1.2em;
    font-weight: 600;
    margin: 20px 0 0 0; }
  html.home.features .features-item p {
    font-size: 1em;
    margin: 10px 0 2em 0;
    max-width: 45ch;
    color: var(--color-text-secondary); }
  html.home.features .features-item [data-preview-media] {
    cursor: pointer; }
html.home.features .features-tag {
  position: relative;
  padding: 4px 6px;
  margin-left: 10px;
  font-size: 14px;
  border-radius: var(--radius-3);
  color: #fff;
  background-color: var(--surface-raised); }
html.home.features .features-tag:hover {
  background-color: #226ede; }
/**
 * Explore page styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.markdown-import-page .import-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  min-height: 100vh;
  min-height: calc(100vh - var(--header-height));
  background: -webkit-gradient(linear, left bottom, left top, from(#5a5a65), to(#2f2f33));
  background: linear-gradient(0deg, #5a5a65, #2f2f33);
  padding: 4em 1em;
  gap: 4em;
  margin-bottom: 4em; }
  html.markdown-import-page .import-wrapper .sl-popup-inner {
    width: 100% !important; }
  html.markdown-import-page .import-wrapper .import-component {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1; }
html.markdown-import-page .import-component-loading {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  color: rgba(255, 255, 255, 0.7); }
html.markdown-import-page .import-component {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 500px; }
html.markdown-import-page .import-intro {
  color: #fff;
  text-align: center; }
  html.markdown-import-page .import-intro h1 {
    font-size: 2em; }
html.markdown-import-page .import-description {
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;
  -webkit-column-gap: 3em;
     -moz-column-gap: 3em;
          column-gap: 3em; }
  html.markdown-import-page .import-description ol {
    padding-left: 0;
    list-style-position: inside; }
@media screen and (max-width: 550px) {
  html.markdown-import-page .import-wrapper {
    gap: 2em;
    padding: 2em 6px 4em 6px; }
  html.markdown-import-page .import-description {
    -webkit-column-count: auto;
       -moz-column-count: auto;
            column-count: auto; } }
/**
 * Shared marketing page foundation.
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.marketing-page {
  --marketing-shell-padding-bottom: clamp( 72px, 10vw, 120px );
  --marketing-background-height: 90vh;
  --marketing-section-padding-y: clamp( 56px, 8vw, 112px );
  --marketing-section-padding-top-first: clamp( 108px, 11vw, 148px );
  --marketing-section-gap-hero: clamp( 38px, 5vw, 64px );
  --marketing-section-gap-split: clamp( 28px, 5vw, 64px );
  --marketing-section-gap-split-tight: 12px;
  --marketing-section-gap-stacked: clamp( 28px, 4vw, 40px );
  --marketing-split-content-column: 0.45fr;
  --marketing-split-media-column: 0.55fr;
  --marketing-cta-panel-min-height: clamp( 260px, 28vw, 360px );
  --marketing-cta-panel-padding-y: clamp( 32px, 5vw, 56px );
  --marketing-cta-panel-padding-x: clamp( 28px, 5vw, 48px );
  --marketing-cta-content-gap: clamp( 24px, 4vw, 40px );
  --marketing-split-text-panel-padding: clamp( 14px, 2vw, 14px );
  --marketing-radius: clamp( 8px, 2vw, 14px );
  --marketing-radius-inner: clamp( 4px, 1vw, 10px );
  --marketing-cta-panel-radius: var(--marketing-radius);
  --marketing-media-radius: var(--marketing-radius);
  --marketing-grid-radius: var(--marketing-radius);
  --marketing-grid-content-padding: calc(var(--marketing-split-text-panel-padding) * 2);
  --marketing-demo-panel-width: min( 1480px, calc( 100vw - 32px ) );
  --marketing-demo-panel-aspect-ratio: 16 / 9;
  --marketing-demo-panel-bottom: 0px;
  --marketing-demo-panel-chrome-height: 120px;
  --marketing-demo-panel-padding-x: 22px;
  --marketing-demo-panel-padding-top: 18px;
  --marketing-demo-panel-padding-bottom: 32px;
  --marketing-mobile-background-height: clamp( 440px, 112vw, 720px );
  --marketing-mobile-section-padding-y: 68px;
  --marketing-mobile-section-padding-top-first: 128px;
  --marketing-font-size-title: clamp(38px, 4vw, 48px);
  --marketing-font-size-title-hero: clamp(38px, 6vw, 64px);
  --marketing-font-size-copy: clamp( 14px, 1.4vw, 16px );
  --marketing-font-size-cta: 15px;
  --marketing-font-size-cta-strong: 18px;
  --marketing-font-size-grid-title: clamp( 16px, 1.8vw, 24px );
  --marketing-color-grape-light: #ddd9e4;
  --marketing-gradient-split-text-panel: linear-gradient(
  	20deg,
  	var(--surface-panel) 0%,
  	var(--surface-canvas) 40%,
  	var(--surface-canvas) 80%,
  	var(--surface-panel) 100%
  );
  --marketing-gradient-split-text-panel-flipped: linear-gradient(
  	-20deg,
  	var(--surface-panel) 0%,
  	var(--surface-canvas) 40%,
  	var(--surface-canvas) 80%,
  	var(--surface-panel) 100%
  );
  --marketing-gradient-split-text-panel-border: linear-gradient(
  	225deg,
  	var(--border-strong) 0%,
  	var(--border-default) 10%,
  	var(--border-default) 40%,
  	transparent 100%
  );
  --marketing-gradient-split-text-panel-border-flipped: linear-gradient(
  	135deg,
  	var(--border-strong) 0%,
  	var(--border-default) 10%,
  	var(--border-default) 40%,
  	transparent 100%
  );
  --marketing-gradient-hero-media-border: linear-gradient(
  	225deg,
  	var(--border-strongest) 0%,
  	var(--border-default) 10%,
  	var(--border-default) 50%,
  	transparent 90%,
  	var(--border-default) 100%
  );
  /* Gradient surface helpers */ }
  html.marketing-page a:focus {
    outline: none; }
  html.marketing-page a:focus-visible {
    outline: 1px solid #226ede;
    outline-offset: 4px; }
  html.marketing-page .marketing-page-main {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            flex: 1 0 auto; }
  html.marketing-page .marketing-page-shell {
    position: relative;
    isolation: isolate;
    padding: 0 var(--page-padding);
    padding-bottom: var(--marketing-shell-padding-bottom);
    color: var(--color-page); }
  html.marketing-page.marketing-demo-panel-open {
    overflow: hidden; }
  html.marketing-page .marketing-page-shell-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: var(--marketing-background-height);
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    opacity: 1;
    background: transparent; }
  html.marketing-page .marketing-page-shell-background-canvas {
    display: block;
    width: 100%;
    height: 100%; }
  html.marketing-page .marketing-page-shell.is-background-effect-unavailable .marketing-page-shell-background-canvas {
    display: none; }
  html.marketing-page .marketing-page-section {
    z-index: 1; }
  html.marketing-page .marketing-page-section {
    position: relative;
    padding: var(--marketing-section-padding-y) 0;
    max-width: calc( var(--page-max-width) - var(--page-padding) * 2 );
    margin: auto; }
  html.marketing-page .marketing-page-section.is-first {
    padding-top: var(--marketing-section-padding-top-first); }
  html.marketing-page .marketing-page-section + .marketing-page-section {
    border-top: 1px solid var(--border-section); }
  html.marketing-page .marketing-page-section-compact-top {
    padding-top: 0;
    border-top: 0 !important; }
  html.marketing-page .marketing-page-section-inner {
    margin: 0 auto; }
  html.marketing-page .marketing-page-section-hero-inner {
    display: grid;
    gap: var(--marketing-section-gap-hero); }
  html.marketing-page .marketing-page-section-intro-media.is-first {
    padding-top: clamp(88px, 10vw, 132px); }
  html.marketing-page .marketing-page-split-layout,
  html.marketing-page .marketing-page-section-split-inner {
    display: grid;
    grid-template-columns: minmax(0, var(--marketing-split-content-column)) minmax(0, var(--marketing-split-media-column));
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
    gap: var(--marketing-section-gap-split-tight); }
  html.marketing-page .marketing-page-section-stacked-inner {
    display: grid;
    gap: var(--marketing-section-gap-stacked); }
  html.marketing-page .marketing-page-section-flipped .marketing-page-section-content {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2; }
  html.marketing-page .marketing-page-section-flipped .marketing-page-section-media {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1; }
  html.marketing-page .marketing-page-section-content {
    max-width: 760px; }
  html.marketing-page .marketing-page-section-split-inner .marketing-page-section-content {
    padding: var(--marketing-split-text-panel-padding); }
  html.marketing-page .marketing-page-hero-intro {
    max-width: none; }
  html.marketing-page .marketing-page-hero-announcement {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: var(--space-2);
    max-width: 100%;
    margin-bottom: var(--space-6);
    padding: var(--space-2) var(--space-4) var(--space-2) var(--space-2);
    border-radius: var(--radius-full);
    color: var(--color-text-strong);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none; }
  html.marketing-page .marketing-page-hero-announcement-outline {
    position: absolute;
    inset: 0;
    border: 1px solid var(--border-strong);
    border-radius: inherit;
    background: transparent;
    -webkit-transition: inset 0.3s var(--ease-out-back), border-color 0.2s ease;
    transition: inset 0.3s var(--ease-out-back), border-color 0.2s ease;
    z-index: 0; }
  html.marketing-page .marketing-page-hero-announcement:hover .marketing-page-hero-announcement-outline {
    inset: -2px;
    border-color: var(--border-strongest); }
  html.marketing-page .marketing-page-hero-announcement-badge {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 0 var(--space-3);
    min-height: calc( var(--button-size-1) );
    border-radius: var(--radius-full);
    background: var(--button-strong-surface);
    color: var(--button-strong-text);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    z-index: 1; }
  html.marketing-page .marketing-page-hero-announcement-label {
    min-width: 0;
    color: inherit;
    position: relative;
    z-index: 1; }
  html.marketing-page .marketing-page-gradient-surface {
    position: relative;
    background: var(--marketing-gradient-surface-background, var(--marketing-gradient-split-text-panel)); }
  html.marketing-page .marketing-page-gradient-surface::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 1px;
    border-radius: inherit;
    background: var(--marketing-gradient-surface-border, var(--marketing-gradient-split-text-panel-border));
    pointer-events: none;
    z-index: 2;
    -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
            mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude; }
  html.marketing-page .marketing-page-gradient-surface-flipped {
    --marketing-gradient-surface-background: var(--marketing-gradient-split-text-panel-flipped);
    --marketing-gradient-surface-border: var(--marketing-gradient-split-text-panel-border-flipped); }
  html.marketing-page .marketing-page-gradient-surface-hero {
    --marketing-gradient-surface-background: transparent;
    --marketing-gradient-surface-border: var(--marketing-gradient-hero-media-border); }
  html.marketing-page .marketing-page-section-text-media .marketing-page-section-inner {
    padding: var(--marketing-split-text-panel-padding);
    border-radius: var(--marketing-radius); }
  html.marketing-page .marketing-page-section-text-media .marketing-page-section-split-inner {
    grid-template-columns: var(--marketing-split-content-column) var(--marketing-split-media-column); }
  html.marketing-page .marketing-page-section-text-media .marketing-page-section-split-inner .marketing-page-media {
    border-radius: var(--marketing-radius-inner); }
  html.marketing-page .marketing-page-section-text-media.marketing-page-section-flipped .marketing-page-section-split-inner {
    grid-template-columns: var(--marketing-split-media-column) var(--marketing-split-content-column); }
  html.marketing-page .marketing-page-section-intro-media .marketing-page-section-inner {
    padding: 0;
    border-radius: 0; }
  html.marketing-page .marketing-page-section-intro-media .marketing-page-section-split-inner {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: clamp(28px, 5vw, 72px); }
  html.marketing-page .marketing-page-section-intro-media.marketing-page-section-flipped .marketing-page-section-split-inner {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); }
  html.marketing-page .marketing-page-section-intro-media .marketing-page-section-split-inner .marketing-page-section-content {
    padding: 0; }
  html.marketing-page .marketing-page-section-intro-media-content {
    max-width: 680px; }
  html.marketing-page .marketing-page-title-intro {
    max-width: 10ch;
    font-size: clamp(42px, 6vw, 64px); }
  html.marketing-page .marketing-page-copy-intro {
    max-width: 34ch;
    font-size: clamp(17px, 2vw, 20px);
    line-height: 1.45; }
  html.marketing-page .marketing-page-section-intro-media-figure .marketing-page-media {
    border-radius: var(--marketing-radius); }
  html.marketing-page .marketing-page-section-intro-media-figure .marketing-page-media-frame {
    border-radius: var(--marketing-radius-inner); }
  html.marketing-page .marketing-page-section-feature {
    width: 100%; }
  html.marketing-page .marketing-page-section-media {
    width: 100%; }
  html.marketing-page .marketing-page-title {
    margin: 0;
    max-width: 25ch;
    color: var(--color-text-strong);
    font-size: var(--marketing-font-size-title);
    line-height: 0.96;
    letter-spacing: -0.02em; }
  html.marketing-page .marketing-page-title-hero {
    font-size: var(--marketing-font-size-title-hero); }
  html.marketing-page .marketing-page-copy {
    max-width: 54ch;
    margin-top: 1em;
    color: var(--color-text-muted);
    font-size: var(--marketing-font-size-copy);
    font-weight: 500;
    line-height: 1.4; }
  html.marketing-page .marketing-page-copy p {
    margin: 0; }
  html.marketing-page .marketing-page-copy p + p {
    margin-top: 1em; }
  html.marketing-page .marketing-page-cta-panel {
    position: relative; }
  html.marketing-page .marketing-page-cta-layout {
    display: grid;
    grid-template-columns: 480px 1fr;
    gap: var(--marketing-section-gap-split-tight);
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch; }
  html.marketing-page .marketing-page-cta-content {
    position: relative;
    max-width: none;
    min-height: clamp(360px, 34vw, 460px);
    display: grid;
    -ms-flex-line-pack: center;
        align-content: center;
    gap: var(--marketing-cta-content-gap);
    padding: clamp(40px, 5vw, 64px);
    border-radius: var(--marketing-cta-panel-radius);
    background: var(--color-spot-1); }
  html.marketing-page .marketing-page-cta-title {
    color: var(--color-spot-1-fg);
    max-width: 8ch;
    font-size: clamp(42px, 5vw, 58px); }
  html.marketing-page .marketing-page-cta-section .marketing-page-actions {
    margin-top: 0;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start; }
  html.marketing-page .marketing-page-cta-brand {
    position: relative;
    overflow: hidden;
    min-height: clamp(360px, 34vw, 460px);
    border-radius: var(--marketing-cta-panel-radius);
    color: var(--border-default);
    display: grid;
    place-items: center; }
  html.marketing-page .marketing-page-cta-brand-mark {
    position: relative;
    z-index: 1;
    width: min(68%, 460px);
    opacity: 0.9; }
  html.marketing-page .marketing-page-cta-brand-mark svg {
    display: block;
    width: 100%;
    height: auto; }
  html.marketing-page .marketing-page-cta-media {
    position: relative;
    overflow: hidden;
    min-height: var(--marketing-cta-panel-min-height);
    border-radius: var(--marketing-cta-panel-radius);
    background: var(--marketing-color-grape-light); }
  html.marketing-page .marketing-page-cta-media > * {
    width: 100%;
    height: 100%; }
  html.marketing-page .marketing-page-cta-media .marketing-page-media {
    height: 100%;
    border: 0;
    -webkit-box-shadow: none;
            box-shadow: none; }
  html.marketing-page .marketing-page-cta-media .marketing-page-media-frame {
    height: 100%;
    aspect-ratio: auto; }
  html.marketing-page .marketing-page-cta-media-placeholder {
    min-height: inherit; }
  html.marketing-page .marketing-page-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px; }
  html.marketing-page .marketing-page-cta {
    margin-top: 24px; }
  html.marketing-page .marketing-page-actions .cta-button {
    margin-top: 0; }
  html.marketing-page .marketing-page-cta-section .cta-button-strong {
    min-height: var(--button-size-7);
    font-size: var(--marketing-font-size-cta);
    font-weight: 600; }
  html.marketing-page .marketing-page-demo-panel {
    position: fixed;
    inset: 0;
    z-index: 40;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 24px 24px 0;
    pointer-events: none; }
  html.marketing-page .marketing-page-demo-panel[hidden] {
    display: none; }
  html.marketing-page .marketing-page-demo-panel-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(9, 10, 14, 0.42);
    backdrop-filter: blur(14px) saturate(0.9);
    opacity: 0;
    -webkit-transition: opacity 0.22s ease;
    transition: opacity 0.22s ease;
    pointer-events: auto; }
  html.marketing-page .marketing-page-demo-panel-sheet {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: min(var(--marketing-demo-panel-width), calc( ( ( 100vh - 24px - var(--marketing-demo-panel-chrome-height) ) * ( 16 / 9 ) ) + ( var(--marketing-demo-panel-padding-x) * 2 ) ));
    max-width: calc( 100vw - 48px );
    height: auto;
    max-height: calc( 100vh - 24px );
    padding: var(--marketing-demo-panel-padding-top) var(--marketing-demo-panel-padding-x) var(--marketing-demo-panel-padding-bottom);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom: 0;
    border-radius: var(--marketing-radius) var(--marketing-radius) 0 0;
    background: rgba(16, 16, 18, 0.96);
    -webkit-transform: translateY(48px);
            transform: translateY(48px);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    opacity: 0;
    -webkit-transition: opacity 0.22s ease, -webkit-transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);
    transition: opacity 0.22s ease, -webkit-transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);
    transition: transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.22s ease;
    transition: transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.22s ease, -webkit-transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);
    pointer-events: auto; }
  html.marketing-page .marketing-page-demo-panel.is-open .marketing-page-demo-panel-backdrop {
    opacity: 1; }
  html.marketing-page .marketing-page-demo-panel.is-open .marketing-page-demo-panel-sheet {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1; }
  html.marketing-page .marketing-page-demo-panel-close {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 999px;
    color: rgba(12, 12, 14, 0.96);
    background: rgba(255, 255, 255, 0.98);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    -webkit-transition: background-color 0.15s ease, -webkit-transform 0.15s ease;
    transition: background-color 0.15s ease, -webkit-transform 0.15s ease;
    transition: background-color 0.15s ease, transform 0.15s ease;
    transition: background-color 0.15s ease, transform 0.15s ease, -webkit-transform 0.15s ease;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto; }
  html.marketing-page .marketing-page-demo-panel-close span {
    display: block;
    line-height: 1; }
  html.marketing-page .marketing-page-demo-panel-close:hover {
    background: white;
    -webkit-transform: translateY(-1px);
            transform: translateY(-1px); }
  html.marketing-page .marketing-page-demo-panel-close:focus {
    outline: none; }
  html.marketing-page .marketing-page-demo-panel-close:focus-visible {
    outline: 1px solid #226ede;
    outline-offset: 3px; }
  html.marketing-page .marketing-page-demo-panel-frame {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    width: 100%;
    aspect-ratio: var(--marketing-demo-panel-aspect-ratio);
    max-height: calc( 100vh - 24px - var(--marketing-demo-panel-chrome-height) );
    min-height: 0;
    margin-inline: auto;
    overflow: hidden;
    border-radius: var(--marketing-radius-inner);
    background: #070709;
    -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
  html.marketing-page .marketing-page-demo-panel-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    gap: 12px;
    margin-bottom: 14px; }
  html.marketing-page .marketing-page-demo-panel-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: var(--radius-full);
    color: var(--color-text-strong);
    background: rgba(255, 255, 255, 0.1);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    -webkit-transition: background-color 0.15s ease, -webkit-transform 0.15s ease;
    transition: background-color 0.15s ease, -webkit-transform 0.15s ease;
    transition: background-color 0.15s ease, transform 0.15s ease;
    transition: background-color 0.15s ease, transform 0.15s ease, -webkit-transform 0.15s ease; }
  html.marketing-page .marketing-page-demo-panel-link:hover {
    background: rgba(255, 255, 255, 0.16);
    -webkit-transform: translateY(-1px);
            transform: translateY(-1px); }
  html.marketing-page .marketing-page-demo-panel-link:focus {
    outline: none; }
  html.marketing-page .marketing-page-demo-panel-link:focus-visible {
    outline: 1px solid #226ede;
    outline-offset: 3px; }
  html.marketing-page .marketing-page-demo-panel-iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: #070709; }
  html.marketing-page .marketing-page-media {
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: 0;
    border: 1px solid var(--border-section);
    border-radius: var(--marketing-media-radius);
    background: -webkit-gradient(linear, left top, left bottom, from(var(--surface-panel)), to(var(--surface-canvas)));
    background: linear-gradient(180deg, var(--surface-panel), var(--surface-canvas)); }
  html.marketing-page .marketing-page-media-frame {
    width: 100%;
    aspect-ratio: var(--marketing-media-aspect-ratio);
    overflow: hidden; }
  html.marketing-page .marketing-page-section-hero .marketing-page-media {
    padding: var(--marketing-split-text-panel-padding);
    border: 0;
    background: transparent; }
  html.marketing-page .marketing-page-section-hero .marketing-page-media-frame {
    border-radius: var(--marketing-radius-inner);
    -webkit-box-shadow: 0 0 0 1px var(--border-subtle);
            box-shadow: 0 0 0 1px var(--border-subtle); }
  html.marketing-page .marketing-page-media-asset {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover; }
  html.marketing-page .marketing-page-media-video .marketing-page-media-asset {
    opacity: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease; }
  html.marketing-page .marketing-page-media-video.is-loaded .marketing-page-media-asset,
  html.marketing-page .marketing-page-media-video video[autoplay] {
    opacity: 1; }
  html.marketing-page .marketing-page-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--marketing-section-gap-split-tight); }
  html.marketing-page .marketing-page-grid-item {
    display: grid;
    grid-template-rows: auto minmax(140px, auto);
    gap: 0;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    border-radius: var(--marketing-grid-radius);
    background: var(--surface-panel); }
  html.marketing-page .marketing-page-grid-item .marketing-page-media {
    padding: var(--marketing-split-text-panel-padding);
    border: 0;
    border-radius: 0;
    background: transparent;
    margin-bottom: calc(var(--marketing-split-text-panel-padding) * -1); }
  html.marketing-page .marketing-page-grid-item .marketing-page-media-frame {
    aspect-ratio: 16 / 10;
    border-radius: var(--marketing-radius-inner);
    -webkit-box-shadow: 0 0 0 1px var(--border-subtle);
            box-shadow: 0 0 0 1px var(--border-subtle); }
  html.marketing-page .marketing-page-grid-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    padding: var(--marketing-grid-content-padding); }
  html.marketing-page .marketing-page-grid-title {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--marketing-font-size-grid-title);
    line-height: 1.05;
    letter-spacing: -0.03em; }
  @supports (animation-timeline: view()) {
    html.marketing-page .features-section .features-item,
    html.marketing-page .features-section .features-section-title,
    html.marketing-page .marketing-section .tier,
    html.marketing-page .sl-text-grid .cell,
    html.marketing-page .global-footer-links,
    html.marketing-page .global-footer-bottom,
    html.marketing-page .marketing-page-section-intro,
    html.marketing-page .marketing-page-section-content:not(.marketing-page-cta-content),
    html.marketing-page .marketing-page-cta-panel,
    html.marketing-page .marketing-page-section-feature,
    html.marketing-page .marketing-page-section-media,
    html.marketing-page .marketing-page-section-intro,
    html.marketing-page .marketing-page-grid-item {
      -webkit-animation-name: marketing-page-section-reveal;
              animation-name: marketing-page-section-reveal;
      -webkit-animation-duration: 1s;
              animation-duration: 1s;
      -webkit-animation-timing-function: linear;
              animation-timing-function: linear;
      -webkit-animation-fill-mode: both;
              animation-fill-mode: both;
      animation-timeline: view();
      animation-range: entry 0% entry min(12vh, 100%);
      will-change: opacity, transform; } }
@-webkit-keyframes marketing-page-section-reveal {
  from {
    opacity: 0.25;
    -webkit-filter: blur(10px);
            filter: blur(10px); }
  to {
    opacity: 1;
    -webkit-filter: blur(0);
            filter: blur(0); } }
@keyframes marketing-page-section-reveal {
  from {
    opacity: 0.25;
    -webkit-filter: blur(10px);
            filter: blur(10px); }
  to {
    opacity: 1;
    -webkit-filter: blur(0);
            filter: blur(0); } }
  @media screen and (max-width: 980px) {
    html.marketing-page .marketing-page-split-layout,
    html.marketing-page .marketing-page-section-split-inner {
      grid-template-columns: 1fr !important; }
    html.marketing-page .marketing-page-section-split-inner .marketing-page-section-content {
      padding: calc( var(--marketing-split-text-panel-padding) * 2 ) 0 calc( var(--marketing-split-text-panel-padding) * 2 ) 0; }
    html.marketing-page .marketing-page-section-intro-media .marketing-page-section-split-inner .marketing-page-section-content {
      padding: 0; }
    html.marketing-page .marketing-page-section-flipped .marketing-page-section-content,
    html.marketing-page .marketing-page-section-flipped .marketing-page-section-media {
      -webkit-box-ordinal-group: initial;
          -ms-flex-order: initial;
              order: initial; }
    html.marketing-page .marketing-page-grid {
      grid-template-columns: 1fr; } }
  @media screen and (max-width: 720px) {
    html.marketing-page .marketing-page-shell-background {
      height: var(--marketing-mobile-background-height); }
    html.marketing-page .marketing-page-section {
      padding: var(--marketing-mobile-section-padding-y) 0; }
    html.marketing-page .marketing-page-section.is-first {
      padding-top: var(--marketing-mobile-section-padding-top-first); }
    html.marketing-page .marketing-page-title {
      max-width: none; }
    html.marketing-page .marketing-page-hero-announcement {
      font-size: 0.875rem; }
    html.marketing-page .marketing-page-hero-announcement-badge {
      padding: 0 var(--space-2);
      font-size: 0.8125rem; }
    html.marketing-page .marketing-page-section-intro-media.is-first {
      padding-top: 108px; }
    html.marketing-page .marketing-page-section-intro-media .marketing-page-section-split-inner {
      gap: 24px; }
    html.marketing-page .marketing-page-section-intro-media-content {
      max-width: none; }
    html.marketing-page .marketing-page-copy-intro {
      max-width: none;
      font-size: 16px; }
    html.marketing-page .marketing-page-cta-layout {
      grid-template-columns: 1fr; }
    html.marketing-page .marketing-page-cta-content {
      min-height: 0;
      padding: 32px 24px; }
    html.marketing-page .marketing-page-cta-section .marketing-page-actions {
      width: 100%;
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start; }
    html.marketing-page .marketing-page-cta-brand-mark {
      width: min(48vw, 300px); }
    html.marketing-page .marketing-page-demo-panel {
      padding: 12px 12px 0; }
    html.marketing-page .marketing-page-demo-panel-sheet {
      --marketing-demo-panel-padding-x: 16px;
      --marketing-demo-panel-padding-top: 16px;
      --marketing-demo-panel-padding-bottom: 24px;
      border-radius: var(--marketing-radius) var(--marketing-radius) 0 0; }
    html.marketing-page .marketing-page-demo-panel-sheet {
      --marketing-demo-panel-chrome-height: 104px; }
    html.marketing-page .marketing-page-demo-panel-frame {
      border-radius: var(--marketing-radius-inner) var(--marketing-radius-inner) 0 0; }
    html.marketing-page .marketing-page-demo-panel-close {
      top: 12px;
      right: 12px; } }
/**
 * Marketing page visualization media.
 */
html.marketing-page .marketing-page-media-visualization {
  background: -webkit-gradient(linear, left top, left bottom, from(var(--surface-panel)), to(var(--surface-canvas)));
  background: linear-gradient(180deg, var(--surface-panel), var(--surface-canvas)); }
html.marketing-page .marketing-page-visualization {
  overflow: hidden;
  background: transparent;
  color: var(--color-text-strong); }
html.marketing-page .marketing-page-visualization-scene {
  --visualization-pointer-x: 0;
  --visualization-pointer-y: 0;
  position: absolute;
  inset: 0;
  -webkit-transform: rotateX(calc( var(--visualization-pointer-y) * -5deg )) rotateY(calc( var(--visualization-pointer-x) * 6deg ));
          transform: rotateX(calc( var(--visualization-pointer-y) * -5deg )) rotateY(calc( var(--visualization-pointer-x) * 6deg ));
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transition: -webkit-transform 0.24s ease;
  transition: -webkit-transform 0.24s ease;
  transition: transform 0.24s ease;
  transition: transform 0.24s ease, -webkit-transform 0.24s ease; }
html.marketing-page .marketing-page-visualization-svg {
  width: auto;
  height: 100%;
  max-width: 100%;
  margin: auto;
  padding: clamp(18px, 4vw, 34px);
  overflow: visible; }
html.marketing-page .marketing-page-visualization-slide-outline {
  fill: transparent;
  stroke: currentColor;
  stroke-width: 1;
  vector-effect: non-scaling-stroke; }
html.marketing-page .marketing-page-visualization-slide-marker {
  fill: var(--color-spot-1);
  transform-box: fill-box;
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation: marketing-page-teams-aligned-color 9s linear infinite, marketing-page-teams-aligned-pulse 9s ease-in-out infinite;
          animation: marketing-page-teams-aligned-color 9s linear infinite, marketing-page-teams-aligned-pulse 9s ease-in-out infinite;
  -webkit-animation-delay: var(--visualization-delay), var(--visualization-delay);
          animation-delay: var(--visualization-delay), var(--visualization-delay);
  vector-effect: non-scaling-stroke; }
@media (prefers-reduced-motion: reduce) {
  html.marketing-page .marketing-page-visualization-scene {
    -webkit-transform: none;
            transform: none; }
  html.marketing-page .marketing-page-visualization-slide-marker {
    -webkit-animation: none;
            animation: none;
    fill: var(--color-spot-3); } }
@-webkit-keyframes marketing-page-teams-aligned-color {
  0%,
		24%,
		100% {
    fill: var(--color-spot-1); }
  29%,
		49% {
    fill: var(--color-spot-2); }
  55%,
		75% {
    fill: var(--color-spot-3); }
  82% {
    fill: var(--color-spot-1); } }
@keyframes marketing-page-teams-aligned-color {
  0%,
		24%,
		100% {
    fill: var(--color-spot-1); }
  29%,
		49% {
    fill: var(--color-spot-2); }
  55%,
		75% {
    fill: var(--color-spot-3); }
  82% {
    fill: var(--color-spot-1); } }
@-webkit-keyframes marketing-page-teams-aligned-pulse {
  0%,
		25%,
		51%,
		78%,
		100% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  28%,
		54%,
		81% {
    -webkit-transform: scale(1.4);
            transform: scale(1.4); }
  33%,
		59%,
		86% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
@keyframes marketing-page-teams-aligned-pulse {
  0%,
		25%,
		51%,
		78%,
		100% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  28%,
		54%,
		81% {
    -webkit-transform: scale(1.4);
            transform: scale(1.4); }
  33%,
		59%,
		86% {
    -webkit-transform: scale(1);
            transform: scale(1); } }
/**
 * Simple CSS-only spinner animation from https://github.com/tobiasahlin/SpinKit
 */
@-webkit-keyframes sk-circleFadeDelay {
  0%, 39%, 100% {
    opacity: 0; }
  40% {
    opacity: 1; } }
@keyframes sk-circleFadeDelay {
  0%, 39%, 100% {
    opacity: 0; }
  40% {
    opacity: 1; } }
.sk-fading-circle {
  margin: auto;
  width: 60px;
  height: 60px;
  position: relative; }

.sk-fading-circle .sk-circle {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0; }

.sk-fading-circle .sk-circle:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 8px;
  height: 8px;
  background-color: #fff;
  border-radius: 25px;
  -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
          animation: sk-circleFadeDelay 1.2s infinite ease-in-out both; }

.sk-fading-circle .sk-circle2 {
  -webkit-transform: rotate(30deg);
          transform: rotate(30deg); }

.sk-fading-circle .sk-circle3 {
  -webkit-transform: rotate(60deg);
          transform: rotate(60deg); }

.sk-fading-circle .sk-circle4 {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg); }

.sk-fading-circle .sk-circle5 {
  -webkit-transform: rotate(120deg);
          transform: rotate(120deg); }

.sk-fading-circle .sk-circle6 {
  -webkit-transform: rotate(150deg);
          transform: rotate(150deg); }

.sk-fading-circle .sk-circle7 {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }

.sk-fading-circle .sk-circle8 {
  -webkit-transform: rotate(210deg);
          transform: rotate(210deg); }

.sk-fading-circle .sk-circle9 {
  -webkit-transform: rotate(240deg);
          transform: rotate(240deg); }

.sk-fading-circle .sk-circle10 {
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg); }

.sk-fading-circle .sk-circle11 {
  -webkit-transform: rotate(300deg);
          transform: rotate(300deg); }

.sk-fading-circle .sk-circle12 {
  -webkit-transform: rotate(330deg);
          transform: rotate(330deg); }

.sk-fading-circle .sk-circle2:before {
  -webkit-animation-delay: -1.1s;
          animation-delay: -1.1s; }

.sk-fading-circle .sk-circle3:before {
  -webkit-animation-delay: -1s;
          animation-delay: -1s; }

.sk-fading-circle .sk-circle4:before {
  -webkit-animation-delay: -0.9s;
          animation-delay: -0.9s; }

.sk-fading-circle .sk-circle5:before {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s; }

.sk-fading-circle .sk-circle6:before {
  -webkit-animation-delay: -0.7s;
          animation-delay: -0.7s; }

.sk-fading-circle .sk-circle7:before {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s; }

.sk-fading-circle .sk-circle8:before {
  -webkit-animation-delay: -0.5s;
          animation-delay: -0.5s; }

.sk-fading-circle .sk-circle9:before {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s; }

.sk-fading-circle .sk-circle10:before {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s; }

.sk-fading-circle .sk-circle11:before {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s; }

.sk-fading-circle .sk-circle12:before {
  -webkit-animation-delay: -0.1s;
          animation-delay: -0.1s; }
/**
 * Shared views for all static pages.
 */
html.static.about .contact {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: var(--space-3);
  gap: var(--space-3); }
html.static.about .team {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--space-4); }
@media screen and (max-width: 500px) {
  html.static.about .team {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; } }
html.static.about .team-person {
  width: 100%;
  max-width: 40ch;
  padding-right: 20px;
  padding-bottom: 20px; }
html.static.about .team-person-picture {
  display: inline-block;
  position: relative;
  z-index: 1; }
html.static.about .team-person-picture:before, html.static.about .team-person-picture:after {
  position: absolute;
  width: 45%;
  height: 10px;
  content: ' ';
  left: 7px;
  bottom: 7px;
  background: transparent;
  -webkit-transform: rotate(-2deg);
          transform: rotate(-2deg);
  -webkit-box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
          box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
  z-index: -1; }
html.static.about .team-person-picture:after {
  left: auto;
  right: 7px;
  -webkit-transform: rotate(2deg);
          transform: rotate(2deg); }
html.static.about .team-person-picture img {
  display: block;
  max-width: 170px;
  border: 4px solid var(--border-default);
  border-radius: var(--card-radius); }
html.static.about .team-person-bio {
  color: var(--color-text-secondary); }
html.static.about .team-person .name {
  font-weight: 600;
  margin-right: 10px;
  vertical-align: middle; }
html.static.about #brand .logo-item {
  display: inline-block;
  margin-bottom: 20px;
  vertical-align: top; }
  html.static.about #brand .logo-item img {
    width: 100%;
    max-width: 380px;
    border-radius: var(--card-radius);
    padding: 10px;
    background: #cfcfcf93; }
html.static.about #brand .logo-item:not(:last-child) {
  margin-right: 20px; }
html.static.about #brand h2:not(:first-child) {
  margin-top: 2em; }
html.static.about #brand .color-item {
  display: inline-block;
  position: relative;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  margin-right: -40px; }
  html.static.about #brand .color-item .color-item-label {
    display: block;
    position: relative;
    width: 100%;
    top: 86px;
    color: #fff;
    text-align: center; }
html.static.about #screenshots .screenshot-item {
  display: inline-block;
  margin: 7px; }
  html.static.about #screenshots .screenshot-item img {
    max-width: 100%;
    border: 1px solid var(--border-default);
    border-radius: var(--card-radius); }
  html.static.about #screenshots .screenshot-item img.white-edges {
    border-color: var(--border-default); }
html.static.about #testimonials .twitter-tweet {
  display: inline-block !important;
  margin: 8px 5px !important;
  vertical-align: top; }
html.static.about #testimonials iframe {
  border-radius: var(--card-radius); }
/**
 * Shared views for all static pages.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.static .column p, html.static .column ul, html.static .column ol, html.static .column blockquote,
html.docs .column p,
html.docs .column ul,
html.docs .column ol,
html.docs .column blockquote {
  max-width: 80ch; }
html.static .column ul,
html.docs .column ul {
  list-style: disc;
  margin: 20px 0 30px 20px; }
  html.static .column ul ul,
  html.docs .column ul ul {
    margin-top: 0;
    margin-bottom: 10px;
    list-style: circle;
    font-size: 0.9em; }
html.static .column ol,
html.docs .column ol {
  margin: 20px 0 30px 20px; }
html.static .column ol li,
html.static .column ul li,
html.docs .column ol li,
html.docs .column ul li {
  margin: 0.5em 0; }
html.static .column dl dt,
html.docs .column dl dt {
  font-weight: 600; }
html.static .column dl dd,
html.docs .column dl dd {
  margin: 0; }
html.static .column dl dd + dt,
html.docs .column dl dd + dt {
  margin-top: 0.5em; }
html.static .column h3,
html.static .column h4,
html.docs .column h3,
html.docs .column h4 {
  margin-top: 1.5em; }
html.static .column h2, html.static .column h3, html.static .column h4,
html.docs .column h2,
html.docs .column h3,
html.docs .column h4 {
  font-weight: 600; }
html.static .column hr,
html.docs .column hr {
  background: var(--border-default);
  border: 0;
  height: 1px;
  margin: var(--space-8) 0; }
html.static .column.wide,
html.docs .column.wide {
  width: 800px;
  max-width: 100%; }
html.static .column.wide-l,
html.docs .column.wide-l {
  width: 900px;
  max-width: 100%; }

html.static.partners .partner-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #ddd;
  padding-bottom: 20px;
  margin-bottom: 20px; }
html.static.partners .partner-header .meta {
  text-align: right; }
html.static.partners .partner-header .url {
  margin: 12px 0 0 0;
  font-size: 16px;
  text-decoration: underline; }
html.static.partners .partner-header .category {
  color: #999;
  border: 1px solid #eee;
  padding: 4px;
  font-size: 0.7em;
  text-transform: uppercase; }

html.static.message section {
  font-size: 1.4em;
  min-height: 40vh;
  display: grid;
  place-items: center; }
/**
 * Changelog styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.static.changelog .sl-changelog {
  position: relative;
  max-width: 600px;
  padding-left: 120px;
  margin: 80px auto 0 auto;
  font-size: 16px; }
  html.static.changelog .sl-changelog .sl-changelog-item {
    position: relative;
    padding: 0 25px 90px 25px;
    margin: 0;
    list-style: none;
    z-index: 2;
    border-radius: 4px; }
    html.static.changelog .sl-changelog .sl-changelog-item p {
      margin: 0; }
  html.static.changelog .sl-changelog .sl-changelog-item-line {
    position: absolute;
    top: 0;
    left: -11px;
    width: 2px;
    bottom: 0;
    background-color: #222; }
  html.static.changelog .sl-changelog .sl-changelog-item:first-child .sl-changelog-item-line {
    top: 13px; }
  html.static.changelog .sl-changelog .sl-changelog-item:last-child .sl-changelog-item-line {
    height: 13px; }
  html.static.changelog .sl-changelog .sl-changelog-item-bullet {
    position: absolute;
    top: 3px;
    left: -20px;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background-color: #fff;
    border: 3px solid #222;
    -webkit-transform: scale(0.4);
            transform: scale(0.4);
    -webkit-transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.15s !important;
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.15s !important; }
  html.static.changelog .sl-changelog .sl-changelog-item.is-visible .sl-changelog-item-bullet {
    -webkit-transform: none;
            transform: none; }
  html.static.changelog .sl-changelog .sl-changelog-item-date {
    position: absolute;
    right: 100%;
    white-space: nowrap;
    padding-right: 45px;
    color: #888;
    opacity: 0;
    -webkit-transform: translateX(40px);
            transform: translateX(40px);
    -webkit-transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.15s !important;
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.15s !important; }
  html.static.changelog .sl-changelog .sl-changelog-item-description {
    opacity: 0;
    -webkit-transform: translateX(-40px);
            transform: translateX(-40px);
    -webkit-transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.15s !important;
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.15s !important;
    word-break: break-word; }
  html.static.changelog .sl-changelog .sl-changelog-item.is-visible .sl-changelog-item-date,
  html.static.changelog .sl-changelog .sl-changelog-item.is-visible .sl-changelog-item-description {
    opacity: 1;
    -webkit-transform: none;
            transform: none; }
  html.static.changelog .sl-changelog .sl-changelog-item.is-unread .sl-changelog-item-date:before {
    content: 'New';
    display: inline-block;
    position: relative;
    top: -2px;
    padding: 1px 6px;
    margin-right: 10px;
    border-radius: 22px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
    background: #888; }
  html.static.changelog .sl-changelog .sl-changelog-item.is-unread .sl-changelog-item-bullet {
    border-color: #226ede; }
  html.static.changelog .sl-changelog .sl-changelog-item.is-unread .sl-changelog-item-line {
    background-color: #226ede; }
  html.static.changelog .sl-changelog .sl-changelog-tag {
    position: relative;
    padding: var(--space-1) var(--space-3);
    top: -1px;
    margin-left: 6px;
    font-size: 12px;
    color: var(--button-primary-text);
    background: var(--button-primary-surface);
    border-radius: 22px;
    cursor: default;
    white-space: nowrap; }
  html.static.changelog .sl-changelog .sl-changelog-tag:hover {
    color: var(--button-primary-text-hover);
    background: var(--button-primary-surface-hover); }
@media screen and (max-width: 750px) {
  html.static.changelog .sl-changelog {
    padding-left: 45px; }
  html.static.changelog .sl-changelog .sl-changelog-item-date {
    position: static;
    -webkit-transform: translateX(-40px);
            transform: translateX(-40px); }
  html.static.changelog .sl-changelog .sl-changelog-item.is-unread .sl-changelog-item-date:before {
    display: none; } }
/**
 * Documentation page styles.
 */
html.docs {
  color: var(--docs-text); }
  html.docs [id] {
    scroll-margin-top: calc(var(--header-height) + var(--space-4)); }
  html.docs section[id] {
    scroll-margin-top: var(--header-height); }
  html.docs h3 {
    margin-top: 2em;
    font-weight: 600;
    font-size: 1.2em; }
  html.docs h4 {
    margin-top: 1em; }
  html.docs .header-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: var(--space-4);
    margin: var(--space-6) 0; }
    html.docs .header-group h2 {
      margin: 0; }
    html.docs .header-group .header-pill {
      margin-left: auto;
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      padding: var(--space-3) var(--space-5);
      border-radius: var(--radius-full);
      background: var(--surface-raised-strong);
      color: var(--color-text-strong);
      font-size: 1.1em; }
    html.docs .header-group .api-docs-header-badge {
      margin-left: auto; }
  html.docs .header-group:first-child {
    margin-top: 0 !important; }
  html.docs .docs-image {
    max-width: 100%;
    max-height: 100%;
    border-radius: var(--radius-4);
    outline: 1px solid var(--surface-tint-1);
    outline-offset: -1px; }
  html.docs h4 + p {
    margin-top: 0.5em; }
  html.docs .code-block {
    white-space: pre;
    overflow: auto;
    max-width: 100%;
    padding: 10px;
    border: 1px solid var(--docs-code-border);
    border-radius: var(--radius-4);
    background: var(--docs-code-bg);
    font-size: 0.9375em;
    color: var(--docs-code-text); }
    html.docs .code-block code {
      padding: 0;
      background: transparent !important; }
  html.docs .code-inline {
    background-color: var(--docs-inline-bg);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-3); }
  html.docs mark {
    padding: 1px 4px;
    border-radius: 4px;
    background: var(--docs-inline-bg);
    color: inherit; }
  html.docs .key-value-table .code-block {
    white-space: pre-wrap; }
  html.docs .key-value-table {
    width: 100%;
    margin: 1.5em 0;
    font-size: 0.9375em; }
    html.docs .key-value-table:last-child {
      margin-bottom: 0; }
    html.docs .key-value-table td,
    html.docs .key-value-table th {
      padding: 10px;
      vertical-align: top;
      text-align: left;
      font-weight: normal;
      border: 1px solid var(--docs-border); }
    html.docs .key-value-table tr + tr {
      border-top: 1px solid var(--docs-border); }
    html.docs .key-value-table td:first-child {
      font-weight: 500;
      color: var(--docs-text); }
    html.docs .key-value-table td .meta {
      display: block;
      margin-top: 6px;
      font-size: 11px;
      font-weight: normal;
      color: var(--docs-text-muted); }
    html.docs .key-value-table td .meta-item {
      padding: 2px 6px;
      margin-right: 2px;
      border: 1px solid var(--docs-border-soft);
      border-radius: 4px; }
    html.docs .key-value-table td .deem {
      color: var(--docs-text-subtle);
      font-weight: normal; }
    html.docs .key-value-table td em {
      color: var(--docs-text);
      font-weight: 500;
      font-style: normal; }
    html.docs .key-value-table td ul {
      margin: 0.4em 0.2em;
      list-style-position: inside; }
    html.docs .key-value-table td li {
      margin: 0.2em 0; }
    html.docs .key-value-table .key-value-table th,
    html.docs .key-value-table .key-value-table td {
      border-color: transparent;
      padding: 8px 14px; }
    html.docs .key-value-table .key-value-table th {
      background: transparent;
      border-bottom: 1px solid var(--docs-border);
      color: var(--docs-heading-muted); }
    html.docs .key-value-table .key-value-table th:first-child,
    html.docs .key-value-table .key-value-table td:first-child {
      border-right: 1px solid var(--docs-border);
      padding-left: 0;
      white-space: nowrap;
      width: 1px; }
    html.docs .key-value-table .key-value-table th:last-child,
    html.docs .key-value-table .key-value-table td:last-child {
      border-right: 0; }
  html.docs .key-value-table .sticky-header th {
    font-weight: 500;
    background-color: var(--docs-table-header-bg);
    position: sticky;
    top: -1px;
    z-index: 10; }
  @media screen and (max-width: 500px) {
    html.docs .key-value-table {
      display: block;
      overflow: auto;
      font-size: 0.8em; } }

html.api .api-docs-page .api-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--docs-gap);
  margin: var(--docs-padding) var(--docs-outdent) var(--docs-gap-lg); }
html.api .api-docs-page .api-summary-card {
  padding: var(--docs-padding);
  border: 1px solid var(--docs-border);
  border-radius: var(--docs-radius);
  background: var(--docs-surface-subtle); }
html.api .api-docs-page .api-summary-label,
html.api .api-docs-page .api-panel-label {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--docs-text-muted); }
html.api .api-docs-page .api-summary-value {
  margin: var(--space-4) 0 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  color: var(--docs-text);
  word-break: break-word; }
html.api .api-docs-page .api-route-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--docs-gap);
  margin: var(--docs-padding) var(--docs-outdent) var(--docs-gap-lg); }
html.api .api-docs-page .api-route-grid-rest {
  grid-template-columns: repeat(2, minmax(0, 1fr)); }
html.api .api-docs-page .api-route-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-5);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  padding: var(--docs-padding);
  border: 1px solid var(--docs-border);
  border-radius: var(--docs-radius);
  background: var(--docs-surface);
  color: inherit;
  text-decoration: none; }
  html.api .api-docs-page .api-route-card p {
    margin: var(--space-4) 0 0;
    color: var(--docs-text-muted); }
  html.api .api-docs-page .api-route-card > div {
    min-width: 0; }
html.api .api-docs-page .api-route-path {
  display: inline-block;
  font-size: 0.95em;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word; }
html.api .api-docs-page .api-method {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-width: 58px;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-full);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1; }
html.api .api-docs-page .api-method.get {
  background: var(--docs-method-get-bg);
  color: var(--docs-method-get-fg); }
html.api .api-docs-page .api-method.post {
  background: var(--docs-method-post-bg);
  color: var(--docs-method-post-fg); }
html.api .api-docs-page .api-method.patch {
  background: var(--docs-method-post-bg);
  color: var(--docs-method-post-fg); }
html.api .api-docs-page .api-method.mcp {
  background: var(--docs-method-mcp-bg);
  color: var(--docs-method-mcp-fg); }
html.api .api-docs-page .api-endpoint {
  margin-top: var(--docs-gap-lg);
  margin-left: var(--docs-outdent);
  margin-right: var(--docs-outdent);
  padding: var(--docs-padding);
  border: 1px solid var(--docs-border);
  border-radius: var(--docs-radius-lg);
  background: var(--docs-surface); }
html.api .api-docs-page .api-endpoint-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--space-5); }
  html.api .api-docs-page .api-endpoint-header h3 {
    padding-top: 0;
    margin: 0;
    font-size: 1.35em; }
  html.api .api-docs-page .api-endpoint-header .api-endpoint-requirement {
    margin-left: auto;
    color: var(--docs-text-muted);
    font-size: 0.9em; }
html.api .api-docs-page .api-endpoint-summary {
  margin: var(--space-5) 0 0; }
html.api .api-docs-page .api-endpoint-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.92fr) minmax(0, 1.28fr);
  gap: var(--docs-gap);
  margin-top: var(--docs-gap);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start; }
html.api .api-docs-page .api-endpoint-examples,
html.api .api-docs-page .api-endpoint-sidebar {
  display: grid;
  gap: var(--docs-gap);
  min-width: 0; }
html.api .api-docs-page .api-panel {
  min-width: 0;
  padding: var(--docs-padding);
  border: 1px solid var(--docs-border);
  border-radius: var(--docs-radius-inner);
  background: var(--docs-surface-subtle); }
html.api .api-docs-page .api-panel-copy {
  margin: var(--space-5) 0 0;
  color: var(--docs-text-muted);
  line-height: 1.6; }
html.api .api-docs-page .api-empty-state {
  padding: var(--docs-padding);
  margin-top: var(--space-5);
  border: 1px dashed var(--docs-border);
  border-radius: var(--docs-radius-inner-2);
  background: var(--docs-surface);
  color: var(--docs-text-muted); }
html.api .api-docs-page .api-param-stack {
  display: grid;
  gap: var(--space-5);
  margin-top: var(--space-5); }
html.api .api-docs-page .api-param-card {
  padding: var(--docs-padding);
  border: 1px solid var(--docs-border);
  border-radius: var(--docs-radius-inner-2);
  background: var(--docs-surface); }
html.api .api-docs-page .api-param-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: var(--space-4); }
html.api .api-docs-page .api-param-name {
  font-size: 0.95em;
  font-weight: 600;
  color: var(--docs-text); }
html.api .api-docs-page .api-param-description {
  margin: var(--space-4) 0 0;
  color: var(--docs-text-muted);
  line-height: 1.55; }
html.api .api-docs-page .api-param-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: var(--space-4); }
html.api .api-docs-page .api-response-panel .code-block {
  margin: var(--space-5) 0 0;
  padding: 0;
  border: 0;
  border-radius: var(--docs-radius-inner-2);
  background: transparent;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word; }
html.api .api-docs-page .api-response-panel {
  background: var(--docs-code-bg);
  border-color: var(--docs-code-border);
  color: var(--docs-code-text); }
html.api .api-docs-page .api-response-panel .api-panel-label {
  color: var(--docs-code-label); }
html.api .api-docs-page .api-response-panel code {
  display: block;
  background: transparent !important;
  white-space: inherit;
  overflow-wrap: inherit;
  word-break: inherit; }
html.api .api-docs-page .api-intro-example {
  margin: var(--docs-padding) var(--docs-outdent) 0;
  border-radius: var(--docs-radius); }
html.api .api-docs-page .api-intro-example .code-block {
  border-radius: var(--docs-radius-card-inner); }
html.api .api-docs-page .api-route-card {
  -webkit-transition: border-color 0.16s ease, -webkit-box-shadow 0.16s ease;
  transition: border-color 0.16s ease, -webkit-box-shadow 0.16s ease;
  transition: box-shadow 0.16s ease, border-color 0.16s ease;
  transition: box-shadow 0.16s ease, border-color 0.16s ease, -webkit-box-shadow 0.16s ease; }
  html.api .api-docs-page .api-route-card:hover {
    border-color: var(--docs-border-strong);
    -webkit-box-shadow: 0 4px 8px -4px rgba(0, 0, 0, 0.1);
            box-shadow: 0 4px 8px -4px rgba(0, 0, 0, 0.1); }

@media screen and (max-width: 900px) {
  .api-docs-page .api-route-grid-rest {
    grid-template-columns: 1fr; }
  .api-docs-page .api-endpoint-layout {
    grid-template-columns: 1fr; } }
/**
 * Styles for pricing page.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.static.pricing {
  --tier-radius: var(--radius-6); }
  html.static.pricing .tiers,
  html.static.pricing .pricing-header-inner {
    max-width: var(--page-max-width);
    padding-left: var(--page-padding);
    padding-right: var(--page-padding); }
  html.static.pricing .pricing-header {
    -webkit-transition: opacity 0.13s ease;
    transition: opacity 0.13s ease;
    min-height: 100px;
    padding: 8em 0 8em 0; }
    html.static.pricing .pricing-header hgroup {
      margin-bottom: 0; }
    html.static.pricing .pricing-header hgroup h2 {
      color: var(--color-text-strong);
      text-align: inherit; }
  html.static.pricing .pricing-header-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: 0 auto; }
  html.static.pricing .pricing-header.deemphasize hgroup,
  html.static.pricing .pricing-header.deemphasize .free-tier {
    opacity: 0.3; }
  html.static.pricing .pricing-header-left {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    margin-right: 10px; }
  html.static.pricing .pricing-header-mid {
    -webkit-box-flex: 1.5;
        -ms-flex: 1.5;
            flex: 1.5;
    text-align: center; }
  html.static.pricing .pricing-header-right {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    position: relative;
    margin-left: 10px; }
  html.static.pricing .pricing-header-right:hover:after {
    content: '';
    display: block;
    position: absolute;
    width: 110%;
    height: 100px;
    bottom: 0;
    right: 0;
    -webkit-transform: translate(4%, 4%);
            transform: translate(4%, 4%); }
  html.static.pricing .billing-period {
    position: relative;
    display: inline-block;
    margin-top: 20px; }
  html.static.pricing .billing-period .discount {
    font-weight: 500;
    opacity: 0.9; }
  html.static.pricing .monthly-billing {
    display: none !important; }
  html.static.pricing[data-billing-period="monthly"] .monthly-billing {
    display: initial !important; }
  html.static.pricing[data-billing-period="monthly"] .yearly-billing {
    display: none !important; }
  html.static.pricing .free-tier {
    display: block;
    padding: 10px 16px;
    background: var(--surface-glass);
    backdrop-filter: var(--surface-glass-filter);
    color: var(--color-text);
    border: 1px solid var(--border-subtle);
    border-radius: 4px; }
    html.static.pricing .free-tier .title {
      margin: 0;
      font-size: 16px;
      font-weight: 500; }
    html.static.pricing .free-tier .title .icon {
      font-size: 1.2em;
      margin-top: 1px;
      margin-left: 5px;
      vertical-align: top; }
    html.static.pricing .free-tier .description {
      margin: 5px 0 0 0;
      font-size: 15px;
      color: inherit; }
    html.static.pricing .free-tier .description strong {
      font-weight: 600; }
  html.static.pricing .free-tier-mobile {
    display: none;
    max-width: 340px;
    margin-top: 40px;
    border: 1px solid var(--border-default);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none; }
    html.static.pricing .free-tier-mobile .title {
      font-weight: 600; }
  html.static.pricing .free-tier-mobile:hover {
    border-color: var(--color-accent); }
  html.static.pricing .free-tier-collapsed,
  html.static.pricing .free-tier-expanded {
    position: absolute;
    right: 0;
    bottom: 0; }
  html.static.pricing .free-tier-collapsed {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border: 1px solid var(--border-default); }
  html.static.pricing .free-tier-expanded {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    bottom: -45px;
    padding: 12px;
    background: var(--surface-glass);
    backdrop-filter: var(--surface-glass-filter);
    border: 1px solid var(--border-subtle);
    -webkit-box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    -webkit-transform: translate(4%, 4%);
            transform: translate(4%, 4%); }
    html.static.pricing .free-tier-expanded .title {
      font-weight: bold; }
  html.static.pricing .pricing-header-right:hover .free-tier-collapsed,
  html.static.pricing .pricing-header-right:focus .free-tier-collapsed {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translate(-4%, -4%);
            transform: translate(-4%, -4%); }
  html.static.pricing .pricing-header-right:hover .free-tier-expanded,
  html.static.pricing .pricing-header-right:focus .free-tier-expanded {
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
            transform: none; }
  html.static.pricing .tiers {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0 auto 40px auto;
    color: var(--color-text);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    background-color: transparent;
    z-index: 2; }
  html.static.pricing .sl-coupon {
    margin-top: -5em;
    z-index: 2; }
  html.static.pricing .sl-coupon + .tiers {
    margin-top: 4em; }
  html.static.pricing .tier {
    display: block;
    width: 32%;
    min-width: 280px;
    max-width: 90%;
    margin: 0 0 3em 2%;
    vertical-align: top;
    text-align: center;
    cursor: default; }
    html.static.pricing .tier .tier-inner {
      background: var(--surface-glass);
      backdrop-filter: var(--surface-glass-filter);
      border-radius: var(--tier-radius);
      overflow: hidden;
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      -webkit-transition: 0.15s -webkit-transform ease, 0.15s -webkit-box-shadow linear;
      transition: 0.15s -webkit-transform ease, 0.15s -webkit-box-shadow linear;
      transition: 0.15s transform ease, 0.15s box-shadow linear;
      transition: 0.15s transform ease, 0.15s box-shadow linear, 0.15s -webkit-transform ease, 0.15s -webkit-box-shadow linear; }
    html.static.pricing .tier strong {
      font-weight: 600; }
    html.static.pricing .tier header {
      position: relative;
      background: var(--surface-lite);
      color: var(--color-text-strong); }
      html.static.pricing .tier header .name {
        padding: 20px 0;
        margin: 0 0 -8px 0;
        font-size: 20px; }
      html.static.pricing .tier header .price {
        margin: 0;
        font-size: 50px;
        font-weight: normal; }
        html.static.pricing .tier header .price span {
          display: inline-block;
          line-height: 1; }
        html.static.pricing .tier header .price .sup {
          font-size: 0.6em;
          vertical-align: 1.7em; }
        html.static.pricing .tier header .price .val {
          font-size: 2em;
          margin: 0 -10px;
          letter-spacing: -4px; }
        html.static.pricing .tier header .price .sub {
          text-align: left;
          font-size: 0.4em;
          line-height: 1.2; }
        html.static.pricing .tier header .price .sub-sub {
          display: block; }
      html.static.pricing .tier header .description {
        margin: 0;
        font-size: 15px;
        height: 35px;
        line-height: 1.7; }
        html.static.pricing .tier header .description span.team-emphasized {
          padding: 2px 10px;
          margin-bottom: 4px;
          color: rgba(255, 255, 255, 0.85); }
        html.static.pricing .tier header .description span.faded {
          opacity: 0.8; }
        html.static.pricing .tier header .description span:first-child:last-child {
          line-height: 35px; }
      html.static.pricing .tier header .description.flash {
        -webkit-animation: flash-opacity 0.5s 1 ease;
                animation: flash-opacity 0.5s 1 ease; }
    html.static.pricing .tier .cta {
      display: block;
      padding: 10px 25px;
      margin-top: 15px; }
      html.static.pricing .tier .cta .pricing-tier-cta {
        position: relative;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        font-size: 16px; }
    html.static.pricing .tier .cta:last-child {
      padding-bottom: 32px; }
    html.static.pricing .tier .body {
      padding: 15px;
      font-size: 14px;
      background-color: var(--surface-panel);
      border: 1px solid var(--border-subtle);
      border-radius: 0 0 var(--tier-radius) var(--tier-radius);
      -webkit-transition: all 0.15s linear;
      transition: all 0.15s linear; }
      html.static.pricing .tier .body p {
        margin: 0;
        padding: 6px 16px; }
      html.static.pricing .tier .body ul {
        margin: 0; }
      html.static.pricing .tier .body .pricing-bullet {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        position: relative;
        padding: 12px 0 12px 15px;
        list-style: none;
        text-align: left;
        margin: 0;
        white-space: nowrap; }
      html.static.pricing .tier .body .pricing-bullet.two-lines-fixed {
        height: 64px; }
      html.static.pricing .tier .body .pricing-bullet:before {
        content: '';
        display: inline-block;
        -ms-flex-negative: 0;
            flex-shrink: 0;
        width: 18px;
        height: 18px;
        margin: 2px 8px 0 -18px;
        vertical-align: middle;
        opacity: 0.55;
        background-color: var(--color-text);
        -webkit-mask-image: url(//staging.slides.com/assets/icons/checkmark-efff7fc2a7a58b43c9db703ba34da5e6d7275fdc72a9dbbae38d2a28b481d6fb.svg);
        mask-image: url(//staging.slides.com/assets/icons/checkmark-efff7fc2a7a58b43c9db703ba34da5e6d7275fdc72a9dbbae38d2a28b481d6fb.svg);
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat; }
      html.static.pricing .tier .body .pricing-bullet-additional:before {
        -webkit-mask-image: url(//staging.slides.com/assets/icons/plus-1f043c5cded66036bbe982e39caff54b84bc97d6654fcf42c0b7b2f1cd5876cf.svg);
        mask-image: url(//staging.slides.com/assets/icons/plus-1f043c5cded66036bbe982e39caff54b84bc97d6654fcf42c0b7b2f1cd5876cf.svg); }
      html.static.pricing .tier .body .faded {
        color: var(--color-text-muted); }
      html.static.pricing .tier .body .sl-info {
        --size: 20px;
        -ms-flex-negative: 0;
            flex-shrink: 0;
        margin: 0 0 0 auto;
        opacity: 0.6; }
  html.static.pricing .tier:first-child {
    margin-left: 0; }
  html.static.pricing .tier.deemphasize {
    opacity: 0.3; }
  html.static.pricing .tier.hover .tier-inner {
    cursor: pointer;
    -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12), 0 8px 38px rgba(0, 0, 0, 0.14);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12), 0 8px 38px rgba(0, 0, 0, 0.14);
    -webkit-transform: translate3d(0, -5px, 0);
            transform: translate3d(0, -5px, 0);
    opacity: 1; }
    html.static.pricing .tier.hover .tier-inner .body .sl-info {
      opacity: 1; }
    html.static.pricing .tier.hover .tier-inner .body {
      border-color: var(--border-strong); }
  html.static.pricing .tier.hover .cta .cta-button-background {
    -webkit-transform: scale(1.03, 1.08);
            transform: scale(1.03, 1.08); }
  html.static.pricing .tier.hover .cta .cta-button-has-arrow .cta-button-label {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px); }
  html.static.pricing .tier.hover .cta .cta-button-has-arrow .cta-button-arrow-disc {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1); }
  html.static.pricing .tier.hover .cta .cta-button-has-arrow .arrow-tail-path {
    stroke-dasharray: 1 0;
    stroke-dashoffset: 0; }
  html.static.pricing .tier.pro {
    margin-top: -20px; }
  html.static.pricing .tier.pro header {
    background: var(--surface-pro); }
  html.static.pricing .tier.pro header .name {
    padding: 30px; }
  html.static.pricing .tier.team header {
    background: var(--surface-team); }
  html.static.pricing .tier.enterprise header {
    border-radius: var(--tier-radius); }
  html.static.pricing .tier.enterprise .description {
    height: auto;
    padding: 0 30px;
    text-align: left;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5; }
  @media screen and (min-width: 1100px) {
    html.static.pricing .tier.enterprise {
      margin-left: auto; } }
  @media screen and (max-width: 1100px) {
    html.static.pricing .pricing-header-left {
      display: none; }
    html.static.pricing .pricing-header-mid:not(:first-child) {
      text-align: left; }
    html.static.pricing .tiers {
      padding: 0 var(--page-padding); }
    html.static.pricing .tiers .tier {
      width: 49%; }
    html.static.pricing .tier:nth-child(odd) {
      margin-left: 0; } }
  @media screen and (max-width: 680px) {
    html.static.pricing .pricing-header-inner {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center; }
    html.static.pricing .pricing-header .discount {
      display: none; }
    html.static.pricing .pricing-header-mid {
      text-align: center !important; }
    html.static.pricing .pricing-header-left,
    html.static.pricing .pricing-header-right {
      margin-left: 0;
      margin-right: 0; }
    html.static.pricing .free-tier {
      display: none; }
    html.static.pricing .free-tier-mobile {
      display: block; }
    html.static.pricing .tiers {
      margin-bottom: var(--section-padding) !important; }
      html.static.pricing .tiers .tier {
        width: 100%;
        margin-left: 0;
        margin-right: 0; } }
  html.static.pricing.touch .sl-info {
    display: none !important; }

html.static.pricing .sl-billing-period {
  text-align: center; }
  html.static.pricing .sl-billing-period label {
    margin: 0 !important; }
/**
 * UI test page styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.wireframe, html.wireframe body {
  overflow: auto;
  width: auto;
  height: auto;
  line-height: initial; }
html.wireframe body {
  overflow: visible; }
html.wireframe .sl-wireframe {
  overflow: visible;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  width: 100%;
  max-width: none;
  margin: 0; }
html.wireframe .sl-page-nav {
  margin-left: 20px;
  margin-top: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  min-height: 100vh; }
html.wireframe .sl-page-nav li {
  margin: 0; }
html.wireframe .sl-page-nav a {
  padding: 8px 0;
  font-size: 14px; }
html.wireframe .sl-page-nav-sections {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto; }
html.wireframe .sl-wireframe-theme-mode {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: auto;
  padding-top: var(--space-5); }
html.wireframe .sl-wireframe-theme-mode .theme-mode-footer-link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--button-size-4);
  height: var(--button-size-4);
  padding: 0;
  border: 0;
  border-radius: var(--radius-3);
  background: var(--surface-nav-link);
  color: var(--color-nav-link);
  font: inherit;
  cursor: pointer; }
html.wireframe .sl-wireframe-theme-mode .theme-mode-footer-link:hover {
  background: var(--surface-nav-link-hover);
  color: var(--color-nav-link-hover); }
html.wireframe .components {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  margin-left: 0;
  margin-right: 0;
  border-left: 1px solid var(--border-subtle);
  overflow: hidden; }
html.wireframe section {
  width: 100%;
  min-height: 100vh;
  padding: 60px;
  border-top: 1px solid var(--border-subtle);
  overflow: auto;
  -webkit-overflow-scrolling: touch; }
html.wireframe section:first-of-type {
  border-top: 0; }
html.wireframe section > h2 {
  margin-bottom: 30px; }
html.wireframe section > h3 {
  margin: 3rem 0 10px 0;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
  color: #777; }
html.wireframe .button-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8px; }
html.wireframe .sl-transition-list {
  background: #f5f5f5;
  padding: 20px;
  width: 700px;
  -webkit-tap-highlight-color: transparent; }
html.wireframe .sl-transition-thumbnail {
  margin-bottom: 0; }
html.wireframe .is-recording .sl-page-nav {
  display: none; }
html.wireframe .is-recording .components {
  border-left: 0; }
html.wireframe .is-recording section {
  border-top: 0; }
html.wireframe .wireframe-theme-grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: var(--space-6);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start; }
html.wireframe .wireframe-theme-card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: var(--radius-3);
  overflow: hidden;
  min-width: 0; }
html.wireframe .wireframe-theme-card__header {
  padding: var(--space-6) var(--space-5);
  text-align: center; }
html.wireframe .wireframe-theme-card__block {
  padding: var(--space-6) var(--space-5);
  border-top-width: 1px;
  border-top-style: solid; }
html.wireframe .wireframe-theme-card__block-label {
  color: var(--color-text-subtle);
  font-size: 9px;
  margin-bottom: var(--space-4);
  text-transform: uppercase;
  letter-spacing: 0.02em; }
html.wireframe .wireframe-theme-text-stack > * + * {
  margin-top: var(--space-3); }
html.wireframe .wireframe-theme-text-line {
  font-size: 11px;
  line-height: 1.35; }
html.wireframe .wireframe-theme-hover-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(5rem, 1fr));
  gap: var(--space-3); }
html.wireframe .wireframe-theme-hover-cell {
  padding: var(--space-4);
  border-radius: var(--radius-2);
  text-align: center;
  min-height: 2.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }
html.wireframe .wireframe-theme-hover-cell-label {
  font-size: 8px;
  line-height: 1.25; }
html.wireframe .wireframe-theme-inset-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3); }
html.wireframe .wireframe-theme-inset-cell {
  padding: var(--space-5);
  border-radius: var(--radius-2);
  text-align: center; }
html.wireframe .wireframe-theme-inset-label {
  color: var(--color-text-secondary);
  font-size: 9px; }
html.wireframe .wireframe-theme-border-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(6.25rem, 1fr));
  gap: var(--space-3); }
html.wireframe .wireframe-theme-border-swatch {
  border-width: 2px;
  border-style: solid;
  border-radius: var(--radius-2);
  padding: var(--space-4) var(--space-2);
  text-align: center;
  min-height: 2.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }
html.wireframe .wireframe-theme-border-swatch-label {
  color: var(--color-text-secondary);
  font-size: 8px;
  line-height: 1.25; }
html.wireframe .wireframe-theme-surface-stack {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--space-4); }
html.wireframe .wireframe-theme-inverse {
  padding: var(--space-5);
  border-radius: var(--radius-2);
  text-align: center; }
html.wireframe .wireframe-theme-inverse-label {
  color: var(--color-text-inverse);
  font-size: 9px;
  font-weight: 500; }
html.wireframe .wireframe-theme-glass-stage {
  position: relative;
  min-height: 4.5rem;
  border-radius: var(--radius-2);
  overflow: hidden;
  background: repeating-linear-gradient(-12deg, var(--surface-raised-strong) 0, var(--surface-raised-strong) 10px, var(--surface-panel-alt) 10px, var(--surface-panel-alt) 20px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: var(--space-4); }
html.wireframe .wireframe-theme-glass-panel {
  width: 100%;
  padding: var(--space-5);
  border-radius: var(--radius-2);
  background: var(--surface-glass);
  backdrop-filter: var(--surface-glass-filter);
  -webkit-backdrop-filter: var(--surface-glass-filter);
  border: 1px solid var(--border-subtle);
  text-align: center; }
html.wireframe .wireframe-theme-glass-label {
  color: var(--color-text);
  font-size: 9px;
  font-weight: 500; }
html.wireframe .wireframe-theme-raised-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-3); }
html.wireframe .wireframe-theme-raised-cell {
  padding: var(--space-4) var(--space-2);
  border-radius: var(--radius-2);
  text-align: center;
  min-width: 0; }
html.wireframe .wireframe-theme-raised-label {
  color: var(--color-text-secondary);
  font-size: 8px;
  line-height: 1.25;
  font-weight: 500; }
html.wireframe .wireframe-theme-controls.sl-form .unit {
  margin-top: 0;
  margin-bottom: var(--space-4); }
html.wireframe .wireframe-theme-controls.sl-form .unit:first-child {
  margin-top: 0; }
html.wireframe .wireframe-theme-button-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--space-3); }
html.wireframe .wireframe-theme-heading-spaced {
  margin-top: var(--space-8); }
@media screen and (max-width: 1000px) {
  html.wireframe .sl-page-nav {
    display: none; }
  html.wireframe .components {
    border-left: 0; }
  html.wireframe section {
    padding-left: 20px;
    padding-right: 20px; } }
/**
 * Team devise styles.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.teams.sessions,
html.teams.passwords,
html.teams.register,
html.teams.registrations,
html.teams.deactivated {
  --team-devise-link: var(--color-text-muted);
  --team-devise-link-hover: #fff;
  height: 100%; }
  html.teams.sessions body,
  html.teams.sessions .container,
  html.teams.sessions .main,
  html.teams.passwords body,
  html.teams.passwords .container,
  html.teams.passwords .main,
  html.teams.register body,
  html.teams.register .container,
  html.teams.register .main,
  html.teams.registrations body,
  html.teams.registrations .container,
  html.teams.registrations .main,
  html.teams.deactivated body,
  html.teams.deactivated .container,
  html.teams.deactivated .main {
    height: 100%; }
  html.teams.sessions .column,
  html.teams.passwords .column,
  html.teams.register .column,
  html.teams.registrations .column,
  html.teams.deactivated .column {
    min-height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
  html.teams.sessions .global-header,
  html.teams.sessions .global-footer,
  html.teams.passwords .global-header,
  html.teams.passwords .global-footer,
  html.teams.register .global-header,
  html.teams.register .global-footer,
  html.teams.registrations .global-header,
  html.teams.registrations .global-footer,
  html.teams.deactivated .global-header,
  html.teams.deactivated .global-footer {
    display: none; }
  html.teams.sessions .org-big-logo,
  html.teams.passwords .org-big-logo,
  html.teams.register .org-big-logo,
  html.teams.registrations .org-big-logo,
  html.teams.deactivated .org-big-logo {
    width: 250px;
    height: 110px;
    margin: 2em auto 0 auto;
    display: block;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat; }
  html.teams.sessions .org-slides-link,
  html.teams.passwords .org-slides-link,
  html.teams.register .org-slides-link,
  html.teams.registrations .org-slides-link,
  html.teams.deactivated .org-slides-link {
    text-align: center;
    font-size: 14px;
    margin-bottom: 4em; }
    html.teams.sessions .org-slides-link a,
    html.teams.passwords .org-slides-link a,
    html.teams.register .org-slides-link a,
    html.teams.registrations .org-slides-link a,
    html.teams.deactivated .org-slides-link a {
      color: var(--team-devise-link);
      border: 0; }
      html.teams.sessions .org-slides-link a:hover,
      html.teams.passwords .org-slides-link a:hover,
      html.teams.register .org-slides-link a:hover,
      html.teams.registrations .org-slides-link a:hover,
      html.teams.deactivated .org-slides-link a:hover {
        color: var(--team-devise-link-hover);
        text-decoration: underline; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
/**
 * These are the styles for the page where users can sign up
 * for, or upgrade to, a team account.
 *
 * NOTE: These styles are also used for the team reactivation
 * page. Make sure to test any changes there.
 */
html.teams-signup {
  --teams-signup-divider: var(--border-default);
  --teams-signup-surface: var(--surface-panel);
  --teams-signup-text-secondary: var(--color-text-secondary);
  --teams-signup-text-muted: var(--color-text-muted); }
  html.teams-signup .column section {
    padding: 0; }
    html.teams-signup .column section .title {
      padding: var(--section-padding);
      padding-bottom: 0; }
    html.teams-signup .column section .placeholder {
      padding: var(--section-padding);
      padding-top: 0; }
    html.teams-signup .column section .actions {
      padding: var(--section-padding);
      padding-top: 0; }
    html.teams-signup .column section .unit label {
      font-size: 14px; }
    html.teams-signup .column section .unit.checkbox label {
      color: var(--color-text);
      font-size: 1em; }
    html.teams-signup .column section .form-section {
      padding: var(--section-padding); }
    html.teams-signup .column section .form-section + .form-section {
      border-top: 2px solid var(--teams-signup-divider); }
    html.teams-signup .column section .billing-section {
      padding-bottom: 30px; }
    html.teams-signup .column section .tos-section h4 a {
      color: var(--color-link);
      border-bottom: 1px solid var(--color-link); }
    html.teams-signup .column section .checkout-section {
      background: var(--teams-signup-surface);
      border-bottom-left-radius: var(--section-radius);
      border-bottom-right-radius: var(--section-radius); }
      html.teams-signup .column section .checkout-section .actions {
        padding: 10px 0 0 0; }
    html.teams-signup .column section .purchase-summary .message {
      color: var(--teams-signup-text-secondary); }
    html.teams-signup .column section .purchase-summary[data-period] .message .period {
      display: none; }
    html.teams-signup .column section .purchase-summary[data-period="monthly"] .message .monthly {
      display: block; }
    html.teams-signup .column section .purchase-summary[data-period="yearly"] .message .yearly {
      display: block; }
    html.teams-signup .column section .unit-group {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: var(--space-6); }
    html.teams-signup .column section .unit-group + .unit-group {
      margin-top: 25px;
      padding-top: 25px;
      border-top: 1px solid var(--teams-signup-divider); }
    html.teams-signup .column section .unit-group-description {
      margin-top: 0.5em;
      margin-bottom: 1em;
      color: var(--teams-signup-text-secondary); }
    html.teams-signup .column section .unit-group .unit {
      margin: 0; }
  html.teams-signup .actions .button:not(.disabled) {
    -webkit-animation: small-bounce 0.4s ease;
            animation: small-bounce 0.4s ease; }
  html.teams-signup .user-account {
    border: 1px solid var(--teams-signup-divider);
    background: var(--surface-canvas);
    padding: 10px; }
  html.teams-signup .user-account-thumb {
    float: left;
    height: 42px;
    margin-right: 10px; }
  html.teams-signup .user-account-name,
  html.teams-signup .user-account-email {
    max-width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  html.teams-signup .user-account-email {
    color: var(--teams-signup-text-muted); }
/**
 * Styles for the team edit pages.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.teams.edit .main section.general input {
  width: 100%; }
/**
 * Styles for the team edit pages.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.teams.edit_members {
  --team-members-description: var(--color-section-description);
  --team-members-badge-surface: var(--color-accent);
  --team-members-badge-text: var(--color-accent-fg);
  --team-members-avatar-surface: var(--surface-panel-alt);
  --team-members-role-heading: var(--color-text-muted);
  --team-members-inactive-text: var(--color-text-muted);
  --team-members-load-more-divider: var(--border-subtle);
  --team-members-load-more-text: var(--color-text-muted);
  --team-members-info-surface: var(--surface-raised-strong);
  --team-members-info-text: var(--color-text-secondary);
  --team-members-info-hover-surface: var(--surface-inverse);
  --team-members-info-hover-text: var(--color-text-inverse); }
  html.teams.edit_members .column {
    width: 940px;
    max-width: 100%; }
  html.teams.edit_members section .intro h3,
  html.teams.edit_members section .intro h4 {
    font-weight: 500;
    margin-bottom: 1em; }
  html.teams.edit_members .invite-form {
    position: relative;
    margin: 2em 0; }
    html.teams.edit_members .invite-form .invite-description {
      color: var(--team-members-description);
      margin: 0.2em 0 1em 0; }
    html.teams.edit_members .invite-form .invite-form-inputs {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
    html.teams.edit_members .invite-form .invite-form-inputs [disabled] {
      opacity: 0.5;
      pointer-events: none; }
    html.teams.edit_members .invite-form .badge {
      position: relative;
      top: -1px;
      margin-left: 6px;
      padding: 2px 6px;
      font-size: 0.8em;
      border-radius: var(--radius-full);
      vertical-align: middle;
      font-weight: 500;
      background: var(--team-members-badge-surface);
      color: var(--team-members-badge-text);
      white-space: nowrap;
      -webkit-user-select: none;
         -moz-user-select: none;
          -ms-user-select: none;
              user-select: none; }
    html.teams.edit_members .invite-form .unit {
      position: relative;
      margin: 0 10px 0 0; }
    html.teams.edit_members .invite-form .email-input {
      -webkit-box-flex: 1;
          -ms-flex-positive: 1;
              flex-grow: 1; }
    html.teams.edit_members .invite-form .email-input input {
      --button-size: var(--button-size-6); }
    html.teams.edit_members .invite-form input[type="text"] {
      margin: 0; }
    html.teams.edit_members .invite-form select {
      width: 100%;
      min-width: 160px; }
    html.teams.edit_members .invite-form button {
      -ms-flex-negative: 0;
          flex-shrink: 0; }
  html.teams.edit_members .users-preloader {
    width: 100%;
    height: 200px; }
  html.teams.edit_members .users-content {
    display: none; }
  html.teams.edit_members .users-table {
    table-layout: fixed;
    width: 100%; }
    html.teams.edit_members .users-table .avatar-link {
      border-bottom: none; }
    html.teams.edit_members .users-table .avatar {
      display: inline-block;
      position: relative;
      height: 1.8em;
      width: 1.8em;
      border-radius: 3em;
      top: 0.6em;
      margin-right: 0.6em;
      background-size: contain;
      background-color: var(--team-members-avatar-surface); }
    html.teams.edit_members .users-table th {
      font-weight: 500;
      color: var(--team-members-role-heading); }
    html.teams.edit_members .users-table td {
      line-height: 3em; }
    html.teams.edit_members .users-table th:first-child {
      color: var(--color-text-strong); }
    html.teams.edit_members .users-table td {
      white-space: nowrap; }
    html.teams.edit_members .users-table .account {
      width: 100%; }
    html.teams.edit_members .users-table .role {
      width: 110px; }
    html.teams.edit_members .users-table .role-selector {
      width: 110px; }
    html.teams.edit_members .users-table .actions {
      width: 130px;
      text-align: right; }
  html.teams.edit_members .users-group {
    display: none; }
  html.teams.edit_members .users-group.visible {
    display: block; }
  html.teams.edit_members .users-group + .users-group {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle); }
  html.teams.edit_members .users-group-invites tr td,
  html.teams.edit_members .users-group-inactive-members tr td {
    color: var(--team-members-inactive-text); }
  html.teams.edit_members .users-group .load-more {
    display: none;
    padding-top: 20px;
    border-top: 1px dashed var(--team-members-load-more-divider);
    color: var(--team-members-load-more-text); }
    html.teams.edit_members .users-group .load-more.visible {
      display: block; }
  html.teams.edit_members .users-group .load-more-button {
    text-decoration: underline;
    margin-left: 10px; }
    html.teams.edit_members .users-group .load-more-button:hover {
      color: var(--color-link-hover); }
  html.teams.edit_members .info {
    display: inline-block;
    width: 18px;
    height: 18px;
    right: 14px;
    line-height: 18px;
    margin: 0 0 0 8px;
    text-align: center;
    background-color: var(--team-members-info-surface);
    color: var(--team-members-info-text);
    border-radius: 50%;
    cursor: default;
    text-transform: none;
    font-family: Times;
    font-size: 14px;
    font-weight: normal; }
    html.teams.edit_members .info:hover {
      background-color: var(--team-members-info-hover-surface);
      color: var(--team-members-info-hover-text); }
/**
 * Styles for the theme editor.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.themes.edit {
  --theme-editor-surface: var(--surface-section);
  --theme-editor-surface-strong: var(--surface-panel-alt);
  --theme-editor-surface-stronger: var(--surface-raised);
  --theme-editor-border: var(--border-default);
  --theme-editor-border-strong: var(--border-stronger);
  --theme-editor-text: var(--color-text);
  --theme-editor-text-muted: var(--color-text-secondary);
  --theme-editor-pill-surface: var(--surface-hover);
  --theme-editor-pill-text: var(--color-text-secondary);
  --theme-editor-accent: var(--color-accent);
  --theme-editor-accent-fg: var(--color-accent-fg);
  --theme-editor-preview-surface: var(--surface-canvas);
  --theme-editor-overlay-surface: var(--surface-canvas);
  --theme-editor-overlay-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
  --theme-editor-reloader-surface: rgba(var(--surface-inverse-rgb), 0.72);
  --theme-editor-reloader-surface-hover: rgba(var(--surface-inverse-rgb), 0.92);
  --theme-editor-reloader-text: var(--color-text-inverse);
  --theme-editor-spinner: var(--color-text-muted);
  overflow: auto !important;
  height: auto !important; }
  html.themes.edit .reveal .controls,
  html.themes.edit .reveal .progress {
    position: absolute; }
  html.themes.edit .theme-header {
    position: relative;
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--theme-editor-border); }
  html.themes.edit .theme-header-buttons {
    position: absolute;
    right: 0;
    top: 0; }
    html.themes.edit .theme-header-buttons .button {
      margin-left: 10px; }
    html.themes.edit .theme-header-buttons .cancel-button .icon {
      margin-right: 2px;
      vertical-align: middle; }
  html.themes.edit .theme-list-empty {
    max-width: 500px;
    margin: 50px 0 60px 0;
    color: var(--theme-editor-text-muted); }
  html.themes.edit .theme-list {
    overflow: auto; }
  html.themes.edit .theme-list-item {
    position: relative;
    display: block;
    width: 100%;
    min-height: 300px;
    margin-bottom: 30px;
    padding: 25px;
    cursor: pointer;
    vertical-align: top;
    cursor: pointer;
    border-radius: var(--radius-4);
    border: 2px solid var(--theme-editor-border);
    background: var(--theme-editor-surface); }
    html.themes.edit .theme-list-item:hover {
      border-color: var(--theme-editor-border-strong); }
  html.themes.edit .theme-list-item-metadata {
    color: var(--theme-editor-text-muted);
    font-size: 0.8em;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease; }
    html.themes.edit .theme-list-item-metadata .theme-list-item-metadata-field {
      display: inline-block;
      padding: 6px 8px;
      margin-right: 8px;
      margin-bottom: 8px;
      line-height: 1.6;
      background: var(--theme-editor-pill-surface);
      color: var(--theme-editor-pill-text);
      border-radius: var(--radius-2);
      border: 1px solid transparent; }
    html.themes.edit .theme-list-item-metadata .theme-list-item-metadata-field .icon {
      margin-right: 4px;
      font-size: 0.9em; }
  html.themes.edit .theme-list-item.default {
    border-color: var(--theme-editor-accent); }
    html.themes.edit .theme-list-item.default.default:hover {
      border-color: var(--theme-editor-accent); }
  html.themes.edit .theme-list-item-thumbnail {
    width: 250px;
    height: 250px;
    max-width: 100%;
    float: left;
    margin-right: 20px;
    border: 1px solid var(--theme-editor-border);
    border-radius: var(--radius-3);
    background-image: url("https://static.slid.es/images/default-deck-thumbnail-transparent.png");
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover; }
  html.themes.edit .theme-list-item-title {
    font-size: 1.5em;
    margin-bottom: 8px;
    padding-right: 20px;
    color: var(--theme-editor-text); }
  html.themes.edit .theme-list-item-controls {
    position: absolute;
    bottom: 5px;
    right: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    padding: 15px;
    gap: 8px; }
    html.themes.edit .theme-list-item-controls .button {
      margin-top: 5px; }

.preloader {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: var(--theme-editor-overlay-surface);
  z-index: 10; }
  .preloader .preloader-inner {
    display: block;
    position: absolute;
    top: 45%;
    left: 50%;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
    text-align: center; }
  .preloader .preloader-spinner {
    display: block;
    position: relative;
    width: 50px;
    height: 50px;
    -webkit-animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal;
            animation: spin-rectangle-to-circle 2.5s cubic-bezier(0.75, 0, 0.5, 1) infinite normal;
    background-color: var(--theme-editor-spinner);
    border-radius: 1px; }
  .preloader.hidden {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.1s ease;
    transition: all 0.1s ease; }

html.themes.edit .preview {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 750px;
  overflow: hidden;
  background-color: var(--theme-editor-preview-surface); }
  html.themes.edit .preview .preview-frame {
    width: 100%;
    height: 100%; }
  html.themes.edit .preview .preview-reloader {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    bottom: 10px;
    left: 10px;
    background: var(--theme-editor-reloader-surface);
    color: var(--theme-editor-reloader-text);
    text-align: center;
    z-index: 2;
    font-size: 16px;
    cursor: pointer; }
    html.themes.edit .preview .preview-reloader:hover {
      background: var(--theme-editor-reloader-surface-hover); }

html.themes.edit .theme-editor {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  opacity: 0;
  z-index: 200;
  background: var(--theme-editor-overlay-surface); }

html.themes.edit .theme-editor-inner {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; }

html.themes.edit.is-editing-theme .theme-editor {
  visibility: visible;
  opacity: 1; }

html.themes.edit.is-editing-theme {
  overflow: hidden !important; }

html.themes.edit .theme-editor-documentation {
  display: none; }
/**
 * Styles for the theme editor panels.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.themes.edit .panel {
  position: absolute;
  width: 750px;
  height: 100%;
  padding: 30px;
  left: 0;
  top: 0;
  background: var(--theme-editor-surface);
  overflow: hidden;
  border-right: 1px solid var(--theme-editor-border);
  z-index: 2;
  color: var(--theme-editor-text); }
  html.themes.edit .panel .panel-header {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    left: 0;
    top: 0;
    width: 100%;
    height: 70px;
    padding-left: 30px;
    padding-right: 30px;
    z-index: 6;
    background-color: var(--theme-editor-surface);
    border-bottom: 1px solid var(--theme-editor-border);
    vertical-align: middle;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
    html.themes.edit .panel .panel-header .button {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      height: 2.2em;
      padding-top: 0;
      padding-bottom: 0; }
    html.themes.edit .panel .panel-header .button + .button {
      margin-left: 10px; }
    html.themes.edit .panel .panel-header .cancel-button .icon {
      margin-left: -4px;
      margin-right: 2px; }
    html.themes.edit .panel .panel-header .save-button {
      visibility: hidden;
      opacity: 0;
      -webkit-transition: all 0.15s ease;
      transition: all 0.15s ease; }
    html.themes.edit .panel .panel-header .page-tabs {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: end;
          -ms-flex-pack: end;
              justify-content: flex-end;
      -webkit-box-flex: 2;
          -ms-flex-positive: 2;
              flex-grow: 2;
      gap: 2px; }
      html.themes.edit .panel .panel-header .page-tabs .page-tab {
        color: var(--theme-editor-text);
        font-size: 14px;
        font-weight: 600;
        opacity: 0.4;
        padding: 6px 8px;
        border-radius: var(--button-radius); }
        html.themes.edit .panel .panel-header .page-tabs .page-tab:hover {
          opacity: 0.8;
          background: var(--theme-editor-pill-surface); }
        html.themes.edit .panel .panel-header .page-tabs .page-tab.selected {
          opacity: 1;
          background: var(--theme-editor-surface-strong); }
  html.themes.edit .panel .page {
    position: absolute;
    width: 100%;
    top: 70px;
    bottom: 0;
    left: 0;
    padding: 30px;
    overflow: auto;
    -webkit-overflow-scrolling: touch; }
    html.themes.edit .panel .page.transition {
      -webkit-transition: all 0.5s cubic-bezier(0.86, 0, 0.07, 1);
      transition: all 0.5s cubic-bezier(0.86, 0, 0.07, 1); }
    html.themes.edit .panel .page.past {
      -webkit-transform: translateX(-100%);
              transform: translateX(-100%);
      visibility: hidden; }
    html.themes.edit .panel .page.future {
      -webkit-transform: translateX(100%);
              transform: translateX(100%);
      visibility: hidden; }
  html.themes.edit .panel .page .info {
    position: absolute;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 30px;
    bottom: 10px;
    right: 10px;
    background: var(--theme-editor-surface-strong);
    color: var(--theme-editor-text);
    text-align: center;
    z-index: 2;
    font-size: 12px;
    opacity: 0.7; }
    html.themes.edit .panel .page .info.negative {
      background: #d04232;
      color: #fff;
      opacity: 0.8; }
    html.themes.edit .panel .page .info.positive {
      background: #40cb90;
      color: #fff;
      opacity: 0.8; }
    html.themes.edit .panel .page .info:hover {
      opacity: 1; }
    html.themes.edit .panel .page .info[data-help-overlay] {
      cursor: pointer; }
  html.themes.edit .panel .page-header h4 {
    margin-bottom: 0.25em;
    font-size: 16px;
    font-weight: 500; }
  html.themes.edit .panel .page-header p {
    margin: 0;
    font-size: 14px;
    color: var(--theme-editor-text-muted); }
  html.themes.edit .panel .page-header a {
    color: var(--color-link); }
  html.themes.edit .panel .page-header a:hover {
    color: var(--color-link-hover); }
  html.themes.edit .panel .page-header .header-buttons {
    font-size: 14px; }
  html.themes.edit .panel .page-header .button + .button {
    margin-left: 8px; }
  html.themes.edit .panel .page-header .float-right {
    float: right; }
  html.themes.edit .panel .page-header > * + * {
    margin-top: 0.5em; }
  html.themes.edit .panel .page-header .documentation {
    display: none;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--theme-editor-border); }
  html.themes.edit .panel .page-header .documentation pre {
    margin-top: 1em;
    margin-bottom: 1.5em;
    font-size: 14px; }
  html.themes.edit .panel .page-header .documentation pre code {
    padding: 16px;
    white-space: pre;
    border-radius: var(--button-radius); }
  html.themes.edit .panel .page-header .documentation img {
    border-radius: var(--button-radius); }
  html.themes.edit .panel .page-header .header-buttons .button.float-right + .button.float-right {
    margin-left: 8px; }
  html.themes.edit .panel .page-header .documentation > :first-child {
    margin-top: 0; }
  html.themes.edit .panel .page-header .documentation h3,
  html.themes.edit .panel .page-header .documentation h4,
  html.themes.edit .panel .page-header .documentation h5 {
    font-size: 14px;
    font-weight: 600;
    margin-top: 2em;
    margin-bottom: 0.25em; }
  html.themes.edit .panel .page-header.expanded .documentation {
    display: block; }
  html.themes.edit .panel .page-header-absolute {
    position: absolute;
    top: 0;
    left: 0;
    height: 150px;
    width: 100%;
    padding: 21px 30px;
    z-index: 6;
    background-color: var(--theme-editor-surface); }
  html.themes.edit .panel .page-header-absolute .documentation {
    padding-bottom: 30px; }
  html.themes.edit .panel .page-header-absolute.expanded {
    height: 100%; }
  html.themes.edit .panel .page .page-header-absolute + .editor-wrapper {
    top: 150px !important; }
html.themes.edit .panel.has-unsaved-changes .save-button {
  visibility: visible;
  opacity: 1; }
html.themes.edit .panel-global-css .hide-from-global-css {
  display: none; }
html.themes.edit .panel .page[data-page-id="settings"] label {
  font-size: 14px; }
html.themes.edit .panel .page[data-page-id="settings"] .name label {
  font-size: 16px;
  font-weight: 500; }
html.themes.edit .panel .page[data-page-id="settings"] input[type="text"] {
  width: 100%; }
html.themes.edit .panel .page[data-page-id="settings"] .sl-themeoptions {
  width: 100%; }
html.themes.edit .panel .page[data-page-id="js"] .editor-wrapper,
html.themes.edit .panel .page[data-page-id="css"] .editor-wrapper,
html.themes.edit .panel .page[data-page-id="html"] .editor-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-top: 1px solid var(--border-default); }
  html.themes.edit .panel .page[data-page-id="js"] .editor-wrapper .editor,
  html.themes.edit .panel .page[data-page-id="css"] .editor-wrapper .editor,
  html.themes.edit .panel .page[data-page-id="html"] .editor-wrapper .editor {
    width: 100%;
    height: 100%; }
html.themes.edit .panel .page[data-page-id="js"] .editor-wrapper .error,
html.themes.edit .panel .page[data-page-id="css"] .editor-wrapper .error,
html.themes.edit .panel .page[data-page-id="html"] .editor-wrapper .error {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  padding: 10px 12px;
  z-index: 20;
  visibility: hidden;
  opacity: 0;
  background: #a7483e;
  color: #fff;
  font-family: monospace;
  font-size: 13px; }
  html.themes.edit .panel .page[data-page-id="js"] .editor-wrapper .error .line,
  html.themes.edit .panel .page[data-page-id="css"] .editor-wrapper .error .line,
  html.themes.edit .panel .page[data-page-id="html"] .editor-wrapper .error .line {
    margin-right: 5px;
    font-weight: 500; }
  html.themes.edit .panel .page[data-page-id="js"] .editor-wrapper .error.visible,
  html.themes.edit .panel .page[data-page-id="css"] .editor-wrapper .error.visible,
  html.themes.edit .panel .page[data-page-id="html"] .editor-wrapper .error.visible {
    visibility: visible;
    opacity: 1; }
html.themes.edit .panel .page[data-page-id="snippets"] {
  background: var(--theme-editor-surface); }
  html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list {
    list-style: none; }
  html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item {
    position: relative;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--theme-editor-border); }
    html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item input,
    html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item textarea {
      width: 100%; }
    html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item input {
      margin-bottom: 5px; }
    html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item .snippet-status {
      position: absolute;
      width: 25px;
      height: 25px;
      line-height: 25px;
      border-radius: 25px;
      bottom: 8px;
      right: 8px;
      background: var(--surface-inverse);
      color: var(--color-text-inverse);
      text-align: center;
      z-index: 2;
      font-size: 11px;
      opacity: 0.15; }
      html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item .snippet-status.negative {
        background: #d04232;
        opacity: 0.8; }
      html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item .snippet-status.positive {
        background: #40cb90;
        opacity: 0.8; }
      html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item .snippet-status:hover {
        opacity: 1; }
  html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item-footer {
    position: relative; }
    html.themes.edit .panel .page[data-page-id="snippets"] .snippet-list-item-footer .button + .button {
      margin-left: 10px; }
  html.themes.edit .panel .page[data-page-id="snippets"] .snippet-controls .add-button-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    text-align: center;
    z-index: 2;
    cursor: pointer;
    background: rgba(var(--surface-panel-rgb), 0.72); }
  html.themes.edit .panel .page[data-page-id="snippets"] .snippet-controls .add-button {
    margin-top: 115px; }
html.themes.edit .panel .page[data-page-id="palette"] {
  background: var(--theme-editor-surface); }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-picker {
    position: relative;
    margin: 20px 0;
    padding: 20px 0;
    border-top: 1px solid var(--theme-editor-border);
    border-bottom: 1px solid var(--theme-editor-border);
    z-index: 1; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum {
    width: 100%;
    background: transparent;
    border: 0;
    overflow: visible; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container {
      padding-left: 0;
      padding-top: 0;
      padding-right: 0;
      border-left: 0;
      width: 100%; }
      html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-dragger {
        width: 14px;
        height: 14px;
        border-radius: 20px;
        margin: 1px 0 0 1px;
        border: 3px solid var(--surface-canvas);
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        background-color: transparent;
        -webkit-box-shadow: 0 0 0 1px var(--theme-editor-border-strong), 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
                box-shadow: 0 0 0 1px var(--theme-editor-border-strong), 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
        z-index: 10; }
      html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-slider {
        border-color: transparent;
        background-color: var(--surface-canvas);
        -webkit-box-shadow: 0 0 0 1px var(--theme-editor-border-strong);
                box-shadow: 0 0 0 1px var(--theme-editor-border-strong); }
      html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-palette .sp-thumb-el {
        width: 22px;
        height: 22px;
        border: 0;
        margin: 1px; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-fill {
      padding-top: 38%; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-color {
      right: 13%; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-hue {
      left: 88%; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-input {
      width: 12%;
      padding: 10px;
      background: var(--surface-canvas);
      color: var(--theme-editor-text);
      border: 1px solid var(--theme-editor-border);
      float: right; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-picker-container .sp-input:focus {
      border-color: #226ede; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-input-container {
      float: right; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-input,
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-hue,
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-color,
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-color .sp-sat,
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-color .sp-sat .sp-val,
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .sp-alpha-inner {
      border-radius: 4px; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .palette-picker-save-button {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      position: absolute;
      left: 0;
      right: 13%;
      height: 37px;
      text-align: left;
      cursor: pointer;
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      margin-top: 0;
      border-radius: var(--button-radius);
      border-color: var(--theme-editor-border); }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum .palette-picker-save-button .icon {
      position: relative;
      top: 1px;
      margin: 0 4px; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-picker-spectrum:after {
      display: none; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list {
    list-style: none;
    position: relative;
    z-index: 2;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-empty {
    font-size: 14px;
    color: var(--theme-editor-text-muted); }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item {
    position: relative;
    display: inline-block;
    width: 137px;
    height: 137px;
    line-height: 137px;
    text-align: center;
    cursor: move; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item-color {
    position: absolute;
    top: 2px;
    right: 2px;
    bottom: 2px;
    left: 2px;
    z-index: 1; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item-label {
    position: relative;
    color: #fff;
    letter-spacing: 1px;
    font-size: 16px;
    font-family: monospace;
    text-transform: uppercase;
    z-index: 2; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item-delete {
    position: absolute;
    right: 8px;
    bottom: 8px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 15px;
    background: rgba(var(--surface-inverse-rgb), 0.72);
    color: var(--color-text-inverse);
    font-size: 14px;
    text-align: center;
    opacity: 0;
    z-index: 3;
    cursor: pointer; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item-delete:hover {
      background: rgba(var(--surface-inverse-rgb), 0.92); }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item.is-light .palette-list-item-label {
    color: rgba(0, 0, 0, 0.6); }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item:hover .palette-list-item-delete {
    opacity: 1; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item.drag-target {
    opacity: 0; }
  html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item.drag-ghost {
    position: absolute;
    z-index: 10; }
    html.themes.edit .panel .page[data-page-id="palette"] .palette-list-item.drag-ghost button {
      display: none; }
/**
 * Styles for the theme editor preview.
 */
html.themes.preview .reveal-viewport {
  width: 100%;
  height: 100%;
  padding: 0;
  overflow: hidden;
  text-align: left; }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.users-api-keys {
  --api-keys-copy-surface: rgba(var(--surface-inverse-rgb), 0.16);
  --api-keys-copy-surface-hover: rgba(var(--surface-inverse-rgb), 0.24);
  --api-keys-copy-text: var(--color-text-inverse);
  --api-keys-status-active-surface: var(--status-success-surface);
  --api-keys-status-active-text: var(--status-success-text);
  --api-keys-status-revoked-surface: var(--surface-hover);
  --api-keys-status-revoked-text: var(--color-text-muted); }
  html.users-api-keys .api-keys-secret-row {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    margin-bottom: 0; }
  html.users-api-keys .api-keys-secret-field {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1; }
  html.users-api-keys .api-keys-secret-action {
    width: auto; }
  html.users-api-keys .api-keys-copy-button {
    background: var(--api-keys-copy-surface);
    color: var(--api-keys-copy-text); }
    html.users-api-keys .api-keys-copy-button:hover, html.users-api-keys .api-keys-copy-button:focus-visible {
      background: var(--api-keys-copy-surface-hover);
      color: var(--api-keys-copy-text); }
  html.users-api-keys .api-keys-create-title {
    margin-bottom: var(--minus-space-5); }
  html.users-api-keys .api-keys-access-level {
    width: 100%; }
  html.users-api-keys .api-keys-form-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end; }
  html.users-api-keys .api-keys-list {
    margin-top: var(--section-margin); }
  html.users-api-keys .api-keys-list-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: var(--space-5); }
  html.users-api-keys .api-keys-list-header h3 {
    margin-top: 0;
    margin-bottom: 0; }
  html.users-api-keys .api-keys-empty {
    color: var(--color-text-muted); }
  @media screen and (max-width: 720px) {
    html.users-api-keys .api-keys-secret-row {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: stretch;
          -ms-flex-align: stretch;
              align-items: stretch; }
    html.users-api-keys .api-keys-secret-action {
      width: 100%; }
    html.users-api-keys .api-keys-copy-button {
      width: 100%;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; } }
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
html.users.confirm .column.thin {
  width: 460px; }
html.users.confirm .confirmation-form {
  position: relative; }
html.users.confirm .confirmation-inputs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 30px; }
html.users.confirm .confirmation-status {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: #fff;
  border-radius: var(--section-radius);
  display: none;
  place-items: center; }
html.users.confirm .confirmation-success {
  width: 100%;
  font-size: 1.2em;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
html.users.confirm .confirmation-success .icon {
  display: block;
  width: 60px;
  height: 60px;
  line-height: 60px;
  border-radius: 30px;
  font-size: 40px;
  background: #40cb90;
  color: #fff;
  text-align: center;
  margin-bottom: 20px; }
html.users.confirm .confirmation-success,
html.users.confirm .spinner {
  display: none; }
html.users.confirm [data-state="loading"] .confirmation-status,
html.users.confirm [data-state="confirmed"] .confirmation-status {
  display: grid; }
html.users.confirm [data-state="loading"] .confirmation-status {
  background-color: rgba(255, 255, 255, 0.8); }
html.users.confirm [data-state="loading"] .spinner,
html.users.confirm [data-state="confirmed"] .confirmation-success {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
html.users.confirm [data-state="loading"] .confirmation-inputs,
html.users.confirm [data-state="confirmed"] .confirmation-inputs {
  pointer-events: none; }
html.users.confirm [data-state="confirmed"] .confirmation-inputs {
  pointer-events: none; }
html.users.confirm .send-confirmation-button[disabled] {
  opacity: 0.5;
  pointer-events: none; }
html.users.confirm input {
  width: 100%;
  height: 70px;
  text-align: center; }
html.users.confirm input + input {
  margin-left: 20px; }
html.users.confirm input::-webkit-input-placeholder {
  color: #bbb; }
html.users.confirm input::-moz-placeholder {
  color: #bbb; }
html.users.confirm input:-ms-input-placeholder {
  color: #bbb; }
html.users.confirm input::-ms-input-placeholder {
  color: #bbb; }
html.users.confirm input::placeholder {
  color: #bbb; }
html.users.confirm input:focus::-webkit-input-placeholder {
  color: transparent; }
html.users.confirm input:focus::-moz-placeholder {
  color: transparent; }
html.users.confirm input:focus:-ms-input-placeholder {
  color: transparent; }
html.users.confirm input:focus::-ms-input-placeholder {
  color: transparent; }
html.users.confirm input:focus::placeholder {
  color: transparent; }
html.users.confirm input::-webkit-outer-spin-button,
html.users.confirm input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0; }
html.users.confirm input[type=number] {
  -moz-appearance: textfield; }
/**
 * Block animation effects.
 */
/**
 * Styles for slide blocks.
 */
/**
 * Utility methods.
 *
 * @author Hakim El Hattab
 */
/**
 * Enumeration of global style config values.
 *
 * @author Hakim El Hattab
 */
/**
 * Block animation effects.
 */
.reveal .sl-block {
  display: block;
  position: absolute;
  z-index: auto;
  min-width: 1px;
  min-height: 1px;
  pointer-events: none; }
  .reveal .sl-block .sl-block-style {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    outline: 0; }
  .reveal .sl-block .sl-block-content {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    outline: 0;
    word-wrap: break-word; }
    .reveal .sl-block .sl-block-content .sl-block-content-preview:not(.inline) {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0; }
  .reveal .sl-block .sl-block-content > :first-child {
    margin-top: 0; }
  .reveal .sl-block .sl-block-content > :last-child,
  .reveal .sl-block .sl-block-content-preview > :last-child {
    margin-bottom: 0; }
  .reveal .sl-block .sl-block-content[data-has-letter-spacing]:not([data-auto-animate-target]) * {
    letter-spacing: inherit; }
  .reveal .sl-block .sl-block-content[data-has-line-height] *, .reveal .sl-block[data-block-type="text"] .sl-block-content[data-auto-animate-target] * {
    line-height: inherit; }

.sl-block[data-hidden] {
  display: none; }

.reveal .sl-block[data-auto-animate-target]:not([data-auto-animate-target^="unmatched"]) .sl-block-style {
  opacity: 1 !important; }

.reveal section:not(.stack):not([data-background-interactive="true"]).present .sl-block-content {
  pointer-events: auto; }

.sl-editor .sl-selection-group {
  display: block;
  position: absolute;
  z-index: auto;
  width: 1px;
  height: 1px;
  top: 0;
  left: 0; }

.sl-editor .sl-selection-group .sl-block-transform .anchor {
  pointer-events: auto !important; }

.ua-safari .sl-block-style[style*="mix-blend-mode"] .sl-block-content.fragment {
  will-change: auto; }

.reveal .sl-block-content[data-animation-type="fade-in"] {
  pointer-events: none;
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="fade-in"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="fade-in"] {
  pointer-events: auto;
  opacity: 1;
  visibility: visible; }
.reveal .sl-block-content[data-animation-type="fade-out"] {
  pointer-events: auto;
  opacity: 1;
  visibility: visible; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="fade-out"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="fade-out"] {
  pointer-events: none;
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="fade-out"][data-animation-trigger="hover"][data-animation-trigger-id="self"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="fade-out"][data-animation-trigger="hover"][data-animation-trigger-id="self"] {
  pointer-events: auto;
  visibility: visible; }
.reveal .is-editing section:not(.stack) .sl-block-content.animate[data-animation-type="fade-out"], .is-editing .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="fade-out"] {
  pointer-events: auto;
  opacity: 0.6;
  visibility: visible; }
.reveal .sl-block-content[data-animation-type="slide-up"] {
  pointer-events: none;
  -webkit-transform: translateY(30px) translateZ(1px);
          transform: translateY(30px) translateZ(1px);
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="slide-up"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="slide-up"] {
  pointer-events: auto;
  -webkit-transform: none;
          transform: none;
  opacity: 1;
  visibility: visible; }
.reveal .sl-block-content[data-animation-type="slide-down"] {
  pointer-events: none;
  -webkit-transform: translateY(-30px) translateZ(1px);
          transform: translateY(-30px) translateZ(1px);
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="slide-down"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="slide-down"] {
  pointer-events: auto;
  -webkit-transform: none;
          transform: none;
  opacity: 1;
  visibility: visible; }
.reveal .sl-block-content[data-animation-type="slide-left"] {
  pointer-events: none;
  -webkit-transform: translateX(30px) translateZ(1px);
          transform: translateX(30px) translateZ(1px);
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="slide-left"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="slide-left"] {
  pointer-events: auto;
  -webkit-transform: none;
          transform: none;
  opacity: 1;
  visibility: visible; }
.reveal .sl-block-content[data-animation-type="slide-right"] {
  pointer-events: none;
  -webkit-transform: translateX(-30px) translateZ(1px);
          transform: translateX(-30px) translateZ(1px);
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="slide-right"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="slide-right"] {
  pointer-events: auto;
  -webkit-transform: none;
          transform: none;
  opacity: 1;
  visibility: visible; }
.reveal .sl-block-content[data-animation-type="scale-up"] {
  pointer-events: none;
  -webkit-transform: scale(0.6) translateZ(1px);
          transform: scale(0.6) translateZ(1px);
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="scale-up"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="scale-up"] {
  pointer-events: auto;
  -webkit-transform: none;
          transform: none;
  opacity: 1;
  visibility: visible; }
.reveal .sl-block-content[data-animation-type="scale-down"] {
  pointer-events: none;
  -webkit-transform: scale(1.4) translateZ(1px);
          transform: scale(1.4) translateZ(1px);
  opacity: 0;
  visibility: hidden; }
.reveal section:not(.stack) .sl-block-content.animate[data-animation-type="scale-down"], .reveal.block-animations-disabled section:not(.stack) .sl-block-content[data-animation-type="scale-down"] {
  pointer-events: auto;
  -webkit-transform: none;
          transform: none;
  opacity: 1;
  visibility: visible; }
.reveal section .sl-block-content[data-animation-type] {
  -webkit-transition-property: opacity, visibility, -webkit-transform;
  transition-property: opacity, visibility, -webkit-transform;
  transition-property: transform, opacity, visibility;
  transition-property: transform, opacity, visibility, -webkit-transform; }
.reveal section .sl-block-content[data-animation-type][data-animation-trigger-id="self"] {
  pointer-events: auto;
  visibility: visible; }
.reveal section.past > .sl-block .sl-block-content[data-animation-type],
.reveal section.future > .sl-block .sl-block-content[data-animation-type] {
  -webkit-transition-delay: 0s !important;
          transition-delay: 0s !important; }
.reveal .sl-block-content.animation-trigger {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.sl-editor.is-editing .reveal section:not(.stack).present .sl-block > * {
  pointer-events: auto; }
.sl-editor.is-editing .reveal .sl-block {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-transition: none;
  transition: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none; }
  .sl-editor.is-editing .reveal .sl-block .sl-block-content {
    cursor: pointer; }
  .sl-editor.is-editing .reveal .sl-block .sl-block-content:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: '';
    z-index: 2;
    background-color: rgba(0, 0, 0, 0);
    border-radius: inherit; }
  .sl-editor.is-editing .reveal .sl-block.is-editing, .sl-editor.is-editing .reveal .sl-block.is-editing .sl-block-content {
    cursor: auto;
    -webkit-user-select: auto;
       -moz-user-select: auto;
        -ms-user-select: auto;
            user-select: auto; }
  .sl-editor.is-editing .reveal .sl-block.is-editing .sl-block-content {
    -webkit-box-shadow: 0 0 0 calc( var(--scaled-border-2) ) rgba(34, 110, 222, 0.4);
            box-shadow: 0 0 0 calc( var(--scaled-border-2) ) rgba(34, 110, 222, 0.4); }
  .sl-editor.is-editing .reveal .sl-block.is-editing .sl-block-content:before {
    display: none; }
.sl-editor.is-editing .reveal .sl-block.intro-start {
  opacity: 0;
  z-index: 255;
  -webkit-transform: scale(1.1);
          transform: scale(1.1); }
.sl-editor.is-editing .reveal .sl-block.intro-end {
  z-index: 255;
  -webkit-transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.2s ease;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.2s ease; }
.sl-editor.is-editing .reveal .sl-block[data-locked] * {
  pointer-events: none !important;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: default; }
.sl-editor.is-editing .reveal .sl-block[data-locked] > .sl-block-transform .anchor {
  display: none !important; }

.sl-editor.is-editing .reveal .sl-block-overlay,
.sl-editor[data-mode="arrange"] .reveal .sl-block-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0; }
.sl-editor.is-editing .reveal .sl-block-overlay-message,
.sl-editor.is-editing .reveal .sl-block-overlay-warning,
.sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-message,
.sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-warning {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 10px;
  font-size: 14px;
  font-family: var(--font-sans);
  text-align: center;
  background-color: #222;
  color: #fff;
  opacity: 0.9;
  overflow: hidden; }
  .sl-editor.is-editing .reveal .sl-block-overlay-message .overlay-content,
  .sl-editor.is-editing .reveal .sl-block-overlay-warning .overlay-content,
  .sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-message .overlay-content,
  .sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-warning .overlay-content {
    margin: auto; }
  .sl-editor.is-editing .reveal .sl-block-overlay-message.below-content,
  .sl-editor.is-editing .reveal .sl-block-overlay-warning.below-content,
  .sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-message.below-content,
  .sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-warning.below-content {
    z-index: 0 !important; }
.sl-editor.is-editing .reveal .sl-block-overlay-warning,
.sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-warning {
  color: #ffa660; }
  .sl-editor.is-editing .reveal .sl-block-overlay-warning .icon,
  .sl-editor[data-mode="arrange"] .reveal .sl-block-overlay-warning .icon {
    display: block;
    margin: 0 auto 10px auto;
    width: 2em;
    height: 2em;
    line-height: 2em;
    border-radius: 1em;
    text-align: center;
    font-size: 12px;
    color: #fff;
    background-color: #e06200; }
.sl-editor.is-editing .reveal .sl-block-placeholder,
.sl-editor[data-mode="arrange"] .reveal .sl-block-placeholder {
  background-image: url(//staging.slides.com/assets/editor/block-placeholder-white-transparent-500x500-11af6287685db6a3135e7eb5ee430edef4e63c3204536743ab55fb2b8401d1aa.png);
  background-size: contain;
  background-color: #222;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  opacity: 0.9; }

.reveal .sl-block[data-block-type="text"][data-flip-x] .sl-block-content > *,
.reveal .sl-block[data-block-type="image"][data-flip-x] img,
.reveal .sl-block[data-block-type="image"][data-flip-x] svg,
.reveal .sl-block[data-block-type="shape"][data-flip-x] svg,
.reveal .sl-block[data-block-type="drawing"][data-flip-x] svg,
.reveal .sl-block[data-block-type="iframe"][data-flip-x] iframe,
.reveal .sl-block[data-block-type="chart"][data-flip-x] canvas {
  -webkit-transform: scaleX(-1);
          transform: scaleX(-1); }

.reveal .sl-block[data-block-type="text"][data-flip-y] .sl-block-content *,
.reveal .sl-block[data-block-type="image"][data-flip-y] img,
.reveal .sl-block[data-block-type="image"][data-flip-y] svg,
.reveal .sl-block[data-block-type="shape"][data-flip-y] svg,
.reveal .sl-block[data-block-type="drawing"][data-flip-y] svg,
.reveal .sl-block[data-block-type="iframe"][data-flip-y] iframe,
.reveal .sl-block[data-block-type="chart"][data-flip-y] canvas {
  -webkit-transform: scaleY(-1);
          transform: scaleY(-1); }

.reveal .sl-block[data-block-type="text"][data-flip-x][data-flip-y] .sl-block-content > *,
.reveal .sl-block[data-block-type="image"][data-flip-x][data-flip-y] img,
.reveal .sl-block[data-block-type="image"][data-flip-x][data-flip-y] svg,
.reveal .sl-block[data-block-type="shape"][data-flip-x][data-flip-y] svg,
.reveal .sl-block[data-block-type="drawing"][data-flip-x][data-flip-y] svg,
.reveal .sl-block[data-block-type="iframe"][data-flip-x][data-flip-y] iframe,
.reveal .sl-block[data-block-type="chart"][data-flip-x][data-flip-y] canvas {
  -webkit-transform: scale(-1, -1);
          transform: scale(-1, -1); }

.reveal .sl-block-group {
  width: 1px;
  height: 1px; }

.reveal.rtl .sl-block-group {
  top: 0;
  left: 0; }

.sl-editor.is-dragging-block .sl-block-transform .metadata,
.sl-editor.is-dragging-block .sl-block-transform .anchor {
  opacity: 0; }

.sl-editor.is-editing .reveal .sl-block-group {
  top: 0;
  left: 0; }
.sl-editor.is-editing .reveal .sl-block-group:not(.is-open) .sl-block[data-locked] .sl-block-content {
  cursor: pointer; }
.sl-editor.is-editing .reveal .sl-block-group.is-open ~ .sl-block-group.is-open {
  -webkit-box-shadow: none;
          box-shadow: none; }
.sl-editor.is-editing .reveal .sl-block-group.is-open > .sl-block-transform {
  visibility: hidden; }
.sl-editor.is-editing .reveal .sl-block-group-content {
  pointer-events: none !important; }
.sl-editor.is-editing .reveal .sl-block-group.is-focused .sl-block-group-content {
  pointer-events: auto !important; }
.sl-editor.is-editing .reveal .sl-block-group-content.is-open:not(.is-open-nested) > .sl-block > * {
  pointer-events: auto; }

.sl-editor.pulse-all-blocks .sl-block-transform,
.sl-editor.has-block-highlights .sl-block-transform {
  opacity: 0; }

.sl-editor.has-block-highlights .sl-block-content {
  -webkit-transition: opacity 0.15s ease, -webkit-filter 0.15s ease !important;
  transition: opacity 0.15s ease, -webkit-filter 0.15s ease !important;
  transition: opacity 0.15s ease, filter 0.15s ease !important;
  transition: opacity 0.15s ease, filter 0.15s ease, -webkit-filter 0.15s ease !important; }

.sl-editor.has-block-highlights section:not(.stack).present .sl-block:not(.is-highlighted):not(.sl-block-group) .sl-block-content {
  opacity: 0.25;
  -webkit-filter: grayscale(0.5);
          filter: grayscale(0.5); }

.sl-editor.is-editing .sl-block-highlights {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 100;
  pointer-events: none !important; }
.sl-editor.is-editing .sl-block-highlight {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  outline: var(--scaled-border-2) solid #226ede;
  outline-offset: 2px;
  opacity: 0;
  -webkit-animation: pulse-semi-opacity 2s linear 0.1s infinite forwards;
          animation: pulse-semi-opacity 2s linear 0.1s infinite forwards; }

.sl-editor.has-block-hover-highlights .sl-block-highlight {
  opacity: 1;
  -webkit-animation: none;
          animation: none;
  outline-offset: -1px; }

.sl-editor.is-editing .sl-block-transform {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  visibility: hidden;
  z-index: 255;
  font-size: calc( 10px / var(--slide-ui-scale, 1) );
  direction: ltr;
  pointer-events: none !important; }
  .sl-editor.is-editing .sl-block-transform .metadata {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    width: 12.7em;
    color: #fff;
    font-size: 11px;
    font-size: calc(11px/var(--slide-ui-scale, 1));
    line-height: 1.7em;
    font-family: var(--font-sans);
    text-align: center;
    pointer-events: none;
    white-space: nowrap;
    padding: 0.55em; }
  .sl-editor.is-editing .sl-block-transform .metadata-item {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 1.7em;
    background-color: #226ede;
    border-radius: 0.18em;
    padding: 0 0.55em; }
  .sl-editor.is-editing .sl-block-transform .metadata-item.interactive {
    cursor: pointer;
    pointer-events: auto; }
  .sl-editor.is-editing .sl-block-transform .metadata-item + .metadata-item {
    margin-left: 0.45em; }
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="s"],
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="n"] {
    left: 50%;
    margin-left: -6.35em; }
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="n"] {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
    bottom: 100%; }
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="s"] {
    top: 100%; }
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="e"],
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="w"] {
    top: 50%; }
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="e"] {
    -webkit-transform: translate(-50%, -50%) rotate(90deg) translate(0, 50%);
            transform: translate(-50%, -50%) rotate(90deg) translate(0, 50%); }
  .sl-editor.is-editing .sl-block-transform .metadata[data-side="w"] {
    -webkit-transform: translate(-50%, -50%) rotate(-90deg) translate(0, 50%);
            transform: translate(-50%, -50%) rotate(-90deg) translate(0, 50%);
    left: 100%; }
  .sl-editor.is-editing .sl-block-transform .sl-block-ai-assist {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 1.7em;
    line-height: 1.7em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 11px;
    font-size: calc(11px/var(--slide-ui-scale, 1));
    font-family: var(--font-sans);
    background-color: #226ede;
    border-radius: 0.18em;
    padding: 0 0.45em;
    color: #fff;
    position: absolute;
    bottom: 0.54em;
    right: 0.54em;
    pointer-events: auto; }
    .sl-editor.is-editing .sl-block-transform .sl-block-ai-assist .icon {
      font-size: 1.2em;
      margin: -0.1em;
      vertical-align: top; }
    .sl-editor.is-editing .sl-block-transform .sl-block-ai-assist.thin-centered {
      bottom: 50%;
      -webkit-transform: translateY(50%);
              transform: translateY(50%);
      font-size: calc(8px/var(--slide-ui-scale, 1)); }
  .sl-editor.is-editing .sl-block-transform .sl-block-ai-assist:hover {
    background: linear-gradient(135deg, #226ede 0%, #7b00ff 100%); }
  .sl-editor.is-editing .sl-block-transform .anchor-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    -webkit-box-shadow: 0 0 0 var(--scaled-border-1) #226ede inset;
            box-shadow: 0 0 0 var(--scaled-border-1) #226ede inset; }
  .sl-editor.is-editing .sl-block-transform .anchor {
    position: absolute;
    width: 1em;
    height: 1em;
    pointer-events: all;
    visibility: hidden; }
  .sl-editor.is-editing .sl-block-transform .anchor-point {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-box-shadow: 0 0 0 var(--scaled-border-1) #226ede inset;
            box-shadow: 0 0 0 var(--scaled-border-1) #226ede inset;
    border-radius: 100px;
    background: #fff;
    cursor: inherit;
    z-index: 2; }
  .sl-editor.is-editing .sl-block-transform .anchor-rotation {
    position: absolute;
    width: 2em;
    height: 2em;
    border-radius: 2em;
    top: 0;
    left: 0;
    z-index: 1;
    -webkit-transform-origin: 0 0;
            transform-origin: 0 0;
    cursor: url(//staging.slides.com/assets/icons/block-rotate-icon-16-4904601fe2df102be6fcad9f81a4601c5be45673cf3c8a80d572d968c18b39c5.cur), pointer;
    cursor: url(//staging.slides.com/assets/icons/block-rotate-icon-16-5dd6c9d1791c78d970282552bd1cd905091397479c1cb18435499daba4255a6b.svg) 8 8, pointer;
    cursor: -webkit-image-set(url(//staging.slides.com/assets/icons/block-rotate-icon-16-5dd6c9d1791c78d970282552bd1cd905091397479c1cb18435499daba4255a6b.svg) 1x, url(//staging.slides.com/assets/icons/block-rotate-icon-32-809cb464a725c861f51c732bc9f19362af8678a97ab465a8d7b7f1f4f09a70d2.svg) 2x) 8 8, pointer; }
  .sl-editor.is-editing .sl-block-transform[data-state="hover"] .anchor-wrapper {
    -webkit-box-shadow: 0 0 0 var(--scaled-border-1) #226ede, 0 0 0 var(--scaled-border-1) #226ede inset;
            box-shadow: 0 0 0 var(--scaled-border-1) #226ede, 0 0 0 var(--scaled-border-1) #226ede inset; }
  .sl-editor.is-editing .sl-block-transform[data-state="hover"] .anchor:not([data-direction=p1]):not([data-direction=p2]):not([data-direction=pc]) {
    display: none !important; }
  .sl-editor.is-editing .sl-block-transform[data-state="hover"] .metadata {
    display: none; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=n] {
    left: 1em;
    right: 1em;
    top: -1em;
    height: 2em;
    width: auto;
    cursor: ns-resize; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=n] .anchor-point {
      width: 1em;
      height: 1em;
      left: 50%;
      margin-left: -0.5em;
      top: 0.5em; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=n] .anchor-rotation {
      left: 50%;
      top: 2em;
      -webkit-transform: rotate(225deg) translate(4px, 4px);
              transform: rotate(225deg) translate(4px, 4px); }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=e] {
    top: 1em;
    bottom: 1em;
    right: -1em;
    height: auto;
    width: 2em;
    cursor: ew-resize; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=e] .anchor-point {
      width: 1em;
      height: 1em;
      top: 50%;
      margin-top: -0.5em;
      left: 0.5em; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=e] .anchor-rotation {
      top: 50%;
      -webkit-transform: rotate(315deg) translate(4px, 4px);
              transform: rotate(315deg) translate(4px, 4px); }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=s] {
    left: 1em;
    right: 1em;
    bottom: -1em;
    height: 2em;
    width: auto;
    cursor: ns-resize; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=s] .anchor-point {
      width: 1em;
      height: 1em;
      left: 50%;
      margin-left: -0.5em;
      top: 0.5em; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=s] .anchor-rotation {
      left: 50%;
      -webkit-transform: rotate(45deg) translate(4px, 4px);
              transform: rotate(45deg) translate(4px, 4px); }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=w] {
    top: 1em;
    bottom: 1em;
    left: -1em;
    height: auto;
    width: 2em;
    cursor: ew-resize; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=w] .anchor-point {
      width: 1em;
      height: 1em;
      top: 50%;
      margin-top: -0.5em;
      left: 0.5em; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=w] .anchor-rotation {
      top: 50%;
      left: 2em;
      -webkit-transform: rotate(135deg) translate(4px, 4px);
              transform: rotate(135deg) translate(4px, 4px); }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=nw] {
    right: 100%;
    bottom: 100%;
    margin-right: -0.5em;
    margin-bottom: -0.5em;
    cursor: nw-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=ne] {
    left: 100%;
    bottom: 100%;
    margin-left: -0.5em;
    margin-bottom: -0.5em;
    cursor: ne-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=se] {
    left: 100%;
    top: 100%;
    margin-left: -0.5em;
    margin-top: -0.5em;
    cursor: se-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=sw] {
    right: 100%;
    top: 100%;
    margin-right: -0.5em;
    margin-top: -0.5em;
    cursor: sw-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=n] {
    cursor: ns-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=e] {
    cursor: ew-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=s] {
    cursor: ns-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=w] {
    cursor: ew-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=nw] {
    cursor: nw-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=ne] {
    cursor: ne-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=se] {
    cursor: se-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-cursor-direction=sw] {
    cursor: sw-resize; }
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=p1],
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=p2],
  .sl-editor.is-editing .sl-block-transform .anchor[data-direction=pc] {
    width: 1em;
    height: 1em;
    left: 0;
    top: 0;
    margin-left: -0.5em;
    margin-top: -0.5em;
    cursor: move; }
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=p1] .anchor-point,
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=p2] .anchor-point,
    .sl-editor.is-editing .sl-block-transform .anchor[data-direction=pc] .anchor-point {
      background-color: rgba(255, 255, 255, 0.9); }
  .sl-editor.is-editing .sl-block-transform.visible {
    visibility: inherit; }
    .sl-editor.is-editing .sl-block-transform.visible .anchor {
      visibility: inherit; }
  .sl-editor.is-editing .sl-block-transform.spread-anchors .anchor:empty {
    font-size: 2px; }

.sl-editor.is-editing .sl-block.is-editing .sl-block-transform {
  visibility: hidden; }

.sl-editor.is-editing.touch-editor-small .sl-block .sl-block-transform {
  font-size: 30px; }

.sl-editor.is-editing.multiple-blocks-selected .sl-block-transform:not([data-state="hover"]) .sl-block-ai-assist,
.sl-editor.is-editing.multiple-blocks-selected .sl-block-transform .anchor-rotation,
.sl-editor.is-editing.multiple-blocks-selected .sl-block-transform .metadata,
.sl-editor.is-editing.multiple-blocks-selected .sl-block .sl-block-transform .anchor {
  display: none; }

.sl-editor .sl-block[data-text-layout="auto-width"] {
  white-space: nowrap; }

.sl-editor .sl-block[data-block-type="text"].has-preview:not(.is-editing) .sl-block-content > *:not(.editing-ui) {
  display: none; }

.sl-editor .sl-block[data-block-type="text"].is-editing .sl-block-content-preview {
  display: none; }

.sl-editor .sl-block[data-block-type="text"].is-fitting .sl-block-content {
  -webkit-transition: none !important;
  transition: none !important;
  height: auto; }

.sl-editor.is-editing .reveal .sl-block[data-block-type="text"].is-editing.is-text-overflowing .sl-block-content {
  max-height: 700px;
  max-height: var(--slide-height);
  overflow: auto; }

.reveal .sl-block[data-block-type="image"] .sl-block-placeholder {
  background-image: url(//staging.slides.com/assets/editor/image-placeholder-white-transparent-500x500-1f08475c78a4a4600fa27f16bd179efdb19d3813ac0b41d3dd118b1c8d243c40.svg) !important; }
.reveal .sl-block[data-block-type="image"] .sl-block-content {
  overflow: hidden; }
.reveal .sl-block[data-block-type="image"] .sl-block-content img {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: top; }
.reveal .sl-block[data-block-type="image"] .sl-block-content svg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0; }
.reveal .sl-block[data-block-type="image"] [data-inline-svg="true"] img {
  display: none; }
.reveal .sl-block[data-block-type="image"] img.loading {
  visibility: hidden; }
.reveal .sl-block[data-block-type="image"] a.sl-block-content {
  color: inherit; }
.reveal .sl-block[data-block-type="image"].is-cropping {
  visibility: hidden; }
.reveal .sl-block[data-block-type="image"].is-panning .sl-block-transform {
  -webkit-box-shadow: 0px 0px 0 2200px rgba(255, 255, 255, 0.5);
          box-shadow: 0px 0px 0 2200px rgba(255, 255, 255, 0.5); }
.reveal .sl-block[data-block-type="image"].is-panning .sl-block-image-controls {
  display: none; }
.reveal .sl-block[data-block-type="image"].is-panning .sl-block-style, .reveal .sl-block[data-block-type="image"].is-panning .sl-block-content {
  overflow: visible;
  cursor: -webkit-grabbing;
  cursor: grabbing;
  z-index: 255 !important; }

.sl-block-image-controls {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: none;
  z-index: 255;
  overflow: hidden;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.1em;
  pointer-events: none !important; }
  .sl-block-image-controls .sl-block-image-control {
    font-size: calc( 16px / var(--slide-ui-scale, 1) );
    width: 1.6em;
    height: 1.6em;
    padding: 0.125em 0.25em;
    pointer-events: auto;
    border-radius: 0.25em; }

.sl-block[data-block-type="image"]:not([data-locked]):hover .sl-block-image-controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.sl-block-image-search {
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 5%;
  left: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  z-index: 20; }

.sl-block-image-search-button {
  font-size: calc( 12px / var(--slide-ui-scale, 1) );
  padding: 0.44em;
  border-radius: 0.25em;
  text-align: left;
  height: auto; }

.reveal .sl-block[data-block-type="image"] .media-progress,
.reveal .sl-block[data-block-type="video"] .media-progress {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: rgba(0, 0, 0, 0.7);
  font-size: 14px;
  color: #fff;
  text-align: center; }

.reveal .sl-block[data-block-type="video"] .sl-block-placeholder {
  background-image: url(//staging.slides.com/assets/editor/video-placeholder-white-transparent-500x500-55ba5c64cb21b3bf7390124d134a0c4b718373928020b49a267d298d246a8bfe.png) !important; }
.reveal .sl-block[data-block-type="video"] .sl-block-content {
  overflow: hidden; }
.reveal .sl-block[data-block-type="video"] .sl-block-content img,
.reveal .sl-block[data-block-type="video"] .sl-block-content video {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: top; }
.reveal .sl-block[data-block-type="video"] .sl-block-content img {
  -o-object-fit: contain;
     object-fit: contain; }
.reveal .sl-block[data-block-type="video"] .sl-block-content .video-link {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10;
  opacity: 0.6;
  background-image: url(//staging.slides.com/assets/icons/video-icon-light-32-08e039bdfb8e4d35457b4908ada233356c14152e3a3490b664345eeee021c046.svg);
  background-size: 14%;
  background-position: right 5% bottom 5%;
  background-repeat: no-repeat;
  background-color: rgba(0, 0, 0, 0.2); }

.reveal .sl-block[data-block-type="iframe"] .sl-block-content {
  overflow: hidden;
  -webkit-overflow-scrolling: touch; }
.reveal .sl-block[data-block-type="iframe"] .sl-block-content iframe {
  width: 100%;
  height: 100%; }
.reveal .sl-block[data-block-type="iframe"] .sl-block-content.fallback {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: rgba(0, 0, 0, 0.1);
  background-repeat: no-repeat;
  background-position: 50% 50%; }
.reveal .sl-block[data-block-type="iframe"] .sl-block-content.fallback a {
  margin: auto;
  max-width: 100%;
  padding: 14px;
  color: #fff;
  font-size: 0.75em; }

.reveal .sl-block[data-block-type="shape"] .sl-block-content {
  line-height: 0;
  pointer-events: none !important; }
.reveal .sl-block[data-block-type="shape"] .sl-block-content svg {
  vertical-align: top; }
.reveal .sl-block[data-block-type="shape"] .sl-block-content svg * {
  pointer-events: auto; }

:not(.sl-editor) .sl-block[data-block-type="shape"] svg {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  padding: 1px;
  margin: -1px !important; }

.reveal .sl-block[data-block-type="code"] .sl-block-placeholder {
  background-image: url(//staging.slides.com/assets/editor/code-placeholder-white-transparent-500x500-3bc858fea8664ac244e3a4d646d15023f8601f46f0a01b1f4df36f25d0a196c5.png) !important; }
.reveal .sl-block[data-block-type="code"] .sl-block-content {
  overflow: hidden; }
.reveal .sl-block[data-block-type="code"] .sl-block-content pre,
.reveal .sl-block[data-block-type="code"] .sl-block-content code {
  width: 100%;
  height: 100%;
  margin: 0; }
.reveal .sl-block[data-block-type="code"] .sl-block-content pre {
  font-size: 0.55em;
  padding: 0; }
.reveal .sl-block[data-block-type="code"] .sl-block-content code {
  white-space: pre;
  word-wrap: normal; }
.reveal .sl-block[data-block-type="code"] .sl-block-content .hljs-ln-numbers {
  white-space: nowrap; }
.reveal .sl-block[data-block-type="code"] .sl-block-content[data-code-wrap="true"] code {
  white-space: pre-wrap;
  word-wrap: break-word;
  word-break: break-word; }
.reveal .sl-block[data-block-type="code"] .copy-code-to-clipboard {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 12px;
  text-transform: uppercase;
  color: #fff;
  background: #226ede;
  border-radius: 2px;
  padding: 4px 8px;
  display: none; }
.reveal .sl-block[data-block-type="code"] .copy-code-to-clipboard:hover {
  background: #4e8be5; }
.reveal .sl-block[data-block-type="code"] .copy-code-to-clipboard:active {
  background: #1e63c9; }
.reveal .sl-block[data-block-type="code"] .copy-code-to-clipboard.bounce {
  -webkit-animation: small-bounce 0.4s ease;
          animation: small-bounce 0.4s ease; }
.reveal .sl-block[data-block-type="code"] .sl-block-content:hover .copy-code-to-clipboard {
  display: block; }

.sl-block[data-block-type="code"].is-empty [data-code-autoheight="true"] {
  min-height: 100px; }

.sl-editor .sl-block[data-block-type="code"] pre:not(:last-child) {
  display: none; }
.sl-editor .sl-block[data-block-type="code"] .sl-block-content-preview {
  height: 100%; }
.sl-editor .sl-block[data-block-type="code"] .sl-block-content-preview pre {
  display: block; }

.sl-editor.is-editing .sl-block[data-block-type="code"] .sl-block-content-preview .fragment {
  display: none;
  -webkit-transition: none;
  transition: none; }
.sl-editor.is-editing .sl-block[data-block-type="code"] .sl-block-content-preview .fragment[data-preview-step="visible"] {
  display: block;
  opacity: 1 !important; }

.has-visible-scrollbars .sl-block[data-block-type="code"] ::-webkit-scrollbar {
  height: 12px;
  width: 12px; }
.has-visible-scrollbars .sl-block[data-block-type="code"] ::-webkit-scrollbar-thumb {
  background: rgba(100, 100, 100, 0.7);
  border-radius: 8px;
  border: 4px solid rgba(0, 0, 0, 0);
  background-clip: padding-box; }
.has-visible-scrollbars .sl-block[data-block-type="code"] ::-webkit-scrollbar-corner {
  background: transparent; }

.sl-block-content[data-code-frame="osx"],
.sl-block-content[data-code-frame="osx-grey"] {
  -webkit-box-shadow: 0 6px 30px rgba(0, 0, 0, 0.3);
          box-shadow: 0 6px 30px rgba(0, 0, 0, 0.3);
  border-radius: 6px; }
  .sl-block-content[data-code-frame="osx"] .sl-block-content-preview, .sl-block-content[data-code-frame="osx"] pre, .sl-block-content[data-code-frame="osx"] code,
  .sl-block-content[data-code-frame="osx-grey"] .sl-block-content-preview,
  .sl-block-content[data-code-frame="osx-grey"] pre,
  .sl-block-content[data-code-frame="osx-grey"] code {
    border-radius: 6px; }

.sl-block-content[data-code-frame="osx"] code,
.sl-block-content[data-code-frame="osx-grey"] code {
  padding: 15px; }

.sl-block-content[data-code-frame="osx"] code:before,
.sl-block-content[data-code-frame="osx-grey"] code:before {
  content: '';
  display: block;
  height: 32px; }

.sl-block-content[data-code-frame="osx"] pre:after,
.sl-block-content[data-code-frame="osx-grey"] pre:after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 32px;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8%2BCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmlld0JveD0iMCAwIDYyIDEyIiB3aWR0aD0iNjIiIGhlaWdodD0iMTIiPgoJPGNpcmNsZSBjeD0iNiIgY3k9IjYiIHI9IjYiIGZpbGw9IiNmZjVhNTIiPjwvY2lyY2xlPgoJPGNpcmNsZSBjeD0iMjYiIGN5PSI2IiByPSI2IiBmaWxsPSIjZTZjMDI4Ij48L2NpcmNsZT4KCTxjaXJjbGUgY3g9IjQ2IiBjeT0iNiIgcj0iNiIgZmlsbD0iIzU0YzIyYiI%2BPC9jaXJjbGU%2BCjwvc3ZnPg%3D%3D);
  background-position: 14px 14px;
  background-repeat: no-repeat;
  background-color: inherit; }

.sl-block-content[data-code-frame="osx-grey"] pre:after {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8%2BCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmlld0JveD0iMCAwIDYyIDEyIiB3aWR0aD0iNjIiIGhlaWdodD0iMTIiPgoJPGNpcmNsZSBjeD0iNiIgY3k9IjYiIHI9IjYiIGZpbGw9IiM5OTkiPjwvY2lyY2xlPgoJPGNpcmNsZSBjeD0iMjYiIGN5PSI2IiByPSI2IiBmaWxsPSIjOTk5Ij48L2NpcmNsZT4KCTxjaXJjbGUgY3g9IjQ2IiBjeT0iNiIgcj0iNiIgZmlsbD0iIzk5OSI%2BPC9jaXJjbGU%2BCjwvc3ZnPg%3D%3D); }

.reveal .sl-block[data-block-type="math"] {
  font-size: 50px; }
  .reveal .sl-block[data-block-type="math"] .sl-block-content {
    font-style: normal;
    font-family: KaTeX_Main, Times New Roman, serif;
    line-height: 1.4; }
  .reveal .sl-block[data-block-type="math"] .sl-block-placeholder {
    background-image: url(//staging.slides.com/assets/editor/math-placeholder-white-transparent-500x500-fde912e07a6f9fac71e1720c44d801bd5d3d026e1e5e0413806ee12d82246e31.png) !important; }
  .reveal .sl-block[data-block-type="math"] .math-input {
    display: none; }
  .reveal .sl-block[data-block-type="math"] .math-output {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content; }
  .reveal .sl-block[data-block-type="math"] .math-output + .math-output {
    display: none; }
  .reveal .sl-block[data-block-type="math"].is-empty .sl-block-content {
    width: 400px;
    height: 200px; }

.reveal .katex {
  font-family: KaTeX_Main, Times New Roman, serif; }

.reveal .sl-block[data-block-type="table"] .sl-block-content {
  text-align: left; }
.reveal .sl-block[data-block-type="table"] .sl-table-column-resizer {
  display: block;
  position: absolute;
  height: 100%;
  width: 9px;
  top: 0;
  margin-left: -4px;
  z-index: 256;
  cursor: col-resize;
  opacity: 0;
  background-color: rgba(34, 110, 222, 0.5);
  -webkit-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease; }
  .reveal .sl-block[data-block-type="table"] .sl-table-column-resizer:hover, .reveal .sl-block[data-block-type="table"] .sl-table-column-resizer.is-dragging {
    opacity: 1; }
.reveal .sl-block[data-block-type="table"] table {
  width: 100%;
  empty-cells: show;
  table-layout: fixed; }
.reveal .sl-block[data-block-type="table"] table td,
.reveal .sl-block[data-block-type="table"] table th {
  padding: 5px;
  min-width: 40px;
  border: 1px solid currentColor;
  vertical-align: top;
  text-align: inherit;
  outline: 0;
  word-break: break-word; }
.reveal .sl-block[data-block-type="table"] table td:empty:after,
.reveal .sl-block[data-block-type="table"] table th:empty:after,
.reveal .sl-block[data-block-type="table"] table td > [contenteditable]:empty:after,
.reveal .sl-block[data-block-type="table"] table th > [contenteditable]:empty:after {
  content: '-';
  visibility: hidden; }
.reveal .sl-block[data-block-type="table"] table td.context-menu-is-open,
.reveal .sl-block[data-block-type="table"] table th.context-menu-is-open {
  background-color: rgba(34, 110, 222, 0.2); }
.reveal .sl-block[data-block-type="table"] table td > [contenteditable],
.reveal .sl-block[data-block-type="table"] table th > [contenteditable] {
  width: 100%;
  height: 100%;
  outline: 0; }

.reveal .sl-block[data-block-type="line"] svg {
  display: block;
  vertical-align: top;
  overflow: visible;
  -webkit-transform: scale(0.9999999);
          transform: scale(0.9999999); }
.reveal .sl-block[data-block-type="line"] .sl-block-content {
  pointer-events: none !important; }
.reveal .sl-block[data-block-type="line"] .line-skeleton {
  display: none; }
.reveal .sl-block[data-block-type="line"] svg * {
  pointer-events: stroke; }
.reveal .sl-block[data-block-type="line"] .line-start,
.reveal .sl-block[data-block-type="line"] .line-end {
  pointer-events: all; }
.reveal .sl-block[data-block-type="line"] [data-auto-animate-target^="unmatched"] {
  -webkit-transition: none;
  transition: none; }

.sl-editor.is-editing .reveal .sl-block[data-block-type="line"] .sl-block-transform {
  border-color: transparent; }
.sl-editor.is-editing .reveal .sl-block[data-block-type="line"] .line-skeleton {
  stroke: #226ede;
  stroke-width: var(--scaled-border-2);
  pointer-events: none; }
.sl-editor.is-editing .reveal .sl-block[data-block-type="line"]:hover .line-skeleton, .sl-editor.is-editing .reveal .sl-block[data-block-type="line"].is-focused .line-skeleton {
  display: block; }

.reveal .sl-block[data-block-type="drawing"] svg {
  display: block;
  vertical-align: top;
  overflow: visible; }
.reveal .sl-block[data-block-type="drawing"] .sl-block-content {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none !important; }
.reveal .sl-block[data-block-type="drawing"] svg * {
  pointer-events: auto; }

.reveal .sl-block[data-block-type="chart"] .sl-block-content {
  overflow: hidden; }

.reveal .sl-block[data-block-type="chart"].is-transforming canvas {
  width: 100% !important;
  height: 100% !important; }
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *







*/