/* Home pagination: the existing four-card geometry stays intact. */
.posts-panel{height:auto;min-height:439px}
.post-link{color:inherit}
.post-link::after{content:"";position:absolute;inset:0;z-index:2;border-radius:6px}
.post-body:has(.post-link){position:static}
.post-link:focus-visible{outline:none}
.post-link:focus-visible::after{outline:2px solid #f5672f;outline-offset:3px}
.post-card:has(.post-link:focus-visible){translate:0 -3px}
.post-body h3 .post-link:hover{color:#c43c15}
.post-pagination-wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;margin-top:16px;padding:14px 6px 0;border-top:1px solid #f09c772b}
.pagination-status{font-size:12px;color:#877164;margin:0}
.post-pagination{display:flex;align-items:center;gap:7px}
.post-pagination[hidden]{display:none}
.post-pagination button{width:35px;height:35px;padding:0;display:grid;place-items:center;border:1px solid #e8a37c55;border-radius:7px;background:#fff5;color:#7b4932;font-size:14px;transition:background .2s,transform .25s,box-shadow .25s}
.post-pagination svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.post-pagination button[aria-current="page"]{background:linear-gradient(135deg,#ff8b4e,#ff511f);border-color:#ff8b55;color:#fff;box-shadow:0 3px 9px #ef63252c}
.post-pagination button:not([disabled]):hover{transform:translateY(-2px);background:#ffd3b8}
.post-pagination button[aria-current="page"]:hover{background:#f7672e}
.post-pagination button:disabled{opacity:.35;cursor:default}
body[data-theme="night"] .post-pagination-wrap{border-color:#e3a27225}
body[data-theme="night"] .pagination-status{color:#c5ac9b}
body[data-theme="night"] .post-pagination button{background:#ffe4c70a;border-color:#e3a27230;color:#e6c3ad}
body[data-theme="night"] .post-pagination button[aria-current="page"]{background:linear-gradient(135deg,#ec985c,#c65a30);color:#fff6ed;border-color:#df8a5650}
body[data-theme="night"] .post-pagination button:not([disabled]):hover{background:#f4a16c20}
body[data-theme="night"] .post-link:hover{color:#ffc8a6}

/* Article reader: editorial reading surface, same warm glass / orange accent. */
.article-column{min-width:0;display:flex;flex-direction:column;gap:14px}
.article-breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;min-height:26px;color:#6d4534;padding:0 3px}
.article-breadcrumb svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7}
.article-breadcrumb a:hover{color:#ee5627}
.article-breadcrumb span:last-child{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:400px}
.article-hero{height:230px;padding:33px 35px;position:relative;border-radius:7px;overflow:hidden;border:1px solid #ffd8a1;box-shadow:0 0 8px #ffb27755;background:#b77753;color:#fff7ef;isolation:isolate}
.article-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:url('assets/hero-banner-v4.png') right 30%/cover no-repeat}
.article-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(78,39,29,.88),rgba(78,39,29,.70) 45%,rgba(78,39,29,.12) 85%)}
.article-kicker{display:flex;align-items:center;gap:10px;font-size:12px;color:#ffe1bf;letter-spacing:.6px}
.article-kicker .pill{height:23px;font-size:12px;padding:0 10px;line-height:21px;letter-spacing:0}
.article-hero h1{font-size:29px;line-height:1.5;margin:15px 0 17px;max-width:670px;font-weight:700;letter-spacing:.2px;text-wrap:balance;text-shadow:0 2px 5px #3e251750}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:12px;color:#ffe7d2}
.article-meta span{display:flex;align-items:center;gap:6px}
.article-meta img{width:23px;height:23px;object-fit:contain}
.article-meta svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6}
.reading-layout{display:grid;grid-template-columns:minmax(0,1fr) 208px;gap:14px;align-items:start}
.reading-main{min-width:0;display:flex;flex-direction:column;gap:14px}
.article-paper{border-radius:7px;padding:30px 34px 32px;background:rgba(255,249,244,.88);color:#514139}
.article-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:20px;margin-bottom:23px;border-bottom:1px solid #dba37e35}
.article-tools .quiet-label{font-size:12px;color:#9a7b69;display:flex;align-items:center;gap:5px}
.article-tools .tool-group{display:flex;gap:7px}
.article-tools button{border:1px solid #ddb08b5c;border-radius:6px;background:#fff4;color:#825139;padding:6px 9px;display:flex;align-items:center;gap:5px;font-size:12px;transition:background .2s,translate .2s}
.article-tools button:hover{background:#ffd7bd;translate:0 -1px}
.article-tools button[aria-pressed="true"]{background:#ffe2c9;color:#c85529}
.article-tools svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7}
.article-lead{font-size:17px;line-height:1.9;color:#754c37;margin:0 0 26px;padding-left:15px;border-left:3px solid #f3874a}
.article-content{font-size:15px;line-height:1.95;overflow-wrap:anywhere}
.article-content section{scroll-margin-top:24px}
.article-content h2{font-size:21px;line-height:1.6;color:#723719;margin:34px 0 14px;letter-spacing:.15px}
.article-content section:first-child h2{margin-top:0}
.article-content p{margin:0 0 17px}
.article-content ul{padding-left:22px;margin:15px 0 23px}
.article-content li{padding-left:5px;margin:7px 0}
.article-content li::marker{color:#f58642}
.article-content blockquote{margin:24px 0;padding:19px 23px;border-left:3px solid #e59057;border-radius:0 7px 7px 0;background:linear-gradient(110deg,#ffe0c966,#fff2e280);color:#8b5b40;font-size:16px;line-height:1.8}
.article-callout{display:flex;gap:14px;padding:18px;margin:23px 0;background:#ffcb9e24;border:1px solid #e79d6b4a;border-radius:7px}
.article-callout>svg{width:26px;height:28px;flex:0 0 26px}
.article-callout strong{color:#ac5428;font-size:14px}
.article-callout p{font-size:14px;margin:5px 0 0;line-height:1.8}
.article-content pre{background:#342823;color:#f9d7b5;font:12px/1.85 ui-monospace,SFMono-Regular,Menlo,monospace;padding:22px;border:1px solid #7b5638;border-radius:8px;overflow:auto;tab-size:2;max-width:100%;margin:23px 0}
.article-content code{font-family:inherit}
.article-endnote{text-align:center;color:#a4826d;font-size:12px;margin:28px 0 20px;display:flex;align-items:center;gap:12px}
.article-endnote::before,.article-endnote::after{content:"";height:1px;flex:1;background:#d8ae902f}
.article-tags{display:flex;gap:7px;flex-wrap:wrap}
.article-tags a{padding:4px 10px;border:1px solid #e6b18d55;background:#fff0e677;border-radius:99px;color:#ae6240;font-size:12px;transition:background .2s}
.article-tags a:hover{background:#ffd5b4}
.author-note{display:flex;align-items:center;gap:15px;margin-top:24px;padding:20px 0 0;border-top:1px solid #dba37e35}
.author-note img{width:52px;height:52px;object-fit:contain}
.author-note strong{font:22px UmaruHandwriting,cursive;color:#f4692e}
.author-note p{font-size:12px;color:#96755f;margin:4px 0}
.reading-aside{position:sticky;top:18px;display:flex;flex-direction:column;gap:12px}
.article-toc{border-radius:7px;padding:18px 16px;background:rgba(255,246,237,.84)}
.toc-title{display:flex;gap:8px;align-items:center;font-size:14px;font-weight:700;color:#975731;margin:0 0 15px}
.toc-title svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6}
.article-toc ol{list-style:none;margin:0;padding:0}
.article-toc li+li{margin-top:5px}
.article-toc a{display:block;border-left:2px solid transparent;padding:8px 0 8px 9px;line-height:1.6;font-size:12px;color:#86654f;border-radius:0 4px 4px 0;transition:background .2s,color .2s}
.article-toc a[aria-current="location"]{color:#cc6130;border-left-color:#ef8a4d;background:#ffba8521;font-weight:600}
.article-toc a:hover{background:#ffb47b1a;color:#b35f32}
.read-progress{border-top:1px solid #dba37e35;padding-top:15px;margin-top:17px;color:#9b7b61;font-size:11px}
.read-progress-label{display:flex;justify-content:space-between;margin-bottom:8px}
.read-progress-track{height:3px;border-radius:5px;background:#dfb58e42;overflow:hidden}
.read-progress-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,#ffc46b,#ed6e2e);transition:width .12s linear}
.reader-note{border-radius:7px;padding:17px 14px 11px;text-align:center;background:rgba(255,244,232,.80);overflow:hidden}
.reader-note img{width:120px;height:73px;object-fit:contain}
.reader-note p{font-size:12px;color:#9b653c;line-height:1.8;margin:8px 0 0}
.article-neighbors{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.article-neighbors a,.article-neighbors .neighbor-empty{padding:18px;border-radius:7px;background:rgba(255,247,237,.85);min-width:0;transition:translate .25s,background .2s}
.article-neighbors a:hover{translate:0 -3px;background:rgba(255,237,218,.94)}
.article-neighbors span{display:block;color:#b27d59;font-size:11px;margin-bottom:7px}
.article-neighbors strong{display:block;font-size:13px;line-height:1.8;color:#744934;overflow-wrap:anywhere}
.neighbor-empty{opacity:.6}
.comment-panel{border-radius:7px;padding:26px 30px;background:rgba(255,249,243,.9)}
.comment-panel h2{font-size:19px;color:#8c4424;margin:0 0 20px;display:flex;align-items:center;gap:9px}
.comment-panel h2 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6}
.comment-item{display:flex;gap:12px;padding:0 0 18px;margin-bottom:18px;border-bottom:1px solid #dfb39335}
.comment-avatar{width:32px;height:32px;flex:0 0 32px;display:grid;place-items:center;background:#ffcc9d88;color:#ae5426;border-radius:50%;font-size:13px}
.comment-item strong{font-size:12px;color:#8c4b2c}.comment-item time{margin-left:8px;font-size:10px;color:#b0917d}.comment-item p{font-size:13px;line-height:1.8;margin:6px 0 0;color:#775745;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-form label{font-size:12px;color:#9a7258;display:block;margin-bottom:8px}
.comment-form input,.comment-form textarea{width:100%;border:1px solid #dbae8b60;border-radius:6px;background:#fff8;color:#664531;padding:11px 13px;outline:none;font:inherit;font-size:13px;line-height:1.7;transition:border-color .2s,box-shadow .2s}
.comment-form input{max-width:240px;margin-bottom:13px}
.comment-form textarea{resize:vertical;min-height:105px;display:block}
.comment-form input:focus,.comment-form textarea:focus{border-color:#f19758;box-shadow:0 0 0 3px #f1975819}
.comment-form input::placeholder,.comment-form textarea::placeholder{color:#ae9786}
.comment-submit-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px}
.comment-submit-row p{font-size:11px;color:#ad8d74;margin:0}
.orange-button{border:1px solid #ed7c3d;background:linear-gradient(135deg,#ff9a54,#ef6025);color:#fff8ef;padding:9px 16px;font-size:12px;border-radius:6px;cursor:pointer;transition:translate .25s,box-shadow .25s}
.orange-button:hover{translate:0 -2px;box-shadow:0 5px 12px #dc79222d}
.reader-error{padding:50px;border-radius:7px;text-align:center;color:#7b492f}
.reader-error h1{font-size:25px}.reader-error p{margin-bottom:28px;font-size:14px}
.article-view footer{display:block;text-align:center;color:#956b52;font-size:11px;margin:30px 0}

body[data-theme="night"] .article-breadcrumb{color:#d9bfae}
body[data-theme="night"] .article-hero{border-color:#c58d6055;box-shadow:0 0 8px #d08a4420}
body[data-theme="night"] .article-hero::before{filter:brightness(.75) saturate(.9)}
body[data-theme="night"] .article-hero::after{background:linear-gradient(90deg,#1c110feb,#291810b8 45%,#26160f33 85%)}
body[data-theme="night"] .article-paper,body[data-theme="night"] .comment-panel{background:rgba(35,28,26,.96);color:#d8c7bb}
body[data-theme="night"] .article-tools{border-color:#ecc59f20}
body[data-theme="night"] .article-tools .quiet-label{color:#b29a89}
body[data-theme="night"] .article-tools button{background:#ffce9e08;border-color:#e8b28330;color:#d2b197}
body[data-theme="night"] .article-tools button:hover,body[data-theme="night"] .article-tools button[aria-pressed="true"]{background:#ffae6e1c;color:#ffbd87}
body[data-theme="night"] .article-lead{color:#efc6a4}
body[data-theme="night"] .article-content h2{color:#ffc497}
body[data-theme="night"] .article-content blockquote{background:#ffb26d0d;color:#e3ba95}
body[data-theme="night"] .article-callout{background:#ffb06808;border-color:#eeb38022}
body[data-theme="night"] .article-callout strong{color:#eebc94}
body[data-theme="night"] .article-content pre{background:#151211;border-color:#b3815733;color:#efc69c}
body[data-theme="night"] .article-tags a{background:#f3b5790c;border-color:#eab68425;color:#d5af8d}
body[data-theme="night"] .author-note{border-color:#ecc59f20}
body[data-theme="night"] .author-note p,body[data-theme="night"] .article-endnote{color:#b49a83}
body[data-theme="night"] .article-toc,body[data-theme="night"] .reader-note{background:rgba(35,28,26,.94)}
body[data-theme="night"] .toc-title{color:#efbd95}
body[data-theme="night"] .article-toc a{color:#c6ab96}
body[data-theme="night"] .article-toc a[aria-current="location"]{color:#ffc092;background:#ffa66712}
body[data-theme="night"] .read-progress{color:#b69a83;border-color:#ecc59f20}
body[data-theme="night"] .reader-note p{color:#d6ac8b}
body[data-theme="night"] .reader-note img{filter:brightness(.9);mask:url('assets/masks/deco-2.svg') center/contain no-repeat}
body[data-theme="night"] .article-neighbors a,body[data-theme="night"] .article-neighbors .neighbor-empty{background:rgba(35,28,26,.94)}
body[data-theme="night"] .article-neighbors strong{color:#e3c4ad}
body[data-theme="night"] .article-neighbors span{color:#b9977c}
body[data-theme="night"] .comment-panel h2{color:#efb287}
body[data-theme="night"] .comment-item{border-color:#ecc59f20}
body[data-theme="night"] .comment-avatar{background:#e5995220;color:#eab98f}
body[data-theme="night"] .comment-item strong{color:#e3b595}
body[data-theme="night"] .comment-item time,body[data-theme="night"] .comment-form label{color:#b49882}
body[data-theme="night"] .comment-item p{color:#d0b8a5}
body[data-theme="night"] .comment-form input,body[data-theme="night"] .comment-form textarea{background:#130f0d66;border-color:#edc8a329;color:#f2ddcb}
body[data-theme="night"] .comment-form input::placeholder,body[data-theme="night"] .comment-form textarea::placeholder{color:#ab917d}
body[data-theme="night"] .comment-submit-row p{color:#aa8b70}
body[data-theme="night"] .reader-error{color:#eac7aa}

@media(max-width:1100px){.reading-layout{grid-template-columns:minmax(0,1fr) 180px;gap:11px}.article-paper{padding:26px}.article-hero{padding:28px}.article-hero h1{font-size:26px}.article-tools .quiet-label{font-size:11px}}
@media(max-width:850px){.reading-layout{grid-template-columns:minmax(0,1fr) 180px}.article-column{gap:12px}.article-hero{height:220px}.article-paper{padding:25px}.article-hero h1{max-width:530px}.article-view .page-shell{display:block}}
@media(max-width:650px){.reading-layout{display:flex;flex-direction:column}.reading-aside{position:static;order:-1;width:100%}.reading-main{width:100%}.reader-note{display:none}.article-toc{padding:14px 16px}.article-toc ol{display:grid;grid-template-columns:1fr 1fr;gap:3px 8px}.article-toc li+li{margin:0}.article-toc a{padding:5px 7px;font-size:11px}.toc-title{margin-bottom:9px}.read-progress{margin-top:10px;padding-top:10px}.article-paper{padding:23px 20px}.article-hero{padding:25px 21px;height:auto;min-height:230px}.article-hero h1{font-size:24px;line-height:1.5;max-width:100%;margin-bottom:18px}.article-meta{gap:10px;font-size:11px}.article-tools .quiet-label{max-width:110px;line-height:1.6}.article-content h2{font-size:19px}.article-content{font-size:14px}.article-lead{font-size:15px}.article-content pre{font-size:11px;padding:16px}.article-neighbors{gap:9px}.article-neighbors a,.article-neighbors .neighbor-empty{padding:13px}.comment-panel{padding:23px 20px}.comment-submit-row{align-items:flex-start}.comment-submit-row p{max-width:170px;line-height:1.8}.article-breadcrumb span:last-child{max-width:190px}}
@media(max-width:540px){.post-pagination-wrap{flex-direction:column;justify-content:center;gap:10px;padding-top:17px;padding-bottom:4px}.post-pagination button{width:40px;height:40px}.post-pagination{gap:8px}.article-view footer{font-size:10px}}

#heroTitle a{color:inherit}
#heroTitle a:hover{text-decoration:underline;text-decoration-color:#ffe6c66e;text-decoration-thickness:1px;text-underline-offset:5px}
.article-view .profile-name{font:26px/31px UmaruHandwriting,cursive;letter-spacing:-.2px;color:#ff4815;margin:0}
body[data-theme="night"] .article-view .profile-name,.article-view[data-theme="night"] .profile-name{color:#ffad80}
.article-content pre{position:relative;padding-top:39px}
.code-copy{position:absolute;right:10px;top:9px;border:1px solid #b17d523b;background:#fff1;color:#d4b28e;font:10px system-ui;padding:3px 8px;border-radius:4px}
.code-copy:hover{background:#fff2}
#commentStatus{font-size:12px;color:#ba6334;min-height:0;margin:10px 0 0}
body[data-theme="night"] #commentStatus{color:#e1b28b}

/* Keep the paginator anchored even when a filtered page has fewer cards. */
.posts-panel{display:flex;flex-direction:column}
.post-grid{margin-bottom:16px}
.post-pagination-wrap{margin-top:auto}
.post-card:nth-child(n+3) .post-body{padding-top:1px}
.reader-note img{mask:url('assets/masks/deco-2.svg') center/contain no-repeat}
.comment-text{flex:1;min-width:0}
.local-comment-remove{float:right;border:0;background:transparent;color:#a48670;font-size:10px;padding:3px 0 3px 8px;cursor:pointer}
.local-comment-remove:hover{color:#d2612d}
.local-comment-undo{border:1px solid #c3957250;background:#fff1;color:#ba6a38;border-radius:5px;font-size:11px;padding:5px 9px;margin-top:5px}
.local-comment-undo[hidden]{display:none}
body[data-theme="night"] .local-comment-remove,body[data-theme="night"] .local-comment-undo{color:#cbaa91}
@media(max-width:850px){.post-card:nth-child(n+3) .post-body{padding-top:0}}
/* Keep reader controls reachable during long-form reading, without changing home. */
.article-view .topbar{position:sticky;top:14px}
.article-view .reading-aside{top:101px}
.article-content section{scroll-margin-top:102px}
@media(max-width:850px){.article-view .topbar{top:10px}.article-content section{scroll-margin-top:90px}}
@media(max-width:650px){.article-view .reading-aside{position:static}}