body {
    background: #1a0f22 url("../images/myspleen-backgr.jpg") center top / cover fixed no-repeat;
    color: #fff;
    min-height: 100vh;
}

a { color: #00b9e7; }
a:hover { color: #77dfff; }
.site-navbar { background: #564e95; box-shadow: 0 0 10px #000; }
.site-banner { padding-top: 1.5rem; padding-bottom: 2rem; }
.site-logo { display: block; width: min(100%, 400px); height: 140px; object-fit: contain; object-position: left center; }
.tagline { font-weight: 700; margin-left: 1.4rem; }
.site-main { min-height: 55vh; }
.spleen-card { color: #34303a; border: 0; border-radius: 0; background: #fff; }
.form-card { color: #fff; border: 0; border-radius: 0; background: linear-gradient(135deg, #7469b4, #55436e); }
.form-card .form-control { color: #34303a; background-color: #fff; }
.form-card .text-secondary { color: #eee9ff !important; }
.form-card .form-legal-link, .form-card .form-legal-link:hover, .form-card .form-legal-link:focus { color: inherit; text-decoration: none; }
.spleen-card:nth-of-type(6n + 1) { background: #ffd6dc; }
.spleen-card:nth-of-type(6n + 2) { background: #ffe2ad; }
.spleen-card:nth-of-type(6n + 3) { background: #cceaff; }
.spleen-card:nth-of-type(6n + 4) { background: #c9f2d5; }
.spleen-card:nth-of-type(6n + 5) { background: #e2d4ff; }
.spleen-card:nth-of-type(6n) { background: #bff1f2; }
.spleen-author { color: #564e95; font-size: 1.1rem; margin-top: .35rem; }
.spleen-text { font-size: 1.05rem; font-weight: 600; white-space: normal; }
.spleen-full-text { white-space: normal; }
.read-more-toggle { border: 0; padding: 0; background: none; color: #00b9e7; text-decoration: underline; }
.spleen-shortcuts { display: flex; align-items: center; gap: .75rem; }
.spleen-shortcut { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: .25rem; color: #00b9e7; font-size: 1.2rem; text-decoration: none; transition: background-color .15s ease, color .15s ease; }
.spleen-shortcut:hover, .spleen-shortcut:focus-visible, .spleen-shortcut.active { background: #008fb8; color: #fff; }
.comment-toggle { color: #34303a; background: #f5a623; border-color: #f5a623; }
.comment-toggle:hover, .comment-toggle:focus-visible, .comment-toggle[aria-expanded="true"] { color: #34303a; background: #e69512; border-color: #e69512; }
.counter-card { padding: 2rem 1rem; color: #fff; border: 0; border-radius: 0; background: linear-gradient(135deg, #564e95, #382746); box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .2); font-size: 1.4rem; }
.counter-card strong { display: block; font-size: 2rem; }
.prose-page { max-width: 760px; line-height: 1.65; }
.prose-page h1, .prose-page h2 { margin: 1.5rem 0 .75rem; }
.comment-item { border-bottom: 1px solid #ddd; padding: 1rem 0 .5rem; }
.comments-panel { border-top: 1px solid rgba(52, 48, 58, .2); padding-top: 1rem; }
.inline-comment-item { border-bottom: 1px solid rgba(52, 48, 58, .15); padding: .75rem 0 .25rem; }
.inline-comment-item p { margin-bottom: .25rem; white-space: pre-line; }
.captcha-options { border: 0; padding: 0; }
.captcha-choice { display: block; cursor: pointer; padding: 4px; border: 2px solid transparent; }
.captcha-choice:has(input:checked) { border-color: #198754; background: #e9f5ee; }
.captcha-choice input { position: absolute; opacity: 0; }
.captcha-choice img { width: 42px; height: 42px; object-fit: contain; }
.ad-slot, .ad-leaderboard { overflow: hidden; border-radius: 0; }
.ad-slot { display: flex; align-items: center; justify-content: center; min-height: 90px; }
.ad-leaderboard { display: flex; justify-content: flex-end; min-height: 90px; }
.ad-leaderboard .ad-unit-leaderboard, .ad-leaderboard iframe { border-radius: 0 !important; }
.ad-unit { display: block; width: 100%; min-height: 250px; }
.ad-unit-leaderboard { width: 100%; max-width: 750px; min-height: 90px; }
.ad-square { min-height: 250px; }
.ad-skyscraper { min-height: 600px; }
.site-footer { padding-top: 3rem; padding-bottom: 2rem; margin-top: 2rem; }
.footer-links { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; margin-bottom: 1rem; }
.footer-links a { text-decoration: none; }
.pagination { flex-wrap: wrap; max-width: 100%; }
.admin-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 2rem; }
.admin-menu { background: rgba(20, 12, 30, .8); padding: 1rem; }
.admin-menu a { display: block; padding: .65rem; text-decoration: none; }
.admin-menu a[aria-current="page"] { background: rgba(255, 255, 255, .12); color: #fff; }
.admin-item { background: #fff; color: #34303a; padding: 1rem; margin-bottom: 1rem; }
.dashboard-stat, .dashboard-panel {
    padding: 1.25rem;
    color: #f5f1ff;
    background: rgba(0, 0, 0, .4);
    border: 1px solid rgba(255, 255, 255, .14);
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .18);
}
.dashboard-stat { min-height: 125px; }
.dashboard-stat span, .dashboard-stat strong, .dashboard-stat small { display: block; }
.dashboard-stat strong { margin: .3rem 0; font-size: 2rem; }
.dashboard-stat:nth-child(3n + 1) strong { color: #69dcff; }
.dashboard-stat:nth-child(3n + 2) strong { color: #8ff0b5; }
.dashboard-stat:nth-child(3n) strong { color: #ff9fe1; }
.dashboard-stat small, .dashboard-panel .text-secondary { color: #d4cbe5 !important; }
.dashboard-panel h2 { color: #ffd479; }
.dashboard-panel dl dt { color: #a7d8ff; }
.dashboard-panel dl dd { color: #f5f1ff; }
.dashboard-panel .form-select {
    color: #f5f1ff;
    background-color: #221b2e;
    border-color: rgba(255, 255, 255, .25);
}
.dashboard-chart-wrap { width: 100%; overflow-x: auto; }
.dashboard-chart { display: block; width: 100%; min-width: 560px; height: auto; }
.chart-gridline { stroke: rgba(255, 255, 255, .2); stroke-width: 1; }
.chart-label { fill: #e2d9f2; font-size: 12px; }
.chart-line { fill: none; stroke: #c49bff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.facebook-widget-card {
    padding: 1.25rem;
    color: #f5f1ff;
    background: rgba(28, 12, 43, .9);
    border: 0;
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .2);
}
.facebook-widget-card h2 { color: #9dc5ff; }
.facebook-widget-card a:not(.btn) { color: #9dc5ff; }
.facebook-widget-notice { color: #d4cbe5; font-size: .875rem; }
.btn-facebook, .btn-facebook:hover, .btn-facebook:focus-visible {
    color: #fff;
    background: #1877f2;
    border-color: #1877f2;
}
.facebook-widget-frame { max-width: 100%; overflow-x: auto; }
.facebook-widget-frame iframe { display: block; width: 100%; max-width: 340px; }
@media (max-width: 767px) {
    .site-logo { height: 100px; }
    .admin-layout { grid-template-columns: 1fr; }
    .ad-skyscraper { min-height: 250px; }
    .ad-leaderboard { display: none; }
}