:root{color-scheme:dark;font-family:Georgia,'Times New Roman',serif;background:#11100e;color:#eee1cc;--gold:#d9b982;--muted:#baad9a;--border:#d9b98238}
*{box-sizing:border-box}
html{min-height:100%;scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:#11100e}
[hidden]{display:none!important}
button,input,textarea{font:inherit}
button,a,input,textarea{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
button:disabled{opacity:.6;cursor:wait}
:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
.backdrop{position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(#11100e50,#11100e85 60%,#11100ee8),url('/blog-background.png') center top/cover no-repeat}
.site-header,.page,.site-footer{position:relative;z-index:1}
.site-header{max-width:1400px;margin:auto;padding:32px 5%;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--border)}
.wordmark{font-size:23px;letter-spacing:2px;color:#f0d8b1}
.wordmark span{display:block;margin-top:10px;font:9px Arial,sans-serif;letter-spacing:4px;color:var(--muted)}
.admin-open{flex:none;border:1px solid #d9b98266;border-radius:999px;padding:10px 16px;background:#11100eaa;color:#d7c2a2;font:11px Arial,sans-serif;letter-spacing:1px}
.admin-open span{margin-left:10px;font-size:16px}
.admin-open:hover{background:#302417;border-color:var(--gold)}
.page{width:min(880px,90%);margin:0 auto;min-height:calc(100vh - 235px);padding-bottom:65px}
.intro{text-align:center;padding:64px 0 46px}
.eyebrow{font:10px/1.7 Arial,sans-serif;letter-spacing:4px;color:var(--gold);margin:0 0 21px}
.intro h1{font-weight:400;font-size:clamp(44px,6.5vw,78px);letter-spacing:2px;line-height:1.12;margin:0;text-shadow:0 6px 30px #000}
.intro h1 em{font-weight:400;color:#e5c591}
.intro-text{font-size:17px;color:#c8bba7;line-height:1.6;margin:20px 0 0}
.archive-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 18px;border-bottom:1px solid var(--border)}
.archive-heading h2{font-size:23px;font-weight:400;margin:0}
.archive-heading>span{color:var(--muted);font:9px Arial,sans-serif;letter-spacing:3px}
.article-list{background:#11100e9e;border-radius:0 0 16px 16px;backdrop-filter:blur(12px)}
.article-card{display:block;padding:26px 28px;border-bottom:1px solid var(--border);transition:background .2s}
.article-card:hover{background:#d9b9820b}
.article-card .card-date{color:var(--muted);font:10px Arial,sans-serif;letter-spacing:2px}
.card-heading{display:flex;justify-content:space-between;align-items:center;gap:22px;margin:11px 0}
.card-heading h3{font-size:clamp(23px,3vw,31px);font-weight:400;margin:0;line-height:1.3;overflow-wrap:anywhere}
.card-heading>span{color:var(--gold);font:25px Arial,sans-serif}
.card-excerpt{color:#baae9d;font-size:15px;line-height:1.65;margin:0 0 15px;overflow-wrap:anywhere}
.card-stats{font:10px Arial,sans-serif;color:#b9a384;letter-spacing:1px}
.status{color:#dec399;font:13px/1.6 Arial,sans-serif;min-height:20px;margin:18px 0}
.status:empty{display:none}
.empty-state{text-align:center;padding:48px 24px;background:#11100eaa;border:1px solid var(--border);border-radius:16px}
.empty-state h3{font-size:28px;font-weight:400;margin:0 0 12px}
.quiet{color:var(--muted);font:13px/1.7 Arial,sans-serif}
.text-button,.back-link{padding:8px 0;background:transparent;border:0;color:var(--gold);font:12px/1.5 Arial,sans-serif}
.text-button:hover,.back-link:hover{text-decoration:underline;text-underline-offset:4px}
#load-more{display:block;margin:25px auto 0}
.reader{margin-top:45px;padding:38px 48px;background:#12110ff0;border:1px solid #d9b98250;border-radius:20px;box-shadow:0 22px 80px #0007}
.back-link{display:inline-block;margin-bottom:35px}
.reader h1{font-weight:400;font-size:clamp(32px,4.8vw,51px);line-height:1.18;margin:0 0 32px;overflow-wrap:anywhere;letter-spacing:.3px}
.reader h1:focus{outline:none}
.article-body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:19px;line-height:1.85;color:#e3d8c8}
.article-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px;padding:28px 0;margin-top:25px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.like-button{display:flex;align-items:center;gap:9px;padding:10px 17px;border:1px solid #d9b98266;border-radius:999px;background:transparent;color:var(--gold);font:12px Arial,sans-serif}
.like-button>span:first-child{font-size:22px}
.like-button[aria-pressed="true"]{background:#d9b98218;border-color:var(--gold)}
#edit-article{margin-left:auto}
.comments{margin-top:35px}
.comments h2{font-size:28px;font-weight:400;margin:0 0 10px}
.fields{display:flex;flex-direction:column;gap:10px}
.fields label{margin-top:10px;color:#d4bd94;font:10px Arial,sans-serif;letter-spacing:2px;text-transform:uppercase}
.fields input,.fields textarea{width:100%;padding:14px 16px;border:1px solid #7a654c;border-radius:10px;background:#100f0d;color:#f4e8d4;font:15px/1.65 Arial,sans-serif;outline:0}
.fields textarea{resize:vertical}
.fields input:focus,.fields textarea:focus{border-color:#e7c995;box-shadow:0 0 0 2px #e7c99533}
.fields input::placeholder,.fields textarea::placeholder{color:#8d8273}
.gold-button{display:flex;justify-content:space-between;align-items:center;gap:35px;margin-top:14px;padding:13px 19px;border:0;border-radius:10px;background:linear-gradient(120deg,#eed4a4,#b58e57);color:#20170e;font:700 12px Arial,sans-serif;letter-spacing:1px}
.gold-button:hover{filter:brightness(1.1)}
.gold-button span{font-size:24px;font-weight:400}
#comment-form .gold-button{align-self:flex-start}
.comment-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.comment-list{margin-top:30px}
.comment{padding:22px 0;border-top:1px solid var(--border)}
.comment-header{display:flex;align-items:center;flex-wrap:wrap;gap:13px}
.comment-header strong{font-size:16px;font-weight:400;color:#e8ceaa;overflow-wrap:anywhere}
.comment-header time{font:10px Arial,sans-serif;color:var(--muted)}
.comment p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px;line-height:1.75;color:#d2c7b7;margin:12px 0 0}
.comment .text-button{margin-left:auto}
.site-footer{width:min(880px,90%);margin:auto;padding:25px 0 32px;border-top:1px solid var(--border);color:#cdb28b;font-size:14px;letter-spacing:1px;display:flex;justify-content:space-between;gap:20px}
.site-footer span{color:#a79780;font:11px/1.5 Arial,sans-serif;letter-spacing:1px}
.admin-dialog{width:min(92vw,650px);max-height:90vh;overflow:auto;padding:42px;border:1px solid #c9a979;border-radius:22px;background:linear-gradient(145deg,#211b15,#0e0d0c);color:#f0e2cc;box-shadow:0 25px 90px #000d}
.admin-dialog::backdrop{background:#070605cf;backdrop-filter:blur(8px)}
.admin-close{position:absolute;top:12px;right:18px;border:0;background:transparent;color:#d5b987;font:32px Arial,sans-serif}
.admin-dialog h2{font-weight:400;font-size:34px;margin:0 0 14px}
.admin-dialog>.quiet{margin-bottom:20px}
.field-hint{color:var(--muted);font:11px/1.5 Arial,sans-serif;margin:0}
.editor-links{display:flex;justify-content:space-between;margin-top:10px}
@media(max-width:600px){.site-header{padding:23px 5%;gap:12px}.wordmark{font-size:18px;letter-spacing:.5px}.wordmark span{font-size:8px;letter-spacing:2px}.admin-open{padding:9px 11px;font-size:10px}.admin-open span{margin-left:4px}.intro{padding:49px 0 37px}.eyebrow{font-size:9px;letter-spacing:2px}.intro h1{font-size:46px}.intro-text{font-size:15px}.archive-heading h2{font-size:21px}.archive-heading>span{font-size:8px;letter-spacing:2px}.article-card{padding:23px 19px}.reader{padding:26px 22px;margin-top:25px;border-radius:15px}.article-body{font-size:17px;line-height:1.8}.article-actions{gap:12px}.admin-dialog{padding:34px 24px}.site-footer{font-size:12px}.site-footer span{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}