@charset "UTF-8";

/*
Super Liminal — ItBackrooms
基于 Ambersight 的 Super Liminal 修改
*/

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;700&family=JetBrains+Mono:wght@400;500&display=swap");
@import url('https://br-jpwiki.github.io/files/util/main/styles/font-awesome.min.css');
@import url("https://br-jpwiki.github.io/files/util/main/styles/fantasque-sans-mono.css");
@import url("https://br-jpwiki.github.io/files/modules/colstyle.min.css");
@import url("https://br-jpwiki.github.io/files/util/common/credit/style/style.css");
@import url("https://br-jpwiki.github.io/files/util/common/image-block/style/style.css");
@import url("https://br-jpwiki.github.io/files/theme/super-liminal/icon-masks.css");

:root {

    font-size: 15px;

    --body-font: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --header-font: 'Inter', 'Noto Sans SC', system-ui, sans-serif;
    --title-font: 'Inter', 'Noto Sans SC', system-ui, sans-serif;
    --mono-font: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;

    /* 米白底 */

    --background-color: 245, 251, 250;
    --text-color: 38, 60, 64;

    --light-color-1: 255, 252, 250;
    --light-color-2: 255, 255, 255;
    --dark-color-1: 232, 244, 242;
    --dark-color-2: 206, 228, 224;
    --dark-color-3: 84, 150, 142;
    --dark-color-4: 38, 92, 86;

    --warning-color: 224, 110, 90;
    --accept-color: 72, 178, 150;
    --neutral-color: 210, 168, 110;
    --cancel-color: 200, 200, 200;
    --warning-text-color: 255, 255, 255;
    --accept-text-color: var(--warning-text-color);
    --neutral-text-color: var(--warning-text-color);

    --link-color: 56, 142, 132;
    --hover-link-color: 36, 110, 102;
    --visited-link-color: 118, 162, 154;
    --newpage-color: 214, 128, 100;

    --selected-background-color: 38, 92, 86;
    --selected-text-color: 255, 252, 250;

    --scrollbar-color: 84, 150, 142, 0.5;
    --scrollbar-background-color: 84, 150, 142, 0.08;

    --general-light-background-color: var(--light-color-2);
    --general-light-text-color: var(--text-color);
    --general-medium-background-color: var(--dark-color-3);
    --general-medium-text-color: var(--light-color-2);
    --general-dark-background-color: var(--dark-color-4);
    --general-dark-text-color: var(--light-color-2);
    --general-shadow-color: 38, 92, 86;
    --general-light-border-color: 84, 150, 142, 0.12;
    --general-medium-border-color: 84, 150, 142, 0.22;
    --general-strong-border-color: 84, 150, 142, 0.4;
    --general-dark-border-color: 38, 92, 86;
    --general-blur: 0.25rem;
    --general-transition-time-fast: 0.2s;
    --general-transition-time-slow: 0.3s;

    /* 现代设计令牌 */

    --radius-lg: 1rem;
    --radius-md: 0.75rem;
    --radius-sm: 0.5rem;
    --radius-xs: 0.375rem;
    --radius-pill: 999px;
    --shadow-xs: 0 1px 2px rgba(38, 92, 86, 0.05);
    --shadow-sm: 0 1px 3px rgba(38, 92, 86, 0.06), 0 1px 2px rgba(38, 92, 86, 0.04);
    --shadow-md: 0 2px 8px rgba(38, 92, 86, 0.07), 0 1px 3px rgba(38, 92, 86, 0.05);
    --shadow-lg: 0 8px 24px rgba(38, 92, 86, 0.1), 0 2px 6px rgba(38, 92, 86, 0.06);
    --shadow-xl: 0 20px 48px rgba(38, 92, 86, 0.15), 0 4px 12px rgba(38, 92, 86, 0.08);
    --ease: cubic-bezier(0.4, 0, 0.2, 1);

    --general-button-text-color: var(--light-color-2);
    --general-button-background-color: var(--dark-color-3);
    --general-hover-button-text-color: var(--light-color-2);
    --general-hover-button-background-color: var(--dark-color-4);

    /* 版头自适应 */

    --main-header-height: clamp(10.5rem, 22vw, 16.5rem);
    --main-header-height-on-mobile: clamp(8.5rem, 26vw, 12rem);
    --header-height: calc(var(--main-header-height) + var(--topbar-height) + 2.6rem);
    --header-width: 100%;
    --header-width-on-mobile: 100%;
    --header-margin: clamp(1.25rem, 5vw, 4rem);
    --logo-image: url("https://img.remit.ee/i/1sll8nmbFICD");
    --header-title: "";
    --header-title-font-size: clamp(1.9rem, 5.5vw, 3.4rem);
    --header-title-font-size-on-mobile: clamp(1.4rem, 6.5vw, 2.1rem);
    --header-subtitle: ""梦....也会杀人吗？"";
    --header-subtitle-font-size: clamp(0.85rem, 1.9vw, 1.15rem);
    --header-subtitle-font-size-on-mobile: clamp(0.75rem, 2.8vw, 0.95rem);
    --search-icon-width-on-mobile: 2.5rem;

    /* 版头背景图 */

    --header-bg-image: url("https://img.remit.ee/i/Jc8fJVXUG9bK");
    --header-bg-overlay: 56, 120, 112, 0.28;
    --header-background-bottom: 56, 120, 112;
    --header-background-top: 245, 251, 250;
    --header-background-image:
        linear-gradient(135deg, rgba(120, 196, 188, 0.36), rgba(200, 228, 224, 0.26) 46%, rgba(140, 196, 216, 0.36)),
        radial-gradient(120% 80% at 18% 0%, rgba(255, 255, 255, 0.45), rgba(255, 255, 255, 0) 62%),
        var(--header-bg-image);
    --header-extra-background-image: none;
    --header-text-color: 255, 252, 250;
    --header-text-shadow-color: 38, 92, 86;

    /* 顶栏 */

    --topbar-height: 2.75rem;
    --topbar-height-on-mobile: 3.25rem;
    --topbar-font-size: 0.85rem;
    --topbar-font-size-on-mobile: 1rem;

    --topbar-inset: clamp(1rem, 4vw, 3rem);
    --topbar-max-width: 72rem;
    --topbar-bg: 255, 251, 250;
    --topbar-hover-bg: 230, 242, 240;
    --topbar-text-color: 38, 92, 86;
    --topbar-hover-text-color: 52, 38, 80;
    --topbar-background-color: 0, 0, 0, 0;
    --topbar-hover-background-color: 230, 242, 240;
    --topbar-hover-border-color: 196, 224, 220, 0.5;
    --topbar-drop-text-color: 44, 84, 84;
    --topbar-drop-hover-text-color: 30, 60, 62;
    --topbar-drop-background-color: 255, 253, 252, 0.98;
    --topbar-drop-hover-background-color: 230, 242, 240;
    --topbar-drop-border-color: 216, 236, 234;
    --topbar-drop-border-width: 1px;
    --topbar-drop-shadow-color: 56, 118, 110, 0.22;

    --header-username-color: 232, 244, 242;
    --account-button-text-color: 38, 92, 86;
    --account-button-hover-text-color: 255, 252, 250;
    --account-button-background-color: 255, 253, 252;
    --account-button-hover-background-color: 92, 156, 148;
    --account-drop-text-color: 38, 60, 64;
    --account-drop-hover-text-color: 255, 252, 250;
    --account-drop-background-color: 255, 253, 252;
    --account-drop-hover-background-color: 92, 156, 148;
    --account-drop-border-color: 220, 238, 236;
    --account-drop-border-width: 1px;

    --search-button-text-color: var(--account-button-text-color);
    --search-button-hover-text-color: var(--account-button-hover-text-color);
    --search-button-background-color: var(--account-button-background-color);
    --search-button-hover-background-color: var(--account-button-hover-background-color);

    --body-width: min(48rem, 92vw);
    --body-margin: max(calc((100% - var(--body-width)) / 2), 1rem);
    --content-font-size: clamp(0.9rem, calc(0.85rem + 0.25vw), 1.05rem);

    --page-title-text-color: var(--text-color);
    --page-title-border-color: 232, 244, 242;

    --page-tag-border-color: 232, 244, 242;
    --page-tag-title-color: 38, 92, 86;
    --page-tag-text-color: 38, 92, 86;
    --page-tag-hover-text-color: 255, 252, 250;
    --page-tag-background-color: 232, 244, 242, 0.6;
    --page-tag-hover-background-color: 84, 150, 142;
    --page-tag-title: "标签 ↴";

    --page-option-text-color: var(--general-button-text-color);
    --page-option-hover-text-color: var(--general-hover-button-text-color);
    --page-option-background-color: var(--general-button-background-color);
    --page-option-hover-background-color: var(--general-hover-button-background-color);

    --footer-text-color: 232, 244, 242;
    --footer-background-color: 38, 92, 86;
    --license-background-color: 255, 252, 250;
    --license-text-color: 84, 150, 142;
    --license-link-color: 84, 150, 142;

    --sidebar-width: 18rem;
    --sidebar-width-on-mobile: 16rem;

    --sidebar-handle-text-color: 255, 252, 250;
    --sidebar-handle-background-color: 56, 120, 112;
    --sidebar-background-color: 255, 252, 250;
    --sidebar-media-background-color: 38, 92, 86, 0.06;
    --sidebar-media-icon-color: 56, 120, 112;
    --sidebar-title-background-color: 56, 120, 112, 0.95;
    --sidebar-title-text-color: 255, 252, 250;
    --sidebar-title-shadow-color: 50, 108, 100;
    --sidebar-text-color: 38, 60, 64;
    --sidebar-hover-text-color: 255, 253, 255;
    --sidebar-border-color: 232, 244, 242;
    --sidebar-hover-background-color: 92, 156, 148;

    --action-area-border-color: 232, 244, 242;
    --action-area-subtext-color: 84, 150, 142;
    --action-area-info-background-color: 38, 92, 86;
    --action-area-info-text-color: 255, 252, 250;
    --page-source-background-color: 255, 252, 250;
    --page-source-text-color: 38, 60, 64;

    --edit-area-background-color: 232, 244, 242, 0.4;
    --edit-area-text-color: 38, 60, 64;
    --edit-area-textarea-text-color: 38, 60, 64;
    --edit-area-textarea-background-color: 255, 255, 255;
    --edit-area-textarea-border-color: 84, 150, 142;
    --edit-area-info-background-color: var(--action-area-info-background-color);
    --edit-area-info-text-color: var(--action-area-info-text-color);
    --edit-area-button-background-color: var(--general-button-background-color);
    --edit-area-button-text-color: var(--general-button-text-color);
    --edit-area-hover-button-background-color: var(--general-hover-button-background-color);
    --edit-area-hover-button-text-color: var(--general-hover-button-text-color);

    --hovertip-background-color: 255, 255, 255;
    --hovertip-text-color: 38, 60, 64;
    --hovertip-border-color: 232, 244, 242;

    --imageblock-border-width: 0;
    --imageblock-caption-background-color: 255, 252, 250;
    --imageblock-caption-text-color: 38, 60, 64;
    --imageblock-shadow-color: 38, 92, 86, 0.08;
    --imageblock-border-color: 232, 244, 242;

    --h1-color: var(--text-color);
    --h2-color: var(--text-color);
    --h3-color: var(--text-color);
    --h4-color: var(--text-color);
    --h5-color: var(--text-color);
    --h6-color: var(--text-color);
    --hr-color: 232, 244, 242;

    --tabview-border-width: 0;
    --tabview-border-color: 232, 244, 242;
    --tabview-button-background-color: 232, 244, 242, 0.5;
    --tabview-button-text-color: 38, 92, 86;
    --tabview-hover-button-background-color: 206, 228, 224;
    --tabview-hover-button-text-color: 38, 60, 64;
    --tabview-selected-button-background-color: 38, 92, 86;
    --tabview-selected-button-text-color: 255, 252, 250;
    --tabview-horizon-color: 232, 244, 242;
    --tabview-content-background-color: 255, 255, 255;
    --tabview-content-text-color: 38, 60, 64;

    --table-border-width: 0;
    --table-border-color: 232, 244, 242;
    --table-header-background-color: 38, 92, 86;
    --table-header-text-color: 255, 252, 250;
    --table-background-color: 255, 255, 255;
    --table-text-color: 38, 60, 64;

    --blockquote-border-width: 0;
    --blockquote-background-color: 255, 252, 250;
    --blockquote-text-color: 38, 60, 64;
    --blockquote-shadow-color: 38, 92, 86, 0.06;
    --blockquote-border-color: 232, 244, 242;

    --code-block-background-color: 255, 252, 250;
    --code-block-text-color: 38, 60, 64;
    --code-block-border-color: 232, 244, 242;
    --code-block-default-color: 38, 60, 64;
    --code-block-code-color: var(--code-block-default-color);
    --code-block-brackets-color: var(--code-block-default-color);
    --code-block-comment-color: 128, 140, 152;
    --code-block-quotes-color: 60, 140, 168;
    --code-block-string-color: var(--code-block-quotes-color);
    --code-block-identifier-color: var(--code-block-text-color);
    --code-block-builtin-color: 52, 140, 160;
    --code-block-reserved-color: 80, 140, 160;
    --code-block-inlinedoc-color: 72, 140, 180;
    --code-block-var-color: var(--code-block-comment-color);
    --code-block-url-color: var(--code-block-inlinedoc-color);
    --code-block-special-color: 50, 110, 130;
    --code-block-number-color: 180, 120, 90;
    --code-block-inlinetags-color: 160, 110, 150;
    --code-block-gutter-background-color: 232, 244, 242;
    --code-block-gutter-color: 84, 150, 142;

    --toc-background-color: 255, 252, 250;
    --toc-text-color: 38, 60, 64;
    --toc-border-color: 232, 244, 242;

    --note-background-color: 245, 252, 250;
    --note-text-color: 70, 90, 92;
    --note-border-color: 240, 200, 188;

    --footnote-block-background-color: 232, 244, 242, 0.5;
    --footnote-block-text-color: 38, 60, 64;
    --footnote-block-border-color: 84, 150, 142;

    --rating-background-color: 255, 255, 255;
    --rating-text-color: 38, 60, 64;
    --rating-rateup-color: 92, 168, 142;
    --rating-ratedown-color: 214, 104, 132;
    --rating-cancel-color: 200, 200, 200;
    --rating-rateup-text-color: 255, 255, 255;
    --rating-ratedown-text-color: 255, 255, 255;
    --rating-cancel-text-color: 80, 80, 80;
    --rating-info-color: 38, 92, 86;
    --rating-info-text-color: 255, 252, 250;
    --rating-border-color: 232, 244, 242;

    --popup-tip-content: "（点击空白处关闭窗口）";
    --popup-loading-content: "正在保存页面……";

    --popup-fader-color: 38, 60, 64, 0.5;
    --popup-background-color: 255, 255, 255;
    --popup-text-color: 38, 60, 64;
    --popup-title-background-color: 38, 92, 86;
    --popup-title-text-color: 255, 252, 250;
    --popup-border-color: 232, 244, 242;
    --popup-button-text-color: 255, 252, 250;
    --popup-button-background-color: 176, 148, 214;
    --popup-hover-button-text-color: 255, 252, 250;
    --popup-hover-button-background-color: 38, 92, 86;
    --popup-tip-color: 38, 92, 86;
    --popup-loading-color: 84, 150, 142;

    --lightblock-background-color: 255, 255, 255;
    --lightblock-text-color: 38, 60, 64;
    --darkblock-background-color: 38, 92, 86;
    --darkblock-text-color: 255, 252, 250;
    --styled-quote-background-color: 255, 252, 250;
    --styled-quote-text-color: 38, 60, 64;
    --styled-quote-border-color: 84, 150, 142;
    --dark-styled-quote-background-color: 38, 92, 86;
    --dark-styled-quote-text-color: 255, 252, 250;
    --dark-styled-quote-border-color: 232, 244, 242;

    --white-monochrome: var(--background-color);
    --pale-gray-monochrome: var(--light-color-2);
    --light-pale-gray-monochrome: 255, 252, 250;
    --very-light-gray-monochrome: 232, 244, 242;
    --light-gray-monochrome: var(--dark-color-1);
    --gray-monochrome: var(--dark-color-3);
    --dark-gray-monochrome: var(--dark-color-4);
    --black-monochrome: var(--text-color);
    --pale-accent: var(--dark-color-2);
    --bright-accent: var(--dark-color-3);
    --medium-accent: var(--dark-color-3);
    --dark-accent: var(--dark-color-4);
    --alt-accent: 214, 128, 100;
    --background-gradient-color: var(--very-light-gray-monochrome);
    --swatch-background: var(--white-monochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--dark-accent);
    --swatch-text-dark: var(--black-monochrome);
    --swatch-text-light: var(--white-monochrome);
    --swatch-text-general: var(--swatch-text-dark);
    --swatch-important-text: var(--bright-accent);
    --swatch-menubg-color: var(--white-monochrome);
    --swatch-menubg-light-color: var(--pale-gray-monochrome);
    --swatch-menubg-medium-color: var(--light-gray-monochrome);
    --swatch-menubg-medium-dark-color: var(--gray-monochrome);
    --swatch-menubg-dark-color: var(--dark-gray-monochrome);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--black-monochrome);
    --swatch-menutxt-dark-color: var(--black-monochrome);
    --swatch-menutxt-light-color: var(--white-monochrome);
    --swatch-menutxt-general-color: var(--swatch-menutxt-dark-color);
    --swatch-border-color: var(--black-monochrome);
    --swatch-secondary-color: var(--swatch-menubg-light-color);
    --swatch-tertiary-color: var(--swatch-menubg-medium-color);
    --swatch-text-secondary-color: var(--swatch-menutxt-light-color);
    --swatch-text-tertiary-color: var(--swatch-menutxt-dark-color);
    --swatch-headerh1-color: var(--swatch-text-light);
    --swatch-headerh2-color: var(--swatch-text-light);
    --swatch-topmenu-border-color: var(--medium-accent);
    --swatch-topmenu-bg-color: var(--swatch-menubg-medium-dark-color);
}

/* Global */

body, html {
    line-height: 1.65;
    font-family: var(--body-font);
    -webkit-hyphens: manual;
            hyphens: manual;
    background: rgba(var(--background-color));
    color: rgba(var(--text-color));
    font-size: 1rem;
    scrollbar-color: rgba(var(--scrollbar-color)) rgba(var(--scrollbar-background-color));
    scrollbar-width: auto;
    min-width: 240px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::-moz-selection { background: rgba(var(--selected-background-color)); color: rgba(var(--selected-text-color)); }
::selection { background: rgba(var(--selected-background-color)); color: rgba(var(--selected-text-color)); }

a {
    color: rgba(var(--link-color));
    transition: color 0.2s var(--ease);
    text-decoration: none;
}

a:visited { color: rgba(var(--visited-link-color)); }

a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--hover-link-color));
    background: transparent;
    -webkit-text-decoration: underline 0.1em;
            text-decoration: underline 0.1em;
}

a.newpage { color: rgba(var(--newpage-color)); text-decoration: none; }

table { border-spacing: 0; }

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    font-family: var(--title-font);
    margin: 0.5em 0 0.35em;
    letter-spacing: -0.025em;
    line-height: 1.3;
}

h1 { font-size: 2em; color: rgba(var(--h1-color)); }
h2 { font-size: 1.65em; color: rgba(var(--h2-color)); }
h3 { font-size: 1.35em; color: rgba(var(--h3-color)); }
h4 { font-size: 1.15em; color: rgba(var(--h4-color)); }
h5 { font-size: 1em; color: rgba(var(--h5-color)); }
h6 { font-size: 0.9em; color: rgba(var(--h6-color)); }

input, textarea, select, button, meter, progress, code, tt, .code, pre, .pre {
    font-family: var(--mono-font);
}

tt { font-size: 100%; }

img, embed, video, object, iframe, table { max-width: 100%; }

.button, .btn { font-family: var(--body-font); }

#container { min-height: 100vh; }

/* Header */

#header {
    width: 100%;
    min-height: var(--header-height);
    height: auto;
    background: rgba(var(--header-background-top));
    color: rgba(var(--header-text-color));
    display: grid;
    grid-template-areas: "h1" "subtitle" "topbar";
    grid-template-rows: var(--main-header-height) auto var(--topbar-height);
    z-index: 12;
    position: relative;
    top: 0;
    left: 0;
    box-shadow: var(--shadow-md);
}

#header p { margin: 0; }

#header::before {
    content: "";
    position: absolute;
    inset: -16px;
    z-index: 0;
    background: var(--header-background-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: blur(12px) saturate(1.08);
    clip-path: inset(16px);
}

#header::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(var(--header-bg-overlay)));
}

#header > * { position: relative; z-index: 1; }

#header h1 {
    grid-area: h1;
    position: relative;
    z-index: 1;
    margin: 0;
    box-sizing: border-box;
    padding: 0 var(--header-margin);
}

#header h1 a {
    font-size: 0;
    width: 100%;
    height: 100%;
    display: block;
    text-decoration: none;
}

#header h1 a span {
    padding: 0.75rem 0 0.35rem;
    width: 100%;
    height: 100%;
    font-size: 0;
    font-weight: 700;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-direction: column;
    gap: 0.45em;
    color: rgba(var(--header-text-color));
    font-family: var(--header-font);
    text-shadow: 1px 1px 3px rgba(var(--header-text-shadow-color)), 0 0 12px rgba(var(--header-text-shadow-color), 0.5);
    box-sizing: border-box;
    line-height: 1.25;
    text-align: center;
}

#header h1 a span::before {
    content: "";
    display: block;
    width: clamp(8rem, 15vw, 12rem);
    height: clamp(8rem, 15vw, 12rem);
    flex: none;
    background: var(--logo-image) center / contain no-repeat;
    filter:
        drop-shadow(0 0 0.9rem rgba(255, 255, 255, 0.55))
        drop-shadow(0 0.45rem 1.1rem rgba(var(--header-text-shadow-color), 0.45));
}

#header h1 a span::after {
    content: none;
    display: none;
}

#header h2 {
    grid-area: subtitle;
    align-self: start;
    justify-self: center;
    display: block;
    position: relative;
    z-index: 1;
    margin: 0.15rem 0 0.85rem 0;
    padding: 0 var(--header-margin);
    font-family: var(--header-font);
    font-size: var(--header-subtitle-font-size);
    font-weight: 500;
    letter-spacing: 0.12em;
    color: rgba(var(--header-text-color));
    text-shadow: 1px 1px 3px rgba(var(--header-text-shadow-color)), 0 0 12px rgba(var(--header-text-shadow-color), 0.5);
    text-align: center;
}

#header h2 span {
    display: block;
    font-size: 0;
    line-height: 1.4;
}

#header h2 span::before {
    content: var(--header-subtitle);
    font-size: var(--header-subtitle-font-size);
    display: block;
}

/* Top Bar — 悬浮浅色胶囊（绝对定位） */

#top-bar {
    grid-area: topbar;
    position: relative;
    padding: 0;
    background: transparent;
    height: 100%;
    box-sizing: border-box;
    right: 0;
    z-index: 14;
}

#top-bar ul, #top-bar li { display: block; }

/* 顶栏胶囊 */

#top-bar .top-bar,
#top-bar .mobile-top-bar {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0;
    width: calc(100% - 2 * var(--topbar-inset));
    max-width: var(--topbar-max-width);
    height: var(--topbar-height);
    background: rgba(var(--topbar-bg));
    border: 1px solid rgba(196, 224, 220, 0.55);
    border-radius: var(--radius-pill);
    box-shadow: 0 6px 22px rgba(56, 118, 110, 0.18), 0 2px 6px rgba(56, 118, 110, 0.12);
    padding: 0 0.4rem;
    box-sizing: border-box;
    margin: 0;
    display: flex;
    align-items: center;
    z-index: 14;
}

#top-bar .mobile-top-bar { display: none; }

#top-bar div[class*=top-bar] > ul {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 0.15rem;
    margin: 0;
    padding: 0;
}

#top-bar div[class*=top-bar] > ul > li {
    height: calc(100% - 0.6rem);
    flex: 2 2 auto;
    margin: 0;
    position: relative;
    border-radius: var(--radius-pill);
    transition: background 0.2s var(--ease);
    display: flex;
    align-items: center;
}

#top-bar div[class*=top-bar] > ul > li:is(:hover, .sfhover) {
    background: rgba(var(--topbar-hover-bg));
}

#top-bar div[class*=top-bar] > ul > li > a {
    height: 100%;
    width: 100%;
    padding: 0 0.9rem;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    font-size: var(--topbar-font-size);
    font-weight: 600;
    letter-spacing: 0.01em;
    color: rgba(var(--topbar-text-color));
    background: transparent;
    box-shadow: none;
    border-radius: var(--radius-pill);
    transition: color 0.2s var(--ease), background 0.2s var(--ease);
}

#top-bar div[class*=top-bar] > ul > li:is(:hover, .sfhover) > a {
    color: rgba(var(--topbar-hover-text-color));
    box-shadow: none;
}

#top-bar div[class*=top-bar] > ul > li > ul {
    box-sizing: border-box;
    border: 1px solid rgba(var(--topbar-drop-border-color));
    border-radius: var(--radius-md);
    background: rgba(var(--topbar-drop-background-color));
    display: flex;
    flex-direction: column;
    min-width: 100%;
    width: auto;
    -webkit-backdrop-filter: blur(var(--general-blur));
            backdrop-filter: blur(var(--general-blur));
    box-shadow: var(--shadow-xl);
    position: absolute;
    left: 0;
    top: calc(100% + 0.6rem);
    padding: 0.4rem;
    grid-gap: 0.15rem;
    pointer-events: none;
    opacity: 0;
    visibility: visible;
    transform-origin: top center;
    transform: translateY(-0.5rem) scaleY(0.9);
    clip-path: inset(0 0 100% 0 round var(--radius-md));
    transition: opacity 0.18s var(--ease), transform 0.26s var(--ease), clip-path 0.26s var(--ease);
    z-index: 15;
}

#top-bar div[class*=top-bar] > ul > li:last-of-type > ul { right: 0; left: auto; }

#top-bar div[class*=top-bar] > ul > li:is(:hover, .sfhover) > ul,
#top-bar div[class*=top-bar] > ul > li > ul > li:is(:hover, .sfhover) > ul {
    pointer-events: auto;
    opacity: 1;
    transform: none;
    clip-path: inset(0 0 0 0 round var(--radius-md));
}

#top-bar div[class*=top-bar] > ul > li > ul > li,
#top-bar div[class*=top-bar] > ul > li > ul > li > ul > li {
    width: 100%;
    box-sizing: border-box;
    border: none;
    border-radius: var(--radius-sm);
    height: 2.1rem;
    position: relative;
    overflow: hidden;
}

#top-bar div[class*=top-bar] > ul > li > ul > li > a,
#top-bar div[class*=top-bar] > ul > li > ul > li > ul > li > a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    background: transparent;
    color: rgba(var(--topbar-drop-text-color));
    padding: 0 1em;
    transition: background 0.2s var(--ease);
    font-size: 0.8rem;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center;
    border-radius: var(--radius-sm);
}

#top-bar div[class*=top-bar] > ul > li > ul > li > a:is(:hover, :active, :focus, :focus-within),
#top-bar div[class*=top-bar] > ul > li > ul > li > ul > li > a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--topbar-drop-hover-text-color));
    background: rgba(var(--topbar-drop-hover-background-color));
}

#top-bar div[class*=top-bar] > ul > li > ul > li > ul {
    box-sizing: border-box;
    border: 1px solid rgba(var(--topbar-drop-border-color));
    border-radius: var(--radius-md);
    background: rgba(var(--topbar-drop-background-color));
    display: flex;
    flex-direction: column;
    min-width: 100%;
    width: auto;
    -webkit-backdrop-filter: blur(var(--general-blur));
            backdrop-filter: blur(var(--general-blur));
    box-shadow: var(--shadow-xl);
    left: calc(100% + 0.4rem);
    top: -0.4rem;
    padding: 0.4rem;
    grid-gap: 0.15rem;
    pointer-events: none;
    opacity: 0;
    visibility: visible;
    transform-origin: left center;
    transform: translateX(-0.5rem) scaleX(0.92);
    clip-path: inset(0 100% 0 0 round var(--radius-md));
    transition: opacity 0.18s var(--ease), transform 0.26s var(--ease), clip-path 0.26s var(--ease);
    position: absolute;
    z-index: 16;
}

#top-bar .mobile-top-bar .open-menu { width: var(--topbar-height-on-mobile); height: 100%; }
#top-bar .mobile-top-bar .open-menu p { display: contents; }

#top-bar .mobile-top-bar .open-menu a {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 0;
    border-radius: var(--radius-pill);
    transition: background 0.2s var(--ease);
    background: transparent;
}

#top-bar .mobile-top-bar .open-menu a::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(var(--topbar-text-color));
    -webkit-mask-image: var(--side-bar-button-mask);
            mask-image: var(--side-bar-button-mask);
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: 100%;
            mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
}

#top-bar .mobile-top-bar .open-menu a:is(:hover, :active, :focus, :focus-within) {
    background: rgba(var(--topbar-hover-background-color));
}

/* User Info */

#login-status {
    position: absolute;
    top: 0.75rem;
    right: calc(var(--header-margin) + 0.6rem);
    font-size: 0.9rem;
    font-weight: 500;
    z-index: 13;
    color: rgba(var(--header-text-color));
    text-shadow: 1px 1px 3px rgba(var(--header-text-shadow-color)), 0 0 10px rgba(var(--header-text-shadow-color), 0.45);
}

#login-status .printuser {
    display: inline-flex;
    align-items: baseline;
    gap: 0.3rem;
    color: rgba(var(--header-username-color));
}

#login-status .printuser > a:first-child { margin: 0; }

#login-status .printuser > a:first-child img {
    height: 1rem;
    width: 1rem;
    padding: 0 0 0 0.5rem;
    vertical-align: -0.2rem;
    background-size: auto;
}

#login-status a { color: rgba(var(--header-text-color)); }

a#account-topbutton {
    font-size: 85%;
    padding: 0.25em 0.7em;
    border-radius: var(--radius-pill);
    background: rgba(var(--account-button-background-color));
    color: rgba(var(--account-button-text-color));
    border: none;
    font-weight: 600;
    text-shadow: none;
    transition: all 0.2s var(--ease);
}

#account-topbutton:is(:hover, :active, :focus, :focus-within) {
    background: rgba(var(--account-button-hover-background-color));
    color: rgba(var(--account-button-hover-text-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

#account-options {
    display: block !important;
    position: absolute;
    right: 0;
    top: calc(100% + 0.35rem);
    opacity: 0;
    pointer-events: none;
    width: 7em;
    padding: 0.35rem;
    border: 1px solid rgba(var(--account-drop-border-color));
    border-radius: var(--radius-md);
    background: rgba(var(--account-drop-background-color));
    box-shadow: var(--shadow-lg);
    text-shadow: none;
    z-index: 15;
    transform-origin: top right;
    transform: translateY(-0.45rem) scaleY(0.9);
    clip-path: inset(0 0 100% 0 round var(--radius-md));
    transition: opacity 0.18s var(--ease), transform 0.26s var(--ease), clip-path 0.26s var(--ease);
}

#account-options ul, #account-options li { display: contents; }

#account-options li a {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: transparent;
    border-radius: var(--radius-xs);
    padding: 0.35em 0;
    transition: all 0.2s var(--ease);
    color: rgba(var(--account-drop-text-color));
    text-decoration: none;
    font-size: 0.85rem;
}

#account-options li a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--account-drop-hover-text-color));
    background: rgba(var(--account-drop-hover-background-color));
}

#login-status:is(:hover, :focus-within) #account-options {
    opacity: 1;
    pointer-events: all;
    transform: none;
    clip-path: inset(0 0 0 0 round var(--radius-md));
}

/* Search */

#search-top-box {
    position: absolute;
    z-index: 13;
    right: calc(var(--header-margin) + 0.6rem);
    top: 2.85rem;
}

#search-top-box-input { display: none; }

#search-top-box-form .button {
    margin: 0;
    font-size: 0.9rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.3em 0.8em;
    font-weight: 600;
    color: rgba(var(--search-button-text-color));
    background: rgba(var(--search-button-background-color));
    border-radius: var(--radius-pill);
    transition: all 0.2s var(--ease);
    cursor: pointer;
    border: none;
    font-family: var(--body-font);
    height: -moz-fit-content;
    height: fit-content;
    line-height: 1.5;
}

#search-top-box-form .button:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--search-button-hover-text-color));
    background: rgba(var(--search-button-hover-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

/* Main Content */

#main-content {
    margin: clamp(2rem, 5vw, 3.5rem) var(--body-margin);
    padding: clamp(1.25rem, 3vw, 2.5rem);
    overflow-wrap: break-word;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

#page-title, .meta-title {
    color: rgba(var(--page-title-text-color));
    border-bottom: none;
    font-weight: 700;
    padding: 0 0 0.75rem;
    margin: 0;
    font-size: clamp(1.7rem, 4.2vw, 2.4rem);
    font-family: var(--title-font);
    letter-spacing: -0.035em;
    position: relative;
}

#page-title::after, .meta-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 3rem;
    height: 0.25rem;
    border-radius: var(--radius-pill);
    background: rgba(var(--link-color));
}

.meta-title { margin: 1rem 0; }
.meta-title p { display: contents; }

#breadcrumbs { margin: 0; padding: 0.5rem 0; font-size: 0.85rem; color: rgba(var(--dark-color-3)); }

#page-content {
    min-height: calc(100vh - var(--header-height));
    margin: 1.75rem 0;
    padding: 0;
    font-size: var(--content-font-size);
}

/* Tags */

.page-tags {
    margin: 2rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    font-size: var(--content-font-size);
}

.page-tags::before {
    content: var(--page-tag-title);
    font-weight: 700;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(var(--page-tag-border-color));
    color: rgba(var(--page-tag-title-color));
    padding: 0.4em 0.8em;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    width: -moz-fit-content;
    width: fit-content;
}

.page-tags span {
    border-top: none;
    padding: 0.6rem 0.25rem 0.25rem;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    grid-gap: 0.4rem;
}

.page-tags span a {
    background: rgba(var(--page-tag-background-color));
    color: rgba(var(--page-tag-text-color));
    border-radius: var(--radius-pill);
    padding: 0.25rem 0.75rem;
    margin: 0;
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: none;
    box-shadow: var(--shadow-xs);
    transition: all 0.2s var(--ease);
}

.page-tags span a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--page-tag-hover-text-color));
    background: rgba(var(--page-tag-hover-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

#main-content .page-tags [href^="/system:page-tags/tag/_"] { display: none; }

/* Buttons */

#page-options-container { margin-top: 0.5rem; padding-bottom: 1rem; }

#page-info {
    margin: 0;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(var(--dark-color-3));
}

.page-watch-options { font-size: 0.85rem; padding-bottom: 0.25rem; }

div[id*=page-options-bottom] {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 0.4rem;
    margin: 0.5rem 0 0;
    padding: 0;
}

div[id*=page-options-bottom] > a {
    flex: 2 0 auto;
    color: rgba(var(--page-option-text-color));
    background: rgba(var(--page-option-background-color));
    border-radius: var(--radius-md);
    transition: all 0.2s var(--ease);
    display: flex;
    line-height: 1;
    justify-content: center;
    align-items: center;
    height: 2.25rem;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    padding: 0 0.75rem;
    margin: 0;
    box-shadow: var(--shadow-xs);
}

div[id*=page-options-bottom] > a:is(:hover, :active) {
    color: rgba(var(--page-option-hover-text-color));
    background: rgba(var(--page-option-hover-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

/* Footer */

#footer {
    display: flex !important;
    flex-wrap: wrap;
    color: rgba(var(--footer-text-color));
    background: rgba(var(--footer-background-color));
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0.5rem 0;
    font-size: 0.8rem;
    position: relative;
    z-index: 8;
}

#footer .options { font-size: 100%; padding: 0; margin-right: 0.2rem; }
#footer .options::after { content: " | "; }
#footer a { color: rgba(var(--footer-text-color)); white-space: nowrap; }
#footer > a { margin-left: 0.2em; }

#license-area {
    padding: 0.6em 0;
    background: rgba(var(--license-background-color));
    color: rgba(var(--license-text-color));
    font-weight: 500;
    position: relative;
    z-index: 8;
}

#license-area a { color: rgba(var(--license-link-color)); }

/* Side Bar */

#side-bar {
    width: var(--sidebar-width);
    height: 100vh;
    position: fixed;
    top: 0;
    left: calc(-1 * var(--sidebar-width));
    margin: 0;
    padding: 0.5rem;
    transition: left 0.3s var(--ease);
    max-height: 100vh;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: 20;
    direction: rtl;
    background: rgba(var(--sidebar-background-color));
    scrollbar-width: thin;
    border-right: none;
    box-sizing: border-box;
    box-shadow: var(--shadow-xl);
}

#side-bar:is(:hover, :focus-within) { left: 0; }

#side-bar::before {
    content: "";
    display: block;
    position: fixed;
    left: 0;
    height: 100vh;
    top: 0;
    width: 1rem;
    background: transparent;
    z-index: -1;
}

#side-bar::after {
    content: "◀";
    position: fixed;
    left: 0;
    height: 8rem;
    top: calc(50vh - 4rem);
    width: 1rem;
    color: rgba(var(--sidebar-handle-text-color));
    background: rgba(var(--sidebar-handle-background-color));
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    z-index: -1;
    opacity: 1;
    transition: opacity 0.2s var(--ease), left 0.4s var(--ease);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0.6rem;
    box-shadow: var(--shadow-md);
}

#side-bar:is(:hover, :focus-within)::after {
    left: calc(-1 * var(--sidebar-width));
    opacity: 0;
}

#side-bar > * { position: relative; z-index: 1; }
#side-bar p { display: contents; }

#side-bar .side-block {
    display: flex;
    flex-direction: column;
    margin: 0.5rem 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-xs);
}

#side-bar .side-block.media {
    background: rgba(var(--sidebar-media-background-color));
    padding: 0.5rem;
}

#side-bar .side-block.media > div { display: flex; justify-content: space-evenly; }
#side-bar .side-block.media a { overflow: hidden; }

#side-bar .side-block.media a img {
    position: relative;
    transform: translateX(-20rem);
    filter: drop-shadow(rgba(var(--sidebar-media-icon-color)) 20rem 0);
}

#side-bar .heading,
#side-bar .collapsible-block-unfolded-link a,
#side-bar .collapsible-block-folded a {
    background: rgba(var(--sidebar-title-background-color));
    color: rgba(var(--sidebar-title-text-color));
    height: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-shadow: none;
    font-weight: 700;
    border-bottom: none;
    direction: ltr;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}

#side-bar .collapsible-block-unfolded-link,
#side-bar .collapsible-block-folded { margin: 0; }

#side-bar .collapsible-block-folded a::before { content: "▸ "; }
#side-bar .collapsible-block-unfolded-link a::before,
#side-bar .collapsible-block-unfolded-link a::after { content: "▾ "; }

#side-bar .menu-item {
    font-size: 0;
    display: flex;
    border-bottom: none;
    direction: ltr;
}

#side-bar .menu-item a {
    display: block;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    font-size: 0.875rem;
    text-decoration: none;
    color: rgba(var(--sidebar-text-color));
    transition: color 0.25s var(--ease), padding-left 0.25s var(--ease);
    padding: 0.5rem 0.75rem;
    border-left: none;
    background: transparent;
    flex-grow: 2;
    font-weight: 500;
}

#side-bar .menu-item a::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: rgba(var(--sidebar-hover-background-color));
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.3s var(--ease);
}

#side-bar .menu-item a:is(:hover, :active, :focus, :focus-within) {
    background: transparent;
    color: rgba(var(--sidebar-hover-text-color));
    padding-left: 1rem;
}

#side-bar .menu-item a:is(:hover, :active, :focus, :focus-within)::before {
    transform: scaleX(1);
}

#side-bar .close-menu {
    position: fixed;
    top: 0;
    right: 0;
    display: block;
    height: 100vh;
    width: 100%;
    transition: opacity 0.3s var(--ease), width 0.3s var(--ease);
    z-index: -1;
    pointer-events: none;
    background: rgba(var(--popup-fader-color));
    opacity: 0;
    -webkit-backdrop-filter: blur(var(--general-blur));
            backdrop-filter: blur(var(--general-blur));
}

#side-bar .close-menu img { display: none; }

/* Action Area */

#action-area {
    position: relative;
    padding: 0.01px 0;
    margin: 1rem 0;
}

#action-area > h1 { line-height: 1; margin-top: 0; }

#file-upload-form table.form,
#rename-option-rename table.form,
form[onsubmit*=setParent] > table.form,
form[onsubmit*=PageTagsModule] > table.form {
    margin: 0;
    display: flex;
    flex-direction: column;
}

table.form tbody, table.form tr { display: contents; }
table.form td { display: block; padding: 0; }

table.form td:first-child {
    font-size: 0.8rem;
    padding-bottom: 0.3em;
    font-weight: 600;
    color: rgba(var(--dark-color-3));
    letter-spacing: 0.02em;
}

table.form td input {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid rgba(var(--edit-area-textarea-border-color), 0.25);
    border-radius: var(--radius-sm);
    background: rgba(var(--edit-area-textarea-background-color));
    color: rgba(var(--edit-area-textarea-text-color));
    padding: 0.5em 0.75em;
    margin: 0;
    outline: none;
    transition: all 0.2s var(--ease);
    font-weight: 500;
}

table.form td input:focus-visible {
    border-color: rgba(var(--edit-area-textarea-border-color));
    box-shadow: 0 0 0 3px rgba(var(--edit-area-textarea-border-color), 0.15);
}

table.form td div.sub {
    text-align: right;
    color: rgba(var(--action-area-subtext-color));
    font-weight: 500;
    font-size: 0.8rem;
}

div.buttons { margin: 1rem 0; padding: 0; display: flex; grid-gap: 0.75rem; }

a.action-area-close, #view-diff-div > p > a {
    position: absolute;
    top: 0;
    right: 0;
    height: 2.25rem;
    width: 2.25rem;
    border-radius: var(--radius-sm);
    background: rgba(var(--general-button-background-color));
    color: rgba(var(--general-button-text-color));
    transition: all 0.2s var(--ease);
    text-decoration: none;
    font-size: 0;
    margin: 0;
    border: none;
    box-shadow: var(--shadow-xs);
}

a.action-area-close::before, #view-diff-div > p > a::before {
    content: "✕";
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

a.action-area-close:is(:hover, :active, :focus, :focus-within),
#view-diff-div > p > a:is(:hover, :active, :focus, :focus-within) {
    background: rgba(var(--general-hover-button-background-color));
    color: rgba(var(--general-hover-button-text-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

/* Edit Page Form */

#edit-page-form {
    background-color: rgba(var(--edit-area-background-color));
    color: rgba(var(--edit-area-text-color));
    padding: 1.25rem;
    border-radius: var(--radius-lg);
}

#edit-page-form .form { margin: 0 !important; width: 100%; }
#edit-page-form .form td:last-child { padding: 0; }

#edit-page-title {
    border: 1px solid rgba(var(--edit-area-textarea-border-color), 0.25);
    border-radius: var(--radius-sm);
    color: rgba(var(--edit-area-textarea-text-color));
    background: rgba(var(--edit-area-textarea-background-color));
    margin: 0;
    padding: 0.5em 0.75em;
    width: 100%;
    box-sizing: border-box;
    outline: none;
    transition: all 0.2s var(--ease);
    font-weight: 700;
    font-size: 1.05rem;
}

#edit-page-textarea {
    color: rgba(var(--edit-area-textarea-text-color));
    background: rgba(var(--edit-area-textarea-background-color));
    border: 1px solid rgba(var(--edit-area-textarea-border-color), 0.25);
    border-radius: var(--radius-md);
    padding: 0.75rem;
    font-size: 0.95rem;
    outline: none;
    box-sizing: border-box;
    transition: all 0.2s var(--ease);
}

.change-textarea-size { margin: 1rem 0; padding: 0; display: flex; }

.change-textarea-size a {
    color: rgba(var(--edit-area-button-text-color));
    background: rgba(var(--edit-area-button-background-color));
    border: none;
    border-radius: var(--radius-sm);
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.75rem;
    height: 1.75rem;
    font-size: 1rem;
    margin-left: 0.5rem;
    text-decoration: none;
    transition: all 0.2s var(--ease);
    box-shadow: var(--shadow-xs);
}

.edit-help-34 { margin: 1rem 0; font-size: 0; }

.edit-help-34 a {
    color: rgba(var(--edit-area-button-text-color));
    background: rgba(var(--edit-area-button-background-color));
    height: 1.75rem;
    padding: 0 0.85em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-right: 0.5rem;
    font-size: 0.8rem;
    font-weight: 500;
    border-radius: var(--radius-pill);
    text-decoration: none;
    transition: all 0.2s var(--ease);
    box-shadow: var(--shadow-xs);
}

.edit-help-34 a:is(:hover, :active, :focus, :focus-within),
.change-textarea-size a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--edit-area-hover-button-text-color));
    background: rgba(var(--edit-area-hover-button-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.edit-page-bottomtable {
    margin: 1rem 0;
    padding: 0;
    display: flex;
    grid-gap: 1rem;
    flex-wrap: wrap;
}

.edit-page-bottomtable tbody, .edit-page-bottomtable tr { display: contents; }

.edit-page-bottomtable td {
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    font-size: 0.8rem;
    font-weight: 500;
    flex-basis: calc((var(--body-width) - 2rem) / 3);
    flex-grow: 1;
}

#edit-page-comments {
    color: rgba(var(--edit-area-textarea-text-color));
    background: rgba(var(--edit-area-textarea-background-color));
    border: 1px solid rgba(var(--edit-area-textarea-border-color), 0.25);
    border-radius: var(--radius-md);
    font-size: 0.95rem;
    outline: none;
    width: 100% !important;
    box-sizing: border-box;
    min-height: 5rem;
    transition: all 0.2s var(--ease);
    padding: 0.75rem;
}

.edit-page-bottomtable td .sub {
    text-align: right;
    color: rgba(var(--action-area-subtext-color));
}

#edit-page-title:focus-visible,
#edit-page-textarea:focus-visible,
#edit-page-comments:focus-visible {
    border-color: rgba(var(--edit-area-textarea-border-color));
    box-shadow: 0 0 0 3px rgba(var(--edit-area-textarea-border-color), 0.15);
}

#lock-info {
    color: rgba(var(--edit-area-info-text-color));
    background: rgba(var(--edit-area-info-background-color));
    margin: 0;
    padding: 2em 1em;
    border-radius: var(--radius-md);
    width: 100%;
    border: none;
    box-sizing: border-box;
}

#edit-page-form div.buttons {
    margin: 1rem 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 0.5rem;
}

div.buttons input, input.button, button, file, a.button {
    margin: 0;
    padding: 0 1em;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    color: rgba(var(--general-button-text-color));
    background: rgba(var(--general-button-background-color));
    border-radius: var(--radius-md);
    flex-basis: 6.5em;
    flex-grow: 1;
    height: 2.25rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s var(--ease);
    line-height: 1;
    text-decoration: none;
    box-shadow: var(--shadow-xs);
}

div.buttons input:is(:hover, :active, :focus, :focus-within),
input.button:is(:hover, :active, :focus, :focus-within),
button:is(:hover, :active, :focus, :focus-within),
file:is(:hover, :active, :focus, :focus-within),
a.button:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--general-hover-button-text-color));
    background: rgba(var(--general-hover-button-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

#edit-page-form div.buttons input {
    color: rgba(var(--edit-area-button-text-color));
    background: rgba(var(--edit-area-button-background-color));
}

#edit-page-form div.buttons input:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--edit-area-hover-button-text-color));
    background: rgba(var(--edit-area-hover-button-background-color));
}

#wd-editor-toolbar-panel {
    margin: 1rem 0;
    display: flex;
    flex-direction: column;
    grid-gap: 0.5rem;
}

#wd-editor-toolbar-panel div {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 0.4rem;
    width: 100%;
    justify-content: center;
    height: auto;
}

#wd-editor-toolbar-panel div > ul { display: contents; }

#wd-editor-toolbar-panel div > ul li { display: block; width: 2rem; height: 2rem; }
#wd-editor-toolbar-panel div > ul > li.hseparator { display: none; }

.wd-editor-toolbar-panel ul li:hover ul {
    border: 1px solid rgba(var(--edit-area-hover-button-background-color));
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
}

#wd-editor-toolbar-panel a {
    width: 100%;
    height: 100%;
    border-radius: var(--radius-sm);
    background: rgba(var(--edit-area-button-background-color));
    transition: all 0.2s var(--ease);
}

#wd-editor-toolbar-panel a:is(:hover, :active, :focus, :focus-within) {
    background: rgba(var(--edit-area-hover-button-background-color));
}

#wd-editor-toolbar-panel a::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    -webkit-mask-image: var(--edit-area-toolbar-icon-mask);
            mask-image: var(--edit-area-toolbar-icon-mask);
    background: rgba(var(--edit-area-button-text-color));
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: 75%;
            mask-size: 75%;
}

#wd-editor-toolbar-panel a:is(:hover, :active, :focus, :focus-within)::before {
    background: rgba(var(--edit-area-hover-button-text-color));
}

#view-diff-div { margin-top: 2rem; position: relative; }
#view-diff-div > p { display: contents; }
#view-diff-div > h1 { margin-top: 0; }

.preview-message {
    position: fixed;
    top: 1rem;
    right: 1rem;
    background: rgba(var(--warning-color));
    color: rgba(var(--warning-text-color));
    padding: 1em 1.25em;
    font-size: 0.9rem;
    border: none;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    z-index: 25;
    opacity: 1;
}

.preview-message a {
    font-weight: 700;
    color: rgba(var(--warning-text-color));
}

/* Who Rates? */

#who-rated-page-area > div {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--body-width) / 4 - 2rem), 1fr) 1.25rem);
    font-size: 0.85rem;
    overflow: hidden;
}

#who-rated-page-area br { display: none; }

#who-rated-page-area .printuser {
    border-bottom: rgba(var(--action-area-border-color)) solid 1px;
    padding: 0.4rem 0.25rem;
}

#who-rated-page-area span[style*=color] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-weight: 700;
    color: rgba(var(--text-color)) !important;
    font-size: 1.25em;
    line-height: 1;
    border-bottom: rgba(var(--action-area-border-color)) solid 1px;
}

/* Files */

#file-upload-form table.form tr:first-child {
    display: flex;
    grid-gap: 0.5rem;
    width: 100%;
    margin-bottom: 1rem;
}

#file-upload-form table.form tr:first-child td { flex: auto; }

#file-upload-form table.form tr:first-child td:first-child {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex: none;
}

#file-upload-form table.form tr:first-child td:first-child::after { content: ":"; }

#upload-userfile[type=file] {
    cursor: pointer;
    box-shadow: none;
    transition: all 0.2s var(--ease);
}

#upload-userfile[type=file]:is(:hover, :active, :focus, :focus-within) {
    box-shadow: 0 0 0 3px rgba(var(--edit-area-textarea-border-color), 0.15);
}

#upload-userfile[type=file]::file-selector-button {
    margin: -0.2em 0.5em -0.2em -0.5em;
    padding: 0.45em 0.85em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: none;
    border-radius: var(--radius-sm);
    color: rgba(var(--general-button-text-color));
    background: rgba(var(--general-button-background-color));
    min-width: 5em;
    cursor: pointer;
    transition: all 0.2s var(--ease);
    font-weight: 600;
    line-height: normal;
}

#upload-userfile[type=file]::file-selector-button:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--general-hover-button-text-color));
    background: rgba(var(--general-hover-button-background-color));
}

#file-comments {
    color: rgba(var(--edit-area-textarea-text-color));
    background: rgba(var(--edit-area-textarea-background-color));
    border: 1px solid rgba(var(--edit-area-textarea-border-color), 0.25);
    border-radius: var(--radius-md);
    font-size: 0.95rem;
    outline: none;
    width: 100% !important;
    box-sizing: border-box;
    min-height: 5rem;
    transition: all 0.2s var(--ease);
    padding: 0.75rem;
}

#file-comments:focus-visible {
    border-color: rgba(var(--edit-area-textarea-border-color));
    box-shadow: 0 0 0 3px rgba(var(--edit-area-textarea-border-color), 0.15);
}

/* History */

#history-form-1 table.form { margin: 0; width: 100%; }

#history-form-1 table.form tr:first-child td:last-child {
    display: grid;
    grid-template-columns: repeat(auto-fill, 1rem minmax(10em, 1fr));
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

#history-form-1 table.form tr:first-child td:last-child br { display: none; }
#history-form-1 table.form tr:last-child { display: flex; align-items: baseline; }
#history-form-1 table.form tr:last-child td:first-child { margin-right: 1ex; }

#revision-list { margin-top: 3rem; }
#revision-list .pager { margin: 0; }

.pager {
    position: relative;
    width: 100%;
    padding-top: 1.5rem;
    display: flex;
    border-bottom: 2px solid rgba(var(--general-hover-button-background-color));
    flex-wrap: wrap;
}

.pager-no {
    position: absolute;
    padding: 0;
    font-weight: 700;
    font-size: 0.8rem;
    top: 0;
    left: 0;
}

.pager .target { display: contents; }

.pager a, .pager .current, .pager .dots {
    display: flex;
    flex: auto;
    border: none;
    margin: 0.15rem;
    padding: 0.35em 0.5em;
    text-decoration: none;
    color: rgba(var(--text-color));
    background: transparent;
    border-radius: var(--radius-sm);
    justify-content: center;
    font-size: 0.9rem;
    transition: all 0.2s var(--ease);
    min-width: 1.75rem;
    font-weight: 500;
}

.pager a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--general-button-text-color));
    background: rgba(var(--general-button-background-color));
}

.pager .current {
    color: rgba(var(--general-hover-button-text-color));
    background: rgba(var(--general-hover-button-background-color));
}

table.page-history { display: flex; flex-direction: column; }
table.page-history tbody { display: contents; }
table.page-history tr:first-child { display: none; }

table.page-history tr {
    display: grid;
    grid-template-areas: "revision choose action user memo date" "signature choose action user memo date";
    grid-template-columns: 2.5rem 3rem 4.4rem max-content 1fr max-content;
    border-bottom: 1px solid rgba(var(--action-area-border-color));
    padding: 0.6rem 0.25rem;
    border-radius: var(--radius-sm);
    transition: background 0.2s var(--ease);
}

table.page-history tr:is(:hover, :focus-within) {
    background: rgba(var(--action-area-border-color), 0.5);
}

table.page-history tr td { display: block; padding: 0; }

table.page-history tr td:nth-child(1) {
    grid-area: revision;
    font-size: 0.8rem;
    text-align: center;
}

table.page-history tr td:nth-child(2) {
    grid-area: choose;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100% !important;
}

table.page-history tr td:nth-child(2) input { margin: 0; }

table.page-history tr td:nth-child(3) {
    grid-area: signature;
    font-size: 0.9rem;
    font-weight: 700;
    text-align: center;
}

table.page-history tr td:nth-child(4) {
    grid-area: action;
    width: 100% !important;
    display: flex;
    grid-gap: 0.25rem;
    align-items: center;
    padding: 0 0.25rem;
    box-sizing: border-box;
}

table.page-history tr td:nth-child(4) a {
    border: none;
    padding: 0;
    width: 1.4rem;
    height: 1.6rem;
    border-radius: var(--radius-xs);
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(var(--general-button-text-color));
    background: rgba(var(--general-button-background-color));
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s var(--ease);
}

table.page-history tr td:nth-child(4) a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--general-hover-button-text-color));
    background: rgba(var(--general-hover-button-background-color));
}

table.page-history tr td:nth-child(5) {
    grid-area: user;
    width: -moz-fit-content !important;
    width: fit-content !important;
    display: flex;
    padding: 0 0.5rem;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

table.page-history tr td:nth-child(6) {
    grid-area: date;
    width: -moz-fit-content !important;
    width: fit-content !important;
    font-size: 0.8rem;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 0.5rem;
    padding: 0 0.25rem 0 0 !important;
}

table.page-history tr td:nth-child(7) {
    grid-area: memo;
    word-break: break-word;
    font-size: 0.85rem !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

table.page-compare {
    display: grid;
    width: 100%;
    margin: 1rem 0;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
}

table.page-compare tbody, table.page-compare tr { display: contents; }
table.page-compare tr > *:first-child { display: none; }
table.page-compare tr > * { display: block; border: none; padding: 0; }

table.page-compare th {
    font-size: 0.8rem;
    text-align: left;
    color: rgba(var(--action-area-subtext-color));
    font-weight: 700;
    line-height: 1;
}

#history-subarea { margin-top: 2rem; position: relative; }
#history-subarea > h2 { margin-top: 0; }

/* Page Tools */

#site-tools-box { padding-top: 2rem !important; }

.page-options-bottom {
    margin: 1rem 0;
    padding: 0;
    display: flex;
    grid-gap: 0.5rem;
}

.page-options-bottom ul, .page-options-bottom li { display: contents; }

.page-options-bottom a {
    flex: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(var(--general-button-text-color));
    background: rgba(var(--general-button-background-color));
    border-radius: var(--radius-md);
    text-decoration: none;
    transition: all 0.2s var(--ease);
    height: 2.25rem;
    font-size: 0.85rem;
    font-weight: 600;
    box-shadow: var(--shadow-xs);
}

.page-options-bottom a:is(:hover, :active) {
    color: rgba(var(--general-hover-button-text-color));
    background: rgba(var(--general-hover-button-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

#st-action-area {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    overflow-wrap: anywhere;
}

.wanted-pages-module, #st-action-area > h1, #st-action-area > p { grid-column: 1/span 2; }

.wanted-pages-module table.form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.wanted-pages-module table.form th,
.wanted-pages-module table.form td { border: none; }

.wanted-pages-module table.form th {
    background: rgba(var(--action-area-info-background-color));
    color: rgba(var(--action-area-info-text-color));
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.5em;
}

.wanted-pages-module table.form td {
    font-weight: 400;
    font-size: 0.8rem;
    border-bottom: 1px solid rgba(var(--action-area-border-color));
    transition: background 0.2s var(--ease);
    padding: 0.4em 0.6em;
}

.wanted-pages-module table.form td:is(:hover, :focus-within) {
    background: rgba(var(--action-area-border-color), 0.5);
}

.wanted-pages-module table.form td:last-child { display: flex; align-items: center; }

#st-action-area > br { display: none; }

#st-action-area > a, #st-action-area > span {
    border-bottom: 1px solid rgba(var(--action-area-border-color));
    transition: background 0.2s var(--ease);
    display: block;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-sm);
}

#st-action-area > a:is(:hover, :active, :focus, :focus-within),
#st-action-area > span:is(:hover, :focus-within) {
    background: rgba(var(--action-area-border-color), 0.5);
}

#st-action-area > a:has(+ span) { text-align: right; }
#st-action-area > a:has(+ br) { grid-column: 1/span 2; }
#st-action-area > span { color: rgba(var(--action-area-subtext-color)) !important; }

/* Edit Meta */

#action-area h1 + p + h2 ~ div[style="padding-left:3em;"] {
    padding: 0 !important;
    margin: 1rem 0;
}

#action-area h1 + p + h2 ~ div[style="padding-left:3em;"] > div {
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(var(--action-area-border-color));
    word-break: break-word;
    padding: 0.4rem 0;
}

#action-area h1 + p + h2 ~ div[style="padding-left:3em;"] > div a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(var(--general-button-text-color));
    background: rgba(var(--general-button-background-color));
    border-radius: var(--radius-sm);
    text-decoration: none;
    transition: all 0.2s var(--ease);
    min-height: 2rem;
    min-width: 3rem;
    font-size: 0.8rem;
    font-weight: 500;
    margin-right: 0.5rem !important;
    box-shadow: var(--shadow-xs);
}

#action-area h1 + p + h2 ~ div[style="padding-left:3em;"] > div a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--general-hover-button-text-color));
    background: rgba(var(--general-hover-button-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

/* Watcher */

#action-area p + ul[style*="list-style: none"] {
    padding: 0;
    margin: 1rem 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--body-width) / 4 - 2rem), 1fr));
    grid-gap: 0.25rem;
}

#action-area p + ul[style*="list-style: none"] li {
    font-size: 0.8rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(var(--action-area-border-color));
    border-radius: var(--radius-sm);
    transition: background 0.2s var(--ease);
}

#action-area p + ul[style*="list-style: none"] li:is(:hover, :active, :focus, :focus-within) {
    background: rgba(var(--action-area-border-color), 0.5);
}

/* Backlink */

#action-area > h1 + h2 + ul,
#action-area > h1 + h2 ~ h2 ~ ul {
    display: block;
    padding: 0;
    margin: 1rem 0;
}

#action-area > h1 + h2 + ul li,
#action-area > h1 + h2 ~ h2 ~ ul li {
    font-size: 0.85rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(var(--action-area-border-color));
    border-radius: var(--radius-sm);
    transition: background 0.2s var(--ease);
    display: flex;
    align-items: center;
}

#action-area > h1 + h2 + ul li:is(:hover, :active, :focus, :focus-within),
#action-area > h1 + h2 ~ h2 ~ ul li:is(:hover, :active, :focus, :focus-within) {
    background: rgba(var(--action-area-border-color), 0.5);
}

#action-area > h1 + h2 + ul li > *,
#action-area > h1 + h2 ~ h2 ~ ul li > * { flex: none; }

#action-area > h1 + h2 + ul li > a:first-child,
#action-area > h1 + h2 ~ h2 ~ ul li > a:first-child { flex: 1; }

/* Page Source */

.page-source {
    background: rgba(var(--page-source-background-color));
    color: rgba(var(--page-source-text-color));
    word-break: break-word;
    border: 1px solid rgba(var(--action-area-border-color));
    border-radius: var(--radius-md);
    padding: 1rem;
    font-family: var(--mono-font);
    font-size: 0.8rem;
}

.inline-diff del {
    white-space: normal;
    color: rgba(var(--warning-text-color));
    background: rgba(var(--warning-color));
    border-radius: var(--radius-xs);
    text-decoration: none;
    padding: 0.1em 0.3em;
}

.inline-diff ins {
    white-space: normal;
    color: rgba(var(--accept-text-color));
    background: rgba(var(--accept-color));
    border-radius: var(--radius-xs);
    text-decoration: none;
    padding: 0.1em 0.3em;
}

/* Parent */

.autocomplete-container { width: 100% !important; }

.error-block {
    background: rgba(var(--warning-color));
    color: rgba(var(--warning-text-color));
    border: none;
    border-radius: var(--radius-md);
    margin: 1rem 0;
    padding: 0.5rem 1rem;
    text-align: center;
    box-shadow: var(--shadow-sm);
}

.error-block a { color: rgba(var(--warning-text-color)); }

/* Rename */

#rename-backlinks-box table.form {
    display: grid;
    grid-template-columns: 1fr max-content;
    grid-template-rows: auto;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

#rename-backlinks-box table.form th {
    background: rgba(var(--action-area-info-background-color));
    color: rgba(var(--action-area-info-text-color));
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.6em 1em;
}

#rename-backlinks-box table.form td {
    font-weight: 400;
    font-size: 0.8rem;
    border-bottom: 1px solid rgba(var(--action-area-border-color));
    transition: background 0.2s var(--ease);
    padding: 0.6em 1em;
}

#rename-backlinks-box table.form td:is(:hover, :focus-within) {
    background: rgba(var(--action-area-border-color), 0.5);
}

#rename-backlinks-box table.form td:last-child { display: flex; align-items: center; }

#rename-option-rename table.form tr:last-child td {
    grid-column: 1/span 2;
    display: flex;
}

#rename-option-rename table.form tr:first-child td:last-child {
    margin-bottom: 1rem;
    padding: 0.4em 0.75em;
    border-radius: var(--radius-sm);
    background: rgba(var(--action-area-info-background-color));
    color: rgba(var(--action-area-info-text-color));
    font-family: var(--mono-font);
    font-weight: 500;
}

#action-area > a.action-area-close + h1 + p + table.form {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

#action-area > a.action-area-close + h1 + p + table.form > tbody > tr > td:nth-child(2) {
    display: grid;
    grid-template-columns: 1.25em 1fr;
    align-items: center;
    gap: 0.25rem 0.125rem;
}

/* Hovertips */

#avatar-hover-container { display: none; }

.hovertip {
    background: rgba(var(--hovertip-background-color)) !important;
    color: rgba(var(--hovertip-text-color));
    border: 1px solid rgba(var(--hovertip-border-color)) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: var(--shadow-lg);
    padding: 0.5rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 500;
    width: -moz-max-content;
    width: max-content;
    max-width: min(87.5%, var(--body-width) * 0.75);
}

/* Horizon Line */

hr {
    margin: 2rem 0;
    height: 0;
    border-top: 1px solid rgba(var(--hr-color));
}

/* Collapsible */

.collapsible-block-unfolded-link,
.collapsible-block-folded { margin: 1rem 0; }

/* Tabview */

.yui-navset {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 1.25rem auto;
}

.yui-navset .yui-nav {
    border: none;
    display: flex;
    flex-wrap: wrap;
    zoom: unset;
    gap: 0.25rem;
    z-index: 1;
    box-sizing: border-box;
    box-shadow: none;
}

.yui-navset .yui-nav li,
.yui-navset .yui-nav li.selected {
    margin: 0;
    flex-grow: 2;
    zoom: unset;
    box-shadow: none;
    display: block;
    padding: 0;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    background: rgba(var(--tabview-button-background-color));
    transition: all 0.2s var(--ease);
    max-width: 100%;
}

.yui-navset .yui-nav li a,
.yui-navset .yui-nav li.selected a {
    background: none;
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    border: none;
    zoom: unset;
    color: rgba(var(--tabview-button-text-color));
    font-weight: 500;
}

.yui-navset .yui-nav a:is(:hover, :active, :focus, :focus-within),
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover { background: none; }

.yui-navset .yui-nav li a em,
.yui-navset .yui-nav li.selected a em {
    padding: 0.5em 0.85em;
    margin: 0;
    border: none;
    position: static;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100%;
    font-style: normal;
}

.yui-navset .yui-nav li:is(:hover, :active, :focus, :focus-within) {
    background: rgba(var(--tabview-hover-button-background-color));
}

.yui-navset .yui-nav li:is(:hover, :active, :focus, :focus-within) a {
    color: rgba(var(--tabview-hover-button-text-color));
}

.yui-navset .yui-nav li.selected {
    background: rgba(var(--tabview-selected-button-background-color));
}

.yui-navset .yui-nav li.selected a,
.yui-navset .yui-nav li.selected a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--tabview-selected-button-text-color));
}

.yui-navset .yui-content {
    box-shadow: var(--shadow-md);
    border: none;
    width: 100%;
    box-sizing: border-box;
    border-radius: 0 var(--radius-md) var(--radius-md) var(--radius-md);
    background: rgba(var(--tabview-content-background-color));
    color: rgba(var(--tabview-content-text-color));
    padding: 1rem 1.25rem;
}

/* Wiki Table */

table.wiki-content-table {
    margin: 1.25rem auto;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    width: 100%;
}

table.wiki-content-table th {
    background: rgba(var(--table-header-background-color));
    color: rgba(var(--table-header-text-color));
    border: none;
    font-weight: 600;
    letter-spacing: 0.02em;
    font-size: 0.85rem;
    padding: 0.7em 1em;
}

table.wiki-content-table td {
    background: rgba(var(--table-background-color));
    color: rgba(var(--table-text-color));
    border: none;
    border-bottom: 1px solid rgba(var(--table-border-color));
    padding: 0.6em 1em;
}

table.wiki-content-table tr:last-child td { border-bottom: none; }

/* Blockquote */

blockquote, .blockquote {
    background: rgba(var(--blockquote-background-color));
    color: rgba(var(--blockquote-text-color));
    box-shadow: var(--shadow-sm);
    margin: 1.25rem 0;
    border: none;
    border-left: 0.3rem solid rgba(var(--link-color));
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    padding: 0.75rem 1.25rem;
}

/* Toc */

#toc {
    background: rgba(var(--toc-background-color));
    color: rgba(var(--toc-text-color));
    margin: 1.25rem 0;
    border: 1px solid rgba(var(--toc-border-color));
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    padding: 0.75rem 1.25rem;
}

#toc-list div[style*="1em"] { margin-left: 1.5em !important; margin-top: 0.4em; position: relative; display: list-item; list-style: square; }
#toc-list div[style*="2em"] { margin-left: 3em !important; margin-top: 0.3em; margin-bottom: 0.3em; position: relative; display: list-item; list-style: disc; }
#toc-list div[style*="3em"] { margin-left: 4.5em !important; position: relative; display: list-item; list-style: circle; }
#toc-list div[style*="4em"] { margin-left: 6em !important; position: relative; display: list-item; list-style: circle; }
#toc-list div[style*="5em"] { margin-left: 7.5em !important; position: relative; display: list-item; list-style: circle; }
#toc-list div[style*="6em"] { margin-left: 9em !important; position: relative; display: list-item; list-style: circle; }

/* Code Block */

.code {
    background: rgba(var(--code-block-background-color));
    color: rgba(var(--code-block-text-color));
    margin: 1.25rem 0;
    border: 1px solid rgba(var(--code-block-border-color));
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    padding: 1rem;
    overflow-x: auto;
}

.hl-default { color: rgb(var(--code-block-default-color)); }
.hl-code { color: rgb(var(--code-block-code-color)); }
.hl-brackets { color: rgb(var(--code-block-brackets-color)); }
.hl-comment { color: rgb(var(--code-block-comment-color)); }
.hl-quotes { color: rgb(var(--code-block-quotes-color)); }
.hl-string { color: rgb(var(--code-block-string-color)); }
.hl-identifier { color: rgb(var(--code-block-identifier-color)); }
.hl-builtin { color: rgb(var(--code-block-builtin-color)); }
.hl-reserved { color: rgb(var(--code-block-reserved-color)); }
.hl-inlinedoc { color: rgb(var(--code-block-inlinedoc-color)); }
.hl-var { color: rgb(var(--code-block-var-color)); }
.hl-url { color: rgb(var(--code-block-url-color)); }
.hl-special { color: rgb(var(--code-block-special-color)); }
.hl-number { color: rgb(var(--code-block-number-color)); }
.hl-inlinetags { color: rgb(var(--code-block-inlinetags-color)); }

.hl-gutter {
    background-color: rgb(var(--code-block-gutter-background-color));
    color: rgb(var(--code-block-gutter-color));
    border-radius: var(--radius-xs);
}

/* Definition List */

dt { font-weight: 700; }
dd { margin-inline-start: 1rem; }
ul, ol { padding-inline-start: 2rem; }

/* Note */

div.wiki-note {
    background: rgba(var(--note-background-color));
    color: rgba(var(--note-text-color));
    border: 1px solid rgba(var(--note-border-color));
    border-radius: var(--radius-md);
    text-align: left;
    margin: 1.25rem auto;
    padding: 1rem 1.25rem;
    max-width: 25rem;
    font-weight: 500;
    box-shadow: var(--shadow-sm);
}

/* Error inline */

.error-inline {
    color: rgba(var(--warning-text-color));
    background: rgba(var(--warning-color));
    display: inline-block;
    padding: 0.2em 0.6em;
    margin: 0 0.2em;
    font-size: 0.8rem;
    font-weight: 600;
    vertical-align: middle;
    border: none;
    border-radius: var(--radius-pill);
}

/* Footnote & Reference */

.footnote .f-footer, .reference .r-footer { display: none; }
.footnote .f-content, .reference .r-content { font-weight: 400; }

.footnotes-footer, .bibitems {
    background: rgba(var(--footnote-block-background-color));
    color: rgba(var(--footnote-block-text-color));
    border-left: 0.3rem solid rgba(var(--footnote-block-border-color));
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    box-shadow: var(--shadow-sm);
    margin: 1.25rem 0;
    padding: 1rem 1.25rem;
    height: auto;
}

.footnotes-footer .title, .bibitems .title { margin: 0 0 0.5rem; }
.footnotes-footer .footnote-footer a:first-child { font-family: var(--mono-font); }
.bibitem:not(:last-child) { margin-bottom: 0.5rem; }

/* Popups */

.odialog-shader, .odialog-shader-iframe { display: none; }

#odialog-container[style*=block] {
    display: flex !important;
    justify-content: center;
    align-items: center;
    position: fixed;
    width: 100%;
    height: 100%;
    -webkit-backdrop-filter: blur(var(--general-blur));
            backdrop-filter: blur(var(--general-blur));
    background: rgba(var(--popup-fader-color));
    top: 0;
    left: 0;
    padding: 0;
    margin: 0;
    box-shadow: none;
    z-index: 30;
}

.owindow {
    max-width: 80ch;
    top: initial !important;
    left: initial !important;
    position: relative;
    flex-basis: calc(100% - 2rem);
    background: rgba(var(--popup-background-color));
    box-sizing: border-box;
    border: none;
    color: rgba(var(--popup-text-color));
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xl);
    padding: 0;
    overflow: hidden;
    pointer-events: auto;
    font-size: var(--content-font-size);
}

.owindow.owait, .owindow.osuccess {
    padding: 1rem 2rem;
    flex-basis: 1px;
    text-align: center;
}

.owindow.osuccess .content {
    white-space: nowrap;
    margin: 0;
    padding: 0;
    background-image: none;
}

.owindow.owait {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 5rem;
}

.owindow.owait::before {
    content: var(--popup-loading-content);
    display: block;
    white-space: nowrap;
    font-weight: 500;
}

.owindow.owait .content {
    display: block;
    position: relative;
    width: 0.2rem;
    height: 0.5rem;
    animation: saving-page-animation infinite 1s ease-in-out -0.2s;
    background-image: none;
    background-color: rgba(var(--popup-loading-color));
    font-size: 0;
    margin: 1rem;
    padding: 0;
    flex: none;
    border-radius: var(--radius-pill);
}

.owindow.owait .content:before,
.owindow.owait .content:after {
    position: absolute;
    width: 0.2rem;
    height: 0.5rem;
    content: "";
    background-color: rgba(var(--popup-loading-color));
    border-radius: var(--radius-pill);
}

.owindow.owait .content:before {
    left: -0.6rem;
    animation: saving-page-animation infinite 1s ease-in-out -0.4s;
}

.owindow.owait .content:after {
    right: -0.6rem;
    animation: saving-page-animation infinite 1s ease-in-out;
}

@keyframes saving-page-animation {
    0%, 80%, 100% { height: 0.7rem; box-shadow: 0 0 rgba(var(--popup-loading-color)); }
    40% { height: 1rem; box-shadow: 0 -0.7rem rgba(var(--popup-loading-color)); }
}

.owindow .title {
    cursor: initial;
    padding: 0.75rem 1.25rem;
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    background: rgba(var(--popup-title-background-color));
    color: rgba(var(--popup-title-text-color));
}

.owindow .content {
    padding: 1.25rem 1.25rem 0;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 0.75rem;
}

.owindow > :not(.button-bar, .title) > :not(img, img + h1) { flex-basis: 100%; margin: 0; }

.owindow .content > img {
    width: 4rem;
    height: 4rem;
    padding: 0 !important;
    background: none !important;
    border-radius: var(--radius-md);
}

.owindow .content > img + h1 {
    margin: 0;
    display: flex;
    align-items: center;
    margin-left: 0.5rem;
}

.owindow .content > img + h1 + table {
    display: grid;
    border-top: 1px solid rgba(var(--popup-text-color), 0.12);
    grid-template-columns: max-content 1fr;
    max-height: 42.5vh;
    overflow-y: auto;
}

.owindow .content > img + h1 + table tbody,
.owindow .content > img + h1 + table tr { display: contents; }

.owindow .content > img + h1 + table td {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(var(--popup-text-color), 0.12);
    font-size: 0.9rem;
}

.owindow .content > img + h1 + table td img { vertical-align: middle; }

.owindow .content > img + h1 + table + div {
    margin-top: 0.25rem !important;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 0.5rem;
}

.owindow .button-bar > a:not([onclick*=cleanAll]),
.owindow div[style*=margin-top] a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(var(--popup-button-text-color));
    background: rgba(var(--popup-button-background-color));
    flex-basis: 8em;
    flex-grow: 2;
    height: 2.25rem;
    transition: all 0.2s var(--ease);
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    padding: 0 0.85em;
    font-size: 0.8rem;
    white-space: nowrap;
    border: none;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-xs);
}

.owindow .button-bar > a:not([onclick*=cleanAll]):is(:hover, :active, :focus, :focus-within),
.owindow div[style*=margin-top] a:is(:hover, :active, :focus, :focus-within) {
    color: rgba(var(--popup-hover-button-text-color));
    background: rgba(var(--popup-hover-button-background-color));
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.owindow .content > img + h1 + table + div > div { display: contents; }
.owindow .content > img + h1 + table + div > a:nth-child(2) { order: 1; }
.owindow .content > img + h1 + table + div > a:nth-child(3) { order: 2; }
.owindow .content > img + h1 + table + div > a:nth-child(4) { order: 3; }
.owindow .content > img + h1 + table + div > div a { order: 4; }

.owindow .button-bar {
    padding: 1rem 1.25rem 1.25rem;
    margin: 0;
    display: flex;
    grid-gap: 0.5rem;
}

.owindow .button-bar > a[onclick*=cleanAll] {
    position: absolute;
    border: none;
    margin: 0;
    padding: 0;
    height: 2.5rem;
    bottom: -2.5rem;
    right: 0;
    width: 100%;
    background: transparent;
    color: rgba(var(--popup-tip-color));
    display: flex;
    font-size: 0;
    font-weight: 600;
    justify-content: center;
    align-items: flex-end;
}

.owindow .button-bar > a[onclick*=cleanAll]:hover { background: transparent; }

.owindow .button-bar > a[onclick*=cleanAll]::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.owindow .button-bar > a[onclick*=cleanAll]::after {
    content: var(--popup-tip-content);
    font-size: 0.8rem;
}

/* Printuser */

.printuser {
    display: inline-flex;
    align-items: baseline;
    gap: 0.25em;
    text-indent: 0;
}

.printuser a { margin-right: 0; }

.printuser > a:first-child {
    display: flex;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    align-self: center;
    min-width: -moz-max-content;
    min-width: max-content;
}

.printuser > a:first-child img {
    height: 1.25em;
    width: 1.25em;
    padding: 0;
    padding-left: 0.5em;
    -o-object-fit: contain;
       object-fit: contain;
    border-radius: var(--radius-xs);
    background-size: cover;
    overflow: hidden;
}

.printuser.deleted img {
    height: 1.25em;
    width: 1.25em;
    padding: 0;
    vertical-align: 0;
    align-self: center;
}

/* Page Elements */

.lightblock {
    background: rgba(var(--lightblock-background-color));
    color: rgba(var(--lightblock-text-color));
    margin: 1.25rem 0;
    padding: 0.75rem 1.25rem;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
}

.darkblock {
    --h1-color: var(--darkblock-text-color);
    --h2-color: var(--darkblock-text-color);
    --h3-color: var(--darkblock-text-color);
    --h4-color: var(--darkblock-text-color);
    --h5-color: var(--darkblock-text-color);
    --h6-color: var(--darkblock-text-color);
    background: rgba(var(--darkblock-background-color));
    color: rgba(var(--darkblock-text-color));
    margin: 1.25rem 0;
    padding: 0.75rem 1.25rem;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);
}

.styled-quote {
    background: rgba(var(--styled-quote-background-color));
    color: rgba(var(--styled-quote-text-color));
    border-left: 0.4rem solid rgba(var(--styled-quote-border-color));
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    box-shadow: var(--shadow-sm);
    margin: 1.25rem 0;
    padding: 0.75rem 1.25rem;
}

.dark-styled-quote {
    --h1-color: var(--dark-styled-quote-text-color);
    --h2-color: var(--dark-styled-quote-text-color);
    --h3-color: var(--dark-styled-quote-text-color);
    --h4-color: var(--dark-styled-quote-text-color);
    --h5-color: var(--dark-styled-quote-text-color);
    --h6-color: var(--dark-styled-quote-text-color);
    background: rgba(var(--dark-styled-quote-background-color));
    color: rgba(var(--dark-styled-quote-text-color));
    border-left: 0.4rem solid rgba(var(--dark-styled-quote-border-color));
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    box-shadow: var(--shadow-md);
    margin: 1.25rem 0;
    padding: 0.75rem 1.25rem;
}

.bblock {
    background-color: rgba(var(--text-color));
    transition: color 0.3s var(--ease) linear;
}

.bblock:is(:hover, :focus-within) {
    background-color: rgba(var(--text-color));
    color: rgb(var(--background-color));
}

.dblock {
    background-color: currentColor;
    transition: background-color 0.3s var(--ease) linear;
}

.dblock:is(:hover, :focus-within) { background-color: transparent; }

.keycap {
    background-color: rgba(var(--general-light-background-color));
    color: rgba(var(--general-light-text-color));
    padding: 0.25em 0.5em;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(var(--action-area-border-color));
    box-shadow: 0 0.1em 0 0.05em rgba(var(--general-shadow-color), 0.15);
    font-family: var(--mono-font);
    font-size: 0.85em;
}

.rt, rt { display: table-header-group; font-size: 0.65em; line-height: 1.15; }
.ruby, ruby { display: inline-table; line-height: 1; vertical-align: text-bottom; }
.rt, .ruby, rt, ruby { text-align: center; white-space: nowrap; }

/* Scrollbar */

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }

::-webkit-scrollbar-thumb {
    background: rgba(var(--scrollbar-color));
    border-radius: var(--radius-pill);
    border: 2px solid rgba(var(--background-color));
}

::-webkit-scrollbar-thumb:hover { background: rgba(var(--dark-color-3), 0.7); }

/* Mobile */

@media only screen and (max-width: 1024px) {

    :root {
        --header-height: calc(var(--main-header-height-on-mobile) + var(--topbar-height-on-mobile) + 2.5rem);
        --header-margin: clamp(1rem, 5vw, 2rem);
        --topbar-inset: 0.75rem;
    }

    #header {
        grid-template-rows: var(--main-header-height-on-mobile) auto calc(var(--topbar-height-on-mobile) + 0.75rem);
        position: sticky;
        top: calc(-1 * var(--main-header-height-on-mobile) - 2rem);
    }

    #header h1 a span {
        gap: 0.3em;
        padding: 0.5rem 0 0.25rem;
    }

    #header h1 a span::before {
        width: clamp(6rem, 22vw, 8.5rem);
        height: clamp(6rem, 22vw, 8.5rem);
    }

    #header h2 {
        font-size: var(--header-subtitle-font-size-on-mobile);
        margin: 0.1rem 0 0.65rem 0;
    }

    #header h2 span::before {
        font-size: var(--header-subtitle-font-size-on-mobile);
    }

    #login-status {
        position: absolute;
        top: 0.65rem;
        font-size: 0.75rem;
        right: calc(var(--header-margin) + 0.5rem + var(--search-icon-width-on-mobile));
    }

    #search-top-box {
        position: absolute;
        right: 0;
        top: 0;
        width: var(--search-icon-width-on-mobile);
        height: var(--main-header-height-on-mobile);
    }

    #search-top-box-form { display: contents; }

    #search-top-box-form .button {
        font-size: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
        padding: 0;
        background: rgba(var(--header-text-color));
        -webkit-mask-image: var(--search-icon-mask);
                mask-image: var(--search-icon-mask);
        -webkit-mask-size: 40%;
                mask-size: 40%;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center 0.8rem;
                mask-position: center 0.8rem;
    }

    #search-top-box-form .button:is(:hover, :active, :focus, :focus-within) {
        transform: none;
        box-shadow: none;
        background: rgba(var(--header-text-color));
    }

    #top-bar .top-bar { display: none; }

    #top-bar .mobile-top-bar {
        display: flex;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 0;
        margin: 0;
        width: calc(100% - 2 * var(--topbar-inset));
        max-width: var(--topbar-max-width);
        height: var(--topbar-height-on-mobile);
        background: rgba(var(--topbar-bg));
        border: 1px solid rgba(196, 224, 220, 0.55);
        border-radius: var(--radius-md);
        box-shadow: 0 6px 22px rgba(56, 118, 110, 0.18), 0 2px 6px rgba(56, 118, 110, 0.12);
        padding: 0 0.25rem;
        box-sizing: border-box;
        align-items: center;
        z-index: 14;
    }

    #top-bar div[class*=top-bar] > ul > li {
        position: static;
        border-radius: var(--radius-pill);
        height: 100%;
        display: flex;
        align-items: center;
    }

    #top-bar div[class*=top-bar] > ul > li > a {
        font-size: var(--topbar-font-size-on-mobile);
        border-radius: var(--radius-pill);
        padding: 0 0.5rem;
    }

    #top-bar div[class*=top-bar] > ul > li > ul {
        max-width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        top: calc(100% + 0.4rem);
        border-radius: var(--radius-md);
        padding: 0.4rem;
    }

    #top-bar div[class*=top-bar] > ul > li > ul > li {
        flex-basis: 40%;
        flex-grow: 2;
        height: var(--topbar-height-on-mobile);
        border-radius: var(--radius-sm);
    }

    #top-bar div[class*=top-bar] > ul > li > ul > li:nth-child(2) { border-top: 0; }

    #top-bar div[class*=top-bar] > ul > li > ul > li:nth-child(2n):nth-last-child(2) {
        box-shadow: none;
    }

    #top-bar div[class*=top-bar] > ul > li > ul > li:nth-child(2n+1):last-child {
        max-width: none;
        border-right-width: 0;
    }

    #top-bar div[class*=top-bar] > ul > li > ul > li > a {
        font-size: calc(var(--topbar-font-size-on-mobile) * 0.9);
        border-radius: var(--radius-sm);
    }

    #side-bar,
    #side-bar:is(:hover, :focus-within):not(:target) {
        left: calc(var(--sidebar-width) * -1);
        width: min(var(--sidebar-width-on-mobile), 100% - 3rem);
    }

    #side-bar::before, #side-bar::after { display: none; }
    #side-bar:target { left: 0; }

    /* 侧栏关闭：全屏遮罩 + 关闭按钮 */
    #side-bar .side-close { display: none; }

    #side-bar:target .side-close { display: block; }

    #side-bar .side-close a {
        position: fixed;
        inset: 0;
        z-index: 0;
        display: block;
        font-size: 0;
        background: rgba(38, 92, 86, 0.22);
        -webkit-backdrop-filter: blur(2px);
                backdrop-filter: blur(2px);
    }

    #side-bar .side-close a::after {
        content: "×";
        position: fixed;
        top: 0.5rem;
        left: calc(min(var(--sidebar-width-on-mobile), 100% - 3rem) - 2.6rem);
        width: 2rem;
        height: 2rem;
        line-height: 2rem;
        text-align: center;
        font-size: 1.25rem;
        border-radius: 50%;
        color: rgba(var(--sidebar-title-text-color));
        background: rgba(var(--sidebar-title-background-color));
        box-shadow: 0 6px 16px rgba(56, 118, 110, 0.32);
    }

    #side-bar:target .close-menu {
        opacity: 1;
        pointer-events: auto;
        width: calc(100% - min(var(--sidebar-width-on-mobile), 100% - 3rem));
    }

    #footer { font-size: 0.6rem; }

    #license-area {
        font-size: 0.8rem;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    #main-content { margin: 1.5rem var(--body-margin); }
}

@media only screen and (max-width: 540px) {

    table.page-history tr {
        grid-template-areas: "revision signature date" "choose action user" "memo memo memo";
        grid-template-columns: 2.5rem 4.4rem 1fr;
    }

    table.page-history tr td:nth-child(3) {
        text-align: left;
        font-size: 0.8rem;
        font-weight: 400;
        margin-bottom: 0.2rem;
    }

    table.page-history tr td:nth-child(5) {
        width: auto !important;
        padding-right: 0;
        font-size: 0.8rem;
        justify-content: flex-end;
    }

    table.page-history tr td:nth-child(6) {
        width: auto !important;
        justify-content: flex-end;
        padding-right: 0;
    }

    table.page-history tr td:nth-child(7) { margin-top: 0.2rem; }

    .owindow .content > img + h1 + table { grid-template-columns: 1fr; }

    .owindow .content > img + h1 + table td:first-child {
        padding-bottom: 0;
        border-bottom: none;
    }

    .owindow .content > img + h1 + table td:last-child { padding-top: 0; }

    #page-title, .meta-title {
        font-size: clamp(1.4rem, 6vw, 1.8rem);
        padding-bottom: 0.5rem;
    }

    blockquote, .blockquote { margin: 1.25rem 0; }

    #header h1 a span::after { margin-top: 0.15em; }
}
