html:has(body.paper.modern) { overflow-anchor: none; }
body.paper.modern {
    --lift: .34s cubic-bezier(.22, .61, .36, 1);
    font-family: var(--sans), "Segoe UI", sans-serif;
    color-scheme: light;
    overflow-anchor: none;
}
body.paper.modern.night {
    --ink: #e0e0e0;
    --muted: #a1a1aa;
    --paper: #0c0c0e;
    --paper-light: #17171a;
    --paper-dark: #101012;
    --soft: #17171a;
    --line: rgba(255, 255, 255, .1);
    --copper: #e08a4f;
    color-scheme: dark;
    background-color: #0c0c0e;
    color: var(--ink);
}
body.paper.modern.day {
    --ink: #1c1b19;
    --muted: #5e5a54;
    --paper: #f4f1ea;
    --paper-light: #fff;
    --paper-dark: #e7e1d6;
    --soft: #fff;
    --line: rgba(28, 27, 25, .1);
    --copper: #c45c26;
    background-color: #f4f1ea;
    color: var(--ink);
}
body.paper.modern.night :is(.blog-lead h1, .tile-copy h2, .topic-copy h2, .topic-name, .topic-x) { color: var(--ink); }
body.paper.modern.night :is(.piece > .deck, .piece .copy, .editor-body, .blog-lead .deck, .topic-copy p) { color: var(--muted); }
body.paper.modern,
body.paper.modern[data-texture] {
    background-image: none;
}
body.paper.modern main,
body.paper.modern .foot {
    width: min(1180px, calc(100% - 2rem));
}
body.paper.modern .modern-top {
    align-items: center;
    gap: .8rem;
    border-bottom: 1px solid var(--line);
    background: var(--paper);
    background: color-mix(in srgb, var(--paper) 88%, transparent);
    backdrop-filter: blur(16px) saturate(1.2);
    -webkit-backdrop-filter: blur(16px) saturate(1.2);
    width: 100%;
    margin-bottom: 1.2rem;
    padding-top: 1.15rem;
    padding-bottom: 1.05rem;
    padding-inline: max(1rem, calc((100% - 1180px) / 2));
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0);
    overflow-anchor: none;
    transition: padding var(--lift), box-shadow var(--lift);
}
body.paper.modern .modern-top.lifted {
    border-bottom-color: var(--line);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .14);
    padding-top: .45rem;
    padding-bottom: .4rem;
}
body.paper.modern .modern-top.lifted .mark { font-size: 1.25rem; }
body.paper.modern[data-shape="blog"] main,
body.paper.modern[data-shape="blog"] .foot {
    width: min(1520px, calc(100% - 3rem));
}
body.paper.modern[data-shape="blog"] .modern-top {
    padding-inline: max(1.5rem, calc((100% - 1520px) / 2));
}
body.paper.modern .mark { font-size: 1.85rem; flex: 0 0 auto; transition: font-size var(--lift); }
body.paper.modern .mark-on-dark { display: none; }
body.paper.modern.night .mark-on-ink { display: none; }
body.paper.modern.night .mark-on-dark { display: inline; }
body.paper.modern.night .colophon .mark-on-dark { display: block; }
body.paper.modern .bar-clip { display: contents; }
body.paper.modern .modern-bar {
    display: flex;
    align-items: center;
    gap: .55rem;
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 1.65rem;
}
body.paper.modern .modern-top button,
body.paper.modern .modern-dock button {
    width: auto;
    margin: 0;
    background: transparent;
    color: inherit;
    border: 0;
    padding: .4rem .7rem;
    font: inherit;
    font-weight: 680;
    letter-spacing: 0;
    text-transform: none;
    cursor: pointer;
}
body.paper.modern .modern-top input[type="hidden"],
body.paper.modern .modern-dock input[type="hidden"] { display: none; }
body.paper.modern .modern-top .today { margin: 0; flex: 0 0 auto; }
body.paper.modern .modern-top .today summary {
    font-weight: 700;
    color: var(--ink);
    list-style: none;
}
body.paper.modern .modern-sections {
    display: flex;
    align-items: center;
    gap: .15rem;
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
    flex-wrap: nowrap;
    overflow: hidden;
    scrollbar-width: none;
}
body.paper.modern .modern-sections::-webkit-scrollbar { display: none; }
body.paper.modern .modern-sections button {
    border-radius: 999px;
    color: var(--muted);
    white-space: nowrap;
    flex: 0 0 auto;
}
body.paper.modern .modern-sections button.here {
    color: var(--ink);
    box-shadow: inset 0 -2px 0 var(--copper);
    border-radius: 0;
}
body.paper.modern .modern-tools {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-left: auto;
    min-width: 0;
}
body.paper.modern .modern-top .find {
    flex: 1 1 12rem;
    width: 11.5rem;
    max-width: 16rem;
    margin: 0;
}
body.paper.modern .modern-top .find input {
    background: var(--paper-light);
    border: 1px solid var(--line);
    color: var(--ink);
}
body.paper.modern .find-list {
    background: var(--paper-light);
    color: var(--ink);
    border-color: var(--line);
}
.find-list.find-hint { width: 100%; padding: .15rem; }
.find-need {
    margin: 0;
    padding: .4rem .75rem;
    color: var(--copper);
    font-family: var(--sans), "Segoe UI", sans-serif;
    font-size: .8rem;
    font-weight: 680;
    letter-spacing: .01em;
}
body.paper.modern .modern-top .tone-button {
    display: grid;
    place-items: center;
    width: 2.3rem;
    height: 2.3rem;
    min-width: 2.3rem;
    min-height: 2.3rem;
    aspect-ratio: 1;
    flex: 0 0 2.3rem;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--paper-light);
    overflow: hidden;
}
body.paper.modern .tone-button svg { width: 1.2rem; height: 1.2rem; display: block; }
body.paper.modern .back-button { display: none; }
body.paper.modern.day .modern-top .tone-button,
body.paper.modern.day .modern-top .search-button,
body.paper.modern.day .paper-more summary {
    background: #1c1b19;
    color: #f6f3ee;
    border-color: #1c1b19;
}
body.paper.modern.night .modern-top .tone-button,
body.paper.modern.night .modern-top .search-button,
body.paper.modern.night .paper-more summary {
    background: #242428;
    color: #f4f4f5;
    border-color: rgba(255, 255, 255, .18);
}
body.paper.modern .shape-switch {
    display: inline-flex;
    padding: .16rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--ink) 8%, transparent);
}
body.paper.modern .shape-switch button { color: var(--muted); border-radius: 999px; }
body.paper.modern .shape-switch button.here {
    background: var(--ink);
    color: var(--paper);
}
body.paper.modern .modern-links { display: flex; gap: .85rem; margin-left: .2rem; }
body.paper.modern .modern-links a { color: var(--muted); text-decoration: none; font-weight: 650; font-size: .92rem; }
body.paper.modern .modern-links a:hover { color: var(--ink); }
body.paper.modern .today-menu {
    background: var(--paper-light);
    color: var(--ink);
    border: 1px solid var(--line);
}
body.paper.modern .today-menu a.here { color: var(--copper); }

.pill {
    display: inline-block;
    margin: 0;
    padding: .16rem .42rem;
    border-radius: .28rem;
    background: #c45c26;
    color: #fff;
    font-family: var(--sans), "Segoe UI", sans-serif;
    font-size: .66rem;
    font-weight: 750;
    letter-spacing: .06em;
    text-transform: uppercase;
    line-height: 1.3;
}
.pill[data-section="gaming"] { background: #2f6fed; }

.blog-hero {
    display: grid;
    grid-template-columns: minmax(15rem, .78fr) minmax(0, 1.45fr);
    gap: .9rem;
    align-items: stretch;
}
.blog-side { display: grid; grid-template-rows: 1fr 1fr; gap: .9rem; min-height: 100%; }
.modern-tile {
    display: flex;
    flex-direction: column;
    position: relative;
    min-height: 11rem;
    height: 100%;
    border-radius: 1.05rem;
    overflow: hidden;
    background: #1a1a1a;
}
.modern-tile > a { display: block; flex: 1; min-height: 11rem; color: inherit; text-decoration: none; position: relative; }
.modern-tile .frame { position: absolute; inset: 0; }
.modern-tile .frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tile-copy {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    padding: 2.2rem .9rem .8rem;
    background: linear-gradient(transparent, rgba(0, 0, 0, .82));
    color: #fff;
}
.tile-copy h2 { margin: .4rem 0 0; color: #fff; font-size: 1.02rem; line-height: 1.25; }
.blog-lead {
    display: flex;
    flex-direction: column;
    min-height: 28rem;
    border-radius: 1.15rem;
    overflow: hidden;
    background: #141416;
    color: #f5f5f5;
}
.blog-lead > a {
    display: flex;
    flex: 1;
    flex-direction: column;
    width: 100%;
    color: inherit;
    text-decoration: none;
}
.blog-lead .frame { position: relative; flex: 1 1 auto; min-height: 15rem; background: #222; }
.blog-lead .frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.blog-lead-copy { padding: 1rem 1.15rem 1.15rem; }
.blog-lead h1 { margin: .55rem 0 .35rem; color: #fff; font-size: clamp(1.55rem, 2.5vw, 2.25rem); letter-spacing: -.03em; }
.blog-lead .deck { margin: 0 0 .7rem; max-width: none; color: #c6c6c6; font-size: 1rem; line-height: 1.45; }
.blog-lead .when { margin: 0; color: #9b9b9b; }

.topic-row {
    display: flex;
    gap: .85rem;
    overflow-x: auto;
    padding: 1.15rem .05rem 1.25rem;
    scrollbar-width: none;
}
.topic-row::-webkit-scrollbar { display: none; }
.topic {
    flex: 0 0 auto;
    width: 5.5rem;
    color: inherit;
    text-align: center;
    text-decoration: none;
    font-size: .72rem;
    line-height: 1.25;
}
.topic-face {
    display: grid;
    place-items: center;
    width: 4.35rem;
    height: 4.35rem;
    margin: 0 auto .4rem;
    border: 2px solid #c45c26;
    border-radius: 50%;
    overflow: hidden;
    background: #2a2a2e;
    color: #fff;
    font-weight: 750;
}
.topic:nth-child(3n) .topic-face { border-color: #2f6fed; }
.topic:nth-child(3n+2) .topic-face { border-color: #d4a017; }
.topic-face img { width: 100%; height: 100%; object-fit: cover; }
.topic > span:last-child {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.modern-kicker { margin: .2rem 0 .85rem; font-size: 1.15rem; }
.modern-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}
.modern-card {
    min-width: 0;
    background: var(--paper-light);
    border-radius: 1rem;
    overflow: hidden;
}
.modern-card > a { display: block; position: relative; color: inherit; text-decoration: none; }
.modern-card .frame { aspect-ratio: 16 / 10; background: #222; overflow: hidden; }
.modern-card .frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.modern-card .pill { position: absolute; top: .7rem; left: .7rem; z-index: 1; }
.modern-copy { padding: .8rem .9rem 1rem; }
.modern-card h2 { margin: 0 0 .35rem; font-size: 1.05rem; letter-spacing: -.02em; line-height: 1.25; }
.modern-card .deck {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0;
    max-width: none;
    color: var(--muted);
    font-size: .92rem;
    line-height: 1.4;
}
.frame.modern-plate { background: #243044; }
.modern-plate[data-hue="0"] { background: linear-gradient(145deg, #3a241c, #c45c26); }
.modern-plate[data-hue="1"] { background: linear-gradient(145deg, #1c2a44, #2f6fed); }
.modern-plate[data-hue="2"] { background: linear-gradient(145deg, #2c2416, #c9a227); }
.modern-plate[data-hue="3"] { background: linear-gradient(145deg, #1d2e2a, #2f9d78); }
.modern-plate[data-hue="4"] { background: linear-gradient(145deg, #2e1c2a, #a84b86); }
.modern-plate[data-hue="5"] { background: linear-gradient(145deg, #241f1c, #6d655c); }

.feed-layout {
    display: grid;
    grid-template-columns: minmax(0, 42rem) minmax(15rem, 20rem);
    gap: 1.6rem;
    align-items: start;
    width: 100%;
}
.feed-stream, .feed-post, .blog-hero, .blog-side, .modern-grid, .topic-row { min-width: 0; max-width: 100%; }
.feed-post h2, .tile-copy h2, .blog-lead h1, .modern-card h2 { overflow-wrap: anywhere; }
.tile-copy h2 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.feed-post { padding: .35rem 0 1.15rem; border-bottom: 1px solid var(--line); }
.feed-meta { display: flex; align-items: center; gap: .6rem; margin: .85rem 0 .35rem; color: var(--muted); font-size: .88rem; }
.feed-post h2 { margin: .2rem 0 .35rem; font-size: 1.28rem; letter-spacing: -.02em; }
.feed-post h2 a { text-decoration: none; }
.feed-post h2 a:hover { color: var(--copper); }
.feed-post .deck { margin: 0; max-width: 40rem; color: var(--muted); font-size: 1rem; line-height: 1.45; }
.feed-photo { display: block; margin-top: .8rem; }
.feed-photo .frame { border-radius: .95rem; overflow: hidden; aspect-ratio: 16 / 9; background: #222; }
.feed-photo .frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.feed-side {
    position: sticky;
    top: 5.2rem;
    padding: .95rem 1rem .4rem;
    background: var(--paper-light);
    border-radius: 1rem;
}
.feed-side h2 { margin: 0 0 .35rem; font-size: 1rem; }
.topic-line {
    display: flex;
    justify-content: space-between;
    gap: .7rem;
    padding: .62rem 0;
    border-top: 1px solid var(--line);
    color: inherit;
    text-decoration: none;
    font-weight: 680;
}
.topic-line span:last-child { color: var(--muted); font-weight: 550; }
.topic-line:hover { color: var(--copper); }

.topic-view {
    position: fixed;
    inset: 0;
    margin: auto;
    width: min(24rem, calc(100vw - 2rem));
    height: min(40rem, calc(100vh - 2rem));
    height: min(40rem, calc(100dvh - 2rem));
    max-height: none;
    padding: 0;
    border: 0;
    border-radius: 1.15rem;
    overflow: visible;
    background: transparent;
    color: #f5f5f5;
    overscroll-behavior: none;
    touch-action: none;
    z-index: 80;
}
.topic-view[open] { display: flex; flex-direction: column; }
.topic-view::backdrop { background: rgba(0, 0, 0, .72); }
html.topic-hold,
html.topic-hold body {
    overflow: hidden;
    overscroll-behavior: none;
}
html.topic-hold { scroll-behavior: auto; }
.topic-x {
    position: absolute;
    top: .55rem;
    right: .55rem;
    z-index: 2;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border-radius: 999px;
    background: rgba(0, 0, 0, .45);
    color: #fff;
    font-size: 1.3rem;
    line-height: 1;
}
.topic-view > form { position: absolute; inset: 0 0 auto; margin: 0; z-index: 2; }
.topic-name {
    flex: 0 0 auto;
    margin: 0;
    padding: .8rem 3.2rem .8rem .95rem;
    border-radius: 1.15rem 1.15rem 0 0;
    background: #111;
    font-weight: 750;
    line-height: 1.3;
    overflow-wrap: anywhere;
}
.topic-reel { position: relative; flex: 1 1 0; min-height: 0; perspective: 6000px; overflow: clip; border-radius: 0 0 1.15rem 1.15rem; }
.topic-pane {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    border-radius: 0 0 1.15rem 1.15rem;
    background: #111;
}
.topic-rotor { position: absolute; inset: 0; z-index: 1; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; }
.topic-side {
    position: absolute;
    inset: 0;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
.topic-side > .topic-pane::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 6;
    border: 1px solid rgba(225, 201, 179, .42);
    border-radius: inherit;
    pointer-events: none;
}
.topic-stage { position: relative; flex: 1 1 0; min-height: 2.2rem; overflow: hidden; }
.topic-frame { height: 100%; background: #1c1c1c; overflow: hidden; }
.topic-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.topic-bars {
    position: absolute;
    z-index: 3;
    top: .55rem;
    left: .7rem;
    right: .7rem;
    display: flex;
    gap: .28rem;
    pointer-events: auto;
}
.topic-stage::before {
    content: "";
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    top: 0;
    height: 2.6rem;
    background: linear-gradient(rgba(0, 0, 0, .55), transparent);
    pointer-events: none;
}
.topic-view .topic-bars button {
    flex: 1 1 0;
    height: .42rem;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, .55);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .45);
    color: transparent;
}
.topic-view .topic-bars button.here { background: #e08a4f; }
.topic-view .topic-bars[hidden] { display: none; }
.topic-view .topic-hit {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: 28%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: transparent;
}
.topic-view .topic-hit.prev { left: 0; }
.topic-view .topic-hit.next { right: 0; }
.topic-view .topic-hit[hidden] { display: none; }
.topic-copy { flex: 0 0 auto; min-width: 0; padding: .8em 1em 1em; font-size: calc(1rem * var(--topic-scale, 1)); line-height: 1.4; overflow-wrap: anywhere; }
.topic-copy h2 { margin: .4em 0; color: #fff; font-size: 1.2em; line-height: 1.2; }
.topic-copy p { margin: .65em 0; color: #c8c8c8; }
.topic-copy .pill { margin: 0; padding: .2em .55em; font-size: .7em; }
.topic-meta { display: flex; justify-content: space-between; gap: .6em; color: #9a9a9a; font-size: .8em; }
.topic-copy .topic-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .9em; margin: .7em 0 0; font-size: .9em; }
.topic-open {
    display: inline-block;
    padding: .55em .9em;
    border-radius: 999px;
    background: #fff;
    color: #111;
    text-decoration: none;
    font-weight: 750;
}
.topic-actions a:last-child { color: #ddd; }
@media (max-height: 540px) and (min-width: 600px) {
    .topic-view { width: min(46rem, calc(100vw - 2rem)); }
    .topic-pane { display: grid; grid-template-columns: 40% minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
    .topic-stage { min-height: 0; border-bottom-left-radius: 1.15rem; }
    .topic-copy { align-self: center; }
}

body.paper.modern .quiet { max-width: 40rem; }
body.paper.modern .piece { max-width: 44rem; }
body.paper.modern[data-shape="blog"] .piece[data-story-rail] {
    width: 75%;
    max-width: 75%;
    margin-inline: auto;
}
body.paper.modern[data-shape="blog"] .piece[data-story-rail] h1 {
    font-size: calc(clamp(2.05rem, 3.1vw, 3.2rem) * var(--story, 1) * var(--reader, 1));
}
body.paper.modern[data-shape="blog"] .piece[data-story-rail] .deck { max-width: none; }
body.paper.modern .piece h1,
body.paper.modern .quiet h1 { letter-spacing: -.03em; }
body.paper.modern .piece .copy,
body.paper.modern .editor-body { font-family: var(--serif), Georgia, serif; }
body.paper.modern .piece .frame.wide { border-radius: 1.05rem; overflow: hidden; }
body.paper.modern .piece > .pill { margin: .2rem 0 .75rem; }
.hash-row { display: flex; flex-wrap: wrap; gap: .4rem .8rem; margin: .15rem 0 1rem; }
.hash-row a { color: var(--copper); font-weight: 720; text-decoration: none; }
.hash-row a.followed { box-shadow: inset 0 -2px 0 var(--copper); }
.topic-line.followed { color: var(--copper); }
body.paper.modern .hit {
    margin: 0 0 .7rem;
    padding: .9rem 1rem;
    background: var(--paper-light);
    border: 0;
    border-radius: .9rem;
}
body.paper.modern .hits { max-width: none; }
body.paper.modern .edition-video { border-radius: 1rem; overflow: hidden; }
body.paper.modern.night .reader::before,
body.paper.modern.night .to-top::before { background: rgba(20, 20, 22, .78); }
body.paper.modern.night .to-top,
body.paper.modern.night .reader { color: #fff; }
body.paper.modern .consent {
    background: var(--paper-light);
    color: var(--ink);
    border: 1px solid var(--line);
}
.modern-dock { display: none; }

@media (max-width: 980px) {
    .modern-grid { grid-template-columns: 1fr 1fr; }
    .blog-hero { grid-template-columns: 1fr; }
    .blog-lead { order: -1; min-height: 0; }
    .feed-layout { grid-template-columns: 1fr; }
    .feed-side { position: static; }
}
@media (max-width: 860px) {
    body.paper.modern .modern-top {
        --chrome: clamp(34px, 12vw, 40px);
        --lift: .46s cubic-bezier(.22, .61, .36, 1);
        display: grid;
        grid-template-columns: auto auto minmax(0, 1fr);
        grid-template-areas: "logo pages tools" "bar bar bar";
        align-items: center;
        column-gap: clamp(6px, 2vw, 12px);
        row-gap: .4rem;
        padding-top: .7rem;
        padding-bottom: .55rem;
        padding-inline: max(12px, env(safe-area-inset-left, 0px)) max(12px, env(safe-area-inset-right, 0px));
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        isolation: isolate;
        transition: padding var(--lift), row-gap var(--lift), box-shadow var(--lift);
    }
    body.paper.modern .modern-top::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: color-mix(in srgb, var(--paper) 88%, transparent);
        backdrop-filter: blur(16px) saturate(1.2);
        -webkit-backdrop-filter: blur(16px) saturate(1.2);
    }
    body.paper.modern .modern-top > * { position: relative; z-index: 1; }
    body.paper.modern .modern-top > .paper-more { z-index: 8; }
    body.paper.modern .modern-top > .mark,
    body.paper.modern .modern-top.lifted > .mark {
        grid-area: logo;
        min-width: 0;
        max-width: 46vw;
        font-size: 1rem;
        line-height: 0;
        transition: none;
    }
    body.paper.modern .modern-top > .mark img {
        height: clamp(16px, 6.8vw, 26px);
        width: auto;
        max-width: 100%;
        transform: translateZ(0) scale(1);
        transform-origin: left center;
        transition: transform var(--lift);
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
    }
    body.paper.modern .modern-top > .mark .mark-on-dark { display: none; }
    body.paper.modern.night .modern-top > .mark .mark-on-ink { display: none; }
    body.paper.modern.night .modern-top > .mark .mark-on-dark { display: inline; }
    body.paper.modern .modern-tools {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-end;
        gap: 0;
        grid-area: tools;
        min-width: 0;
        margin: 0;
    }
    body.paper.modern .modern-tools > * + * { margin-left: clamp(10px, 2.8vw, 14px); }
    body.paper.modern .modern-top .back-button {
        display: grid;
        place-items: center;
        width: 0;
        min-width: 0;
        height: var(--chrome);
        margin: 0;
        padding: 0;
        border-width: 0;
        border-radius: 50%;
        opacity: 0;
        overflow: hidden;
        pointer-events: none;
        transform: scale(.86);
        transition: width var(--lift), min-width var(--lift), opacity .28s ease, transform var(--lift), border-width var(--lift);
    }
    body.paper.modern .modern-top .back-button + * { margin-left: 0; transition: margin-left var(--lift); }
    body.paper.modern .bar-clip {
        display: grid;
        grid-area: bar;
        grid-template-rows: 1fr;
        min-height: 0;
        overflow: visible;
        transition: grid-template-rows var(--lift);
    }
    body.paper.modern .modern-top.clip .bar-clip { overflow: hidden; }
    body.paper.modern .modern-bar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        flex: none;
        width: 100%;
        min-width: 0;
        min-height: 0;
        margin: 0;
        max-height: none;
        overflow: visible;
        transition: opacity .28s ease;
    }
    body.paper.modern .modern-top.clip .modern-bar { overflow: hidden; }
    body.paper.modern .modern-top .today { width: auto; margin: 0 .35rem 0 0; }
    body.paper.modern .row-break { display: none; }
    body.paper.modern .today-menu {
        left: auto;
        right: 0;
        width: min(15rem, calc(100vw - 1.5rem));
    }
    body.paper.modern .section-line { flex: 1 1 100%; min-width: 0; margin-top: .2rem; }
    body.paper.modern .modern-sections { flex: 1 1 auto; min-width: 0; margin-top: 0; overflow: hidden; }
    body.paper.modern .more-news { flex: 0 0 auto; margin-top: 0; }
    body.paper.modern .modern-top .find { position: absolute; width: 2.3rem; max-width: 2.3rem; margin: 0; opacity: 0; pointer-events: none; }
    body.paper.modern .shape-switch,
    body.paper.modern .modern-links { display: none; }
    .modern-grid { grid-template-columns: 1fr; }
    body.paper.modern .modern-top.compact { row-gap: 0; padding-top: .4rem; padding-bottom: .32rem; }
    body.paper.modern .modern-top.compact .bar-clip { grid-template-rows: 0fr; }
    body.paper.modern .modern-top.compact .back-button {
        width: var(--chrome);
        min-width: var(--chrome);
        opacity: 1;
        border-width: 1px;
        border-radius: 50%;
        pointer-events: auto;
        transform: scale(1);
    }
    body.paper.modern .modern-top.compact .back-button + * { margin-left: clamp(10px, 2.8vw, 14px); }
    body.paper.modern .back-button svg { width: 18px; height: 18px; display: block; }
    body.paper.modern .modern-top.compact .modern-bar {
        opacity: 0;
        pointer-events: none;
    }
    body.paper.modern .modern-top.compact > .mark img { transform: translateZ(0) scale(.72); }
    body.paper.modern .consent { bottom: calc(1.15rem + env(safe-area-inset-bottom, 0px)); }
}
@media (prefers-reduced-motion: reduce) {
    .topic-view, .modern-top, .modern-top::before, .bar-clip, .modern-bar, .mark, .mark img, .back-button, .reader-menu, .shape-switch::before, .frame img, .topic-face img, .more-news .today-menu { transition: none; }
}

body.paper.modern .frame,
body.paper.modern .topic-face { overflow: hidden; }
body.paper.modern .frame img,
body.paper.modern .topic-face img { transition: transform .45s ease; }
@media (hover: none) {
    body.paper.modern .frame img,
    body.paper.modern .topic-face img { transition: none; }
}
body.paper.modern .modern-card:hover .frame img,
body.paper.modern .modern-tile:hover .frame img,
body.paper.modern .feed-photo:hover .frame img,
body.paper.modern .blog-lead:hover .frame img,
body.paper.modern .topic:hover .topic-face img { transform: scale(1.06); }
body.paper.modern .modern-card:hover h2,
body.paper.modern .modern-tile:hover h2,
body.paper.modern .feed-post:hover h2 a,
body.paper.modern .blog-lead:hover h1,
body.paper.modern .topic:hover > span:last-child,
body.paper.modern .more-link { color: var(--copper); }
body.paper.modern .more-link {
    display: inline-block;
    margin-top: .55rem;
    font-weight: 750;
    text-decoration: none;
}

body.paper.modern .shape-switch { position: relative; display: grid; grid-template-columns: 1fr 1fr; min-width: 8.4rem; }
body.paper.modern .shape-switch::before {
    content: "";
    position: absolute;
    top: .16rem;
    bottom: .16rem;
    left: .16rem;
    width: calc(50% - .16rem);
    border-radius: 999px;
    background: var(--copper);
    transition: transform .22s ease;
}
body.paper.modern .shape-switch:has(button[value="feed"].here)::before { transform: translateX(100%); }
body.paper.modern .shape-switch button { position: relative; z-index: 1; background: transparent; }
body.paper.modern .shape-switch button.here { background: transparent; color: #1c120c; }
body.paper.modern.day .shape-switch button.here { color: #fff; }
body.paper.modern .section-line { display: flex; flex-wrap: nowrap; align-items: center; gap: .1rem; min-width: 0; }
body.paper.modern .more-news { position: relative; flex: 0 0 auto; display: flex; align-items: center; align-self: center; margin: 0; }
body.paper.modern .more-news summary {
    display: flex;
    align-items: center;
    margin: 0;
    padding: .4rem .7rem;
    font: inherit;
    font-weight: 680;
    line-height: 1.2;
    color: var(--muted);
    list-style: none;
    cursor: pointer;
}
body.paper.modern .more-news summary::-webkit-details-marker,
body.paper.modern .paper-more summary::-webkit-details-marker { display: none; }
body.paper.modern .more-news summary::marker,
body.paper.modern .paper-more summary::marker { content: none; }
body.paper.modern .more-news summary.here { color: var(--ink); box-shadow: inset 0 -2px 0 var(--copper); }
body.paper.modern .more-news .today-menu { min-width: 14rem; }
body.paper.modern .more-news .today-menu p { margin: .35rem .6rem; color: var(--muted); font-size: .92rem; }
body.paper.modern .more-news .today-menu button {
    display: block;
    width: 100%;
    text-align: left;
    background: transparent;
    color: var(--ink);
}
body.paper.modern .more-news .today-menu button.here { color: var(--copper); }

body.paper.modern.night .archive-pick select,
body.paper.modern.night select,
body.paper.modern.night input,
body.paper.modern.night textarea {
    background: #17171a;
    color: #f4f4f5;
    border-color: rgba(255, 255, 255, .16);
}
body.paper.modern.night option { background: #17171a; color: #f4f4f5; }

body.paper.modern .search-button,
body.paper.modern .paper-more,
body.paper.modern .row-break { display: none; }

.reader-shade {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 24;
    border: 0;
    background: rgba(0, 0, 0, .45);
}
body.menu-open .reader-shade { display: block; }
.reader-menu {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 25;
    width: min(22rem, 100%);
    padding: 1.1rem 1.15rem 2rem;
    overflow: auto;
    background: var(--paper);
    color: var(--ink);
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 40px rgba(0, 0, 0, .18);
    transform: translateX(104%);
    transition: transform .22s ease;
}
body.menu-open .reader-menu { transform: none; }
body.menu-open .reader,
body.menu-open .to-top { opacity: 0; pointer-events: none; }
.reader-menu-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.reader-menu h2 { margin: 0; font-size: 1.35rem; }
.reader-menu h3 { margin: 1.3rem 0 .55rem; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.reader-x {
    width: 2.2rem;
    height: 2.2rem;
    padding: 0;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--paper-light);
    color: var(--ink);
    font-size: 1.3rem;
    line-height: 1;
}
.theme-switch { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.theme-switch button,
.reader-go,
.reader-google {
    border: 1px solid var(--line);
    background: var(--paper-light);
    color: var(--ink);
    border-radius: 999px;
}
.theme-switch button.here,
a.reader-go {
    background: var(--ink);
    color: var(--paper);
    text-decoration: none;
}
.reader-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.account-actions { display: grid; gap: .55rem; margin-top: .85rem; }
.account-actions form { margin: 0; }
.account-actions a,
.account-actions button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    width: 100%;
    min-height: 2.75rem;
    margin: 0;
    padding: .55rem .9rem;
    border-radius: 999px;
    border: 1px solid var(--line);
    text-decoration: none;
    font-weight: 720;
}
.account-actions .reader-go { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.account-actions .reader-line { background: transparent; color: var(--ink); }
.account-actions .reader-google { background: #fff; color: #1f1f1f; }
.account-actions .reader-google svg { width: 1.05rem; height: 1.05rem; flex: 0 0 auto; }
.terms-note { overflow: auto; }
.reader-who { display: grid; gap: .15rem; }
.reader-who span { color: var(--muted); }
.reader-menu .fine { text-transform: none; letter-spacing: 0; font-size: .92rem; }
body.paper.modern .modern-card,
body.paper.modern .blog-lead,
body.paper.modern .modern-tile,
body.paper.modern .feed-post {
    border: 1px solid var(--line);
    --card-shadow: 0 12px 22px -14px rgba(224, 138, 79, .22), 0 14px 34px rgba(0, 0, 0, .16);
    box-shadow: var(--card-shadow);
    transition: box-shadow .2s ease;
}
@media (hover: hover) and (pointer: fine) {
    body.paper.modern :is(.modern-card, .blog-lead, .modern-tile, .feed-post):hover {
        --card-shadow: 0 15px 26px -13px rgba(224, 138, 79, .4), 0 14px 34px rgba(0, 0, 0, .16);
    }
}
body.paper.modern.night .modern-card,
body.paper.modern.night .feed-post,
body.paper.modern.night .blog-lead,
body.paper.modern.night .modern-tile { background: #1b1b21; }
body.paper.modern.night .modern-grid .modern-card:nth-child(even),
body.paper.modern.night .feed-stream .feed-post:nth-of-type(even) { background: #24242c; }
body.paper.modern.day .modern-card,
body.paper.modern.day .feed-post { background: #fff; }
body.paper.modern.day .blog-lead,
body.paper.modern.day .modern-tile { background: #141416; color: #f5f5f5; }
body.paper.modern.day .modern-grid .modern-card:nth-child(even),
body.paper.modern.day .feed-stream .feed-post:nth-of-type(even) { background: #f7f1e8; }
body.paper.modern .feed-post {
    margin: 0 0 .9rem;
    padding: .95rem 1rem 1.05rem;
    border-radius: 1rem;
    border-bottom: 1px solid var(--line);
}
body.paper.modern .modern-card { box-shadow: inset 3px 0 0 #c45c26, var(--card-shadow); }
body.paper.modern .modern-card:has(.pill[data-section="gaming"]),
body.paper.modern .feed-post:has(.pill[data-section="gaming"]) { box-shadow: inset 3px 0 0 #2f6fed, var(--card-shadow); }
@media (hover: hover) and (min-width: 861px) {
    body.paper.modern .modern-card,
    body.paper.modern .feed-post { transition: box-shadow .2s ease; }
    body.paper.modern .modern-card:hover,
    body.paper.modern .feed-post:hover,
    body.paper.modern .modern-card:hover:has(.pill[data-section="gaming"]),
    body.paper.modern .feed-post:hover:has(.pill[data-section="gaming"]) {
        box-shadow: inset 3px 0 0 var(--copper), var(--card-shadow);
    }
    body.paper.modern .modern-sections button,
    body.paper.modern .more-news summary {
        border-radius: 999px;
        transition: background .18s ease, box-shadow .18s ease, color .18s ease;
    }
    body.paper.modern .more-news .today-menu {
        opacity: 0;
        transform: translateY(-6px);
        pointer-events: none;
        transition: opacity .24s ease, transform .24s ease;
    }
    body.paper.modern .more-news.spread .today-menu {
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }
    body.paper.modern .more-news::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        height: .7rem;
    }
    body.paper.modern .modern-sections button:hover,
    body.paper.modern .modern-sections button.here,
    body.paper.modern .more-news summary:hover,
    body.paper.modern .more-news summary.here {
        color: var(--ink);
        background: color-mix(in srgb, var(--paper) 46%, transparent);
        border-radius: 999px;
        box-shadow:
            inset 0 1px 0 color-mix(in srgb, #fff 50%, transparent),
            inset 0 -2px 0 var(--copper),
            0 8px 18px rgba(0, 0, 0, .08);
        backdrop-filter: blur(12px) saturate(1.4);
        -webkit-backdrop-filter: blur(12px) saturate(1.4);
    }
}
body.paper.modern .feed-post:has(.pill:not([data-section="gaming"])) { box-shadow: inset 3px 0 0 #c45c26, var(--card-shadow); }
.topic.followed .topic-face { box-shadow: 0 0 0 3px var(--copper); }
.widget-line { margin: .65rem 0 0; }
.widget-line label { margin: 0; text-transform: none; letter-spacing: 0; font-size: 1rem; }
.size-switch { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin-top: .15rem; }
.size-switch button,
.home-picks button,
.interest-line button {
    border: 1px solid var(--line);
    background: var(--paper-light);
    color: var(--ink);
    border-radius: 999px;
}
.home-picks { display: grid; gap: .45rem; }
.home-picks label { margin: 0; text-transform: none; letter-spacing: 0; font-size: 1rem; }
.interest-line { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin: .35rem 0; }
.interest-line button { padding: .35rem .7rem; }
@media (max-width: 860px) {
    .reader-menu { width: 100%; }
    .terms-note { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
    body.paper.modern .shape-switch,
    body.paper.modern .modern-links { display: none; }
    body.paper.modern .modern-top .search-button { display: grid; place-items: center; flex: 0 0 var(--chrome); margin: 0; width: var(--chrome); height: var(--chrome); min-width: var(--chrome); min-height: var(--chrome); aspect-ratio: 1; padding: 0; border-radius: 50%; border: 1px solid var(--line); background: var(--paper-light); color: var(--ink); overflow: hidden; }
    body.paper.modern .modern-top .tone-button { flex: 0 0 var(--chrome); margin: 0; width: var(--chrome); height: var(--chrome); min-width: var(--chrome); min-height: var(--chrome); aspect-ratio: 1; padding: 0; border-radius: 50%; }
    body.paper.modern .modern-tools > .tone-button { margin-left: clamp(10px, 2.8vw, 14px); }
    body.paper.modern .modern-top.compact .modern-tools > .search-button { margin-left: clamp(10px, 2.8vw, 14px); }
    body.paper.modern .row-break { display: none; }
    body.paper.modern .search-button svg,
    body.paper.modern .paper-more svg { width: 18px; height: 18px; display: block; }
    body.paper.modern .modern-top .tone-button svg { width: 20px; height: 20px; display: block; }
    body.paper.modern .paper-more { display: block; position: relative; grid-area: pages; width: var(--chrome); height: var(--chrome); margin: 0; }
    body.paper.modern .paper-more summary {
        display: grid;
        place-items: center;
        width: 100%;
        height: 100%;
        padding: 0;
        border-radius: 999px;
        list-style: none;
        cursor: pointer;
    }
    body.paper.modern .modern-top .tone-button,
    body.paper.modern .modern-top .search-button,
    body.paper.modern .modern-top .back-button,
    body.paper.modern .paper-more summary {
        background: rgba(255, 252, 248, .16);
        color: var(--copper);
        border: 1px solid rgba(255, 255, 255, .55);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .72),
            inset 0 -2px 2px rgba(34, 30, 26, .14),
            0 8px 18px rgba(34, 30, 26, .12);
        backdrop-filter: blur(8px) saturate(1.55);
        -webkit-backdrop-filter: blur(8px) saturate(1.55);
    }
    body.paper.modern.day .modern-top .tone-button,
    body.paper.modern.day .modern-top .search-button,
    body.paper.modern.day .modern-top .back-button,
    body.paper.modern.day .paper-more summary {
        background: color-mix(in srgb, var(--copper) 22%, transparent);
        color: var(--copper);
        border-color: color-mix(in srgb, var(--copper) 48%, transparent);
    }
    body.paper.modern.night .modern-top .tone-button,
    body.paper.modern.night .modern-top .search-button,
    body.paper.modern.night .modern-top .back-button,
    body.paper.modern.night .paper-more summary {
        background: rgba(20, 20, 22, .28);
        color: var(--copper);
        border-color: rgba(255, 255, 255, .28);
    }
    html.android body.paper.modern .modern-top,
    html.android body.paper.modern .modern-top.lifted {
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow: none;
    }
    html.android body.paper.modern .modern-top::before,
    html.android body.paper.modern .modern-top.lifted::before {
        background: rgba(244, 241, 234, .97);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    html.android body.paper.modern.night .modern-top::before,
    html.android body.paper.modern.night .modern-top.lifted::before {
        background: rgba(12, 12, 14, .97);
    }
    html.android body.paper.modern .modern-top .tone-button,
    html.android body.paper.modern .modern-top .search-button,
    html.android body.paper.modern .modern-top .back-button,
    html.android body.paper.modern .paper-more summary {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    body.paper.modern .paper-more .today-menu {
        left: 0;
        right: auto;
        top: calc(100% + .4rem);
        width: 10.4rem;
        min-width: 0;
        max-width: calc(100vw - 1.5rem);
        padding: .2rem;
        background: var(--paper-light);
        color: var(--ink);
        opacity: 1;
        border: 1px solid var(--line);
        border-radius: .7rem;
        box-shadow: 0 16px 36px rgba(0, 0, 0, .28);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        pointer-events: auto;
    }
    body.paper.modern .paper-more .today-menu a { padding: .48rem .7rem; font-size: .88rem; }
    body.paper.modern form.archive-pick {
        flex-wrap: nowrap;
        align-items: flex-end;
        gap: .35rem;
    }
    body.paper.modern form.archive-pick label {
        flex: 1 1 0;
        min-width: 0;
        margin: 0;
        overflow: hidden;
        font-size: .62rem;
        letter-spacing: .04em;
    }
    body.paper.modern form.archive-pick label:nth-child(2) { flex: 1.45 1 0; }
    body.paper.modern form.archive-pick select,
    body.paper.modern form.archive-pick select[name="month"] {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        margin-top: .15rem;
        padding: .38rem .2rem;
        font-size: .82rem;
    }
    body.paper.modern form.archive-pick button {
        flex: 0 0 auto;
        margin: 0;
        padding: .4rem .55rem;
        font-size: .78rem;
    }
    body.paper.modern .section-line { display: flex; }
    body.paper.modern .modern-top { position: sticky; top: 0; }
    body.paper.modern .today .today-menu { left: 0; right: auto; }
    body.paper.modern .more-news .today-menu { left: auto; right: 0; }
    body.paper.modern .modern-top .find {
        position: absolute;
        z-index: 7;
        top: .55rem;
        right: 3.5rem;
        width: 2.3rem;
        max-width: 2.3rem;
        height: 2.3rem;
        margin: 0;
        opacity: 0;
        visibility: hidden;
        overflow: hidden;
        pointer-events: none;
    }
    body.paper.modern .modern-top.search-open .find {
        visibility: visible;
        pointer-events: auto;
    }
    body.paper.modern .modern-top.search-open .modern-sections,
    body.paper.modern .modern-top.search-open .more-news,
    body.paper.modern .modern-top.search-open .today,
    body.paper.modern .modern-top.search-open .section-line { visibility: hidden; }
}
@media (hover: hover) and (min-width: 861px) {
    body.paper.modern .modern-top .tone-button { transition: background .18s ease, color .18s ease, border-color .18s ease; }
    body.paper.modern.day .modern-top .tone-button {
        background: var(--copper);
        color: #fff;
        border-color: var(--copper);
    }
    body.paper.modern.day .modern-top .tone-button:hover { color: #14120f; }
    body.paper.modern.night .modern-top .tone-button:hover {
        color: var(--copper);
        border-color: var(--copper);
    }
    body.paper.modern .to-top,
    body.paper.modern .reader {
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, .22),
            0 0 0 6px rgba(255, 255, 255, .07),
            0 12px 32px rgba(0, 0, 0, .16);
    }
    body.paper.modern.day .to-top,
    body.paper.modern.day .reader {
        box-shadow:
            0 0 0 1px rgba(28, 27, 25, .18),
            0 0 0 6px rgba(28, 27, 25, .06),
            0 12px 32px rgba(34, 30, 26, .1);
    }
}