:root{
--background:#f8fbff;
--surface:#f5f8fc;
--surface-accent:#e8f1ff;
--border:#d7e1ef;
--border-accent:#bfd2ee;
--border-strong:#89b2e8;
--text:#0f172a;
--text-soft:#334155;
--link:#134db0;
--link-hover:#0d3f91;
--link-strong:#0a2f72;
--link-visited:#184785;
--accent-text:#1a4f99;
--focus:#0f4fb3;
--radius-sm:0.45rem;
--radius-md:0.85rem;
--radius-lg:1.2rem;
--radius-xl:1.8rem;
}

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

html{
scroll-behavior:smooth;
}

body{
margin:0;
min-height:100vh;
background:radial-gradient(circle at top right,rgb(191 219 254 / 36%),transparent 30%),linear-gradient(180deg,rgb(248 251 255 / 100%),rgb(255 255 255 / 100%) 36%,rgb(245 249 255 / 100%));
color:var(--text);
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
font-size:1rem;
line-height:1.6;
}

a{
color:var(--link);
text-decoration-thickness:0.08em;
text-underline-offset:0.18em;
}

a:hover{
color:var(--link-hover);
}

a:focus-visible,button:focus-visible{
outline:2px solid var(--focus);
outline-offset:2px;
box-shadow:0 0 0 2px rgb(255 255 255 / 95%),0 0 0 6px rgb(15 79 179 / 22%);
border-radius:0.2rem;
}

a:visited{
color:var(--link-visited);
}

p,ul,ol{
margin:0;
}

.skip-link{
position:absolute;
left:1rem;
top:-4rem;
padding:0.75rem 1rem;
background:#0f172a;
color:#fff;
border-radius:var(--radius-md);
z-index:10;
}

.skip-link:focus{
top:1rem;
}

.site-shell{
width:min(72rem,calc(100% - 2rem));
margin:0 auto;
padding:1.5rem 1.25rem 3rem;
border-radius:var(--radius-xl);
background:linear-gradient(180deg,rgb(255 255 255 / 98%),rgb(238 245 255 / 98%));
box-shadow:0 1rem 2.5rem rgb(15 23 42 / 6%),0 0 0 1px rgb(191 210 238 / 72%);
}

.site-header,.site-footer{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:1rem;
}

.site-header{
padding-bottom:2rem;
}

.site-name{
font-size:1.5rem;
font-weight:700;
line-height:1.2;
}

.site-role{
margin-top:0.3rem;
color:var(--text-soft);
}

.site-nav{
display:flex;
flex-wrap:wrap;
gap:0.6rem 0.75rem;
}

.site-nav a{
color:var(--text-soft);
font-weight:600;
padding:0.28rem 0.72rem;
border:1px solid transparent;
border-radius:999px;
text-decoration:none;
}

.eyebrow a{
color:inherit;
}

.social-link-list{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:0.85rem;
margin-top:1rem;
padding:0;
list-style:none;
}

.social-link-list li{
min-width:0;
}

.social-link-list a{
display:flex;
flex-direction:column;
gap:0.18rem;
min-height:100%;
padding:0.95rem 1rem;
border:1px solid var(--border-accent);
border-radius:var(--radius-lg);
background:rgb(255 255 255 / 78%);
text-decoration:none;
}

.social-link-label{
font-weight:700;
line-height:1.25;
}

.social-link-detail{
color:var(--text-soft);
font-size:0.95rem;
line-height:1.35;
overflow-wrap:anywhere;
}

.footer-nav{
display:flex;
flex-wrap:wrap;
gap:0.5rem 0.6rem;
margin-top:0.95rem;
}

.footer-nav a{
display:inline-flex;
align-items:center;
min-height:2.5rem;
padding:0.3rem 0.65rem;
border:1px solid var(--border);
border-radius:999px;
background:rgb(255 255 255 / 82%);
text-decoration:none;
}

.intro a{
color:var(--link);
font-weight:600;
}

.intro a:hover{
color:var(--link-hover);
}

.social-link-list a:hover,.social-link-list a:focus-visible{
border-color:var(--border-strong);
background:var(--surface);
}

.footer-nav a:hover,.footer-nav a:focus-visible{
border-color:var(--border-strong);
background:var(--surface);
}

.site-nav a[aria-current="page"]{
color:var(--link-strong);
border-color:var(--border-strong);
background:var(--surface-accent);
box-shadow:inset 0 0 0 1px rgb(255 255 255 / 65%);
}

.site-nav a:hover,.site-nav a:focus-visible{
color:var(--link-strong);
border-color:var(--border-strong);
background:var(--surface-accent);
}

.hero{
padding:2.75rem 1.75rem;
border:1px solid var(--border-accent);
border-radius:var(--radius-xl);
background:linear-gradient(135deg,rgb(230 240 255 / 98%),rgb(255 255 255 / 98%));
}

.not-found{
max-width:42rem;
padding:3rem 0 2rem;
}

.eyebrow{
font-size:0.95rem;
font-weight:700;
color:var(--accent-text);
}

.hero h1,.section h2,.panel h3{
margin:0;
line-height:1.2;
}

.hero h1{
max-width:16ch;
margin-top:0.75rem;
font-size:clamp(2.3rem,6vw,4.25rem);
}

.intro{
max-width:44rem;
margin-top:1rem;
font-size:1.125rem;
color:var(--text-soft);
}

.back-link{
margin-top:1.25rem;
font-weight:600;
}

.inline-link-list,.tag-list,.taxonomy-list,.archive-list{
margin:0;
padding:0;
list-style:none;
}

.inline-link-list{
display:flex;
flex-wrap:wrap;
gap:0.75rem 1rem;
margin-top:1rem;
}

.section{
padding:2rem 0;
}

.section+.section{
border-top:1px solid rgb(191 210 238 / 65%);
}

.section h2{
margin-bottom:1rem;
font-size:clamp(1.6rem,3vw,2.2rem);
color:var(--accent-text);
}

.content-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1rem;
}

.panel{
padding:1.25rem;
border:1px solid var(--border-accent);
background:linear-gradient(180deg,rgb(255 255 255 / 96%),rgb(242 247 255 / 100%));
border-radius:var(--radius-lg);
}

.panel h3{
font-size:1.2rem;
}

.panel p+p{
margin-top:0.9rem;
}

.panel-wide{
grid-column:1 / -1;
}

.photo-grid{
align-items:start;
}

.photo-card{
margin:0;
overflow:hidden;
border:1px solid var(--border-accent);
background:linear-gradient(180deg,rgb(255 255 255 / 96%),rgb(242 247 255 / 100%));
border-radius:var(--radius-lg);
}

.photo-card img{
display:block;
width:100%;
aspect-ratio:3 / 1;
height:auto;
object-fit:cover;
background:var(--surface-accent);
}

.photo-card-link{
display:block;
}

.photo-card figcaption{
padding:1rem;
}

.photo-title,.photo-caption{
display:block;
}

.photo-title{
font-weight:700;
line-height:1.3;
}

.photo-caption{
margin-top:0.35rem;
color:var(--text-soft);
}

.photo-detail{
max-width:58rem;
padding:3rem 0 2rem;
}

.photo-meta{
margin-top:0.6rem;
color:var(--text-soft);
}

.photo-viewer{
margin:2rem 0 0;
}

.photo-viewer img{
display:block;
width:100%;
height:auto;
border:1px solid var(--border-accent);
border-radius:var(--radius-lg);
background:var(--surface-accent);
}

.photo-viewer figcaption{
max-width:44rem;
margin-top:0.85rem;
color:var(--text-soft);
}

.photo-pagination{
margin-top:1.5rem;
}

.post-grid{
grid-template-columns:1fr;
}

.post-card{
max-width:44rem;
}

.post-card-title{
margin-top:0.3rem;
}

.post-meta-inline{
margin-top:0.6rem;
color:var(--text-soft);
font-size:0.95rem;
}

.post-date,.post-meta{
color:var(--text-soft);
font-size:0.95rem;
}

.note-card{
max-width:44rem;
border-left:3px solid var(--border-accent);
}

.note-label{
font-weight:700;
color:var(--accent-text);
}

.note-body{
margin-top:0.6rem;
color:var(--text-soft);
}

.note-body>*+*{
margin-top:0.6rem;
}

.note-permalink{
margin-top:0.6rem;
font-size:0.85rem;
}

.note-source{
margin-top:0.5rem;
font-size:0.95rem;
word-break:break-all;
}

.note-shell{
max-width:44rem;
padding:2rem 0;
}

.post-shell{
max-width:44rem;
padding:3rem 0 2rem;
}

.post-header h1{
margin:0.75rem 0 0;
line-height:1.15;
font-size:clamp(2.2rem,5vw,3.8rem);
}

.note-shell .post-header h1{
font-size:clamp(1.6rem,4vw,2.4rem);
}

.post-meta{
margin-top:0.9rem;
}

.tag-list{
display:flex;
flex-wrap:wrap;
gap:0.6rem;
margin-top:1rem;
}

.tag-link{
display:inline-flex;
align-items:center;
padding:0.2rem 0.55rem;
border:1px solid var(--border-strong);
background:var(--surface-accent);
border-radius:999px;
color:var(--link-strong);
text-decoration:none;
font-size:0.95rem;
}

.tag-count{
color:var(--text-soft);
}

.taxonomy-list li+li{
margin-top:0.75rem;
}

.archive-year+.archive-year{
margin-top:2rem;
}

.archive-month{
margin-top:1rem;
}

.archive-month h3{
margin:0 0 0.6rem;
}

.archive-list li+li{
margin-top:0.65rem;
}

.archive-list time{
display:inline-block;
min-width:9.5rem;
margin-right:0.8rem;
color:var(--text-soft);
}

.prose{
margin-top:2rem;
}

.prose>*+*{
margin-top:1rem;
}

.prose h2,.prose h3,.prose h4{
line-height:1.2;
}

.prose ul,.prose ol{
padding-left:1.25rem;
}

.prose li+li{
margin-top:0.4rem;
}

.prose blockquote{
margin-left:0;
padding-left:1rem;
border-left:3px solid var(--border-strong);
color:var(--text-soft);
}

.prose code,.prose pre{
font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;
}

.prose code{
padding:0.08rem 0.28rem;
background:#eef4ff;
border-radius:var(--radius-sm);
}

.prose pre{
overflow-x:auto;
padding:1rem;
border:1px solid var(--border-accent);
background:linear-gradient(180deg,rgb(255 255 255 / 96%),rgb(241 246 255 / 100%));
border-radius:var(--radius-lg);
}

.prose pre code{
padding:0;
background:transparent;
}

.section-cta{
margin-top:1rem;
}

.hide-on-mobile{
display:block;
}

.category-badge{
display:inline-block;
font-size:0.75rem;
font-weight:600;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--link-strong);
background:var(--surface-accent);
border:1px solid var(--border-strong);
border-radius:0.5rem;
padding:0.15rem 0.6rem;
margin-bottom:0.4rem;
}

.link-list,.uses-list{
padding-left:1.25rem;
}

.link-list li+li,.uses-list li+li{
margin-top:0.6rem;
}

.site-footer{
margin-top:2.5rem;
padding:1.25rem 1.5rem;
border:1px solid var(--border-strong);
border-radius:var(--radius-lg);
background:linear-gradient(180deg,rgb(238 245 255 / 94%),rgb(255 255 255 / 100%));
color:var(--text-soft);
}


@media (width <= 700px){
.hide-on-mobile{
display:none;
}

.site-header,.site-footer{
flex-direction:column;
}

.site-header{
gap:1.25rem;
}

.site-nav{
width:100%;
gap:0.55rem;
}

.site-nav a{
padding-inline:0.65rem;
}

.content-grid{
grid-template-columns:1fr;
}

.social-link-list{
grid-template-columns:1fr;
}

.hero{
padding-top:2rem;
}

}


@media (prefers-reduced-motion:reduce){
html{
scroll-behavior:auto;
}

}


@media print{
.site-nav,.skip-link,.tag-list,.section-cta,.category-badge{
display:none;
}

.site-shell{
max-width:none;
border:none;
box-shadow:none;
padding:0;
background:none;
}

.hero,.panel{
border:1px solid #ccc;
box-shadow:none;
background:none;
break-inside:avoid;
}

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

a[href^="http"]::after{
content:" (" attr(href) ")";
font-size:0.8em;
color:#666;
}

}