/* =====================================================================
   XtremePapers — Papers section UI (index.php + header.php)
   Visual language shared with prepare.xtremepape.rs:
   dark "XtremePapers" theme by default, warm paper theme via toggle.
   ===================================================================== */

:root,
:root[data-theme="dark"] {
    --paper: #0a0a0b;
    --surface: #151517;
    --surface-2: #1c1c20;
    --surface-3: #232328;
    --line: #2a2a30;
    --line-soft: #1f1f24;
    --ink: #f4f4f5;
    --ink-2: #d4d4d8;
    --ink-soft: #a1a1aa;
    --ink-faint: #71717a;
    --accent: #e4002b;
    --accent-2: #ff4d6d;
    --accent-soft: #2d0a11;
    --accent-line: rgba(255, 77, 109, 0.35);
    --on-accent-soft: #ff8fa3;
    --folder: #f2b84b;
    --good: #4ade80;
    --good-soft: #0c2017;
    --grid: rgba(255, 255, 255, 0.045);
    --bg-glow: radial-gradient(1100px circle at 50% -120px, #e4002b2b, transparent 55%),
               radial-gradient(800px circle at 92% 320px, #7c3aed0f, transparent 50%);
    --grad-cta: linear-gradient(135deg, #ff2b4e, #c00023);
    --grad-card: linear-gradient(160deg, #1c1418, #151517 55%);
    --shadow-1: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-3: 0 20px 50px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --header-bg: rgba(10, 10, 11, 0.82);
    color-scheme: dark;
}

:root[data-theme="light"] {
    --paper: #faf7f0;
    --surface: #ffffff;
    --surface-2: #fffcf5;
    --surface-3: #f4efe4;
    --line: #eae4d9;
    --line-soft: #f1ece2;
    --ink: #1c1917;
    --ink-2: #292524;
    --ink-soft: #57534e;
    --ink-faint: #8a837b;
    --accent: #c2410c;
    --accent-2: #d42a1c;
    --accent-soft: #ffedd5;
    --accent-line: rgba(194, 65, 12, 0.3);
    --on-accent-soft: #9a3412;
    --folder: #d08a16;
    --good: #15803d;
    --good-soft: #dcfce7;
    --grid: rgba(124, 63, 24, 0.075);
    --bg-glow: radial-gradient(900px circle at 15% -180px, #ea580c17, transparent 55%),
               radial-gradient(700px circle at 90% -220px, #d9770612, transparent 50%);
    --grad-cta: linear-gradient(135deg, #ea580c, #c2410c);
    --grad-card: linear-gradient(160deg, #fff3e2, #fff 58%);
    --shadow-1: 0 1px 2px rgba(124, 63, 24, 0.06);
    --shadow-3: 0 10px 24px rgba(124, 63, 24, 0.1), 0 40px 80px -20px rgba(124, 63, 24, 0.25);
    --header-bg: rgba(250, 247, 240, 0.85);
    color-scheme: light;
}

:root {
    --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-serif: "Charter", "Iowan Old Style", "Source Serif Pro", Georgia, serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --max: 1200px;
    --gutter: 16px;
    --radius: 16px;
    --radius-sm: 10px;
    --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
    margin: 0;
    min-height: 100vh;
    font: 15px/1.55 var(--font-sans);
    color: var(--ink);
    background-color: var(--paper);
    background-image:
        var(--bg-glow),
        linear-gradient(var(--grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid) 1px, transparent 1px);
    background-size: auto, 28px 28px, 28px 28px;
    background-repeat: no-repeat, repeat, repeat;
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

:focus-visible { outline: 2px solid var(--accent-2); outline-offset: 2px; border-radius: 6px; }

.xp-sr {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.xp-skip {
    position: absolute; left: 12px; top: -48px; z-index: 100;
    padding: 8px 14px; border-radius: 8px;
    background: var(--accent); color: #fff; font-weight: 700;
}
.xp-skip:focus { top: 12px; }

.xp-container { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }

/* ---------- site header (header.php) ---------- */
.xp-site {
    position: sticky; top: 0; z-index: 50;
    background: var(--header-bg);
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    backdrop-filter: saturate(160%) blur(14px);
    border-bottom: 1px solid var(--line);
}

.xp-site-bar { display: flex; align-items: center; gap: 20px; min-height: 64px; }

.xp-logo { flex: none; display: block; padding: 6px 0; transition: transform .4s var(--ease); }
.xp-logo:hover { transform: scale(1.04); }

.xtremelogo {
    display: block;
    width: 214px;
    height: 28px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1180.3 156'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='588.7' y1='159.2' x2='588.7' y2='120.4' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0'/%3E%3Cstop offset='.2' stop-color='%23030303'/%3E%3Cstop offset='.3' stop-color='%230d0d0d'/%3E%3Cstop offset='.4' stop-color='%231e1e1e'/%3E%3Cstop offset='.5' stop-color='%23363636'/%3E%3Cstop offset='.6' stop-color='%23555'/%3E%3Cstop offset='.7' stop-color='%237b7b7b'/%3E%3Cstop offset='.8' stop-color='%23a7a7a7'/%3E%3Cstop offset='.9' stop-color='%23dadada'/%3E%3Cstop offset='1' stop-color='%23ccc'/%3E%3C/linearGradient%3E%3Cfilter id='b' x='0' y='120.4' width='1177.4' height='38.8' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-color='%23ccc' result='bg'/%3E%3CfeBlend in='SourceGraphic' in2='bg'/%3E%3C/filter%3E%3Cmask id='c' x='0' y='120.4' width='1177.4' height='38.8' maskUnits='userSpaceOnUse'%3E%3Cpath fill='url(%23a)' filter='url(%23b)' d='M0 120.4h1177.4v38.8H0z'/%3E%3C/mask%3E%3C/defs%3E%3Cpath fill='%23c00' stroke='%23bbb' stroke-miterlimit='10' stroke-width='3' d='M517.5 37h85.9v17.7h-85.9zM517.5 68.7h85.9v17.7h-85.9zM302.4 37h85.9v17.7h-85.9zM302.4 68.7h85.9v17.7h-85.9z'/%3E%3Cpath d='M499 37h-20l-26 27-25.2-27H407v64.2h-136l-19.2-14.8h7.6a24.7 24.7 0 1 0 0-49.4H120L77.2 67.4 34.5 37H4.7l57.7 41-57.7 41h29.8l42.7-30.4 69.1 49.1h29.4L92 78l32.7-23.3h42.2v64.2h17.7V54.7h74.7a7 7 0 0 1 0 14h-32.1v17.7l42.6 32.5h154.8V59l28.8 29.5 27.8-28.8V119h122.2v-17.7H498.9z' fill='%23c00' stroke='%23bbb' stroke-miterlimit='10' stroke-width='3'/%3E%3Cpath fill='%23ddd' stroke='%23c00' stroke-miterlimit='10' stroke-width='3' d='M891.5 37h85.9v17.7h-85.9zM891.5 68.7h85.9v17.7h-85.9z'/%3E%3Cpath d='M1151 69.5l-25-.7a7 7 0 0 1-7-7c0-4 3.1-7 6-7h50.8L1152.7 37H1126a24.7 24.7 0 1 0 0 49.4l25 .7a7 7 0 0 1 0 14h-76.5l-19-14.8h7.5a24.7 24.7 0 1 0 0-49.4h-67.2v64.3H816.2V86.4h32.1a24.7 24.7 0 1 0 0-49.4h-49.8v31.7h-33.8l-13-31.7h-26l-26.5 64.2h-59.5V86.4h32a24.7 24.7 0 1 0 0-49.4H622v82h89.4L738.7 53l27.2 65.9h19.5L772 86.4h26.6V119h215V54.7h49.5a7 7 0 0 1 0 14h-30.9v18.7l41.3 31.5h77.5a24.7 24.7 0 1 0 0-49.4zM816.2 54.7h32.1a7 7 0 0 1 0 14h-32zm-176.5 0h32a7 7 0 0 1 0 14h-32z' fill='%23ddd' stroke='%23c00' stroke-miterlimit='10' stroke-width='3'/%3E%3Cg opacity='.3' stroke-miterlimit='10' stroke-width='3' mask='url(%23c)'%3E%3Cpath fill='%23c00' stroke='%23bbb' d='M4.7 122l45.8 32.5h29.7l-45.7-32.6H4.7zM227.2 154.4h24.5l19.1-14.8H407v14.9h17.7v-32.6H269.8l-42.6 32.5zM481.2 122v32.5H499v-14.9h104.5V122H481.2zM166.9 121.9h17.7v32.5h-17.7z'/%3E%3Cpath fill='%23ddd' stroke='%23c00' d='M622 122v32.5h17.7v-14.9h59.5l6.2 14.9h19.5l-13.5-32.6H622zM1151 122h-77.5l-42.6 32.5h24.6l19-14.8h76.5a7 7 0 0 1 0 14l23.6.7A24.7 24.7 0 0 0 1151 122zM798.5 154.4h17.7v-14.8H996v14.9h17.7v-32.6h-215v32.5zM752.5 154.5H772l13.4-32.6h-19.5l-13.4 32.6z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
}

:root[data-theme="light"] .xtremelogo { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1180.3 156'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='588.7' y1='159.2' x2='588.7' y2='120.4' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0'/%3E%3Cstop offset='.2' stop-color='%23030303'/%3E%3Cstop offset='.3' stop-color='%230d0d0d'/%3E%3Cstop offset='.4' stop-color='%231e1e1e'/%3E%3Cstop offset='.5' stop-color='%23363636'/%3E%3Cstop offset='.6' stop-color='%23555'/%3E%3Cstop offset='.7' stop-color='%237b7b7b'/%3E%3Cstop offset='.8' stop-color='%23a7a7a7'/%3E%3Cstop offset='.9' stop-color='%23dadada'/%3E%3Cstop offset='1' stop-color='%23ccc'/%3E%3C/linearGradient%3E%3Cfilter id='b' x='0' y='120.4' width='1177.4' height='38.8' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-color='%23ccc' result='bg'/%3E%3CfeBlend in='SourceGraphic' in2='bg'/%3E%3C/filter%3E%3Cmask id='c' x='0' y='120.4' width='1177.4' height='38.8' maskUnits='userSpaceOnUse'%3E%3Cpath fill='url(%23a)' filter='url(%23b)' d='M0 120.4h1177.4v38.8H0z'/%3E%3C/mask%3E%3C/defs%3E%3Cpath fill='%23c00' stroke='%23bbb' stroke-miterlimit='10' stroke-width='3' d='M517.5 37h85.9v17.7h-85.9zM517.5 68.7h85.9v17.7h-85.9zM302.4 37h85.9v17.7h-85.9zM302.4 68.7h85.9v17.7h-85.9z'/%3E%3Cpath d='M499 37h-20l-26 27-25.2-27H407v64.2h-136l-19.2-14.8h7.6a24.7 24.7 0 1 0 0-49.4H120L77.2 67.4 34.5 37H4.7l57.7 41-57.7 41h29.8l42.7-30.4 69.1 49.1h29.4L92 78l32.7-23.3h42.2v64.2h17.7V54.7h74.7a7 7 0 0 1 0 14h-32.1v17.7l42.6 32.5h154.8V59l28.8 29.5 27.8-28.8V119h122.2v-17.7H498.9z' fill='%23c00' stroke='%23bbb' stroke-miterlimit='10' stroke-width='3'/%3E%3Cpath fill='%23292524' stroke='%23c00' stroke-miterlimit='10' stroke-width='3' d='M891.5 37h85.9v17.7h-85.9zM891.5 68.7h85.9v17.7h-85.9z'/%3E%3Cpath d='M1151 69.5l-25-.7a7 7 0 0 1-7-7c0-4 3.1-7 6-7h50.8L1152.7 37H1126a24.7 24.7 0 1 0 0 49.4l25 .7a7 7 0 0 1 0 14h-76.5l-19-14.8h7.5a24.7 24.7 0 1 0 0-49.4h-67.2v64.3H816.2V86.4h32.1a24.7 24.7 0 1 0 0-49.4h-49.8v31.7h-33.8l-13-31.7h-26l-26.5 64.2h-59.5V86.4h32a24.7 24.7 0 1 0 0-49.4H622v82h89.4L738.7 53l27.2 65.9h19.5L772 86.4h26.6V119h215V54.7h49.5a7 7 0 0 1 0 14h-30.9v18.7l41.3 31.5h77.5a24.7 24.7 0 1 0 0-49.4zM816.2 54.7h32.1a7 7 0 0 1 0 14h-32zm-176.5 0h32a7 7 0 0 1 0 14h-32z' fill='%23292524' stroke='%23c00' stroke-miterlimit='10' stroke-width='3'/%3E%3Cg opacity='.3' stroke-miterlimit='10' stroke-width='3' mask='url(%23c)'%3E%3Cpath fill='%23c00' stroke='%23bbb' d='M4.7 122l45.8 32.5h29.7l-45.7-32.6H4.7zM227.2 154.4h24.5l19.1-14.8H407v14.9h17.7v-32.6H269.8l-42.6 32.5zM481.2 122v32.5H499v-14.9h104.5V122H481.2zM166.9 121.9h17.7v32.5h-17.7z'/%3E%3Cpath fill='%23292524' stroke='%23c00' d='M622 122v32.5h17.7v-14.9h59.5l6.2 14.9h19.5l-13.5-32.6H622zM1151 122h-77.5l-42.6 32.5h24.6l19-14.8h76.5a7 7 0 0 1 0 14l23.6.7A24.7 24.7 0 0 0 1151 122zM798.5 154.4h17.7v-14.8H996v14.9h17.7v-32.6h-215v32.5zM752.5 154.5H772l13.4-32.6h-19.5l-13.4 32.6z'/%3E%3C/g%3E%3C/svg%3E"); }

.xp-site-nav { flex: 1; min-width: 0; display: flex; justify-content: center; }
.xp-site-nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 2px; }
.xp-site-nav a {
    display: flex; align-items: center; gap: 6px;
    padding: 8px 14px; border-radius: 999px;
    color: var(--ink-soft); font-size: 14.5px; font-weight: 500; white-space: nowrap;
    transition: color .15s, background-color .15s;
}
.xp-site-nav a:hover { color: var(--ink); background: var(--surface-2); }
.xp-site-nav .is-selected a { color: var(--ink); background: var(--surface-2); box-shadow: inset 0 -2px 0 var(--accent); font-weight: 600; }
.xp-site-nav .xp-nav-prepare a { color: var(--accent-2); font-weight: 700; }
.xp-site-nav .xp-nav-prepare a:hover { background: var(--accent-soft); color: var(--on-accent-soft); }

.xp-site-tools { flex: none; display: flex; align-items: center; gap: 8px; }

.xp-cta {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 9px 16px; border-radius: 999px;
    background: var(--grad-cta); color: #fff !important;
    font-size: 14px; font-weight: 700; white-space: nowrap;
    box-shadow: 0 6px 18px -6px rgba(228, 0, 43, 0.6);
    transition: transform .2s var(--ease), box-shadow .2s;
}
.xp-cta:hover { transform: translateY(-1px); box-shadow: 0 10px 24px -8px rgba(228, 0, 43, 0.7); }

.xp-theme-toggle {
    display: grid; place-items: center;
    width: 38px; height: 38px; padding: 0;
    border: 1px solid var(--line); border-radius: 999px;
    background: var(--surface); color: var(--ink-soft); cursor: pointer;
    transition: color .15s, border-color .15s;
}
.xp-theme-toggle:hover { color: var(--ink); border-color: var(--ink-faint); }
.xp-theme-toggle .i-sun { display: none; }
:root[data-theme="light"] .xp-theme-toggle .i-sun { display: block; }
:root[data-theme="light"] .xp-theme-toggle .i-moon { display: none; }

.xp-boards { border-top: 1px solid var(--line-soft); }
.xp-boards-inner { display: flex; align-items: center; gap: 12px; padding-top: 9px; padding-bottom: 9px; }
.xp-boards-label {
    flex: none; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint);
}
.xp-boards ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; }
.xp-boards a {
    display: block; padding: 5px 14px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--surface);
    color: var(--ink-2); font-size: 13px; font-weight: 600; white-space: nowrap;
    transition: border-color .15s, color .15s, background-color .15s;
}
.xp-boards a:hover { border-color: var(--accent-line); color: var(--ink); }
.xp-boards .is-current a { background: var(--accent-soft); border-color: var(--accent-line); color: var(--on-accent-soft); }

.xp-hscroll { overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.xp-hscroll::-webkit-scrollbar { display: none; }

/* ---------- page head ---------- */
.xp-main { padding-top: 28px; padding-bottom: 56px; }

.xp-crumbs ol {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-wrap: wrap; align-items: center; row-gap: 4px;
    font-size: 13px; color: var(--ink-faint);
}
.xp-crumbs li { display: inline-flex; align-items: center; min-width: 0; }
.xp-crumbs li + li::before {
    content: ""; flex: none; width: 5px; height: 5px; margin: 0 10px 0 7px;
    border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor;
    transform: rotate(45deg); opacity: .7;
}
.xp-crumbs a { color: var(--ink-soft); transition: color .15s; overflow-wrap: anywhere; }
.xp-crumbs a:hover { color: var(--ink); }
.xp-crumbs a[aria-current] { color: var(--ink); font-weight: 600; }

.xp-hero { margin: 18px 0 22px; }

.xp-kicker {
    display: flex; align-items: center; gap: 10px; margin: 0 0 10px;
    font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-2);
}
.xp-kicker::before { content: ""; width: 22px; height: 2px; border-radius: 2px; background: currentColor; }

.xp-title {
    margin: 0;
    font-family: var(--font-serif);
    font-size: clamp(28px, 4.2vw, 46px);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.015em;
    overflow-wrap: anywhere;
}

.xp-subtitle { margin: 10px 0 0; max-width: 62ch; color: var(--ink-soft); font-size: 15.5px; }
.xp-subtitle strong { color: var(--ink); font-weight: 600; }

.xp-stats { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.xp-stats li {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 11px; border-radius: 999px;
    background: var(--surface); border: 1px solid var(--line);
    font-size: 12.5px; color: var(--ink-soft);
}
.xp-stats b { color: var(--ink); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- search ---------- */
.xp-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0 0 18px; }

.xp-search {
    flex: 1 1 420px; max-width: 760px;
    display: flex; align-items: center; gap: 8px;
    padding: 6px 6px 6px 16px;
    background: var(--surface); border: 1px solid var(--line); border-radius: 999px;
    box-shadow: var(--shadow-1);
    transition: border-color .15s, box-shadow .15s;
}
.xp-search:focus-within { border-color: var(--accent-line); box-shadow: 0 0 0 4px var(--accent-soft); }
.xp-search > svg { flex: none; color: var(--ink-faint); }
.xp-search input {
    flex: 1; min-width: 0; height: 40px; padding: 0;
    border: 0; outline: 0; background: transparent;
    color: var(--ink); font: inherit; font-size: 16px;
}
.xp-search input::placeholder { color: var(--ink-faint); }
.xp-search input::-webkit-search-cancel-button { -webkit-appearance: none; }

.xp-clear {
    flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 999px;
    color: var(--ink-soft); background: var(--surface-2); transition: color .15s, background-color .15s;
}
.xp-clear:hover { color: var(--ink); background: var(--surface-3); }

.xp-btn {
    flex: none; height: 40px; padding: 0 22px; border: 0; border-radius: 999px;
    background: var(--grad-cta); color: #fff; cursor: pointer;
    font: inherit; font-size: 14.5px; font-weight: 700;
    box-shadow: 0 6px 16px -8px rgba(228, 0, 43, 0.7);
    transition: transform .2s var(--ease), filter .2s;
}
.xp-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* sort chips: phones only (table header is hidden there) */
.xp-sortbar { display: none; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-faint); }
.xp-sortbar a {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 6px 12px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font-weight: 600;
}
.xp-sortbar a.is-active { border-color: var(--accent-line); background: var(--accent-soft); color: var(--on-accent-soft); }

/* ---------- native ad ---------- */
.xp-ad { margin: 0 0 18px; }
.xp-ad iframe {
    display: block; width: 100%; max-width: 800px; height: 150px; margin: 0 auto; border: 0;
    color-scheme: normal; /* matches the ad page, so its transparent background is not painted white */
}

/* ---------- listing ---------- */
.papers-listing-shell {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
    overflow: hidden;
}

#main_content { width: 100%; border-collapse: collapse; font-size: 14.5px; }

#main_content thead th {
    padding: 0;
    background: var(--surface-2);
    border-bottom: 1px solid var(--line);
    font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    color: var(--ink-faint); text-align: left; white-space: nowrap;
}
#main_content thead th.fsize, #main_content thead th.fmtime { text-align: right; }
#main_content thead a {
    display: flex; align-items: center; gap: 6px; padding: 13px 16px;
    color: inherit; transition: color .15s;
}
#main_content thead th.fsize a, #main_content thead th.fmtime a { justify-content: flex-end; }
#main_content thead a:hover, #main_content thead a.is-active { color: var(--ink); }
#main_content thead a.is-active { box-shadow: inset 0 -2px 0 var(--accent); }

.xp-arrow { flex: none; color: var(--accent-2); }

#main_content tbody td {
    padding: 11px 16px;
    border-top: 1px solid var(--line-soft);
    vertical-align: middle;
}
#main_content tbody tr:first-child td { border-top: 0; }
#main_content tbody tr { transition: background-color .12s; }
#main_content tbody tr:hover { background: var(--surface-2); }

#main_content td.fico { width: 56px; padding-right: 0; }
#main_content td.fsize { width: 130px; text-align: right; color: var(--ink-soft); white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 13.5px; }
#main_content td.fmtime { width: 220px; text-align: right; color: var(--ink-soft); white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 13.5px; }

.xp-date-short { display: none; }
.xp-muted { color: var(--ink-faint); }

.xp-ico { display: block; width: 28px; height: 28px; }
.xp-ico--folder { color: var(--folder); }
.xp-ico--up { color: var(--ink-faint); }

.xp-name { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-width: 0; }

a.directory, a.file { overflow-wrap: anywhere; transition: color .15s; }
a.directory { color: var(--ink); font-weight: 600; }
a.file { color: var(--ink-2); }
a.directory:hover, a.file:hover {
    color: var(--ink);
    text-decoration: underline; text-decoration-color: var(--accent-2);
    text-decoration-thickness: 1.5px; text-underline-offset: 3px;
}
.xp-up a.directory { color: var(--ink-soft); font-weight: 500; }

/* "Solutions" / "Learn with XP Prepare!" pills */
.solution-link {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 11px 3px 8px; border-radius: 999px;
    background: var(--accent-soft); border: 1px solid var(--accent-line);
    color: var(--on-accent-soft) !important;
    font-size: 12px; font-weight: 700; line-height: 1.35; white-space: nowrap;
    text-decoration: none !important;
    transition: background-color .15s, color .15s, border-color .15s, transform .15s var(--ease);
}
.solution-link::before {
    content: ""; flex: none; width: 12px; height: 12px; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.solution-link--prepare::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2L4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2L4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E");
}
.solution-link:hover {
    background: var(--accent); border-color: var(--accent); color: #fff !important; transform: translateY(-1px);
}
.solution-link--prepare { background: var(--grad-cta); border-color: transparent; color: #fff !important; }
.solution-link--prepare:hover { filter: brightness(1.1); }

.recent {
    display: inline-block; padding: 2px 8px; border-radius: 999px;
    background: var(--good-soft); color: var(--good);
    font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; line-height: 1.5;
}

.xp-empty td { padding: 48px 20px !important; text-align: center; color: var(--ink-soft); }
.xp-empty strong { display: block; margin-bottom: 4px; font-family: var(--font-serif); font-size: 20px; color: var(--ink); }
.xp-empty a { color: var(--accent-2); font-weight: 600; }

/* ---------- donate ---------- */
.xp-donate {
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
    max-width: 860px; margin: 36px auto 0; padding: 24px 28px;
    background: var(--grad-card);
    border: 1px solid var(--line); border-radius: var(--radius);
    box-shadow: var(--shadow-3);
}
.xp-donate .xp-kicker { margin-bottom: 6px; }
.xp-donate h2 { margin: 0; font-family: var(--font-serif); font-size: 22px; line-height: 1.2; }
.xp-donate p { margin: 6px 0 0; color: var(--ink-soft); font-size: 14.5px; }

.donate-button {
    flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 13px 26px; border-radius: 12px;
    background: var(--grad-cta); color: #fff !important; font-weight: 700; white-space: nowrap;
    box-shadow: 0 10px 24px -10px rgba(228, 0, 43, 0.8);
    transition: transform .2s var(--ease), filter .2s;
}
.donate-button:hover { transform: scale(1.05); filter: brightness(1.08); }

/* ---------- footer / misc ---------- */
.xp-foot {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px;
    margin-top: 32px; font-size: 13px; color: var(--ink-faint);
}
.xp-foot a { color: var(--ink-soft); }
.xp-foot a:hover { color: var(--ink); }

.xp-toolbox { display: flex; justify-content: center; gap: 8px; margin-top: 16px; }
.xp-toolbox a, .xp-toolbox button {
    display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px;
    border: 1px solid var(--line); border-radius: 999px; background: var(--surface);
    color: var(--ink-soft); font: inherit; font-size: 13px; cursor: pointer;
}

#inline_content { padding: 16px; color: #222; }

/* ---------- tablets ---------- */
@media (max-width: 980px) {
    .xp-site-nav { justify-content: flex-start; }
    #main_content td.fmtime { width: 130px; }
    .xp-date-full { display: none; }
    .xp-date-short { display: inline; }
}

/* ---------- phones ---------- */
@media (max-width: 720px) {
    body { font-size: 15px; }

    .xp-site-bar { flex-wrap: wrap; gap: 0; min-height: 0; padding-top: 10px; }
    .xp-logo { order: 1; }
    .xtremelogo { width: 178px; height: 24px; }
    .xp-site-tools { order: 2; margin-left: auto; }
    .xp-site-tools .xp-cta { display: none; }
    .xp-site-nav { order: 3; flex: 1 0 100%; margin: 6px calc(var(--gutter) * -1) 0; padding: 0 var(--gutter) 8px; }
    .xp-site-nav a { padding: 7px 12px; font-size: 14px; }

    .xp-boards-label { display: none; }
    .xp-boards-inner { padding-top: 8px; padding-bottom: 8px; }

    .xp-main { padding-top: 18px; }
    .xp-hero { margin: 14px 0 16px; }
    .xp-subtitle { font-size: 14.5px; }

    .xp-tools { gap: 10px; }
    .xp-search { flex-basis: 100%; padding-left: 14px; }
    .xp-btn { padding: 0 16px; }
    .xp-sortbar { display: flex; flex-wrap: wrap; }

    .xp-ad iframe { height: 250px; }

    /* listing turns into a stacked list */
    #main_content, #main_content tbody { display: block; }
    #main_content thead { display: none; }
    #main_content tbody tr {
        position: relative;
        display: grid;
        grid-template-columns: auto auto 1fr;
        grid-template-areas: "ico name name" "ico size date";
        align-items: center;
        column-gap: 12px;
        row-gap: 3px;
        padding: 12px 14px;
        border-top: 1px solid var(--line-soft);
    }
    #main_content tbody tr:first-child { border-top: 0; }
    #main_content tbody tr:active { background: var(--surface-2); }
    #main_content tbody td { display: block; padding: 0; border: 0; width: auto !important; text-align: left; }
    #main_content td.fico { grid-area: ico; align-self: start; padding-top: 1px; }
    #main_content td.fname { grid-area: name; min-width: 0; }
    #main_content td.fsize { grid-area: size; font-size: 12.5px; text-align: left; }
    #main_content td.fmtime { grid-area: date; font-size: 12.5px; text-align: left; }
    #main_content td.fsize + td.fmtime::before { content: "\00B7"; margin-right: 6px; color: var(--ink-faint); }
    #main_content .xp-empty td { grid-column: 1 / -1; }

    /* whole row is tappable; pills stay independently clickable above it */
    .xp-row-link::after { content: ""; position: absolute; inset: 0; }
    .solution-link, .recent { position: relative; z-index: 1; }
    .solution-link { padding: 5px 12px 5px 9px; }

    .xp-donate { flex-direction: column; align-items: stretch; text-align: center; padding: 22px 18px; }
    .xp-donate .xp-kicker { justify-content: center; }
    .donate-button { width: 100%; }
}

/* ---------- print (toolbar print button) ---------- */
@media print {
    body { background: #fff; color: #000; }
    .xp-site, .xp-tools, .xp-ad, .xp-donate, .xp-foot, .xp-toolbox, .solution-link { display: none !important; }
    .papers-listing-shell { box-shadow: none; border-color: #ccc; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; }
}