@font-face {
    font-family: "MOMIKA MiSans";
    font-style: normal;
    font-weight: 400;
    src: url("./fonts/MiSans-Normal.ttf") format("truetype");
    font-display: swap;
}

:root {
    --text: #111113;
    --muted: #6e6e73;
    --hairline: rgba(20, 24, 32, 0.08);
    --accent: #0a84ff;
    --glass-control:
        radial-gradient(ellipse at 50% 50%, rgba(255, 255, 255, 0.98) 0%, rgba(253, 252, 250, 0.98) 58%, #ffffff 100%),
        linear-gradient(180deg, #ffffff 0%, #fbfaf8 52%, #ffffff 100%);
    --glass-control-strong:
        radial-gradient(ellipse at 50% 50%, #ffffff 0%, rgba(253, 252, 250, 0.98) 58%, #ffffff 100%),
        linear-gradient(180deg, #ffffff 0%, #fcfbfa 52%, #ffffff 100%);
    --glass-highlight:
        inset 0 8px 18px rgba(219, 219, 219, 0.22),
        inset 0 -10px 18px rgba(255, 255, 255, 0.96),
        inset 10px 0 18px rgba(255, 255, 255, 0.72),
        inset -10px 0 18px rgba(255, 255, 255, 0.72);
    --recessed-edge:
        inset 0 0 0 2px rgba(224, 224, 224, 0.48),
        inset 0 2px 4px rgba(238, 238, 238, 0.78);
    --warm-shadow: 0 1px 0 rgba(255, 255, 255, 0.9), 0 18px 42px rgba(232, 221, 211, 0.42);
    --warm-shadow-strong: 0 1px 0 rgba(255, 255, 255, 0.92), 0 22px 52px rgba(232, 221, 211, 0.46);
    --directory-surface: var(--glass-control);
    --directory-surface-border: 2px solid rgba(255, 255, 255, 0.86);
    --directory-surface-radius: 38px;
    --directory-surface-shadow: var(--glass-highlight), var(--recessed-edge), var(--warm-shadow-strong);
    --directory-surface-backdrop: blur(26px) saturate(150%) brightness(1.04);
    /* Dock material tokens live in dock-material.css and are shared with resource rows. */
    --directory-control-hover-background:
        radial-gradient(ellipse at 50% 50%, rgba(255, 255, 255, 0.98), rgba(248, 246, 243, 0.94) 58%, rgba(255, 255, 255, 0.98)),
        rgba(248, 246, 243, 0.94);
    --directory-control-hover-shadow:
        inset 0 7px 12px rgba(224, 224, 224, 0.2),
        inset 0 -7px 12px rgba(255, 255, 255, 0.88),
        inset 0 0 0 2px rgba(224, 224, 224, 0.34);
    --directory-control-active-background: #f8f4f1;
    --directory-control-active-shadow:
        inset 0 8px 18px rgba(219, 219, 219, 0.16),
        inset 0 -10px 18px rgba(255, 255, 255, 0.96),
        inset 0 0 0 2px rgba(224, 224, 224, 0.58),
        0 1px 0 rgba(255, 255, 255, 0.9);
    --g2-sm: 11px;
    --g2-lg: 22px;
    --g2-pill: 999px;
    --sidebar-g2-radius: 38px;
    --font-main: "MOMIKA MiSans", sans-serif;
    --layout-top: 16px;
    --layout-right: 22px;
    --layout-bottom: 20px;
    --layout-left: 24px;
    --sidebar-left: 22px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    text-decoration: none;
    font-family: var(--font-main) !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-synthesis: none;
}

html,
body {
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
    background: #f8f4f1;
}

@media screen and (min-width: 2560px) {
    body {
        width: 1440px;
        margin: 0 auto;
    }
}

body {
    position: relative;
    display: flex;
    color: var(--text);
    isolation: isolate;
    user-select: none;
    -webkit-user-select: none;
}

input,
textarea {
    user-select: text;
    -webkit-user-select: text;
}

button,
input,
a {
    font-family: var(--font-main) !important;
}

button {
    appearance: none;
}

::-webkit-scrollbar {
    width: 0;
    height: 0;
}

.leftbar {
    order: 1;
    display: flex;
    flex: 0 0 252px;
    flex-direction: column;
    height: calc(100dvh - var(--layout-top) - var(--layout-bottom));
    margin: var(--layout-top) 0 var(--layout-bottom) var(--sidebar-left);
    padding: 18px 16px 16px;
    overflow: hidden;
    background: var(--directory-surface);
    border: var(--directory-surface-border);
    border-radius: var(--sidebar-g2-radius);
    box-shadow: var(--directory-surface-shadow);
    -webkit-backdrop-filter: var(--directory-surface-backdrop);
    backdrop-filter: var(--directory-surface-backdrop);
}

/*
 * The script replaces the circular fallback above with a size-aware G2 path.
 * drop-shadow is evaluated after clip-path, so the outer glass shadow keeps
 * following the clipped contour instead of being cut off at the border box.
 */
.leftbar.has-g2-clip {
    filter:
        drop-shadow(0 1px 0 rgba(255, 255, 255, 0.92))
        drop-shadow(0 18px 21px rgba(232, 221, 211, 0.4));
}

.bottomdiv {
    flex: 0 0 4px;
}

.group {
    order: 4;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    padding: 0 2px 2px;
    overflow-y: auto;
    color: var(--text);
    scrollbar-width: none;
}

.nav-title {
    margin: 8px 6px 4px;
    color: #444448;
    font-size: 12px;
    font-weight: 700 !important;
    font-synthesis: weight;
    line-height: 1.15;
}

.groups {
    width: 100%;
    margin: 0 0 6px;
}

.minigroup,
.minigroup-up,
.minigroup-down,
.minigroup-whole {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    padding: 0 12px;
    color: var(--text);
    background: transparent;
    border: 0;
    border-radius: 18px;
    transition: background 160ms ease, box-shadow 160ms ease, transform 160ms ease, color 160ms ease;
}

.minigroup:hover,
.minigroup-up:hover,
.minigroup-down:hover,
.minigroup-whole:hover,
.minigroup:focus-within,
.minigroup-up:focus-within,
.minigroup-down:focus-within,
.minigroup-whole:focus-within,
.minigroup.is-active,
.minigroup-up.is-active,
.minigroup-down.is-active,
.minigroup-whole.is-active {
    background: var(--directory-control-hover-background);
    box-shadow: var(--directory-control-hover-shadow);
}

.minigroup.is-active,
.minigroup-up.is-active,
.minigroup-down.is-active,
.minigroup-whole.is-active {
    /* Keep the selected navigation item on the exact same Liquid Glass surface as the Dock. */
    background: var(--directory-surface);
    border: var(--directory-surface-border);
    border-radius: var(--directory-surface-radius);
    box-shadow:
        var(--glass-highlight),
        var(--recessed-edge),
        0 1px 0 rgba(255, 255, 255, 0.92);
    backdrop-filter: var(--directory-surface-backdrop);
}

.minigroup.is-disabled,
.minigroup-up.is-disabled,
.minigroup-down.is-disabled,
.minigroup-whole.is-disabled {
    opacity: 0.64;
}

.nav-symbol {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    color: rgba(17, 17, 19, 0.58);
}

.nav-symbol::before {
    display: block;
    width: 100%;
    height: 100%;
    content: "";
    background: currentColor;
    mask: var(--symbol) center / contain no-repeat;
}

.nav-entry-action {
    gap: 8px;
}

.nav-status-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin-left: auto;
    background: rgba(140, 140, 146, 0.5);
    border-radius: 999px;
    box-shadow: 0 0 0 3px rgba(140, 140, 146, 0.09);
}

.nav-status-dot.is-online {
    background: rgba(48, 176, 98, 0.92);
    box-shadow: 0 0 0 3px rgba(48, 176, 98, 0.14);
}

.brand-link-icon,
.bootcss-nav-icon {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    object-fit: contain;
    opacity: 0.76;
}

.minigroup a,
.minigroup-up a,
.minigroup-down a,
.minigroup-whole a,
.minigroup button,
.minigroup-up button,
.minigroup-down button,
.minigroup-whole button {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: 32px;
    overflow: hidden;
    color: rgba(17, 17, 19, 0.92);
    font-size: 14px;
    line-height: 32px;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: transparent;
    border: 0;
    outline: 0;
    cursor: pointer;
}

.nav-terminal { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.15' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.2' y='6.2' width='19.6' height='15.6' rx='4.2'/%3E%3Cpath d='m8.4 11.2 3.2 2.8-3.2 2.8M14.5 17h5'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-linux { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21.5c.9 1 2.8 1.8 5 1.8s4.1-.8 5-1.8'/%3E%3Cpath d='M8.1 16.9c-1 1.6-1.3 3.2-.4 4 .9.9 2.5.5 4-.7M19.9 16.9c1 1.6 1.3 3.2.4 4-.9.9-2.5.5-4-.7'/%3E%3Cpath d='M10 13.8c-.8-4.4.7-9 4-9s4.8 4.6 4 9'/%3E%3Cpath d='M10 14c.4 3.5 2 5.7 4 5.7s3.6-2.2 4-5.7'/%3E%3Cpath d='M12.3 10.5h.1M15.7 10.5h.1'/%3E%3Cpath d='M12.4 14.4h3.2'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-window { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='5' width='18' height='18' rx='4.2'/%3E%3Cpath d='M14 5v18M5 14h18'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-macos { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='5.5' width='19' height='17' rx='4.2'/%3E%3Cpath d='M9 11.5v1.2M19 11.5v1.2M10 17.2c2.4 1.6 5.6 1.6 8 0M14 5.5v17'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-tool { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18.8 5.3a6 6 0 0 0 3.9 7.9l-9.9 9.9a3.3 3.3 0 0 1-4.7-4.7l9.9-9.9a6 6 0 0 0 .8-3.2Z'/%3E%3Cpath d='m8.8 19.2 1.9 1.9'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-code { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.15' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m10.5 9-5 5 5 5M17.5 9l5 5-5 5M15.5 6.5l-3 15'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-ai { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4v3M14 21v3M4 14h3M21 14h3M7 7l2.1 2.1M18.9 18.9 21 21M21 7l-2.1 2.1M9.1 18.9 7 21'/%3E%3Ccircle cx='14' cy='14' r='4.2'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-file { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 4.8h8.2L21 9.6v13.6H8z'/%3E%3Cpath d='M16 5v5h5M11 15h6M11 19h4'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-folder { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 9.5h7.2l2 3H23v7.4a3.3 3.3 0 0 1-3.3 3.3H8a3.3 3.3 0 0 1-3.5-3.3Z'/%3E%3Cpath d='M4.5 9.5v10.3'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-link { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m11.5 16.5 5-5'/%3E%3Cpath d='M9.2 19.8 7.6 21.4a4.2 4.2 0 0 1-6-6l4.2-4.2a4.2 4.2 0 0 1 6 0' transform='translate(3 0)'/%3E%3Cpath d='m18.8 8.2 1.6-1.6a4.2 4.2 0 0 1 6 6l-4.2 4.2a4.2 4.2 0 0 1-6 0' transform='translate(-3 0)'/%3E%3C/g%3E%3C/svg%3E"); }
.nav-diamond { --symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='white' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4.5 4.8 10l9.2 13.5L23.2 10Z'/%3E%3Cpath d='M4.8 10h18.4M9.4 10 14 23.5 18.6 10'/%3E%3C/g%3E%3C/svg%3E"); }

.right-page {
    position: relative;
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    height: 100dvh;
    overflow: hidden;
}

.mobile-menu-toggle {
    display: none;
}

.workspace-topbar {
    --search-inline-space: 20px;
    --search-block-space: 12px;
    --search-text-line-height: 18px;
    position: absolute;
    top: var(--layout-top);
    left: var(--layout-left);
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 104px;
    height: calc(var(--search-text-line-height) + (var(--search-block-space) * 2));
    padding: 0 var(--search-inline-space);
    overflow: hidden;
    color: rgba(17, 17, 19, 0.66);
    background: var(--directory-surface);
    border: var(--directory-surface-border);
    border-radius: var(--directory-surface-radius);
    box-shadow: var(--directory-surface-shadow);
    backdrop-filter: var(--directory-surface-backdrop);
    transition: width 260ms cubic-bezier(0.2, 0.8, 0.2, 1), background 160ms ease, box-shadow 160ms ease;
}

.workspace-topbar:hover,
.workspace-topbar.is-search-open {
    width: min(520px, calc(100% - 96px));
}

.top-search-symbol,
.top-search-divider,
.top-search-label,
.file-search,
.file-search-clear,
.quick-dock a,
.dock-button {
    position: relative;
    z-index: 1;
}

.top-search-symbol {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    opacity: 0.5;
}

.top-search-symbol::before {
    display: block;
    width: 100%;
    height: 100%;
    content: "";
    background: rgba(32, 36, 42, 0.74);
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m16.5 16.5 4 4'/%3E%3C/svg%3E") center / contain no-repeat;
}

.top-search-divider,
.top-search-label {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    height: var(--search-text-line-height);
    overflow: hidden;
    color: rgba(17, 17, 19, 0.58);
    font-size: 14px;
    line-height: var(--search-text-line-height);
    white-space: nowrap;
}

.top-search-divider {
    width: 4px;
}

.top-search-label {
    width: 28px;
    opacity: 1;
    transition: width 180ms ease, opacity 120ms ease;
}

.workspace-topbar:hover .top-search-label,
.workspace-topbar.is-search-open .top-search-label {
    width: 0;
    opacity: 0;
}

.file-search {
    flex: 1 1 auto;
    width: 0;
    min-width: 0;
    height: var(--search-text-line-height);
    opacity: 0;
    color: rgba(17, 17, 19, 0.9);
    font-size: 15px;
    line-height: var(--search-text-line-height);
    background: transparent;
    border: 0;
    outline: none;
    pointer-events: none;
    transition: opacity 140ms ease 40ms;
}

.file-search::-webkit-search-cancel-button {
    display: none;
    appearance: none;
    -webkit-appearance: none;
}

.file-search::-ms-clear {
    display: none;
}

.workspace-topbar:hover .file-search,
.workspace-topbar.is-search-open .file-search {
    opacity: 1;
    pointer-events: auto;
}

.file-search-clear {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    margin-right: -8px;
    cursor: pointer;
    opacity: 0;
    background: transparent;
    border: 0;
    border-radius: 50%;
    outline: none;
    pointer-events: none;
    transition: background 160ms ease, box-shadow 160ms ease;
}

.file-search-clear:hover,
.file-search-clear:focus-visible {
    background: var(--directory-control-hover-background);
    box-shadow: var(--directory-control-hover-shadow);
}

.file-search-clear::before,
.file-search-clear::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 1.8px;
    content: "";
    background: rgba(17, 17, 19, 0.58);
    border-radius: 999px;
}

.file-search-clear::before { transform: translate(-50%, -50%) rotate(45deg); }
.file-search-clear::after { transform: translate(-50%, -50%) rotate(-45deg); }
.workspace-topbar.has-search-value .file-search-clear {
    opacity: 1;
    pointer-events: auto;
}

.corner-logo {
    position: absolute;
    top: var(--layout-top);
    right: var(--layout-right);
    z-index: 10;
    display: grid;
    grid-template: 1fr / 1fr;
    width: 42px;
    height: 42px;
    padding: 5px;
    place-items: center;
    overflow: hidden;
    background: var(--glass-control);
    border-radius: var(--g2-pill);
    box-shadow: var(--glass-highlight), var(--recessed-edge), var(--warm-shadow-strong);
    transform-origin: top right;
    backdrop-filter: blur(26px) saturate(160%);
    transition:
        width 260ms cubic-bezier(0.2, 0.8, 0.2, 1),
        height 260ms cubic-bezier(0.2, 0.8, 0.2, 1),
        padding 260ms cubic-bezier(0.2, 0.8, 0.2, 1),
        box-shadow 180ms ease;
}

.corner-logo > * {
    grid-area: 1 / 1;
}

.corner-logo-image {
    position: relative;
    z-index: 1;
    display: block;
    width: 32px;
    height: 32px;
    object-fit: cover;
    border-radius: var(--g2-pill);
    transition: opacity 160ms ease, transform 180ms ease;
}

.corner-logo.is-expanded {
    width: min(330px, calc(100vw - var(--layout-left) - var(--layout-right)));
    height: 72px;
    padding: 0 26px;
}

.corner-logo.is-progress {
    height: 72px;
}

.corner-logo.is-expanded .corner-logo-image {
    opacity: 0;
    transform: scale(0.82);
    pointer-events: none;
}

.corner-island-content {
    position: relative;
    z-index: 1;
    display: grid;
    align-self: center;
    justify-self: stretch;
    width: 100%;
    min-width: 0;
    gap: 8px;
    padding: 0 2px;
    opacity: 0;
    pointer-events: none;
    transform: translateX(8px);
    transition: opacity 180ms ease, transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.corner-logo.is-expanded .corner-island-content {
    opacity: 1;
    transform: translateX(0);
}

.corner-island-main {
    display: grid;
    align-items: center;
    min-width: 0;
    gap: 4px;
}

.corner-island-title,
.corner-island-detail {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.corner-island-title {
    color: rgba(17, 17, 19, 0.86);
    font-size: 14px;
    line-height: 17px;
}

.corner-island-detail {
    color: rgba(17, 17, 19, 0.42);
    font-size: 11px;
    line-height: 15px;
}

.corner-island-progress {
    width: 100%;
    height: 5px;
    overflow: hidden;
    background: rgba(17, 17, 19, 0.09);
    border-radius: var(--g2-pill);
}

.corner-island-progress[hidden] {
    display: none;
}

.corner-island-progress-bar {
    display: block;
    width: 0%;
    height: 100%;
    background: linear-gradient(90deg, rgba(10, 132, 255, 0.62), rgba(58, 160, 108, 0.72));
    border-radius: inherit;
    transition: width 160ms ease;
}

.workspace-context {
    position: absolute;
    top: 84px;
    left: 26px;
    z-index: 6;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 34px;
}

.workspace-context h1 {
    color: #111113;
    font-size: 26px;
    letter-spacing: 0;
    line-height: 1;
}

.workspace-context h1.is-changing {
    animation: workspace-heading-in 280ms ease-out both;
}

@keyframes workspace-heading-in {
    from {
        opacity: 0;
        filter: blur(3px);
    }

    to {
        opacity: 1;
        filter: blur(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .workspace-context h1.is-changing {
        animation: none;
    }
}

.directory-back {
    position: relative;
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    color: rgba(17, 17, 19, 0.68);
    cursor: pointer;
    background: transparent;
    border: 0;
}

.directory-back::before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 19px;
    height: 19px;
    content: "";
    background: currentColor;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 18-6-6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
    transform: translate(-50%, -50%);
}

.directory-back[hidden],
.workspace-address[hidden] {
    display: none;
}

.workspace-address {
    position: absolute;
    top: 84px;
    right: 30px;
    z-index: 6;
    max-width: min(460px, 38vw);
    overflow: hidden;
    color: rgba(17, 17, 19, 0.38);
    font-size: 12px;
    line-height: 1.2;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.main-show-page {
    position: absolute;
    top: 126px;
    right: 0;
    bottom: 100px;
    left: 0;
    overflow: hidden;
}

.right-page.has-super-dock .main-show-page {
    bottom: 144px;
}

.right-page.is-previewing .main-show-page,
.right-page.is-previewing.has-super-dock .main-show-page {
    position: fixed;
    z-index: 1000;
    inset: 0;
    background: #f8f4f1;
}

.main-show-page iframe {
    display: block;
    width: 100%;
    height: 100%;
    background: #f8f4f1;
    border: 0;
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
    transform-origin: 50% 24%;
    transition: opacity 240ms ease, filter 260ms ease, transform 280ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.right-page.is-frame-switching .main-show-page iframe {
    opacity: 0;
    filter: blur(8px);
    transform: translateY(10px) scale(0.992);
}

.preview-close {
    position: absolute;
    top: max(16px, env(safe-area-inset-top));
    right: max(16px, env(safe-area-inset-right));
    z-index: 2;
    width: 44px;
    height: 44px;
    color: #111113;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(17, 17, 19, 0.1);
    border-radius: 50%;
    box-shadow: 0 12px 30px rgba(17, 17, 19, 0.16);
    backdrop-filter: blur(18px) saturate(150%);
    transition: background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.preview-close::before,
.preview-close::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 2px;
    content: "";
    background: currentColor;
    border-radius: 999px;
}

.preview-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.preview-close::after { transform: translate(-50%, -50%) rotate(-45deg); }

.preview-close:hover {
    background: #fff;
    box-shadow: 0 16px 36px rgba(17, 17, 19, 0.2);
    transform: scale(1.04);
}

.preview-close:active { transform: scale(0.96); }

.preview-close:focus-visible {
    outline: 3px solid rgba(10, 132, 255, 0.42);
    outline-offset: 3px;
}

.preview-close[hidden] { display: none; }

.preview-top-dock {
    position: absolute;
    top: max(14px, env(safe-area-inset-top));
    left: 50%;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: min(760px, calc(100% - 28px));
    min-height: 72px;
    padding: 0 15px 0 26px;
    overflow: visible;
    background: var(--directory-surface);
    border: var(--directory-surface-border);
    border-radius: var(--directory-surface-radius);
    box-shadow: var(--directory-surface-shadow);
    transform: translateX(-50%);
    backdrop-filter: var(--directory-surface-backdrop);
}

.preview-top-dock[hidden] { display: none; }

.preview-top-details {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.preview-top-title,
.preview-top-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.preview-top-title {
    color: rgba(17,17,19,.86);
    font-size: 14px;
    line-height: 17px;
}

.preview-top-meta {
    color: rgba(17,17,19,.42);
    font-size: 11px;
    line-height: 15px;
}

.preview-top-actions {
    display: flex;
    align-items: center;
    gap: 7px;
}

.preview-top-dock .preview-close {
    position: relative;
    top: auto;
    right: auto;
    z-index: auto;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    color: rgba(17,17,19,.68);
    background: transparent;
    border: 0;
    border-radius: 50%;
    box-shadow: none;
    backdrop-filter: none;
}

.preview-top-dock .preview-close:hover,
.preview-top-dock .preview-close:focus-visible {
    color: rgba(17,17,19,.94);
    background: var(--directory-control-hover-background);
    box-shadow: var(--directory-control-hover-shadow);
    transform: translateY(-1px);
}

@media (max-width: 700px) {
    .preview-top-dock {
        width: calc(100% - 20px);
        min-height: 64px;
        padding: 0 10px 0 18px;
    }
}

.quick-dock,
.corner-logo.is-expanded {
    background: var(--dock-surface);
    border: var(--dock-highlight-border);
    border-radius: var(--dock-radius);
    box-shadow: var(--dock-shadow);
    backdrop-filter: var(--dock-backdrop);
}

.quick-dock {
    --dock-edge-space: 26px;
    --dock-icon-inset: 11px;
    position: absolute;
    right: var(--layout-right);
    bottom: var(--layout-bottom);
    left: var(--layout-left);
    z-index: 8;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 10px;
    height: 72px;
    min-height: 72px;
    padding: 0 calc(var(--dock-edge-space) - var(--dock-icon-inset)) 0 var(--dock-edge-space);
    overflow: visible;
    transition: bottom 220ms ease, transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.right-page.has-super-dock .quick-dock {
    bottom: calc(var(--layout-bottom) + 44px);
}

.selected-resource {
    display: grid;
    gap: 4px;
    height: 36px;
    min-width: 0;
}

#selected-resource-name {
    max-width: 100%;
    overflow: hidden;
    color: rgba(17, 17, 19, 0.86);
    font-size: 14px;
    line-height: 17px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#selected-resource-hash {
    max-width: 100%;
    overflow: hidden;
    color: rgba(17, 17, 19, 0.42);
    font-size: 11px;
    line-height: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#selected-resource-name[aria-disabled="false"],
#selected-resource-hash[aria-disabled="false"] {
    cursor: copy;
}

.dock-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

.quick-dock.is-quick-link-selection .dock-actions > :not(#download-resource) {
    display: none !important;
}

.dock-button,
.quick-dock a {
    display: inline-grid;
    place-items: center;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    color: rgba(17, 17, 19, 0.68);
    cursor: pointer;
    background: transparent;
    border: 0;
    border-radius: 50%;
    outline: 0;
    box-shadow: none;
    transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.dock-button:hover,
.quick-dock a:hover,
.dock-button:focus-visible,
.quick-dock a:focus-visible {
    color: rgba(17, 17, 19, 0.94);
    background: var(--directory-control-hover-background);
    box-shadow: var(--directory-control-hover-shadow);
    transform: translateY(-1px);
}

.dock-super[aria-pressed="true"] {
    color: rgba(17, 17, 19, 0.94);
    background: var(--directory-control-active-background);
    box-shadow: var(--directory-control-active-shadow);
    transform: translateY(-1px);
}

.dock-button:disabled,
.dock-download[aria-disabled="true"],
.dock-button[aria-disabled="true"] {
    opacity: 0.34;
    pointer-events: none;
}

.dock-icon {
    width: 20px;
    height: 20px;
    background: currentColor;
    mask: var(--dock-symbol) center / contain no-repeat;
}

.dock-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.dock-refresh { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22.2 10.4A8.4 8.4 0 1 0 22.5 15.6'/%3E%3Cpath d='M22.3 6.3v4.5h-4.5'/%3E%3C/svg%3E"); }
.dock-super { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3.8 16.3 11l7.2 2.3-7.2 2.4L14 22.8l-2.3-7.1-7.2-2.4 7.2-2.3Z'/%3E%3Cpath d='M22.2 4.8v4.4'/%3E%3Cpath d='M20 7h4.4'/%3E%3C/svg%3E"); }
.dock-tool-run { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m11 7 8 7-8 7Z'/%3E%3C/svg%3E"); }
.dock-upload { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 20V6'/%3E%3Cpath d='m8.5 11.5 5.5-5.5 5.5 5.5'/%3E%3Cpath d='M6 20.5v1.2A2.3 2.3 0 0 0 8.3 24h11.4a2.3 2.3 0 0 0 2.3-2.3v-1.2'/%3E%3C/svg%3E"); }
.dock-new-folder { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.8 9.2h7l2 3h9.4v8.3a2.7 2.7 0 0 1-2.7 2.7h-13a2.7 2.7 0 0 1-2.7-2.7Z'/%3E%3Cpath d='M18 15.2v5'/%3E%3Cpath d='M15.5 17.7h5'/%3E%3C/svg%3E"); }
.dock-open { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.2 7.8h7.1l2.1 3h8.4v9.6a2.8 2.8 0 0 1-2.8 2.8H8a2.8 2.8 0 0 1-2.8-2.8Z'/%3E%3Cpath d='M14 14.2h5.5M17 11.7l2.5 2.5-2.5 2.5'/%3E%3C/svg%3E"); }
.dock-preview { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.8 14s3.7-6 10.2-6 10.2 6 10.2 6-3.7 6-10.2 6S3.8 14 3.8 14Z'/%3E%3Ccircle cx='14' cy='14' r='3'/%3E%3C/svg%3E"); }
.dock-download { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 5v14'/%3E%3Cpath d='m8.5 13.5 5.5 5.5 5.5-5.5'/%3E%3Cpath d='M6 22.5h16'/%3E%3C/svg%3E"); }
.dock-delete { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 8h17'/%3E%3Cpath d='M11 8V5.8A1.8 1.8 0 0 1 12.8 4h2.4A1.8 1.8 0 0 1 17 5.8V8'/%3E%3Cpath d='m8 8 .9 16h10.2L20 8'/%3E%3Cpath d='M12 12v8'/%3E%3Cpath d='M16 12v8'/%3E%3C/svg%3E"); }
.dock-store { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.8 9.2h7.2l2 3h9.2v8.2a2.8 2.8 0 0 1-2.8 2.8H7.6a2.8 2.8 0 0 1-2.8-2.8Z'/%3E%3Cpath d='M14 18.5V8'/%3E%3Cpath d='m10.4 11.6 3.6-3.6 3.6 3.6'/%3E%3C/svg%3E"); }
.dock-details { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='14' cy='14' r='9'/%3E%3Cpath d='M14 12.5v6'/%3E%3Cpath d='M14 9.2h.01'/%3E%3C/svg%3E"); }
.dock-rename { --dock-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16.2 7.2 4.6 4.6'/%3E%3Cpath d='M7.2 20.8 6 22l1.2-5.2L18.7 5.3a2 2 0 0 1 2.8 0l1.2 1.2a2 2 0 0 1 0 2.8L11.2 20.8Z'/%3E%3C/svg%3E"); }

.dock-button[hidden],
.dock-download[hidden],
.upload-popover[hidden],
.rename-popover[hidden],
.store-popover[hidden] {
    display: none;
}

.super-dock {
    position: absolute;
    right: var(--layout-right);
    bottom: var(--layout-bottom);
    left: var(--layout-left);
    z-index: 7;
    display: flex;
    align-items: center;
    height: 36px;
    min-height: 36px;
    padding: 0 16px;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    background: var(--directory-surface);
    border: var(--directory-surface-border);
    border-radius: var(--directory-surface-radius);
    box-shadow: var(--directory-surface-shadow);
    backdrop-filter: var(--directory-surface-backdrop);
    transform: translateY(14px) scale(0.985);
    transition: opacity 180ms ease, visibility 180ms ease, transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.super-dock.is-visible {
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.super-dock-content {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    color: rgba(17, 17, 19, 0.72);
    font-size: 12px;
    line-height: 1;
}

.super-dock-symbol {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    color: rgba(10, 132, 255, 0.82);
    background: currentColor;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3.8 16.3 11l7.2 2.3-7.2 2.4L14 22.8l-2.3-7.1-7.2-2.4 7.2-2.3Z'/%3E%3Cpath d='M22.2 4.8v4.4'/%3E%3Cpath d='M20 7h4.4'/%3E%3C/svg%3E") center / contain no-repeat;
}

.super-dock-title {
    flex: 0 0 auto;
    color: rgba(17, 17, 19, 0.82);
}

.super-dock-detail {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    color: rgba(17, 17, 19, 0.44);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.super-dock-actions {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.super-dock-action {
    position: relative;
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 32px;
    min-width: 32px;
    height: 32px;
    padding: 0;
    color: rgba(17, 17, 19, 0.74);
    background: transparent;
    border: 0;
    border-radius: 18px;
    cursor: pointer;
    box-shadow: none;
    transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.super-dock-action:hover,
.super-dock-action.is-selected {
    color: rgba(17, 17, 19, 0.94);
    background: var(--directory-control-hover-background);
    box-shadow: var(--directory-control-hover-shadow);
    transform: translateY(-1px);
}

.super-dock-action.is-danger {
    color: rgba(173, 46, 54, 0.86);
}

.super-dock-action.is-disabled {
    opacity: 0.44;
    cursor: not-allowed;
}

.super-dock-action-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.super-dock-action-icon {
    width: 17px;
    height: 17px;
    background: currentColor;
    mask: var(--super-symbol) center / contain no-repeat;
    -webkit-mask: var(--super-symbol) center / contain no-repeat;
}

.super-icon-console { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='6.5' width='19' height='15' rx='2.5'/%3E%3Cpath d='m9 12 3 2.5-3 2.5'/%3E%3Cpath d='M14.5 17h4.5'/%3E%3C/svg%3E"); }
.super-icon-terminal { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m8.5 9 5 5-5 5'/%3E%3Cpath d='M15 19h5'/%3E%3Crect x='4' y='5' width='20' height='18' rx='3'/%3E%3C/svg%3E"); }
.super-icon-select { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6h6v6H6zM16 6h6v6h-6zM6 16h6v6H6zM16 16h6v6h-6z'/%3E%3C/svg%3E"); }
.super-icon-rename { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16.2 7.2 4.6 4.6'/%3E%3Cpath d='M7.2 20.8 6 22l1.2-5.2L18.7 5.3a2 2 0 0 1 2.8 0l1.2 1.2a2 2 0 0 1 0 2.8L11.2 20.8Z'/%3E%3C/svg%3E"); }
.super-icon-move { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4v20M4 14h20M9 9 4 14l5 5M19 9l5 5-5 5'/%3E%3C/svg%3E"); }
.super-icon-copy { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='13' height='13' rx='2.5'/%3E%3Cpath d='M6 17V7.5A1.5 1.5 0 0 1 7.5 6H17'/%3E%3C/svg%3E"); }
.super-icon-delete { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 8h17M11 8V5.8A1.8 1.8 0 0 1 12.8 4h2.4A1.8 1.8 0 0 1 17 5.8V8M8 8l.9 16h10.2L20 8M12 12v8M16 12v8'/%3E%3C/svg%3E"); }
.super-icon-queue { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round'%3E%3Cpath d='M7 8h14M7 14h14M7 20h10'/%3E%3C/svg%3E"); }
.super-icon-refresh { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22.2 10.4A8.4 8.4 0 1 0 22.5 15.6'/%3E%3Cpath d='M22.3 6.3v4.5h-4.5'/%3E%3C/svg%3E"); }
.super-icon-status { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 18h4l2-8 4 12 2-7h6'/%3E%3C/svg%3E"); }
.super-icon-more { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='white'%3E%3Ccircle cx='8' cy='14' r='2.2'/%3E%3Ccircle cx='14' cy='14' r='2.2'/%3E%3Ccircle cx='20' cy='14' r='2.2'/%3E%3C/svg%3E"); }
.super-icon-path { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 20c4 0 4-12 8-12s4 12 8 12'/%3E%3Ccircle cx='6' cy='20' r='2'/%3E%3Ccircle cx='22' cy='20' r='2'/%3E%3C/svg%3E"); }
.super-icon-link { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11.5 16.5 16.5 11.5'/%3E%3Cpath d='M12.5 8.5 14 7a5 5 0 0 1 7 7l-1.5 1.5'/%3E%3Cpath d='M15.5 19.5 14 21a5 5 0 0 1-7-7l1.5-1.5'/%3E%3C/svg%3E"); }
.super-icon-share { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='19' cy='7' r='3'/%3E%3Ccircle cx='8' cy='14' r='3'/%3E%3Ccircle cx='19' cy='21' r='3'/%3E%3Cpath d='m10.7 12.7 5.6-4.4M10.7 15.3l5.6 4.4'/%3E%3C/svg%3E"); }
.super-icon-lock { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='12' width='16' height='11' rx='2.5'/%3E%3Cpath d='M10 12V9a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E"); }
.super-icon-version { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 7h9l3 3v11H8z'/%3E%3Cpath d='M17 7v4h4M11 15h7M11 19h5'/%3E%3C/svg%3E"); }
.super-icon-snapshot { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='8' width='18' height='13' rx='3'/%3E%3Cpath d='M10 8l1.4-2h5.2L18 8'/%3E%3Ccircle cx='14' cy='14.5' r='3.2'/%3E%3C/svg%3E"); }
.super-icon-ai { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4l2 6 6 2-6 2-2 6-2-6-6-2 6-2zM22 5v4M20 7h4'/%3E%3C/svg%3E"); }
.super-icon-pdf { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 5h9l4 4v14H8zM17 5v5h5'/%3E%3Cpath d='M10 17h8M10 20h5'/%3E%3C/svg%3E"); }
.super-icon-ocr,.super-icon-text { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 8h14M14 8v12M10 20h8'/%3E%3C/svg%3E"); }
.super-icon-image { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='6' width='18' height='16' rx='3'/%3E%3Cpath d='m8 19 5-5 4 4 2-2 3 3'/%3E%3Ccircle cx='18' cy='11' r='1.6'/%3E%3C/svg%3E"); }
.super-icon-cutout { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 21 21 7M8 8l4 4M16 16l4 4'/%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3Ccircle cx='20' cy='20' r='3'/%3E%3C/svg%3E"); }
.super-icon-upscale { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 19 19 9M13 9h6v6M9 9h3M9 9v3M19 19h-3M19 19v-3'/%3E%3C/svg%3E"); }
.super-icon-similar { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='7' width='10' height='10' rx='2'/%3E%3Crect x='13' y='11' width='10' height='10' rx='2'/%3E%3C/svg%3E"); }
.super-icon-media { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='7' width='18' height='14' rx='3'/%3E%3Cpath d='m12 11 6 3-6 3z'/%3E%3C/svg%3E"); }
.super-icon-proxy { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 9h10a4 4 0 0 1 0 8H11'/%3E%3Cpath d='m10 13-4 4 4 4'/%3E%3C/svg%3E"); }
.super-icon-transcode { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8h12v5M20 8l-4 4M20 8l-4-4M20 20H8v-5M8 20l4-4M8 20l4 4'/%3E%3C/svg%3E"); }
.super-icon-frames { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='7' width='18' height='14' rx='2'/%3E%3Cpath d='M10 7v14M18 7v14M5 12h18M5 16h18'/%3E%3C/svg%3E"); }
.super-icon-subtitle { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='7' width='18' height='14' rx='3'/%3E%3Cpath d='M9 16h10M9 19h7'/%3E%3C/svg%3E"); }
.super-icon-edit { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 6h14v16H7zM10 11h8M10 15h8M10 19h5'/%3E%3C/svg%3E"); }
.super-icon-git { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m14 4 10 10-10 10L4 14zM10 14h8M14 10v8'/%3E%3C/svg%3E"); }
.super-icon-format { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round'%3E%3Cpath d='M8 7h12M8 12h9M8 17h12M8 22h6'/%3E%3C/svg%3E"); }
.super-icon-model { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.1' stroke-linejoin='round'%3E%3Cpath d='m14 4 9 5v10l-9 5-9-5V9zM5 9l9 5 9-5M14 14v10'/%3E%3C/svg%3E"); }
.super-icon-texture { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='6' width='16' height='16' rx='2'/%3E%3Cpath d='M6 11h16M6 17h16M11 6v16M17 6v16'/%3E%3C/svg%3E"); }
.super-icon-package { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.1' stroke-linejoin='round'%3E%3Cpath d='m14 4 9 5-9 5-9-5zM5 9v10l9 5 9-5V9M14 14v10'/%3E%3C/svg%3E"); }
.super-icon-asset,.super-icon-tag { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 6h8l10 10-7 7L6 13z'/%3E%3Ccircle cx='10' cy='10' r='1.8'/%3E%3C/svg%3E"); }
.super-icon-size { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 21V7h14M7 21h14'/%3E%3Cpath d='M11 17h3M11 13h6M11 9h9'/%3E%3C/svg%3E"); }
.super-icon-duplicate { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='6' width='11' height='11' rx='2'/%3E%3Crect x='11' y='11' width='11' height='11' rx='2'/%3E%3Cpath d='M9 11h5M14 14v-5'/%3E%3C/svg%3E"); }
.super-icon-folder { --super-symbol: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.8 9.2h7l2 3h9.4v8.3a2.7 2.7 0 0 1-2.7 2.7h-13a2.7 2.7 0 0 1-2.7-2.7z'/%3E%3C/svg%3E"); }


.rename-popover,
.transfer-panel {
    position: absolute;
    right: auto;
    bottom: 98px;
    left: 50%;
    z-index: 29;
    display: grid;
    align-items: center;
    overflow: hidden;
    width: min(520px, calc(100% - 76px));
    min-height: 48px;
    padding: 10px 12px;
    opacity: 0;
    pointer-events: none;
    background: var(--glass-control-strong);
    border: 0;
    border-radius: 22px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 0 rgba(255, 255, 255, 0.45), 0 38px 98px rgba(18, 34, 62, 0.32), 0 14px 34px rgba(18, 34, 62, 0.18);
    transform: translate(-50%, 22px) scale(0.985);
    backdrop-filter: blur(30px) saturate(190%) brightness(1.04);
    transition: opacity 180ms ease, transform 240ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.right-page.has-super-dock .rename-popover,
.right-page.has-super-dock .transfer-panel {
    bottom: 142px;
}

.rename-popover.is-visible,
.rename-popover.is-settled,
.transfer-panel.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, 0) scale(1);
}

.rename-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px 28px;
    gap: 7px;
    align-items: center;
    width: 100%;
}

.rename-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.rename-input {
    min-width: 0;
    height: 28px;
    padding: 0 11px;
    color: rgba(17, 17, 19, 0.9);
    font-size: 13px;
    background: rgba(255, 255, 255, 0.58);
    border: 0;
    border-radius: 14px;
    outline: none;
}

.rename-confirm,
.rename-cancel {
    position: relative;
    width: 28px;
    height: 28px;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.64);
    border: 0;
    border-radius: 50%;
}

.rename-confirm::before {
    position: absolute;
    top: 48%;
    left: 50%;
    width: 13px;
    height: 8px;
    content: "";
    border-bottom: 2px solid rgba(10, 132, 255, 0.9);
    border-left: 2px solid rgba(10, 132, 255, 0.9);
    transform: translate(-50%, -50%) rotate(-45deg);
}

.rename-cancel::before,
.rename-cancel::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 13px;
    height: 1.8px;
    content: "";
    background: rgba(17, 17, 19, 0.58);
    border-radius: 999px;
}

.rename-cancel::before { transform: translate(-50%, -50%) rotate(45deg); }
.rename-cancel::after { transform: translate(-50%, -50%) rotate(-45deg); }

.upload-popover,
.store-popover {
    position: absolute;
    bottom: calc(100% + 12px);
    z-index: 6;
    display: grid;
    gap: 6px;
    min-width: 132px;
    padding: 8px;
    background: var(--glass-control-strong);
    border: 0;
    border-radius: 18px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96), 0 24px 62px rgba(18, 34, 62, 0.24), 0 8px 22px rgba(18, 34, 62, 0.12);
    backdrop-filter: blur(30px) saturate(190%) brightness(1.04);
}

.upload-popover {
    left: 50%;
    transform: translateX(-50%);
}

.store-popover {
    right: 12px;
}

.upload-popover button,
.store-popover button {
    min-height: 34px;
    padding: 0 12px;
    color: rgba(17, 17, 19, 0.8);
    font-size: 13px;
    white-space: nowrap;
    background: rgba(248, 247, 245, 0.86);
    border: 0;
    border-radius: 12px;
    cursor: pointer;
}

.store-label {
    color: rgba(17, 17, 19, 0.56);
    font-size: 12px;
}

.store-targets {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.transfer-panel {
    gap: 7px;
    z-index: 28;
}

.transfer-panel[hidden] {
    display: none;
}

.transfer-line {
    display: flex;
    align-items: center;
    gap: 10px;
}

#transfer-title {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    color: rgba(17, 17, 19, 0.78);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#transfer-percent {
    color: rgba(17, 17, 19, 0.46);
    font-size: 12px;
}

.transfer-cancel {
    position: relative;
    width: 26px;
    height: 26px;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.56);
    border: 0;
    border-radius: 50%;
}

.transfer-cancel[hidden] {
    display: none;
}

.transfer-cancel::before,
.transfer-cancel::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 1.8px;
    content: "";
    background: rgba(17, 17, 19, 0.58);
    border-radius: 999px;
}

.transfer-cancel::before { transform: translate(-50%, -50%) rotate(45deg); }
.transfer-cancel::after { transform: translate(-50%, -50%) rotate(-45deg); }

.transfer-track {
    width: 100%;
    height: 5px;
    overflow: hidden;
    background: rgba(17, 17, 19, 0.09);
    border-radius: var(--g2-pill);
}

#transfer-bar {
    display: block;
    width: 0%;
    height: 100%;
    background: linear-gradient(90deg, rgba(10, 132, 255, 0.62), rgba(58, 160, 108, 0.72));
    border-radius: inherit;
    transition: width 160ms ease;
}

.transfer-panel.is-error #transfer-bar {
    background: linear-gradient(90deg, rgba(255, 69, 58, 0.72), rgba(255, 149, 0, 0.72));
}

.terminal-panel {
    position: absolute;
    top: 116px;
    right: var(--layout-right);
    bottom: 132px;
    left: var(--layout-left);
    z-index: 8;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 10px;
    padding: 14px;
    color: rgba(246, 248, 250, 0.92);
    background: rgba(24, 28, 34, 0.78);
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 24px;
    box-shadow: var(--glass-highlight), 0 26px 70px rgba(18, 34, 62, 0.28);
    backdrop-filter: blur(24px) saturate(145%);
}

.terminal-panel[hidden] {
    display: none;
}

.terminal-header,
.terminal-input-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.terminal-header {
    justify-content: space-between;
}

#terminal-title {
    display: block;
    font-size: 14px;
}

#terminal-subtitle {
    display: block;
    margin-top: 3px;
    color: rgba(246, 248, 250, 0.58);
    font-size: 12px;
}

#terminal-close {
    height: 30px;
    padding: 0 12px;
    color: rgba(17, 17, 19, 0.82);
    background: rgba(255, 255, 255, 0.78);
    border: 0;
    border-radius: var(--g2-pill);
    cursor: pointer;
}

.terminal-output {
    min-height: 0;
    margin: 0;
    overflow: auto;
    color: rgba(231, 238, 248, 0.92);
    font-family: var(--font-main) !important;
    font-size: 13px;
    line-height: 1.55;
    white-space: pre-wrap;
}

.terminal-input-row {
    padding: 9px 12px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
}

.terminal-prompt {
    color: rgba(79, 195, 247, 0.9);
    font-family: var(--font-main) !important;
    font-size: 13px;
    line-height: 1;
}

.terminal-input {
    flex: 1 1 auto;
    min-width: 0;
    color: rgba(246, 248, 250, 0.94);
    background: transparent;
    border: 0;
    outline: 0;
    font-family: var(--font-main) !important;
    font-size: 13px;
    line-height: 1.4;
}

.momika-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(248, 244, 241, 0.34);
    backdrop-filter: blur(18px) saturate(150%);
}

.momika-dialog {
    display: grid;
    gap: 14px;
    width: min(390px, calc(100vw - 48px));
    padding: 18px;
    color: rgba(17, 17, 19, 0.88);
    background: var(--glass-control-strong);
    border: 0;
    border-radius: 26px;
    box-shadow: var(--glass-highlight), var(--recessed-edge), 0 34px 92px rgba(18, 34, 62, 0.24);
}

.momika-dialog h2 {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
}

.momika-dialog p {
    margin: 0;
    color: rgba(17, 17, 19, 0.52);
    font-size: 13px;
    line-height: 1.5;
}

.momika-dialog input {
    width: 100%;
    height: 38px;
    padding: 0 12px;
    color: rgba(17, 17, 19, 0.9);
    background: rgba(255, 255, 255, 0.62);
    border: 0;
    border-radius: 16px;
    outline: none;
}

.momika-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.momika-dialog-actions button {
    min-width: 72px;
    height: 34px;
    padding: 0 14px;
    color: rgba(17, 17, 19, 0.78);
    cursor: pointer;
    background: rgba(255, 255, 255, 0.62);
    border: 0;
    border-radius: var(--g2-pill);
}

.momika-dialog-actions .is-primary {
    color: rgba(255, 255, 255, 0.96);
    background: rgba(10, 132, 255, 0.86);
}

.momika-dialog-actions .is-danger {
    color: rgba(255, 255, 255, 0.96);
    background: rgba(214, 66, 76, 0.9);
}

@media (max-width: 820px) {
    body {
        display: block;
    }

    .leftbar {
        position: fixed;
        inset: 12px auto 12px 12px;
        z-index: 60;
        width: min(280px, calc(100vw - 42px));
        height: auto;
        margin: 0;
        transform: translateX(calc(-100% - 24px));
        transition: transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
    }

    body.is-mobile-menu-open .leftbar {
        transform: translateX(0);
    }

    .mobile-menu-toggle {
        position: absolute;
        top: max(12px, env(safe-area-inset-top));
        right: max(12px, env(safe-area-inset-right));
        z-index: 61;
        display: grid;
        width: 38px;
        height: 38px;
        place-items: center;
        background: var(--glass-control);
        border: 0;
        border-radius: 50%;
        box-shadow: var(--glass-highlight), var(--recessed-edge), var(--warm-shadow);
    }

    .mobile-menu-toggle span,
    .mobile-menu-toggle::before,
    .mobile-menu-toggle::after {
        width: 16px;
        height: 1.8px;
        content: "";
        background: rgba(17, 17, 19, 0.72);
        border-radius: 999px;
    }

    .mobile-menu-toggle::before,
    .mobile-menu-toggle::after {
        position: absolute;
        left: 11px;
    }

    .mobile-menu-toggle::before { top: 13px; }
    .mobile-menu-toggle::after { bottom: 13px; }

    .right-page {
        width: 100%;
        height: 100dvh;
    }

    .workspace-topbar {
        --search-inline-space: 14px;
        --search-block-space: 9px;
        top: max(12px, env(safe-area-inset-top));
        left: max(12px, env(safe-area-inset-left));
        width: 92px;
    }

    .workspace-topbar.is-search-open {
        width: min(430px, calc(100vw - 72px));
    }

    .corner-logo {
        top: max(12px, env(safe-area-inset-top));
        right: calc(max(12px, env(safe-area-inset-right)) + 52px);
        width: 38px;
        height: 38px;
    }

    .corner-logo-image {
        width: 28px;
        height: 28px;
    }

    .corner-logo.is-expanded {
        width: min(260px, calc(100vw - 88px));
        height: 60px;
    }

    .workspace-context {
        top: calc(max(12px, env(safe-area-inset-top)) + 58px);
        left: max(20px, env(safe-area-inset-left));
    }

    .workspace-context h1 {
        font-size: 24px;
    }

    .workspace-address {
        display: none;
    }

    .main-show-page {
        top: 104px;
        bottom: calc(96px + env(safe-area-inset-bottom));
    }

    .right-page.has-super-dock .main-show-page {
        bottom: calc(138px + env(safe-area-inset-bottom));
    }

    .quick-dock {
        --dock-edge-space: 12px;
        --dock-icon-inset: 8px;
        right: max(12px, env(safe-area-inset-right));
        bottom: max(12px, env(safe-area-inset-bottom));
        left: max(12px, env(safe-area-inset-left));
        grid-template-columns: 1fr;
        gap: 6px;
        height: auto;
        min-height: 62px;
        padding: var(--dock-edge-space) calc(var(--dock-edge-space) - var(--dock-icon-inset)) var(--dock-edge-space) var(--dock-edge-space);
    }

    .right-page.has-super-dock .quick-dock {
        bottom: calc(max(12px, env(safe-area-inset-bottom)) + 42px);
    }

    .dock-actions {
        flex-wrap: wrap;
        width: 100%;
    }

    .dock-button,
    .quick-dock a {
        width: 36px;
        min-width: 36px;
        height: 36px;
        min-height: 36px;
    }

    .super-dock {
        right: max(12px, env(safe-area-inset-right));
        bottom: max(12px, env(safe-area-inset-bottom));
        left: max(12px, env(safe-area-inset-left));
        height: 36px;
        min-height: 36px;
        padding: 0 12px;
    }

    .super-dock-title {
        display: none;
    }

    .terminal-panel {
        top: 104px;
        right: max(12px, env(safe-area-inset-right));
        bottom: calc(max(12px, env(safe-area-inset-bottom)) + 118px);
        left: max(12px, env(safe-area-inset-left));
    }

    .rename-popover,
    .transfer-panel {
        right: max(12px, env(safe-area-inset-right));
        bottom: calc(max(12px, env(safe-area-inset-bottom)) + 118px);
        left: max(12px, env(safe-area-inset-left));
        width: auto;
        transform: translateY(22px) scale(0.985);
    }

    .rename-popover.is-visible,
    .rename-popover.is-settled,
    .transfer-panel.is-visible {
        transform: translateY(0) scale(1);
    }
}