arcane-os 0.1.0-dev.5

package/runtime/arcane/css/document-site.css

@@ -0,0 +1,981 @@
+/* Reusable, progressively enhanced documentation-site layout.
+ * Load after Arcane theme.css and primitives.css.
+ */
+
+*,
+*::before,
+*::after{
+    box-sizing:border-box;
+}
+
+html{
+    min-height:100%;
+    scroll-behavior:smooth;
+}
+
+body.static-doc-site{
+    background:
+        radial-gradient(circle at 12% -8%,color-mix(in srgb,var(--arcane-focus) 14%,transparent),transparent 32rem),
+        var(--arcane-surface);
+    color:var(--text-color);
+    font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
+    line-height:1.6;
+    margin:0;
+    min-height:100vh;
+    text-rendering:optimizeLegibility;
+}
+
+.static-doc-site a{
+    color:var(--arcane-focus);
+    text-decoration-thickness:.08em;
+    text-underline-offset:.16em;
+}
+
+.static-doc-site :where(a,button,input,summary):focus-visible{
+    border-radius:var(--arcane-radius-small);
+    outline:3px solid color-mix(in srgb,var(--arcane-focus) 48%,transparent);
+    outline-offset:.2rem;
+}
+
+.skip-link{
+    background:var(--arcane-surface-raised);
+    border:2px solid var(--arcane-focus);
+    border-radius:var(--arcane-radius-medium);
+    color:var(--text-color);
+    font-weight:700;
+    inset-block-start:var(--arcane-space-3);
+    inset-inline-start:var(--arcane-space-3);
+    padding:var(--arcane-space-3) var(--arcane-space-4);
+    position:fixed;
+    transform:translateY(-180%);
+    z-index:1000;
+}
+
+.skip-link:focus{
+    transform:translateY(0);
+}
+
+.static-site-header{
+    backdrop-filter:blur(1rem);
+    background:color-mix(in srgb,var(--arcane-surface) 86%,transparent);
+    border-block-end:1px solid var(--arcane-border);
+    position:sticky;
+    top:0;
+    z-index:20;
+}
+
+.static-site-header__inner,
+.static-site-footer__inner,
+.static-site-main{
+    margin-inline:auto;
+    max-inline-size:96rem;
+    padding-inline:clamp(1rem,3.5vw,3.5rem);
+}
+
+.static-site-header__inner{
+    align-items:center;
+    display:flex;
+    gap:clamp(.75rem,2vw,1.5rem);
+    min-block-size:4.5rem;
+    padding-block:.65rem;
+}
+
+.static-site-brand{
+    align-items:center;
+    color:var(--text-color) !important;
+    display:inline-flex;
+    flex:0 0 auto;
+    font-size:1rem;
+    font-weight:800;
+    gap:.7rem;
+    letter-spacing:-.01em;
+    text-decoration:none;
+}
+
+.static-site-brand__mark{
+    align-items:center;
+    aspect-ratio:1;
+    background:linear-gradient(145deg,var(--arcane-focus),var(--arcane-review));
+    border:1px solid color-mix(in srgb,var(--arcane-focus) 56%,var(--arcane-border));
+    border-radius:.62rem;
+    box-shadow:var(--arcane-shadow-small);
+    color:var(--arcane-action-text);
+    display:inline-flex;
+    font:800 1rem/1 ui-monospace,"Cascadia Code",monospace;
+    justify-content:center;
+    inline-size:2.25rem;
+}
+
+.static-site-nav{
+    align-items:center;
+    display:flex;
+    flex:1 1 auto;
+    gap:.2rem;
+    justify-content:center;
+}
+
+.static-site-nav a{
+    border-radius:var(--arcane-radius-medium);
+    color:var(--arcane-muted);
+    font-size:.9rem;
+    font-weight:680;
+    padding:.55rem .7rem;
+    text-decoration:none;
+    white-space:nowrap;
+}
+
+.static-site-nav a:is(:hover,[aria-current="page"]){
+    background:var(--arcane-secondary);
+    color:var(--text-color);
+}
+
+.static-site-main{
+    min-block-size:calc(100vh - 13rem);
+    padding-block:clamp(1.5rem,4vw,4rem) clamp(3rem,7vw,6rem);
+}
+
+.eyebrow{
+    color:var(--arcane-muted);
+    font-size:.75rem;
+    font-weight:780;
+    letter-spacing:.14em;
+    margin:0 0 .35rem;
+    text-transform:uppercase;
+}
+
+.static-hero{
+    align-items:center;
+    display:grid;
+    gap:clamp(2rem,5vw,5rem);
+    grid-template-columns:minmax(0,1fr) minmax(20rem,.82fr);
+    min-block-size:min(44rem,calc(100vh - 8rem));
+    padding-block:clamp(1rem,5vw,4.5rem);
+}
+
+.static-hero__copy{
+    max-inline-size:48rem;
+}
+
+.static-hero h1,
+.static-page-heading h1,
+.static-document__header h1,
+.static-not-found h1{
+    font-family:Georgia,"Times New Roman",serif;
+    font-weight:650;
+    letter-spacing:-.035em;
+    line-height:1.02;
+    text-wrap:balance;
+}
+
+.static-hero h1{
+    font-size:clamp(2.65rem,6vw,5rem);
+    margin:.3rem 0 1.25rem;
+    max-inline-size:14ch;
+}
+
+.static-hero__lede{
+    color:var(--arcane-muted);
+    font-size:clamp(1.05rem,2vw,1.3rem);
+    line-height:1.7;
+    margin:0;
+    max-inline-size:44rem;
+}
+
+.static-hero__actions{
+    display:flex;
+    flex-wrap:wrap;
+    gap:var(--arcane-space-3);
+    margin-block-start:var(--arcane-space-6);
+}
+
+.static-status-badges{
+    align-items:center;
+    display:flex;
+    flex-wrap:wrap;
+    gap:var(--arcane-space-2);
+    margin-block-start:var(--arcane-space-4);
+}
+
+.static-status-badges a{
+    display:inline-flex;
+}
+
+.static-status-badges img{
+    block-size:1.25rem;
+    inline-size:auto;
+}
+
+.static-hero__visual{
+    margin:0;
+    overflow:hidden;
+    padding:.55rem;
+    transform:rotate(1deg);
+}
+
+.static-hero__visual img{
+    aspect-ratio:16/9;
+    block-size:auto;
+    border-radius:calc(var(--arcane-radius-large) - .25rem);
+    display:block;
+    inline-size:100%;
+    object-fit:cover;
+}
+
+.static-hero__visual figcaption{
+    color:var(--arcane-muted);
+    font-size:.82rem;
+    padding:.65rem .5rem .25rem;
+}
+
+.static-section-directory,
+.static-catalog,
+.static-catalog-section,
+.static-related{
+    display:grid;
+    gap:var(--arcane-space-5);
+}
+
+.static-section-directory{
+    padding-block:clamp(2rem,6vw,5rem);
+}
+
+.static-section-heading{
+    max-inline-size:52rem;
+}
+
+.static-section-heading h2,
+.static-related h2{
+    font-size:clamp(1.55rem,3vw,2.35rem);
+    letter-spacing:-.025em;
+    line-height:1.16;
+    margin:.25rem 0 0;
+    text-wrap:balance;
+}
+
+.static-section-heading p:last-child{
+    color:var(--arcane-muted);
+    margin:.65rem 0 0;
+}
+
+.static-section-grid{
+    display:grid;
+    gap:var(--arcane-space-4);
+    grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));
+}
+
+.static-section-card{
+    color:var(--text-color) !important;
+    display:grid;
+    gap:.45rem;
+    min-block-size:12rem;
+    padding:clamp(1.1rem,3vw,1.75rem);
+    text-decoration:none;
+    transition:border-color 160ms ease,box-shadow 160ms ease,transform 160ms ease;
+}
+
+.static-section-card:is(:hover,:focus-visible){
+    border-color:color-mix(in srgb,var(--arcane-focus) 65%,var(--arcane-border));
+    box-shadow:var(--arcane-shadow-medium);
+    transform:translateY(-.18rem);
+}
+
+.static-section-card strong{
+    font-size:1.3rem;
+}
+
+.static-section-card>span:last-child{
+    color:var(--arcane-muted);
+}
+
+.static-development-note{
+    border-inline-start:.35rem solid var(--arcane-review);
+    margin-block-start:clamp(1rem,4vw,3rem);
+    max-inline-size:62rem;
+}
+
+.static-development-note .arcane-card__body,
+.static-document-callout .arcane-card__body,
+.static-on-this-page .arcane-card__body,
+.static-document-card .arcane-card__body{
+    padding:clamp(1rem,2.5vw,1.5rem);
+}
+
+.static-development-note h2,
+.static-document-callout h2,
+.static-on-this-page h2{
+    font-size:1.05rem;
+    margin:0;
+}
+
+.static-development-note p:last-child{
+    color:var(--arcane-muted);
+    margin-block-end:0;
+}
+
+.static-breadcrumbs{
+    align-items:center;
+    color:var(--arcane-muted);
+    display:flex;
+    flex-wrap:wrap;
+    font-size:.88rem;
+    gap:.55rem;
+    margin-block-end:clamp(1.5rem,4vw,3rem);
+}
+
+.static-breadcrumbs a{
+    color:inherit;
+}
+
+.static-page-heading{
+    margin-block-end:clamp(2rem,6vw,5rem);
+    max-inline-size:58rem;
+}
+
+.static-page-heading h1{
+    font-size:clamp(2.5rem,5vw,4.25rem);
+    margin:.25rem 0 1rem;
+}
+
+.static-page-heading>p:last-child{
+    color:var(--arcane-muted);
+    font-size:clamp(1rem,2vw,1.2rem);
+    margin:0;
+    max-inline-size:50rem;
+}
+
+.static-catalog{
+    gap:clamp(3rem,7vw,6rem);
+}
+
+.static-document-grid,
+.static-related__grid{
+    display:grid;
+    gap:var(--arcane-space-4);
+    grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));
+}
+
+.static-document-card{
+    block-size:100%;
+}
+
+.static-document-card .arcane-card__body{
+    display:flex;
+    flex-direction:column;
+    gap:.65rem;
+}
+
+.static-document-card h3{
+    font-size:1.2rem;
+    line-height:1.25;
+    margin:0;
+}
+
+.static-document-card h3 a{
+    color:var(--text-color);
+}
+
+.static-document-card p:last-child{
+    color:var(--arcane-muted);
+    margin:0;
+}
+
+.static-section-all{
+    margin-block-start:clamp(2rem,5vw,4rem);
+}
+
+.static-site-main--document{
+    max-inline-size:104rem;
+}
+
+.static-document-layout{
+    align-items:start;
+    display:grid;
+    gap:clamp(2rem,5vw,5rem);
+    grid-template-columns:minmax(12rem,17rem) minmax(0,1fr);
+}
+
+.static-section-nav{
+    border-inline-end:1px solid var(--arcane-border);
+    max-block-size:calc(100vh - 7rem);
+    overflow-y:auto;
+    padding-inline-end:clamp(1rem,3vw,2rem);
+    position:sticky;
+    scrollbar-gutter:stable;
+    top:6rem;
+}
+
+.static-section-nav>p{
+    font-size:.75rem;
+    font-weight:800;
+    letter-spacing:.12em;
+    margin:0 0 var(--arcane-space-3);
+    text-transform:uppercase;
+}
+
+.static-section-nav ol{
+    list-style:none;
+    margin:0;
+    padding:0;
+}
+
+.static-section-nav__filter{
+    display:grid;
+    gap:.45rem;
+    margin-block:0 var(--arcane-space-4);
+}
+
+.static-section-nav__filter label{
+    color:var(--arcane-muted);
+    font-size:.78rem;
+    font-weight:720;
+}
+
+.static-section-nav__filter-control{
+    display:grid;
+    gap:.4rem;
+    grid-template-columns:minmax(0,1fr) auto;
+}
+
+.static-section-nav__filter input{
+    background:var(--arcane-surface-raised);
+    border:1px solid var(--arcane-border);
+    border-radius:var(--arcane-radius-small);
+    color:var(--text-color);
+    inline-size:100%;
+    min-inline-size:0;
+    padding:.55rem .65rem;
+}
+
+.static-section-nav__filter button{
+    background:var(--arcane-secondary);
+    border:1px solid var(--arcane-border);
+    border-radius:var(--arcane-radius-small);
+    color:var(--text-color);
+    cursor:pointer;
+    font-weight:680;
+    padding:.45rem .6rem;
+}
+
+.static-section-nav__status{
+    color:var(--arcane-muted);
+    font-size:.72rem;
+}
+
+.static-section-nav>ol{
+    display:grid;
+    gap:.2rem;
+}
+
+.static-section-nav>ol>li{
+    display:grid;
+    gap:.25rem;
+}
+
+.static-section-nav details{
+    display:grid;
+    gap:.2rem;
+}
+
+.static-section-nav summary{
+    border-radius:var(--arcane-radius-small);
+    color:var(--text-color);
+    cursor:pointer;
+    font-size:.78rem;
+    font-weight:760;
+    letter-spacing:.04em;
+    padding:.48rem .55rem;
+}
+
+.static-section-nav summary:is(:hover,[aria-current="location"]){
+    background:var(--arcane-secondary);
+}
+
+.static-section-nav__section-link{
+    font-size:.76rem !important;
+    margin-inline:.55rem;
+}
+
+.static-section-nav a{
+    border-radius:var(--arcane-radius-small);
+    color:var(--arcane-muted);
+    display:block;
+    font-size:.87rem;
+    line-height:1.35;
+    overflow-wrap:anywhere;
+    padding:.45rem .55rem;
+    text-decoration:none;
+}
+
+.static-section-nav a:is(:hover,[aria-current="location"],[aria-current="page"]){
+    background:var(--arcane-secondary);
+    color:var(--text-color);
+}
+
+.static-section-nav a[aria-current="page"]{
+    border-inline-start:.2rem solid var(--arcane-focus);
+    font-weight:720;
+}
+
+.static-section-nav li ol{
+    border-inline-start:1px solid var(--arcane-border);
+    margin:.1rem 0 .6rem .55rem;
+    padding-inline-start:.55rem;
+}
+
+.static-section-nav--collection>ol{
+    gap:.45rem;
+}
+
+.static-section-nav--collection summary{
+    text-transform:none;
+}
+
+.static-document{
+    --static-reading-measure:78ch;
+    inline-size:100%;
+    min-inline-size:0;
+}
+
+.static-document>:not(.static-document__content),
+.static-document__content>:not(table){
+    max-inline-size:min(100%,var(--static-reading-measure));
+}
+
+.static-document__header{
+    border-block-end:1px solid var(--arcane-border);
+    margin-block-end:clamp(1.5rem,4vw,2.5rem);
+    padding-block-end:clamp(1.5rem,4vw,2.5rem);
+}
+
+.static-document__header h1{
+    font-size:clamp(2.4rem,5vw,4.15rem);
+    margin:.35rem 0 1rem;
+    overflow-wrap:anywhere;
+}
+
+.static-document__summary{
+    color:var(--arcane-muted);
+    font-size:clamp(1.05rem,2vw,1.23rem);
+    line-height:1.68;
+    margin:0;
+}
+
+.static-document-meta{
+    display:flex;
+    flex-wrap:wrap;
+    gap:.5rem;
+    list-style:none;
+    margin:var(--arcane-space-5) 0 0;
+    padding:0;
+}
+
+.static-document-meta li{
+    background:var(--arcane-secondary);
+    border:1px solid var(--arcane-border);
+    border-radius:999px;
+    color:var(--arcane-muted);
+    font-size:.78rem;
+    padding:.25rem .65rem;
+}
+
+.static-document-callout,
+.static-on-this-page{
+    box-shadow:none;
+    margin-block:var(--arcane-space-5);
+}
+
+.static-document-callout{
+    border-inline-start:.3rem solid var(--arcane-warning);
+}
+
+.static-document-callout ul,
+.static-on-this-page ol{
+    margin-block:.65rem 0;
+    padding-inline-start:1.35rem;
+}
+
+.static-on-this-page ol{
+    columns:2 16rem;
+}
+
+.static-on-this-page li{
+    break-inside:avoid;
+    margin-block:.35rem;
+}
+
+.static-on-this-page li[data-level="3"]{
+    margin-inline-start:.8rem;
+}
+
+.static-document__content{
+    font-size:1rem;
+    line-height:1.75;
+    min-inline-size:0;
+    overflow-wrap:break-word;
+}
+
+.static-document__content :where(h2,h3,h4,h5,h6){
+    font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
+    letter-spacing:-.02em;
+    line-height:1.2;
+    scroll-margin-block-start:6rem;
+    text-wrap:balance;
+}
+
+.static-document__content h2{
+    font-size:clamp(1.65rem,3vw,2.25rem);
+    margin-block:2.75rem 1rem;
+}
+
+.static-document__content h3{
+    font-size:clamp(1.3rem,2vw,1.65rem);
+    margin-block:2rem .75rem;
+}
+
+.static-document__content :where(h4,h5,h6){
+    font-size:1.08rem;
+    margin-block:1.6rem .65rem;
+}
+
+.static-document__content p,
+.static-document__content ul,
+.static-document__content ol,
+.static-document__content blockquote{
+    margin-block:0 1.15rem;
+}
+
+.static-document__content blockquote{
+    border-inline-start:.3rem solid var(--arcane-review);
+    color:var(--arcane-muted);
+    margin-inline:0;
+    padding:.4rem 0 .4rem 1.2rem;
+}
+
+.static-document__content :where(code,kbd){
+    background:var(--arcane-secondary);
+    border-radius:.25rem;
+    font-family:ui-monospace,"Cascadia Code",Consolas,monospace;
+    font-size:.9em;
+    padding:.1em .32em;
+}
+
+.static-document__content pre{
+    background:var(--arcane-secondary);
+    border:1px solid var(--arcane-border);
+    border-radius:var(--arcane-radius-medium);
+    max-inline-size:100%;
+    overflow:auto;
+    padding:clamp(.85rem,2.5vw,1.25rem);
+}
+
+.static-document__content pre code{
+    background:transparent;
+    padding:0;
+}
+
+.static-document__content img{
+    block-size:auto;
+    border:1px solid var(--arcane-border);
+    border-radius:var(--arcane-radius-medium);
+    box-shadow:var(--arcane-shadow-small);
+    display:block;
+    margin-block:1.5rem;
+    max-inline-size:100%;
+}
+
+.static-document__content table{
+    border-collapse:collapse;
+    display:block;
+    inline-size:100%;
+    margin-block:1.5rem;
+    max-inline-size:100%;
+    overflow-x:auto;
+    overscroll-behavior-inline:contain;
+}
+
+.static-document__content table :where(code,kbd){
+    overflow-wrap:normal;
+    white-space:normal;
+    word-break:normal;
+}
+
+.static-document__content pre:focus-visible,
+.static-document__content table:focus-visible{
+    outline:3px solid var(--arcane-focus);
+    outline-offset:.2rem;
+}
+
+.static-document__content :where(th,td){
+    border:1px solid var(--arcane-border);
+    padding:.65rem .75rem;
+    text-align:start;
+    vertical-align:top;
+}
+
+.static-document__content th{
+    background:var(--arcane-secondary);
+}
+
+.document-image-fallback{
+    background:var(--arcane-secondary);
+    border:1px dashed var(--arcane-border);
+    border-radius:var(--arcane-radius-small);
+    color:var(--arcane-muted);
+    display:block;
+    font-size:.88rem;
+    margin-block:1rem;
+    padding:.75rem;
+}
+
+.static-document__source{
+    border-block-start:1px solid var(--arcane-border);
+    font-size:.88rem;
+    margin-block:clamp(2rem,5vw,4rem);
+    padding-block-start:var(--arcane-space-4);
+}
+
+.static-related{
+    margin-block:clamp(2.5rem,6vw,5rem);
+}
+
+.static-related__grid{
+    grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
+}
+
+.static-previous-next{
+    border-block-start:1px solid var(--arcane-border);
+    display:grid;
+    gap:var(--arcane-space-4);
+    grid-template-columns:repeat(2,minmax(0,1fr));
+    padding-block-start:var(--arcane-space-5);
+}
+
+.static-previous-next a{
+    background:var(--arcane-surface-raised);
+    border:1px solid var(--arcane-border);
+    border-radius:var(--arcane-radius-medium);
+    color:var(--text-color);
+    display:grid;
+    gap:.25rem;
+    padding:var(--arcane-space-4);
+    text-decoration:none;
+}
+
+.static-previous-next a:last-child{
+    text-align:end;
+}
+
+.static-previous-next span{
+    color:var(--arcane-muted);
+    font-size:.75rem;
+    letter-spacing:.08em;
+    text-transform:uppercase;
+}
+
+.static-not-found{
+    align-content:center;
+    display:grid;
+    min-block-size:100vh;
+    max-inline-size:52rem;
+}
+
+.static-not-found h1{
+    font-size:clamp(2.8rem,7vw,5.5rem);
+    margin:.2rem 0 1rem;
+}
+
+.static-not-found>p:not(.eyebrow){
+    color:var(--arcane-muted);
+    font-size:1.15rem;
+}
+
+.static-site-footer{
+    border-block-start:1px solid var(--arcane-border);
+    color:var(--arcane-muted);
+    font-size:.84rem;
+}
+
+.static-site-footer__inner{
+    align-items:center;
+    display:flex;
+    gap:var(--arcane-space-5);
+    justify-content:space-between;
+    min-block-size:7rem;
+    padding-block:var(--arcane-space-5);
+}
+
+@media (max-width:72rem){
+    .static-site-header{
+        position:static;
+    }
+
+    .static-site-header__inner{
+        align-items:flex-start;
+        flex-wrap:wrap;
+    }
+
+    .static-site-nav{
+        flex-wrap:wrap;
+        justify-content:flex-start;
+        order:3;
+        inline-size:100%;
+    }
+
+    .static-site-header__inner>.arcane-badge{
+        margin-inline-start:auto;
+    }
+
+    .static-hero{
+        grid-template-columns:1fr;
+        min-block-size:0;
+    }
+
+    .static-hero__copy{
+        max-inline-size:54rem;
+    }
+
+    .static-hero__visual{
+        max-inline-size:52rem;
+        transform:none;
+    }
+}
+
+@media (max-width:58rem){
+    .static-document-layout{
+        display:flex;
+        flex-direction:column;
+    }
+
+    .static-document{
+        order:1;
+    }
+
+    .static-section-nav{
+        border:1px solid var(--arcane-border);
+        border-radius:var(--arcane-radius-medium);
+        inline-size:100%;
+        max-block-size:none;
+        order:2;
+        overflow:visible;
+        padding:var(--arcane-space-4);
+        position:static;
+    }
+
+    .static-section-nav>ol{
+        grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));
+    }
+
+    .static-section-nav li ol{
+        border:0;
+        margin-inline:0;
+        padding-inline:0;
+    }
+
+    .static-document{
+        inline-size:100%;
+    }
+}
+
+@media (max-width:38rem){
+    .static-site-header__inner,
+    .static-site-footer__inner,
+    .static-site-main{
+        padding-inline:clamp(.9rem,5vw,1.25rem);
+    }
+
+    .static-site-brand span:last-child{
+        max-inline-size:8.5rem;
+    }
+
+    .static-hero{
+        gap:var(--arcane-space-6);
+        grid-template-columns:minmax(0,1fr);
+    }
+
+    .static-hero__visual{
+        inline-size:100%;
+    }
+
+    .static-hero h1,
+    .static-page-heading h1,
+    .static-document__header h1{
+        overflow-wrap:anywhere;
+    }
+
+    .static-section-card{
+        min-block-size:0;
+    }
+
+    .static-on-this-page ol{
+        columns:1;
+    }
+
+    .static-previous-next{
+        grid-template-columns:1fr;
+    }
+
+    .static-previous-next a:last-child{
+        text-align:start;
+    }
+
+    .static-site-footer__inner{
+        align-items:flex-start;
+        flex-direction:column;
+        justify-content:center;
+    }
+}
+
+@media (forced-colors:active){
+    .static-site-brand__mark,
+    .static-section-card,
+    .static-document-meta li,
+    .static-document__content :where(th,td),
+    .static-previous-next a{
+        border-color:CanvasText;
+    }
+
+    .static-doc-site :where(a,button,input,summary):focus-visible{
+        outline-color:Highlight;
+    }
+
+    .static-document__content pre:focus-visible,
+    .static-document__content table:focus-visible{
+        outline-color:Highlight;
+    }
+}
+
+@media print{
+    .static-site-header,
+    .static-site-footer,
+    .static-section-nav,
+    .static-previous-next,
+    .static-related,
+    .static-document__source,
+    .skip-link{
+        display:none;
+    }
+
+    .static-site-main,
+    .static-site-main--document{
+        max-inline-size:none;
+        padding:0;
+    }
+
+    .static-document-layout{
+        display:block;
+    }
+
+    .static-document{
+        inline-size:100%;
+    }
+
+    .static-document__content table{
+        display:table;
+        overflow:visible;
+    }
+
+    .static-document__content table :where(code,kbd){
+        overflow-wrap:anywhere;
+        word-break:break-word;
+    }
+}