/* ──────────────────────────────────────────────────────────────────
   "Calm modernism" UI tokens.
   Replaces the previous neo-brutalist system (thick black borders,
   hard offset block shadows). Aim is broad-audience friendly —
   Linear / Notion / Discord-flavoured, built on:
       • soft layered shadows for elevation (no offset blocks)
       • hairline borders only where structural (inputs); surfaces
         separate via background tint + shadow
       • generous radii (8/12/16, pill for primary CTAs)
       • single calm accent used sparingly on primary actions
       • Inter for chrome, Mona preserved for chat (where AA art lives)

   Themes override these tokens instead of restyling every selector —
   the design pivots from one consistent place.
*/
:root {
    /* ── Accent: single calm hue. Primary CTAs + active states only.
       Never use for hovers, decoration, or destructive actions. */
    --ui-accent: #5b8def;          /* indigo: friendly, neutral, cross-cultural */
    --ui-accent-fg: #ffffff;
    --ui-accent-hover: #6f9bf2;
    --ui-accent-active: #4a7be0;
    --ui-accent-soft: rgba(91, 141, 239, 0.12);  /* tinted bg for hover/selected */

    /* ── Surfaces. Three elevation tiers; difference is small but
       readable. Each step is ~3% lighter (or darker, in dark theme).
       Use `surface-overlay` for menus/popups; `surface-raised` for
       cards/panels; `surface` for the page itself. */
    --ui-surface:         #ffffff;
    --ui-surface-raised:  #fafafa;
    --ui-surface-overlay: #ffffff;
    --ui-surface-sunken:  #f3f4f6;
    --ui-surface-muted:   #ebedf0;     /* for inputs, code blocks, sunken wells */

    /* ── Foreground. Three tiers — primary, secondary, tertiary
       (muted). Avoid pure black; #1f2328 reads softer in light UI. */
    --ui-text:         #1f2328;
    --ui-text-muted:   #5d6470;
    --ui-text-faint:   #9099a8;
    --ui-text-on-accent: var(--ui-accent-fg);

    /* ── Borders: hairline, used only where structural (form
       controls, table dividers, sidebar separators). Cards/panels
       lean on shadow + surface tint. */
    --ui-border-color:        #e3e6ea;
    --ui-border-color-strong: #c9cdd4;  /* hover/focus on inputs */
    --ui-border-width:        1px;

    /* ── Soft layered shadows for elevation. Combine ambient + direct
       light (the standard "Material 2" recipe), low alpha so they
       work over coloured backdrops too. */
    --ui-shadow-1: 0 1px 2px rgba(20, 24, 40, 0.04), 0 1px 3px rgba(20, 24, 40, 0.06);
    --ui-shadow-2: 0 2px 4px rgba(20, 24, 40, 0.05), 0 4px 12px rgba(20, 24, 40, 0.08);
    --ui-shadow-3: 0 4px 8px rgba(20, 24, 40, 0.06), 0 12px 28px rgba(20, 24, 40, 0.12);
    --ui-shadow-focus: 0 0 0 3px var(--ui-accent-soft);

    /* Legacy aliases — keep name back-compat for one release cycle
       so old selectors still find a value. Map to the new system. */
    --ui-shadow-color: rgba(20, 24, 40, 0.12);
    --ui-shadow-offset: 0px;
    --ui-shadow-block:       var(--ui-shadow-2);
    --ui-shadow-block-small: var(--ui-shadow-1);
    --ui-surface-alt: var(--ui-surface-raised);

    /* ── Radii. Friendlier than the old 4–8 range; pill for the
       single primary action so it really pops. */
    --ui-radius-sm:  8px;
    --ui-radius-md:  12px;
    --ui-radius-lg:  16px;
    --ui-radius-pill: 9999px;

    /* ── Motion: 150 ms is the modern default — slow enough to feel
       intentional, fast enough not to drag. */
    --ui-ease:     cubic-bezier(0.16, 1, 0.3, 1);   /* gentle ease-out */
    --ui-duration: 150ms;

    /* ── Typography. Inter (or the system UI stack) for chrome;
       legacy Mona preserved for chat-message bodies (`.chat-text`)
       where the AA-art glyph metrics matter. */
    --ui-font-ui:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --ui-font-mono: 'IPAMonaPGothic', 'IPA モナー Pゴシック', Monapo, Mona, 'MS PGothic', 'ＭＳ Ｐゴシック', submona, monospace;
    --ui-font-numeric: 'Inter', -apple-system, sans-serif;
}

#page-container
{
    /* Solid off-white backdrop. The old gradient washes are gone —
       neo-brutalism is about flat color blocks, not depth. */
    /* Page bg is a subtle off-white so white panels lift off it; pure
       white reads sterile. The decorative background SVG stays but
       the multiply blend keeps it whisper-light against the new tone. */
    background-color: var(--ui-surface-sunken);
    background-image: url("/images/background.svg");
    background-blend-mode: multiply;
    background-size: 60vw;
    background-position-x: calc(100% - 50px);
    background-position-y: calc(100% - 50px);
    background-repeat: no-repeat;
    /* Chrome uses Inter; chat-message bodies opt back into Mona via
       the dedicated `--ui-font-mono` token (see `.message`). */
    font-family: var(--ui-font-ui);
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--ui-text);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
}

header {
    /* Header sits above the login card. The wordmark is large enough
       to anchor the page; the subtitle is a muted secondary line. */
    margin: 8px auto 24px;
    max-width: 980px;
    padding: 0 20px;
    height: auto;
    text-align: center;
}

header h1 {
    margin: 0 0 4px;
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.1;
}

header h2 {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    color: var(--ui-text-muted);
    letter-spacing: 0.01em;
}

header h1 a {
    color: var(--ui-text);
    text-decoration: none;
}

input[type='range']
{
    appearance: none;
    background-color: #afb1b1;
    width: 120px;
    height: 4px;
    font-size: 18px;
}

input
{
    /* `accent-color` paints checkbox ticks, radio dots, the range
       thumb — keeping it in sync with the design accent. */
    accent-color: var(--ui-accent);
}

/* Modern text inputs: hairline border on the muted surface, pill-ish
   radius, soft accent ring on focus. Skip the spec'd `range`, which
   has its own styling above. */
input[type='text'],
input[type='password'],
input[type='email'],
input[type='search'],
input[type='url'],
input[type='number'],
input[type='tel'],
textarea,
select
{
    background: var(--ui-surface-muted);
    color: var(--ui-text);
    border: var(--ui-border-width) solid var(--ui-border-color);
    border-radius: var(--ui-radius-sm);
    padding: 8px 12px;
    font: inherit;
    line-height: 1.4;
    transition:
        border-color var(--ui-duration) var(--ui-ease),
        box-shadow var(--ui-duration) var(--ui-ease),
        background-color var(--ui-duration) var(--ui-ease);
}

input[type='text']:hover,
input[type='password']:hover,
input[type='email']:hover,
textarea:hover,
select:hover
{
    border-color: var(--ui-border-color-strong);
}

input[type='text']:focus,
input[type='password']:focus,
input[type='email']:focus,
input[type='search']:focus,
input[type='url']:focus,
input[type='number']:focus,
input[type='tel']:focus,
textarea:focus,
select:focus
{
    outline: none;
    border-color: var(--ui-accent);
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-focus);
}

input::placeholder,
textarea::placeholder
{
    color: var(--ui-text-faint);
}

/* ── Login page layout ────────────────────────────────────────────
   Centered card that holds the full sign-in flow. Sits on the
   page-bg so its shadow + radius read clearly. The header (`bubzpoipoi`
   title) lives above the card — outside its padding — so the card
   feels like a standalone object. */
#login-page
{
    padding: 24px 16px 40px;
    min-height: 100vh;
    box-sizing: border-box;
}

#login-form {
    display: flex;
    flex-direction: column;
    gap: 28px;
    max-width: 980px;
    margin: 0 auto;
    padding: 32px clamp(20px, 4vw, 44px) 40px;
    background: var(--ui-surface);
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow-2);
    text-align: left;
}

#login-form > div {
    margin: 0;
}

#username-selection {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

#username-selection > label {
    font-size: 13px;
    font-weight: 500;
    color: var(--ui-text-muted);
    letter-spacing: 0.01em;
}

#username-selection > input {
    width: 100%;
    box-sizing: border-box;
}

#username-selection span.error,
#login-form span.error {
    color: #d24159;
    font-size: 12px;
    margin-top: 4px;
}

#login-footer {
    margin: 24px auto 0;
    max-width: 720px;
    text-align: center;
    color: var(--ui-text-muted);
    font-size: 13px;
    line-height: 1.55;
}

#login-footer h3
{
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ui-text-faint);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

[v-cloak]
{
    display: none;
}

#room
{
    position: relative;
}

#chatLog
{
    background-color: var(--ui-surface);
    color: var(--ui-text);
    height: 150px;
    overflow-y: auto;
    resize: vertical;
    /* Brutalist surface: thick solid border, hard offset block
       shadow, near-zero radius. */
    border: var(--ui-border-width) solid var(--ui-border-color);
    border-radius: var(--ui-radius-sm);
    box-shadow: var(--ui-shadow-block);
    padding: 6px 4px;
    scrollbar-width: thin;
    scrollbar-color: var(--ui-border-color) transparent;
}
#chatLog::-webkit-scrollbar { width: 10px; }
#chatLog::-webkit-scrollbar-track { background: transparent; }
#chatLog::-webkit-scrollbar-thumb {
    background-color: var(--ui-border-color);
    border-radius: 0;
}

/* ── Chat channel tag + global message styling ───────────────────
   `[Global]` prefix renders in the accent colour so it pops against
   the regular log entries without changing layout. */
.message-channel-tag {
    color: var(--ui-accent);
    font-weight: 800;
    letter-spacing: 0.04em;
    margin-right: 2px;
    font-size: 0.85em;
}
.message--global {
    /* Subtle accent-tinted background bar — the eye picks it out of
       a busy local log without losing readability. */
    background:
        linear-gradient(
            to right,
            color-mix(in srgb, var(--ui-accent) 14%, transparent),
            color-mix(in srgb, var(--ui-accent) 5%, transparent) 60%,
            transparent
        );
    border-left: 3px solid var(--ui-accent);
    padding-left: 6px !important;
}

/* ── Local / Global channel toggle ───────────────────────────────
   Sits left of the input textbox. Same brutalist button signature
   as the rest of the toolbar; the active pill flips fg/bg + drops
   its offset shadow so it visibly reads as "pressed in". */
.chat-channel-toggle {
    display: inline-flex;
    flex-shrink: 0;
    align-self: stretch;
    margin-right: 4px;
}
.chat-channel-toggle__btn {
    /* Inherits the shared #toolbar button styling (border, shadow,
       hover-lift). Tighter horizontal padding so the two-button row
       takes less width. */
    padding: 4px 10px !important;
    min-height: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    font-size: 11px !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 1.2 !important;
}
.chat-channel-toggle__btn:first-child {
    border-top-left-radius: var(--ui-radius-sm) !important;
    border-bottom-left-radius: var(--ui-radius-sm) !important;
    border-right-width: 1px !important;
}
.chat-channel-toggle__btn:last-child {
    border-top-right-radius: var(--ui-radius-sm) !important;
    border-bottom-right-radius: var(--ui-radius-sm) !important;
    border-left-width: 1px !important;
}
/* Active pill: filled with accent colour. The brutalist offset
   shadow stays — visually similar to the primary Send button so
   the user sees this is a *state*, not just a hover. */
.chat-channel-toggle__btn--active {
    background: var(--ui-accent) !important;
    color: var(--ui-accent-fg) !important;
    font-weight: 800;
}
.chat-channel-toggle__btn--active:hover:enabled {
    background: var(--ui-accent-hover) !important;
}

.underlined-usernames .message-author
{
    text-decoration: underline;
    text-decoration-color: #929292;
}

.message
{
    overflow: hidden;
    line-height: 20px;
    padding-left: 5px;
}

.message span
{
    unicode-bidi: isolate;
}

.timestamps-in-copied-log .message .message-timestamp
{
    display: inline-block;
}

.log-dividers .message
{
    padding-top: 3px;
    padding-bottom: 3px;
}

.log-dividers .message:not(:first-child)
{
    border-top: 1px solid var(--ui-border);
}

.message .message-timestamp
{
    display: none;
    width: 1px; /* must be at least 1px for chrome to include its content when copy-pasting */
    height: 1px; /* must be at least 1px for chrome to include its content when copy-pasting */
    white-space: nowrap;
    overflow: hidden; /* overflow: clip doesn't work on safari */
}

.message .message-mention
{
	font-weight: bold;
    text-decoration: underline;
}

.video-container,
.audio-stream-controls-spinner
{
    z-index: 150;
    width: 219px;
    /* "height: auto" is needed because resizing the the video container with the mouse (with jquery.ui) defines
       both height and width via javascript, but since the video's aspect ratio isn't always constant (example, when sharing
       a window that gets resized) we need at least one between height and width to stay "auto", so that the container's size stays
       flexible in respect to the contained video's size */ 
    height: auto !important;
    background-color: #7e7e7e;
    background-image: url("/spinner.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50px;
    margin: 4px 0px;
    overflow: hidden;
}

video {
    width: 100%;
    /* not sure why, video-container seems to be always 4px taller than it should be to neatly contain the <video>  */
    margin-bottom: -4px;
}

.highlighted-username
{
    color: red;
    text-shadow: #939393 0px 0px 1px;
}

.username
{
    cursor: pointer;
}

.stream-title
{
    font-weight: bold;
}

.stream-is-active .stream-title
{
    font-weight: normal;
}

/* div[id^="received-video-"]
{
    position: absolute;
    top: 18px;
    left: 0px;
}


/* --- canvas triangle buttons --- */

.canvas-button-top-right
{
    width: 12px;
    height: 12px;
    padding: 0;
    border: 0;
    cursor: pointer;
}

.canvas-button-top-right
    {background: linear-gradient(to bottom left, transparent 50%, #787878 50%);}
.canvas-button-top-right:active
    {background: linear-gradient(to bottom left, transparent 50%, #ffffff 50%);}

/* --- infobox with names and stats etc --- */

#infobox-container
{
    position: absolute;
    top: 7px;
    right: 7px;
}

#infobox-button
{
    position: absolute;
    top: 2px;
    right: 2px;
}

#infobox
{
    position: absolute;
    top: 0;
    right: 0;
    min-width: 170px;
    background-color: rgba(120, 120, 120, 0.1);
    color: #ffffff;
    padding: 3px;
    font-size: 12px;
    text-shadow: #000 0 0 1px;
}

#infobox td
{
    white-space: nowrap;
}

#infobox-streamcount
{
    position: absolute;
    bottom: 6px;
    right: 6px;
} 

.big-red-alert
{
    position: absolute;
    z-index: 100;
    color: #d00;
}

#stage
{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 5px;
    min-height: 100%;
    box-sizing: border-box;
}

#main-section
{
    flex-grow: 1;
    width: 70%;
    position: relative;
    padding-right: 7px;
    display: flex;
    flex-direction: column;
}

/* #main-section::after
{
    cursor: e-resize;
    width: 3px;
    height: 100%;
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    content: '';
} */

@media (min-width: 947px)
{
    #main-section
    {
        flex-grow: initial;
    }
    #video-streams
    {
        flex-wrap: nowrap;
    }
}

#video-streams{
    padding: 5px;
    flex-grow: 1;
    box-sizing: border-box;
    min-width: 200px;
}

#room-canvas
{
    position: absolute;
    width: 100%;
    height: 100%;
}

#canvas-container
{
    position: relative;
    height: 511px;
    font-family: Arial, Helvetica, sans-serif;
    resize: vertical;
    overflow: auto;
    order: 1;
}

#toolbar
{
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 8px;
    overflow: auto;
    order: 2;
    /* Brutalist slab: solid surface, thick border, hard offset
       shadow. No blur — the panel is opaque by design so it reads
       against any backdrop. */
    background: var(--ui-surface);
    border: var(--ui-border-width) solid var(--ui-border-color);
    border-radius: var(--ui-radius-sm);
    box-shadow: var(--ui-shadow-block);
    padding: 10px 12px;
    margin-top: 12px;
    margin-bottom: 12px;
}

.log-above-toolbar #toolbar
{
    order: 3;
}

#chat-log-container
{
    order: 3;
}

.log-above-toolbar #chat-log-container
{
    order: 2;
    display: flex;
}

.log-above-toolbar #chatLog
{
    flex-grow: 1;
    margin: 3px;
}

#login-page button,
#toolbar button,
.stream-buttons button,
.slot-wrapper button,
.popup button
{
    /* Modern soft button: subtle elevation via shadow-1, no border
       shouting from the surface. Hover lifts to shadow-2 + softens
       background; press scales down a hair — no translate snap.
       Use the `background-color` longhand (not `background:` shorthand)
       so buttons that layer their own `background-image` (toolbar
       arrow buttons, etc.) keep their icon — shorthand would expand
       to `background-image: none` at the specificity of *this* rule
       and stomp them. */
    background-color: var(--ui-surface-raised);
    color: var(--ui-text);
    border: var(--ui-border-width) solid transparent;
    padding: 8px 16px;
    margin: 2px;
    min-height: 36px;
    border-radius: var(--ui-radius-sm);
    white-space: nowrap;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.005em;
    cursor: pointer;
    box-shadow: var(--ui-shadow-1);
    transition:
        transform var(--ui-duration) var(--ui-ease),
        box-shadow var(--ui-duration) var(--ui-ease),
        background-color var(--ui-duration) var(--ui-ease),
        border-color var(--ui-duration) var(--ui-ease);
}

/* Icon-only buttons (Font Awesome `fas …` classes with no text
   children: cogs, bell, logout, pin, lock, etc.). Two things need
   overriding from the general button rule:
   1. Sizing — the inherited 13 px text-size + horizontal text padding
      leaves the glyph tiny and lost in dead whitespace.
   2. font-family — the general rule sets `font-family: inherit` at
      ID-bearing specificity (1,0,1), which beats FA's `.fas` rule
      at (0,1,0). Result: the FA private-use codepoint (U+F085 cogs,
      U+F2F5 sign-out-alt, U+F0F3 bell) renders as the missing-glyph
      tofu in Inter. Re-assert the FA font here at (1,1,1). */
#toolbar button.fas,
.popup button.fas,
.stream-buttons button.fas,
.slot-wrapper button.fas {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

#toolbar button.far,
.popup button.far,
.stream-buttons button.far,
.slot-wrapper button.far {
    font-family: 'Font Awesome 5 Free';
    font-weight: 400;
}

#toolbar button.fab,
.popup button.fab,
.stream-buttons button.fab,
.slot-wrapper button.fab {
    font-family: 'Font Awesome 5 Brands';
    font-weight: 400;
}

#toolbar button.fas,
#toolbar button.far,
#toolbar button.fab,
.popup button.fas,
.popup button.far,
.popup button.fab,
.stream-buttons button.fas,
.stream-buttons button.far,
.stream-buttons button.fab,
.slot-wrapper button.fas,
.slot-wrapper button.far,
.slot-wrapper button.fab {
    /* Square clickable area, generous tap target. */
    width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    /* 16 px reads as the standard "toolbar icon" weight without
       dominating. */
    font-size: 16px;
    /* Center the icon glyph inside the square. */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* Antialiasing tweaks FA's own stylesheet sets — re-apply since
       our font-family override needs them at the same specificity. */
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: auto;
    line-height: 1;
}

/* Primary CTA — large, pill-shaped, accent-coloured. Used for the
   single most important action on a page (Login, Send). */
#login-button {
    display: inline-block;
    margin: 18px auto 0;
    padding: 10px 32px;
    min-height: 44px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.01em;
    background: var(--ui-accent);
    color: var(--ui-accent-fg);
    border-radius: var(--ui-radius-pill);
    border: none;
    box-shadow: var(--ui-shadow-2);
    cursor: pointer;
    transition:
        transform var(--ui-duration) var(--ui-ease),
        box-shadow var(--ui-duration) var(--ui-ease),
        background-color var(--ui-duration) var(--ui-ease);
}

#login-button:hover:enabled {
    background: var(--ui-accent-hover);
    box-shadow: var(--ui-shadow-3);
}

#login-button:active:enabled {
    background: var(--ui-accent-active);
    transform: scale(0.98);
    box-shadow: var(--ui-shadow-1);
}

/* Soft hover: background warms by one tier, shadow steps up. No
   translate — the "lift" reads via shadow alone. */
#login-page button:hover:enabled,
#toolbar button:hover:enabled,
.stream-buttons button:hover:enabled,
.slot-wrapper button:hover:enabled,
.popup button:hover:enabled
{
    background-color: var(--ui-surface-overlay);
    box-shadow: var(--ui-shadow-2);
}

/* Press: scale down 2% — calm tactile feedback without slamming. */
#login-page button:active:enabled,
#toolbar button:active:enabled,
.stream-buttons button:active:enabled,
.slot-wrapper button:active:enabled,
.popup button:active:enabled
{
    transform: scale(0.98);
    box-shadow: var(--ui-shadow-1);
}

/* Focus: standard accent ring offset from the button — works on
   any background, doesn't rely on border colour. */
#login-page button:focus-visible,
#toolbar button:focus-visible,
.stream-buttons button:focus-visible,
.slot-wrapper button:focus-visible,
.popup button:focus-visible
{
    outline: none;
    box-shadow: var(--ui-shadow-1), var(--ui-shadow-focus);
}

#login-page button:disabled,
#toolbar button:disabled,
.stream-buttons button:disabled,
.slot-wrapper button:disabled,
.popup button:disabled
{
    color: var(--ui-text-muted);
    cursor: not-allowed;
    box-shadow: var(--ui-shadow-block-small);
    opacity: 0.55;
    transform: none;
}

/* Send / Login: primary action — saturated red fill. Border + offset
   shadow stay (the brutalist signature); the accent fills the
   surface. */
#toolbar button#send-button,
#toolbar #send-button,
#login-button {
    background: var(--ui-accent);
    color: var(--ui-accent-fg);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
#toolbar #send-button:hover:enabled,
#login-button:hover:enabled {
    background: var(--ui-accent-hover);
}

.mute-unmute-button span.fas {
    width: 17px;
}

.preferences-percentage
{
    display: inline-block;
    width: 36px;
    text-align: right;
}

#toolbar-text-input
{
    flex-grow: 1;
    display: flex;
    align-items: stretch;
    flex-basis: 200px;
    gap: 8px;
}
#toolbar-buttons
{
    display: flex;
    align-items: stretch;
}

#input-textbox
{
    width: 0px;
    flex-grow: 1;
    resize: vertical;
    min-width: 180px;
    font-family: IPAMonaPGothic,'IPA モナー Pゴシック',Monapo,Mona,'MS PGothic','ＭＳ Ｐゴシック',submona,sans-serif;
    background: var(--ui-surface);
    color: var(--ui-text);
    border: var(--ui-border-width) solid var(--ui-border-color);
    border-radius: var(--ui-radius-sm);
    box-shadow: var(--ui-shadow-block-small);
    padding: 6px 10px;
    font-size: 14px;
    transition: border-color 120ms var(--ui-ease), box-shadow 120ms var(--ui-ease);
}
#input-textbox:focus {
    outline: none;
    border-color: var(--ui-accent);
    box-shadow: var(--ui-shadow-offset) var(--ui-shadow-offset) 0 0 var(--ui-accent);
}

.tooltip-section
{
    display: flex;
    flex-direction: column;
    align-items: stretch;
    align-content: stretch;
    gap: 6px;
    padding: 0 6px;
}
.tooltip-section:first-child { padding-left: 0; }

.tooltip-section > button
{
    flex-grow: 1;
}

.tooltip-section > label
{
    white-space: nowrap;
}

.non-wrappable-buttons
{
    display: flex;
}

.tooltip-section-title
{
    flex-grow: 1;
    display: flex;
    align-items: end;
    justify-content: center;
}

.tooltip-volume-section
{
    min-height: 80px;
    align-items: center;
}

#toolbar button.arrow-button
{
    font-weight: bold;
    font-size: 20px;
    padding: 3px 8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 15px;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    margin: 1px;
}
.arrow-button-left
{
    background-image: url("/images/north_west_black_24dp.svg");
}
.arrow-button-up
{
    background-image: url("/images/north_east_black_24dp.svg");
}
.arrow-button-down
{
    background-image: url("/images/south_west_black_24dp.svg");
}
.arrow-button-right
{
    background-image: url("/images/south_east_black_24dp.svg");
}


#rula-popup {
    max-width: 600px;
    width: 90%;
}

.popup {
    position: fixed;
    top: 50%;
    left: 50%;
    width: auto;
    height: auto;
    transform: translate(-50%,-50%);
    
    max-height: 100%;
    overflow: auto;

    outline: 2px solid #afb1b1;
    background-color: #ffffff;
    z-index: 201;
    /* Need to clear padding, margin and border esplicitly for popups that are <fieldset>s */
    padding: 0;
    margin: 0;
    border: 0;
}

#dialog-popup
{
    z-index: 204;
}

@media (max-width: 600px) {
    .popup {
        width: 90%;
    }
}

.popup-overlay
{
    content: "";
    position: fixed;
    z-index: 200;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:rgba(77,77,77,.4);
}

#dialog-popup-overlay
{
    z-index: 203
}

.popup-titlebar
{
    background-color: #fafafa;
    border-bottom: 2px solid #afb1b1;
    display: flex;
    flex-direction: row;
}

.popup-title
{
    display: flex;
    flex: auto;
    font-size: 20px;
    margin: 10px;
}

.popup-titlebar-item
{
    display: flex;
    align-items: center;
    margin-right: 10px;
}

.popup-titlebar-item label
{
    white-space: pre-wrap;
}

.popup-content
{
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    margin: 5px;
    border: 2px solid #afb1b1;
}

.popup-section:not(:first-child)
{
    border-top: 2px solid #afb1b1;
}

.popup-header
{
    margin: 10px 10px 10px 20px;
    font-size: 18px;
}

.popup-item
{
    margin: 10px;
    white-space: pre-line;
}

.popup-subsection
{
    margin-left: 20px;
}

.popup-notice
{
    white-space: pre-wrap;
    font-size: 12px
}

.popup-table
{
    width: 100%;
    border-collapse: collapse;
}

.popup-table col
{
    border-right: 1px solid #afb1b1;
}

.popup-table col:last-of-type
{
    border-right: 0;
}

.popup-table th
{
    text-align: left;
    font-weight: normal;
    background-color: #f3f3f3;
    border-bottom: 1px solid #afb1b1;
}

.popup-table td,
.popup-table th
{
    padding: 2px 5px;
}

.popup-selectable-table tr:hover td
{
    background-color: #e6ffe0;
    cursor: pointer;
}

.popup-row-is-selected td
{
    background-color: #cdffc1;
}

.popup-row-is-selected .user-not-in-room-warning
{
    padding-right: 6px;
    font-size: 13px
}

.inactive-user-icon
{
    height: 15px;
    margin-right: 5px;
    /* this strange filter is a way to turn a black image into a sort of light blue. */
    /* no idea of how it actually does that. */
    filter: brightness(90%) invert(57%) sepia(52%) hue-rotate(152deg) saturate(275%);
}

.enabled-disabled-listener-icon
{
    height: 15px;
    margin-right: 5px;
}

.popup-sortable-table th
{
    cursor: pointer
}

.popup-buttons
{
    text-align: right;
    margin: 5px 20px 5px 20px;
}

.popup-buttons button
{
    display: inline-block;
    margin-left: 5px;
}

/* ── Character picker ────────────────────────────────────────────
   Roster grid + a search box above it. Tiles use a soft elevation
   (shadow-1 → shadow-2 on hover, accent-soft tint when selected)
   instead of borrow-from-OS system colours that didn't fit the
   calm-modern palette. */
#character-selection
{
    display: block;
    width: 100%;
    padding: 2px 0;
    user-select: none;
}

#character-selection .character-selection-toolbar
{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

#character-selection .character-selection-current
{
    font-size: 12px;
    color: var(--ui-text-muted);
}

#character-selection #character-search-input
{
    min-width: 200px;
    max-width: 320px;
    /* Inherits the global text-input styling (token-based border,
       focus ring, padding). The width clamps live here. */
}

#character-selection .character-grid
{
    display: grid;
    grid-template-columns: repeat(auto-fill, 80px);
    grid-auto-rows: 96px;
    gap: 10px;
    justify-content: center;
    max-width: 920px;
    margin: 0 auto;
}

#character-selection label
{
    position: relative;
    min-height: 88px;
    min-width: 72px;
    margin: 0;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: var(--ui-surface-muted);
    border: var(--ui-border-width) solid transparent;
    border-radius: var(--ui-radius-md);
    cursor: pointer;
    box-shadow: var(--ui-shadow-1);
    transition:
        background-color var(--ui-duration) var(--ui-ease),
        border-color var(--ui-duration) var(--ui-ease),
        box-shadow var(--ui-duration) var(--ui-ease),
        transform var(--ui-duration) var(--ui-ease);
}

#character-selection img
{
    display: block;
    position: absolute;
    object-fit: cover;
    image-rendering: auto;
}

#character-selection .character-name
{
    width: 100%;
    position: relative;
    z-index: 1;
    color: var(--ui-text-muted);
    font-size: 10px;
    text-align: center;
    background-color: color-mix(in srgb, var(--ui-surface) 85%, transparent);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    padding: 3px 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.01em;
}

#character-selection label:hover
{
    background: var(--ui-surface-overlay);
    box-shadow: var(--ui-shadow-2);
    transform: translateY(-1px);
}

#character-selection .character-selected {
    background: var(--ui-accent-soft);
    border-color: var(--ui-accent);
    box-shadow:
        var(--ui-shadow-2),
        0 0 0 1px var(--ui-accent);
}

#character-selection .character-selected .character-name
{
    background: var(--ui-accent);
    color: var(--ui-accent-fg);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    font-weight: 600;
}

#character-selection label:focus-within
{
    box-shadow: var(--ui-shadow-2), var(--ui-shadow-focus);
}

#character-selection .character-empty-state
{
    font-size: 13px;
    color: var(--ui-text-muted);
    margin-top: 12px;
    text-align: center;
}

#character-selection input {
    /* Visually hidden but still focusable — keeps keyboard-tab
       navigation working and screen readers happy. */
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
}

div[id^="vu-meter-container"]
{
    background-color: black;
    height: 5px;
    width: 219px;
    margin: 4px 0px;
}

div[id^="vu-meter-bar-"]
{
    height: 5px;
    width: 0;
    position: relative;
}

div[id^="vu-meter-bar-primary-"]
{
    z-index: 2;
}

div[id^="vu-meter-bar-primary-"].outbound-vu-meter-bar
{
    background-color: red;
}

div[id^="vu-meter-bar-primary-"].inbound-vu-meter-bar
{
    background-color: green;
}

div[id^="vu-meter-bar-secondary-"]
{
    z-index: 1;
    top: -5px;
}

div[id^="vu-meter-bar-secondary-"].outbound-vu-meter-bar
{
    background-color: darkred;
}

div[id^="vu-meter-bar-secondary-"].inbound-vu-meter-bar
{
    background-color: darkgreen;
}

button.checked {
    text-decoration: underline;
}

#poop-page
{
    font-size: 100px;
}

.full-screen-page
{
    font-size: 25px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#user-list-popup td
{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    word-wrap: anywhere;
}

#user-list-popup td button
{
    flex-shrink: 0;
}

#user-list-popup tr div
{
    cursor: pointer;
    flex-grow: 1;
    display: flex;
    align-items: center;
}

.pinned-video
{
    position: relative !important;
}

.unpinned-video
{
    position: absolute !important;
}

.unpinned-video .pin-video-button
{
    transform: rotate(90deg);
}

.video-container > .pin-video-button
{
    position: absolute;
    z-index: 1;
    background: rgba(255, 255, 255, 0.7);
    border: 0;
    margin: 7px;
    width: 28px;
    height: 28px;
    font-size: 13px;
    /* visibility: hidden; */
    opacity: 0;
    transition: opacity 0.3s;
}

.video-container:hover > .pin-video-button
{
    /* visibility: visible; */
    opacity: 1;
}

.stream-buttons {
    width: 219px;
    display: flex;
    align-items: center;
}

.stream-buttons .feedback-button {
    /* push the button to the right */
    margin-left: auto;
}

.stream-buttons button,
.slot-wrapper button
{
    background-color: #4d4d9f;
    color: white;
}

.stream-buttons button.red-button,
.slot-wrapper button.red-button,
.slot-wrapper button.slot-button-highlight
{
    background-color: #9f6161;
    color: white;
}

.slot-message
{
    margin-top: 5px;
    margin-bottom: 5px;
}

.janken-wrapper
{
    min-height: 260px;
}

@media (min-width: 947px)
{
    .janken-wrapper
    {
        width: 260px;
    }
}

.janken-versus
{
    display: flex;
}

.janken-versus-player1,
.janken-versus-player2
{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.janken-versus-player1
{
    text-align: right;
    margin-right: 5px;
}

.janken-versus-player2
{
    text-align: left;
    margin-left: 5px;
}

.janken-hands button
{
    font-size: 40px;
    line-height: 40px;
    width: 60px;
    height: 60px;
    background-size: 50px 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
}

.janken-hand-results
{
    display: flex;
}

.janken-results-hand
{
    width: 120px;
    height: 120px;
    color: black;
    background-color: #e16060;
    margin-left: 10px;
    background-size: 100px 100px;
    border-radius: 5px;
    outline: 1px solid #959595;
}

.janken-hands-draw .janken-results-hand
{
    background-color: #ffd277;
}

.janken-results-hand.janken-hand-winner
{
    background-color: #b7df87;
}

.janken-hand-player1
{
    transform: rotate(90deg);
}

.janken-hand-player2
{
    transform: rotate(-90deg);
}

.janken-hand-rock,
.janken-hand-paper,
.janken-hand-scissors
{
    background-repeat: no-repeat;
    background-position: center;
}

.janken-hand-rock { background-image: url("/images/hand-rock.svg"); }
.janken-hand-paper { background-image: url("/images/hand-paper.svg"); }
.janken-hand-scissors { background-image: url("/images/hand-scissors.svg"); }

button.janken-hand-rock { background-image: url("/images/hand-rock.light.svg"); }
button.janken-hand-paper { background-image: url("/images/hand-paper.light.svg"); }
button.janken-hand-scissors { background-image: url("/images/hand-scissors.light.svg"); }

.system-message
{
    font-weight: bold;
}

.ignored-message
{
    display: none;
    user-select: none;
}

.ignore-indicators-in-log .ignored-message
{
    display: block;
    height: 2px;
    width: 2px;
    margin-bottom: -2px;
    font-size: 0;
    background-color: red;
}

.message-author
{
    cursor: pointer;
}

/* ── Area selection (pill chips) ────────────────────────────────
   Each area is a clickable pill: name + "users / streams" counts
   inside. The native radio is hidden; the label is the affordance.
   Selected pill picks up the accent. */
#area-selection
{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 4px;
}

#area-selection label
{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--ui-surface-muted);
    color: var(--ui-text);
    border: var(--ui-border-width) solid transparent;
    border-radius: var(--ui-radius-pill);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
    transition:
        background-color var(--ui-duration) var(--ui-ease),
        color var(--ui-duration) var(--ui-ease),
        border-color var(--ui-duration) var(--ui-ease);
}

#area-selection label:hover
{
    background: var(--ui-surface-overlay);
}

#area-selection input[type="radio"]
{
    /* Hide the native radio but keep it focusable for keyboard
       users — focus styling applies to the wrapping label below. */
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
}

#area-selection label:has(input:checked)
{
    background: var(--ui-accent);
    color: var(--ui-accent-fg);
}

#area-selection label:has(input:focus-visible)
{
    box-shadow: var(--ui-shadow-focus);
}

/* make all jquery slider handles round */
#page-container .ui-corner-all
{
    border-radius: 10px;
}

.tooltip-section .ui-slider
{
    margin: 10px 0;
    height: 100%;
    width: 4px;
}

.tooltip-section .ui-slider-vertical .ui-slider-handle
{
    left: -9px;
}

/* Workaround to prevent zoom in iOS when tapping quickly on a button */
button
{
    touch-action: manipulation;
}

#main-section .ui-resizable-handle:hover
{
    background-color: gray;
}

.audio-stream-controls-container
{
    /* position: relative to make it so that the width: 100% and height: 100%;
       in the spinner container div cover only the parent element and not the
       entire page. */
    position: relative;
    width: fit-content;
}

.audio-stream-controls
{
    visibility: hidden;
    display: flex;
    align-items: center;
    width: 219px;
    flex-wrap: wrap;
}

.audio-stream-controls-container.listener-connected > .audio-stream-controls
{
    visibility: visible;
}

.audio-stream-controls-container.listener-connected > .audio-stream-controls-spinner
{
    visibility: hidden;
}

.audio-stream-controls-spinner
{
    display: flex;
    align-items: center;
    visibility: visible;
    position: absolute;
    z-index: 9999999999;
    width: 100%;
    height: 100%;
    justify-content: center;
}

.audio-stream-controls-spinner img
{
    height: 18px;
}

.visible-only-to-specific-users-stream-icon
{
    color: #474747;
    padding-right: 5px;
}

.vtuber-character
{
    position: absolute;
    width: 30%;
    right: 0;
    bottom: -22%;
    transform: scale(-1,1);
    animation: 5s ease-in-out 0s infinite alternate vtuber_character_swaying;
}

.vtuber-character.jumping
{
    animation: 0.1s ease-in 0s infinite alternate vtuber_character_jumping;
}

@keyframes vtuber_character_jumping {
    from { bottom: -22% } to { bottom: -20% }
}

@keyframes vtuber_character_swaying {
    from {
        transform: scale(-1,1) rotate(-5deg);
    } to {
        transform: scale(-1,1) rotate(5deg);
    }
}

.nico-nico-messages-container {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    /* pointer-events set to none so that onVideoDoubleClick() isn't called
       with a niconico message as event.target instead of the correct <video> element*/
    pointer-events: none;
}

.nico-nico-messages-container span {
    position: absolute;
    left: 0;
    transform: translate(-100%, 0);
    animation: nico-nico-message-animation 5s linear 1;
    color: white;
    white-space: nowrap;
}

@keyframes nico-nico-message-animation {
    0% {
        left: 100%;
        transform: translate(0, 0);
    }

    100% {
        left: 0;
        transform: translate(-100%, 0);
    }
}

#niconico-message-template {
    display: none;
}

.numeric-value-control
{
    background-color: #4d4d9f;
    color: #F3EFE0;
    border-radius: 3px;
    border: 1px solid #959595;
    display: inline-block;
}

.numeric-value-control button
{
    padding: 0;
    margin: 0;
    min-width: 20px; /* min width because the number can be more than 2 digits */
    height: 20px;
    min-height: auto; /* reset min-height set by the ".stream-buttons button" rule */
    font-size: 14px;
    border-right: 1px solid gray;
    border-top: none;
    border-bottom: none;
    border-left: none;
    background: none;
    color: #F3EFE0;
    cursor: pointer;
    vertical-align: top;
}

/* no border on the last button */
.numeric-value-control button:last-child
{
    border-right: none;
}

.numeric-value-control button.disabled {
    color: gray;
    pointer-events: none;
}

.numeric-value-control button.decrement
{
    background-image: url("/images/minus.svg");
    background-size: 100%;
}

.numeric-value-control button.increment
{
    background-image: url("/images/plus.svg");
    background-size: 100%;
}

.numeric-value-control button.value {
    padding: 0 4px;
}#page-container.theme-dark {
    /* Calm-modernism dark palette. Linear-flavoured: deep neutral
       greys with a single soft indigo accent, hairline borders, soft
       layered shadows that work over dark surfaces because alpha is
       low enough not to crush. */
    --ui-accent: #7aa2ff;            /* shifted brighter for AA contrast on dark */
    --ui-accent-fg: #0d111c;
    --ui-accent-hover: #8eb1ff;
    --ui-accent-active: #6892f0;
    --ui-accent-soft: rgba(122, 162, 255, 0.16);

    /* Three elevation tiers — each ~3% lighter. Page is the deepest. */
    --ui-surface:         #1b1d23;
    --ui-surface-raised:  #22252d;
    --ui-surface-overlay: #2a2e38;
    --ui-surface-sunken:  #15171c;
    --ui-surface-muted:   #2a2e38;

    --ui-text:         #e8eaee;
    --ui-text-muted:   #a3a8b3;
    --ui-text-faint:   #6c7282;

    /* Hairline borders: just enough to resolve in low light, not
       enough to feel cage-like. */
    --ui-border-color:        #2e323b;
    --ui-border-color-strong: #444a55;

    /* Shadows on dark surfaces use slightly higher alpha so the
       depth still reads. */
    --ui-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.30), 0 1px 3px rgba(0, 0, 0, 0.20);
    --ui-shadow-2: 0 2px 4px rgba(0, 0, 0, 0.35), 0 4px 12px rgba(0, 0, 0, 0.28);
    --ui-shadow-3: 0 4px 8px rgba(0, 0, 0, 0.40), 0 12px 28px rgba(0, 0, 0, 0.45);
    --ui-shadow-focus: 0 0 0 3px var(--ui-accent-soft);

    /* Legacy aliases (for one release) */
    --ui-shadow-color: rgba(0, 0, 0, 0.45);
    --ui-shadow-block:       var(--ui-shadow-2);
    --ui-shadow-block-small: var(--ui-shadow-1);
    --ui-surface-alt: var(--ui-surface-raised);

    background-color: var(--ui-surface);
    background-image: none;
    color: var(--ui-text);
    scrollbar-color: var(--ui-border-color-strong) transparent;
}

.theme-dark h1 a {
    color: #f0f0f0;
}

.theme-dark .message a {
    color: #c2cde1;
}

.theme-dark .message-author {
    padding-right: 2px;
    color: #c2cde1;
}

.theme-dark .log-dividers .message {
    border-color: #666666;
}

.theme-dark .log-dividers .message:nth-child(even) {
    background-color: #28282b;
}

/* The shared modern selectors in main.css already pull from the
   --ui-surface / --ui-text / --ui-border-color tokens overridden
   at the top of this file, so we no longer need per-selector
   overrides here. Anything missed would just be a hard-coded
   non-themed input.bare which there are none of. */

.theme-dark ::-webkit-scrollbar {
    background-color: #28282b;
}

.theme-dark ::-webkit-scrollbar-track {
    background-color: #28282b;
}

.theme-dark ::-webkit-scrollbar-thumb {
    background-color: #686868;
}

.theme-dark ::-webkit-scrollbar-corner {
    background-color: #28282b;
}

.theme-dark .stream-buttons button.red-button,
.theme-dark .slot-wrapper button.red-button,
.theme-dark .slot-wrapper button.slot-button-highlight
{
    background-color: #754848;
}

.theme-dark .popup {
    background-color: #38383b;
    color: #f0f0f0;
}

.theme-dark .popup .popup-titlebar {
    background-color: #38383b;
    color: #f0f0f0;
}

.theme-dark .popup th {
    background-color: #38383b;
    color: #f0f0f0;
}

.theme-dark .popup-selectable-table tr:hover td {
    background-color: #242424;
}

.theme-dark .popup-selectable-table tr.popup-row-is-selected td {
    color: #f0f0f0;
    background-color: #242424;
}

.theme-dark .popup-row-is-selected
{
    color: black;
}

.theme-dark .arrow-button-left
{
    background-image: url("/images/north_west_black_24dp.dark.svg");
}
.theme-dark .arrow-button-up
{
    background-image: url("/images/north_east_black_24dp.dark.svg");
}
.theme-dark .arrow-button-down
{
    background-image: url("/images/south_west_black_24dp.dark.svg");
}
.theme-dark .arrow-button-right
{
    background-image: url("/images/south_east_black_24dp.dark.svg");
}
#page-container.theme-shaddox {
    /* Calm-modernism Shaddox: keeps the sage character but trades
       the brutalist border + offset block shadow for the same hairline
       + soft-shadow recipe as the default theme. The teal stays — it's
       what defines the brand — but it's calmer now. */
    --ui-accent: #94c19a;            /* sage, slightly brighter for AA on the deeper bg */
    --ui-accent-fg: #15201d;
    --ui-accent-hover: #aacfaf;
    --ui-accent-active: #7eae87;
    --ui-accent-soft: rgba(148, 193, 154, 0.16);

    /* Three teal tiers, ~3% lighter each step. */
    --ui-surface:         #2c3e44;
    --ui-surface-raised:  #354a51;
    --ui-surface-overlay: #3e555c;
    --ui-surface-sunken:  #243036;
    --ui-surface-muted:   #3e555c;

    --ui-text:         #d6dcd2;
    --ui-text-muted:   #95a39a;
    --ui-text-faint:   #6a7872;

    /* Hairline borders use a slightly lighter teal — readable but
       not the visual lead. */
    --ui-border-color:        #44595f;
    --ui-border-color-strong: #5e7177;

    --ui-shadow-1: 0 1px 2px rgba(10, 18, 22, 0.30), 0 1px 3px rgba(10, 18, 22, 0.20);
    --ui-shadow-2: 0 2px 4px rgba(10, 18, 22, 0.35), 0 4px 12px rgba(10, 18, 22, 0.30);
    --ui-shadow-3: 0 4px 8px rgba(10, 18, 22, 0.40), 0 12px 28px rgba(10, 18, 22, 0.45);
    --ui-shadow-focus: 0 0 0 3px var(--ui-accent-soft);

    --ui-shadow-color: rgba(10, 18, 22, 0.45);
    --ui-shadow-block:       var(--ui-shadow-2);
    --ui-shadow-block-small: var(--ui-shadow-1);
    --ui-surface-alt: var(--ui-surface-raised);

    background-color: var(--ui-surface);
    color: var(--ui-text);
    scrollbar-color: var(--ui-border-color-strong) transparent;
}

.theme-shaddox .message {
    background-color: var(--ui-surface);
    border-color: var(--ui-border-color);
}

.theme-shaddox .message a {
    color: var(--ui-accent);
}

.theme-shaddox .message-author {
    padding-right: 2px;
    color: var(--ui-accent);
}

.theme-shaddox .underlined-usernames .message-author
{
    text-decoration-color: var(--ui-accent);
}

.theme-shaddox .log-dividers .message:nth-child(even) {
    background-color: var(--ui-surface-sunken);
}

.theme-shaddox .stream-buttons button.red-button,
.theme-shaddox .slot-wrapper button.red-button,
.theme-shaddox .slot-wrapper button.slot-button-highlight
{
    background-color: #624a4a;
}

.theme-shaddox .popup,
.theme-shaddox .popup .popup-titlebar,
.theme-shaddox .popup th {
    background-color: var(--ui-surface);
    color: var(--ui-text);
}

.theme-shaddox .popup-selectable-table tr:hover td {
    background-color: var(--ui-surface-alt);
}

.theme-shaddox .popup-selectable-table tr.popup-row-is-selected td {
    color: var(--ui-text);
    background-color: var(--ui-surface-alt);
}

.theme-shaddox .popup-row-is-selected
{
    color: black;
}

.theme-shaddox .arrow-button-left
{
    background-image: url("/images/north_west_black_24dp.dark.svg");
}
.theme-shaddox .arrow-button-up
{
    background-image: url("/images/north_east_black_24dp.dark.svg");
}
.theme-shaddox .arrow-button-down
{
    background-image: url("/images/south_west_black_24dp.dark.svg");
}
.theme-shaddox .arrow-button-right
{
    background-image: url("/images/south_east_black_24dp.dark.svg");
}
/*!
 * jQuery UI CSS Framework 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/category/theming/
 */
/*!
 * jQuery UI CSS Framework 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/category/theming/
 */
/*!
 * jQuery UI CSS Framework 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/category/theming/
 */
/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
}
.ui-front {
	z-index: 100;
}
/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
	pointer-events: none;
}
/* Icons
----------------------------------*/
.ui-icon {
	display: inline-block;
	vertical-align: middle;
	margin-top: -.25em;
	position: relative;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
}
.ui-widget-icon-block {
	left: 50%;
	margin-left: -8px;
	display: block;
}
/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/*!
 * jQuery UI Accordion 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/accordion/#theming
 */
.ui-accordion .ui-accordion-header {
	display: block;
	cursor: pointer;
	position: relative;
	margin: 2px 0 0 0;
	padding: .5em .5em .5em .7em;
	font-size: 100%;
}
.ui-accordion .ui-accordion-content {
	padding: 1em 2.2em;
	border-top: 0;
	overflow: auto;
}
/*!
 * jQuery UI Autocomplete 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/autocomplete/#theming
 */
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
}
/*!
 * jQuery UI Button 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/button/#theming
 */
.ui-button {
	padding: .4em 1em;
	display: inline-block;
	position: relative;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;
	-webkit-user-select: none;
	user-select: none;
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
	text-decoration: none;
}
/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
	width: 2em;
	box-sizing: border-box;
	text-indent: -9999px;
	white-space: nowrap;
}
/* no icon support for input elements */
input.ui-button.ui-button-icon-only {
	text-indent: 0;
}
/* button icon element(s) */
.ui-button-icon-only .ui-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -8px;
	margin-left: -8px;
}
.ui-button.ui-icon-notext .ui-icon {
	padding: 0;
	width: 2.1em;
	height: 2.1em;
	text-indent: -9999px;
	white-space: nowrap;

}
input.ui-button.ui-icon-notext .ui-icon {
	width: auto;
	height: auto;
	text-indent: 0;
	white-space: normal;
	padding: .4em 1em;
}
/* workarounds */
/* Support: Firefox 5 - 125+ */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
/*!
 * jQuery UI Checkboxradio 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/checkboxradio/#theming
 */
.ui-checkboxradio-label .ui-icon-background {
	box-shadow: inset 1px 1px 1px #ccc;
	border-radius: .12em;
	border: none;
}
.ui-checkboxradio-radio-label .ui-icon-background {
	width: 16px;
	height: 16px;
	border-radius: 1em;
	overflow: visible;
	border: none;
}
.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon,
.ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon {
	background-image: none;
	width: 8px;
	height: 8px;
	border-width: 4px;
	border-style: solid;
}
.ui-checkboxradio-disabled {
	pointer-events: none;
}
/*!
 * jQuery UI Controlgroup 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/controlgroup/#theming
 */
.ui-controlgroup {
	vertical-align: middle;
	display: inline-block;
}
.ui-controlgroup > .ui-controlgroup-item {
	float: left;
	margin-left: 0;
	margin-right: 0;
}
.ui-controlgroup > .ui-controlgroup-item:focus,
.ui-controlgroup > .ui-controlgroup-item.ui-visual-focus {
	z-index: 9999;
}
.ui-controlgroup-vertical > .ui-controlgroup-item {
	display: block;
	float: none;
	width: 100%;
	margin-top: 0;
	margin-bottom: 0;
	text-align: left;
}
.ui-controlgroup-vertical .ui-controlgroup-item {
	box-sizing: border-box;
}
.ui-controlgroup .ui-controlgroup-label {
	padding: .4em 1em;
}
.ui-controlgroup .ui-controlgroup-label span {
	font-size: 80%;
}
.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item {
	border-left: none;
}
.ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item {
	border-top: none;
}
.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content {
	border-right: none;
}
.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content {
	border-bottom: none;
}
/* Spinner specific style fixes */
.ui-controlgroup-vertical .ui-spinner-input {
	width: calc( 100% - 2.4em );
}
.ui-controlgroup-vertical .ui-spinner .ui-spinner-up {
	border-top-style: solid;
}
/*!
 * jQuery UI Datepicker 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/datepicker/#theming
 */
.ui-datepicker {
	width: 17em;
	padding: .2em .2em 0;
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 45%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}
/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}
/* Icons */
.ui-datepicker .ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
	left: .5em;
	top: .3em;
}
/*!
 * jQuery UI Dialog 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/dialog/#theming
 */
.ui-dialog {
	position: absolute;
	top: 0;
	left: 0;
	padding: .2em;
	outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
	padding: .4em 1em;
	position: relative;
}
.ui-dialog .ui-dialog-title {
	float: left;
	margin: .1em 0;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
	position: absolute;
	right: .3em;
	top: 50%;
	width: 20px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
}
.ui-dialog .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
	text-align: left;
	border-width: 1px 0 0 0;
	background-image: none;
	margin-top: .5em;
	padding: .3em 1em .5em .4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
	margin: .5em .4em .5em 0;
	cursor: pointer;
}
.ui-dialog .ui-resizable-n {
	height: 2px;
	top: 0;
}
.ui-dialog .ui-resizable-e {
	width: 2px;
	right: 0;
}
.ui-dialog .ui-resizable-s {
	height: 2px;
	bottom: 0;
}
.ui-dialog .ui-resizable-w {
	width: 2px;
	left: 0;
}
.ui-dialog .ui-resizable-se,
.ui-dialog .ui-resizable-sw,
.ui-dialog .ui-resizable-ne,
.ui-dialog .ui-resizable-nw {
	width: 7px;
	height: 7px;
}
.ui-dialog .ui-resizable-se {
	right: 0;
	bottom: 0;
}
.ui-dialog .ui-resizable-sw {
	left: 0;
	bottom: 0;
}
.ui-dialog .ui-resizable-ne {
	right: 0;
	top: 0;
}
.ui-dialog .ui-resizable-nw {
	left: 0;
	top: 0;
}
.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
/*!
 * jQuery UI Draggable 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 */
.ui-draggable-handle {
	touch-action: none;
}
/*!
 * jQuery UI Menu 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/menu/#theming
 */
.ui-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	display: block;
	outline: 0;
}
.ui-menu .ui-menu {
	position: absolute;
}
.ui-menu .ui-menu-item {
	margin: 0;
	cursor: pointer;
}
.ui-menu .ui-menu-item-wrapper {
	position: relative;
	padding: 3px 1em 3px .4em;
}
.ui-menu .ui-menu-divider {
	margin: 5px 0;
	height: 0;
	font-size: 0;
	line-height: 0;
	border-width: 1px 0 0 0;
}
.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
	margin: -1px;
}
/* icon support */
.ui-menu-icons {
	position: relative;
}
.ui-menu-icons .ui-menu-item-wrapper {
	padding-left: 2em;
}
/* left-aligned */
.ui-menu .ui-icon {
	position: absolute;
	top: 0;
	bottom: 0;
	left: .2em;
	margin: auto 0;
}
/* right-aligned */
.ui-menu .ui-menu-icon {
	left: auto;
	right: 0;
}
/*!
 * jQuery UI Progressbar 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/progressbar/#theming
 */
.ui-progressbar {
	height: 2em;
	text-align: left;
	overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
	margin: -1px;
	height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
	background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw==");
	height: 100%;
	opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
	background-image: none;
}
/*!
 * jQuery UI Resizable 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 */
.ui-resizable {
	position: relative;
}
.ui-resizable-handle {
	position: absolute;
	font-size: 0.1px;
	display: block;
	touch-action: none;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
	display: none;
}
.ui-resizable-n {
	cursor: n-resize;
	height: 7px;
	width: 100%;
	top: -5px;
	left: 0;
}
.ui-resizable-s {
	cursor: s-resize;
	height: 7px;
	width: 100%;
	bottom: -5px;
	left: 0;
}
.ui-resizable-e {
	cursor: e-resize;
	width: 7px;
	right: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-w {
	cursor: w-resize;
	width: 7px;
	left: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-se {
	cursor: se-resize;
	width: 12px;
	height: 12px;
	right: 1px;
	bottom: 1px;
}
.ui-resizable-sw {
	cursor: sw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	bottom: -5px;
}
.ui-resizable-nw {
	cursor: nw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	top: -5px;
}
.ui-resizable-ne {
	cursor: ne-resize;
	width: 9px;
	height: 9px;
	right: -5px;
	top: -5px;
}
/*!
 * jQuery UI Selectable 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 */
.ui-selectable {
	touch-action: none;
}
.ui-selectable-helper {
	position: absolute;
	z-index: 100;
	border: 1px dotted black;
}
/*!
 * jQuery UI Selectmenu 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/selectmenu/#theming
 */
.ui-selectmenu-menu {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}
.ui-selectmenu-menu .ui-menu {
	overflow: auto;
	overflow-x: hidden;
	padding-bottom: 1px;
}
.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
	font-size: 1em;
	font-weight: bold;
	line-height: 1.5;
	padding: 2px 0.4em;
	margin: 0.5em 0 0 0;
	height: auto;
	border: 0;
}
.ui-selectmenu-open {
	display: block;
}
.ui-selectmenu-text {
	display: block;
	margin-right: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-selectmenu-button.ui-button {
	text-align: left;
	white-space: nowrap;
	width: 14em;
}
.ui-selectmenu-icon.ui-icon {
	float: right;
	margin-top: 0;
}
/*!
 * jQuery UI Sortable 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 */
.ui-sortable-handle {
	touch-action: none;
}
/*!
 * jQuery UI Slider 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/slider/#theming
 */
.ui-slider {
	position: relative;
	text-align: left;
}
.ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	width: 1.2em;
	height: 1.2em;
	cursor: pointer;
	touch-action: none;
}
.ui-slider .ui-slider-range {
	position: absolute;
	z-index: 1;
	font-size: .7em;
	display: block;
	border: 0;
	background-position: 0 0;
}
.ui-slider-horizontal {
	height: .8em;
}
.ui-slider-horizontal .ui-slider-handle {
	top: -.3em;
	margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
	top: 0;
	height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
	left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
	right: 0;
}
.ui-slider-vertical {
	width: .8em;
	height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
	left: -.3em;
	margin-left: 0;
	margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
	left: 0;
	width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
	bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
	top: 0;
}
/*!
 * jQuery UI Spinner 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/spinner/#theming
 */
.ui-spinner {
	position: relative;
	display: inline-block;
	overflow: hidden;
	padding: 0;
	vertical-align: middle;
}
.ui-spinner-input {
	border: none;
	background: none;
	color: inherit;
	padding: .222em 0;
	margin: .2em 0;
	vertical-align: middle;
	margin-left: .4em;
	margin-right: 2em;
}
.ui-spinner-button {
	width: 1.6em;
	height: 50%;
	font-size: .5em;
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	cursor: default;
	display: block;
	overflow: hidden;
	right: 0;
}
/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button {
	border-top-style: none;
	border-bottom-style: none;
	border-right-style: none;
}
.ui-spinner-up {
	top: 0;
}
.ui-spinner-down {
	bottom: 0;
}
/*!
 * jQuery UI Tabs 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/tabs/#theming
 */
.ui-tabs {
	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
	padding: .2em;
}
.ui-tabs .ui-tabs-nav {
	margin: 0;
	padding: .2em .2em 0;
}
.ui-tabs .ui-tabs-nav li {
	list-style: none;
	float: left;
	position: relative;
	top: 0;
	margin: 1px .2em 0 0;
	border-bottom-width: 0;
	padding: 0;
	white-space: nowrap;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
	float: left;
	padding: .5em 1em;
	text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	margin-bottom: -1px;
	padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
	cursor: text;
}
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
	cursor: pointer;
}
.ui-tabs .ui-tabs-panel {
	display: block;
	border-width: 0;
	padding: 1em 1.4em;
	background: none;
}
/*!
 * jQuery UI Tooltip 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/tooltip/#theming
 */
.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
}
body .ui-tooltip {
	border-width: 2px;
}
/*!
 * jQuery UI CSS Framework 1.14.2
 * https://jqueryui.com
 *
 * Copyright OpenJS Foundation and other contributors
 * Released under the MIT license.
 * https://jquery.org/license
 *
 * https://api.jqueryui.com/category/theming/
 *
 * To view and modify this theme, visit https://jqueryui.com/themeroller/
 */
/* Component containers
----------------------------------*/
.ui-widget {
	font-family: Arial,Helvetica,sans-serif/*{ffDefault}*/;
	font-size: 1em/*{fsDefault}*/;
}
.ui-widget .ui-widget {
	font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
	font-family: Arial,Helvetica,sans-serif/*{ffDefault}*/;
	font-size: 1em;
}
.ui-widget.ui-widget-content {
	border: 1px solid #c5c5c5/*{borderColorDefault}*/;
}
.ui-widget-content {
	border: 1px solid #dddddd/*{borderColorContent}*/;
	background: #ffffff/*{bgColorContent}*/ /*{bgImgUrlContent}*/ /*{bgContentXPos}*/ /*{bgContentYPos}*/ /*{bgContentRepeat}*/;
	color: #333333/*{fcContent}*/;
}
.ui-widget-content a {
	color: #333333/*{fcContent}*/;
}
.ui-widget-header {
	border: 1px solid #dddddd/*{borderColorHeader}*/;
	background: #e9e9e9/*{bgColorHeader}*/ /*{bgImgUrlHeader}*/ /*{bgHeaderXPos}*/ /*{bgHeaderYPos}*/ /*{bgHeaderRepeat}*/;
	color: #333333/*{fcHeader}*/;
	font-weight: bold;
}
.ui-widget-header a {
	color: #333333/*{fcHeader}*/;
}
/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,

/* We use html here because we need a greater specificity to make sure disabled
works properly when clicked or hovered */
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
	border: 1px solid #c5c5c5/*{borderColorDefault}*/;
	background: #f6f6f6/*{bgColorDefault}*/ /*{bgImgUrlDefault}*/ /*{bgDefaultXPos}*/ /*{bgDefaultYPos}*/ /*{bgDefaultRepeat}*/;
	font-weight: normal/*{fwDefault}*/;
	color: #454545/*{fcDefault}*/;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button {
	color: #454545/*{fcDefault}*/;
	text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
	border: 1px solid #cccccc/*{borderColorHover}*/;
	background: #ededed/*{bgColorHover}*/ /*{bgImgUrlHover}*/ /*{bgHoverXPos}*/ /*{bgHoverYPos}*/ /*{bgHoverRepeat}*/;
	font-weight: normal/*{fwDefault}*/;
	color: #2b2b2b/*{fcHover}*/;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited,
a.ui-button:hover,
a.ui-button:focus {
	color: #2b2b2b/*{fcHover}*/;
	text-decoration: none;
}
.ui-visual-focus {
	box-shadow: 0 0 3px 1px rgb(94, 158, 214);
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
	border: 1px solid #003eff/*{borderColorActive}*/;
	background: #007fff/*{bgColorActive}*/ /*{bgImgUrlActive}*/ /*{bgActiveXPos}*/ /*{bgActiveYPos}*/ /*{bgActiveRepeat}*/;
	font-weight: normal/*{fwDefault}*/;
	color: #ffffff/*{fcActive}*/;
}
.ui-icon-background,
.ui-state-active .ui-icon-background {
	border: #003eff/*{borderColorActive}*/;
	background-color: #ffffff/*{fcActive}*/;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
	color: #ffffff/*{fcActive}*/;
	text-decoration: none;
}
/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
	border: 1px solid #dad55e/*{borderColorHighlight}*/;
	background: #fffa90/*{bgColorHighlight}*/ /*{bgImgUrlHighlight}*/ /*{bgHighlightXPos}*/ /*{bgHighlightYPos}*/ /*{bgHighlightRepeat}*/;
	color: #777620/*{fcHighlight}*/;
}
.ui-state-checked {
	border: 1px solid #dad55e/*{borderColorHighlight}*/;
	background: #fffa90/*{bgColorHighlight}*/;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
	color: #777620/*{fcHighlight}*/;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
	border: 1px solid #f1a899/*{borderColorError}*/;
	background: #fddfdf/*{bgColorError}*/ /*{bgImgUrlError}*/ /*{bgErrorXPos}*/ /*{bgErrorYPos}*/ /*{bgErrorRepeat}*/;
	color: #5f3f3f/*{fcError}*/;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
	color: #5f3f3f/*{fcError}*/;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
	color: #5f3f3f/*{fcError}*/;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
	font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
	opacity: .7;
	font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
	opacity: .35;
	background-image: none;
}
/* Icons
----------------------------------*/
/* states and images */
.ui-icon {
	width: 16px;
	height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
	background-image: url("data:image/png;base64,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");
}
.ui-widget-header .ui-icon {
	background-image: url("data:image/png;base64,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");
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon {
	background-image: url("data:image/png;base64,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");
}
.ui-state-active .ui-icon,
.ui-button:active .ui-icon {
	background-image: url("data:image/png;base64,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");
}
.ui-state-highlight .ui-icon,
.ui-button .ui-state-highlight.ui-icon {
	background-image: url("data:image/png;base64,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");
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
	background-image: url("data:image/png;base64,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");
}
.ui-button .ui-icon {
	background-image: url("data:image/png;base64,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");
}
/* positioning */
/* Three classes needed to override `.ui-button:hover .ui-icon` */
.ui-icon-blank.ui-icon-blank.ui-icon-blank {
	background-image: none;
}
.ui-icon-caret-1-n { background-position: 0 0; }
.ui-icon-caret-1-ne { background-position: -16px 0; }
.ui-icon-caret-1-e { background-position: -32px 0; }
.ui-icon-caret-1-se { background-position: -48px 0; }
.ui-icon-caret-1-s { background-position: -65px 0; }
.ui-icon-caret-1-sw { background-position: -80px 0; }
.ui-icon-caret-1-w { background-position: -96px 0; }
.ui-icon-caret-1-nw { background-position: -112px 0; }
.ui-icon-caret-2-n-s { background-position: -128px 0; }
.ui-icon-caret-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -65px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -65px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 1px -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }
.ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-on { background-position: -96px -144px; }
.ui-icon-radio-off { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px; }
.ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px; }
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
.ui-icon-squaresmall-close { background-position: -80px -208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }
/* Misc visuals
----------------------------------*/
/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
	border-top-left-radius: 3px/*{cornerRadius}*/;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
	border-top-right-radius: 3px/*{cornerRadius}*/;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
	border-bottom-left-radius: 3px/*{cornerRadius}*/;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
	border-bottom-right-radius: 3px/*{cornerRadius}*/;
}
/* Overlays */
.ui-widget-overlay {
	background: #aaaaaa/*{bgColorOverlay}*/ /*{bgImgUrlOverlay}*/ /*{bgOverlayXPos}*/ /*{bgOverlayYPos}*/ /*{bgOverlayRepeat}*/;
	opacity: .3/*{opacityOverlay}*/;
}
.ui-widget-shadow {
	box-shadow: 0/*{offsetLeftShadow}*/ 0/*{offsetTopShadow}*/ 5px/*{thicknessShadow}*/ #666666/*{bgColorShadow}*/;
}

.floating-avatars[data-v-ff79920e] {
    position: fixed;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}
.floating-avatars__avatar[data-v-ff79920e] {
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    user-select: none;
    /* The avatar SVGs are pixel art; keep the crisp edges look. */
    image-rendering: pixelated;
}

/* The floating-avatars layer sits at z-index 0 (position: fixed); the page
   chrome must stack above it so clicks land on inputs / buttons. */
header[data-v-9fbbc649],
#login-form[data-v-9fbbc649] {
    position: relative;
    z-index: 1;
}

/* ── Hero row ──────────────────────────────────────────────────────
   SSB-style "Player Card" centered above the roster. The two columns
   (inputs + preview) sit side-by-side as one unit, centered on the
   page rather than spanning the full width — that's the difference
   between "centered character-select" and "form pushed left, preview
   pushed right". */
.login-hero[data-v-9fbbc649] {
    display: flex;
    gap: 32px;
    align-items: stretch;
    justify-content: center;
    margin: 6px auto 24px;
    flex-wrap: wrap;
    max-width: 820px;
    text-align: left;
}
.login-hero__form[data-v-9fbbc649] {
    /* Fixed basis + no grow: holds a sensible column width without
       pushing the preview to the screen edge on wide displays. */
    flex: 0 1 360px;
    min-width: 280px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-self: center;
}

/* ── Character preview ─────────────────────────────────────────────
   The "stage" reads like a tiny vaporwave anime opening: a deep
   night-purple base, animated color clouds drifting across it, a
   slowly rotating conic sunburst behind the character, a pulsing
   aura ring at sprite height, and sparkles floating upward. The
   sprite itself keeps the existing walk-cycle bob.

   All effects are CSS-only — no extra JS, no canvas, no images.
   Each layer is its own `aria-hidden` div so screen readers don't
   announce "vibes". */
.character-preview[data-v-9fbbc649] {
    position: relative;
    flex: 0 0 320px;
    width: 320px;
    height: 380px;
    /* Radius aligned to the card (var(--ui-radius-lg) = 16) so the
       preview reads as a "first-class citizen" inside the form
       rather than a randomly-rounded import. The vibrant interior
       stays — it's the personality beat on an otherwise calm page. */
    border-radius: var(--ui-radius-lg);
    background:
        linear-gradient(180deg,
            hsl(280 50% 14%) 0%,
            hsl(248 60% 10%) 55%,
            hsl(228 70% 6%) 100%);
    box-shadow:
        /* Inset highlight + thin coloured rim still read against the
           dark interior; outer drop-shadow eased to match the rest
           of the page (less of the dramatic "lifted slab" look). */
        0 1px 0 hsl(0 0% 100% / 0.10) inset,
        0 0 0 1px hsl(280 80% 60% / 0.18),
        var(--ui-shadow-3);
    overflow: hidden;
    isolation: isolate;
}

/* ── Layer: rotating conic sunburst ──────────────────────────────
   Bottom-most. The "rays" radiate from the sprite's chest height
   and crawl around once every 30 seconds. Slow enough to feel
   ambient rather than dizzying. */
.character-preview__rays[data-v-9fbbc649] {
    position: absolute;
    left: 50%;
    top: 48%;
    width: 180%;
    aspect-ratio: 1 / 1;
    transform: translate(-50%, -50%);
    background: repeating-conic-gradient(
        from 0deg,
        hsl(40 95% 70% / 0.16) 0deg 8deg,
        transparent 8deg 22deg
    );
    mix-blend-mode: screen;
    animation: rays-spin-9fbbc649 32s linear infinite;
    pointer-events: none;
    z-index: 0;
}
@keyframes rays-spin-9fbbc649 {
from { transform: translate(-50%, -50%) rotate(0deg);
}
to   { transform: translate(-50%, -50%) rotate(360deg);
}
}

/* ── Layer: drifting color clouds ─────────────────────────────────
   Multi-radial gradient sized larger than the frame, animated
   side-to-side so the clouds appear to drift. Wraps around because
   the layer is oversized and `overflow: hidden` clips the edges. */
.character-preview__clouds[data-v-9fbbc649] {
    position: absolute;
    inset: -10%;
    background:
        radial-gradient(circle at 25% 30%, hsl(320 90% 65% / 0.30), transparent 35%),
        radial-gradient(circle at 78% 78%, hsl(195 95% 60% / 0.30), transparent 38%),
        radial-gradient(circle at 18% 80%, hsl(60 95% 60% / 0.22), transparent 32%),
        radial-gradient(circle at 80% 22%, hsl(140 85% 55% / 0.22), transparent 32%);
    filter: blur(10px);
    animation: clouds-drift-9fbbc649 16s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 0;
}
@keyframes clouds-drift-9fbbc649 {
0%   { transform: translate(-3%, -2%);
}
50%  { transform: translate(2%, 1%);
}
100% { transform: translate(3%, -1%);
}
}

/* ── Layer: pulsing aura ring ────────────────────────────────────
   Sits at sprite chest height. Two stacked radial gradients pulse
   in opposite phases so the aura "breathes". */
.character-preview__aura[data-v-9fbbc649] {
    position: absolute;
    left: 50%;
    top: 46%;
    width: 320px;
    height: 320px;
    transform: translate(-50%, -50%);
    background:
        radial-gradient(circle at center,
            hsl(195 100% 70% / 0.0) 0%,
            hsl(195 100% 70% / 0.18) 30%,
            hsl(280 90% 65% / 0.20) 45%,
            transparent 60%),
        radial-gradient(circle at center,
            hsl(320 95% 70% / 0.22) 0%,
            transparent 30%);
    mix-blend-mode: screen;
    animation: aura-pulse-9fbbc649 4.5s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
@keyframes aura-pulse-9fbbc649 {
0%, 100% {
        transform: translate(-50%, -50%) scale(0.92);
        opacity: 0.75;
}
50% {
        transform: translate(-50%, -50%) scale(1.08);
        opacity: 1;
}
}

/* ── Layer: floating sparkles ─────────────────────────────────────
   Seven white pinpricks rising up the frame. Each one has its own
   delay + path so the cluster looks unscripted. */
.character-preview__sparkles[data-v-9fbbc649] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    overflow: hidden;
}
.sparkle[data-v-9fbbc649] {
    position: absolute;
    bottom: -10px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: hsl(0 0% 100% / 0.95);
    box-shadow:
        0 0 4px hsl(0 0% 100% / 0.85),
        0 0 10px hsl(195 100% 75% / 0.6);
    opacity: 0;
    animation-name: sparkle-rise-9fbbc649;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
}
@keyframes sparkle-rise-9fbbc649 {
0%   { transform: translate(0, 0) scale(0.6); opacity: 0;
}
10%  { opacity: 1;
}
80%  { opacity: 0.8;
}
100% { transform: translate(var(--drift, 0px), -360px) scale(1); opacity: 0;
}
}

/* Per-sparkle randomisation. Hand-tuned so the cloud looks scattered
   rather than columnar. */
.sparkle--1[data-v-9fbbc649] { left:  8%; animation-duration: 6.5s; animation-delay: 0.0s; --drift: 14px;
}
.sparkle--2[data-v-9fbbc649] { left: 22%; animation-duration: 7.8s; animation-delay: 1.4s; --drift: -10px;
}
.sparkle--3[data-v-9fbbc649] { left: 38%; animation-duration: 8.5s; animation-delay: 2.7s; --drift: 18px;
}
.sparkle--4[data-v-9fbbc649] { left: 54%; animation-duration: 6.8s; animation-delay: 0.9s; --drift: -6px;
}
.sparkle--5[data-v-9fbbc649] { left: 68%; animation-duration: 9.2s; animation-delay: 3.4s; --drift: 12px;
}
.sparkle--6[data-v-9fbbc649] { left: 82%; animation-duration: 7.2s; animation-delay: 2.0s; --drift: -16px;
}
.sparkle--7[data-v-9fbbc649] { left: 92%; animation-duration: 8.0s; animation-delay: 4.6s; --drift: 8px;
}

/* ── Sprite ──────────────────────────────────────────────────────
   Always on top of the FX layers; gets a richer drop-shadow now
   that the background is busier. */
.character-preview__stage[data-v-9fbbc649] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}
.character-preview__sprite[data-v-9fbbc649] {
    position: relative;
    z-index: 2;
    max-width: 86%;
    max-height: 86%;
    image-rendering: pixelated;
    filter:
        drop-shadow(0 6px 12px hsl(0 0% 0% / 0.6))
        drop-shadow(0 0 18px hsl(195 100% 65% / 0.35));
    transition: transform 200ms ease-out;
}

/* The walk-cycle bob — same shape as before, deeper bob for the
   bigger stage. */
.character-preview__sprite--frame-0[data-v-9fbbc649] { transform: translateY(0);
}
.character-preview__sprite--frame-1[data-v-9fbbc649] { transform: translateY(-3px);
}
.character-preview--idle .character-preview__sprite[data-v-9fbbc649] { transform: translateY(0);
}

/* Soft elliptical floor shadow under the sprite. */
.character-preview__floor[data-v-9fbbc649] {
    position: absolute;
    left: 50%;
    bottom: 56px;
    width: 64%;
    height: 18px;
    transform: translateX(-50%);
    background: radial-gradient(
        ellipse at center,
        hsl(0 0% 0% / 0.55) 0%,
        hsl(0 0% 0% / 0.22) 45%,
        transparent 75%
    );
    z-index: 1;
    pointer-events: none;
}
.character-preview__caption[data-v-9fbbc649] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14px;
    text-align: center;
    color: hsl(0 0% 100%);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: capitalize;
    z-index: 3;
    text-shadow:
        0 1px 2px hsl(0 0% 0% / 0.85),
        0 0 10px hsl(280 90% 70% / 0.45);
}
@media (max-width: 640px) {
.character-preview[data-v-9fbbc649] {
        flex: 0 0 auto;
        width: 100%;
        max-width: 320px;
        height: 320px;
}
}