/* Blog-only reading/layout additions. Shared branding lives in phase1-home.css. */
.p1-blog-skip { position: absolute; top: -100px; left: 1rem; z-index: 1000; padding: 1rem; background: var(--p1-panel); }
.p1-blog-skip:focus { top: 1rem; }
.p1-blog-grid-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.p1-blog-art { position: relative; height: 150px; overflow: hidden; background: var(--p1-panel); }
.p1-blog-art-anime { background: repeating-linear-gradient(145deg, transparent 0 30px, #8c6bff1a 31px 32px), linear-gradient(145deg, #18213a, #231b39); }
.p1-blog-art-lakers { background: linear-gradient(90deg, transparent 49.7%, #f5c04a44 49.9% 50.1%, transparent 50.3%), radial-gradient(circle at center, transparent 48px, #f5c04a66 49px 50px, transparent 51px), #211c34; }
.p1-blog-art-chargers { background: repeating-linear-gradient(90deg, transparent 0 50px, #65e5ff20 51px 52px), linear-gradient(135deg,#09283c,#123249); }
.p1-article-layout { max-width: 800px; margin: auto; }
.p1-article-layout > .p1-blog-art { border-radius: .95rem; margin: 2rem 0; }
.p1-article-byline { color: var(--p1-muted); font-size: .88rem; }
.p1-article-body { color: #c3d0e3; font-size: 1.08rem; line-height: 1.85; }
.p1-article-body p { margin: 0 0 1.4rem; }
.p1-article-body h2 { margin: 2.6rem 0 1rem; color: #fff; font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.2; letter-spacing: -.03em; }
.p1-article-body a, .p1-article-related a { color: var(--p1-cyan) !important; }
.p1-reading-note { color: var(--p1-muted); line-height: 1.7; margin: 1.5rem 0; }
.p1-article-related { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.13); color: var(--p1-muted); line-height: 1.8; }
.p1-article-related h2 { color: #fff; }
.p1-article-related details { margin: 1.5rem 0; }
.p1-article-related summary { cursor: pointer; color: var(--p1-ink); }
.p1-article-related li { margin: .6rem 0; }
.p1-archive-list { list-style: none; padding: 0; margin: 2.5rem 0 0; }
.p1-archive-list li { display: flex; justify-content: space-between; gap: 2rem; padding: 1.7rem 0; border-bottom: 1px solid rgba(255,255,255,.13); }
.p1-archive-list h3 { margin: .6rem 0 0; max-width: 850px; font-size: 1.2rem; line-height: 1.4; }
.p1-archive-date { flex-shrink: 0; color: var(--p1-muted); font-size: .85rem; }
.p1-archive-list a:hover { color: var(--p1-cyan) !important; }
@media(max-width:640px) { .p1-blog-grid-pair { grid-template-columns: 1fr; } .p1-archive-list li { flex-direction: column; gap: .75rem; } }